/* @import url('https://fonts.googleapis.com/css2?family=Dancing+Script&family=Playfair+Display&display=swap');  */
 /* @import url('https://fonts.googleapis.com/css2?family=EB+Garamond&family=Noto+Sans+JP:wght@300&display=swap'); */
 @import url('https://fonts.googleapis.com/css2?family=EB+Garamond&family=Montserrat:wght@400;600;800&family=Noto+Sans+JP:wght@300&display=swap');
body {
     /* font-family: 'Dancing Script' , cursive;  */
     font-family: 'Montserrat', sans-serif;
      font-family: 'EB Garamond', serif;
    /* font-family: 'Noto Sans JP', sans-serif;   */
    font-size : 20px;
    font-weight: 400;
  margin :0px;
  background-color:var(--primary-color) ;
}
 
:root {
       
        --primary-color: #13737b; 
       /* --primary-color: #1c7ca8; */
        --secoundary:rgb(22, 19, 19);
      /* --third:rgb(179, 41, 64); */
      --third:rgb(143, 55, 70);
      --light:rgb(66, 139, 139);
}

 #myhead {

     background-color: var(--primary-color) ;
      border-bottom-left-radius: 3rem;
      text-align: center;
      padding : 1rem 1rem;
      color : white;
     
 }
 header h1{
     font-size:45px;
     font-weight: bold;
 }
 .container-fluid {
     padding: 1rem 1rem;

 }

 .container-center {
    text-align : center;
    padding: 1rem 1rem;
    background-color: palevioletred;

 }

 /**links**/
.link {
    text-decoration: none;
     padding: 0.3rem 0.5rem; 
    text-align: center;
    margin: 0px;
    
}
 .primary{
       border-radius: 0.5rem;  
      color : white; 
     /* background-color:#49c7d3; */
     background-color:var(--secoundary);
     /* box-shadow: 1px 1px 6px  rgb(39, 39, 39) ; */

 }

 .primary:hover{
    
      /* background-color:var(--primary-color); */
      box-shadow: 1px 1px 6px  rgb(39, 39, 39) ;
     
 }

 .secoundary {
    color: var(--secoundary);
    border: 2px solid var(--secoundary);
    border-radius: 0.5rem;
    background-color:rgb(233, 227, 233);
    font-weight: bolder;
    padding: 0.2rem 0.4rem;
 }
 .secoundary:hover{
    box-shadow: 1px 1px 6px  rgb(39, 39, 39) ;
 }
   
.list
{
    list-style-type:none;

}

.initem {
 display :inline;
 padding : 0rem 0.4rem;

}
.unordered
{
    color :violet;

}

.inline {
    color : pink;
}

.bar {

padding : 0.1rem 0.5rem ;
background-color: var(--secoundary);
text-decoration: none;
border-bottom-left-radius: 3rem;
 box-shadow: 3px 8px 12px rgb(66, 139, 139); 
/* box-shadow: 3px 8px 12px rgb(63, 137, 180); */
}
.project-bar{
    background-color: var(--secoundary);
     box-shadow: 3px 8px 12px rgb(66, 139, 139); 
    /* box-shadow: 3px 8px 12px rgb(63, 137, 180); */
padding : 0.1rem 0.5rem ;
border-bottom-left-radius: 3rem;
}
.bar-items {
    text-align: right;
}

.item {
    text-decoration: none;
    color :white;
    padding:0px;

    
}
.active {
    font-weight:bolder;
    color:white;
    font-size: larger;
}
.hero {
    max-width: 500px;
     padding:20px;
    
    
}
.hero-head {
    text-align: center;
   padding : 2rem 0.5rem;
}
.heads {
    text-align: center;
    list-style-type: none;
    display:flex;
    flex-wrap:wrap;
    justify-content: center;
    padding:0px;

   
   
}
.blog{
justify-content: center;

}
.blogHero{
    max-width: 400px;
    padding-top: 30px;
}
/**sections**/

.section  {
text-align: center;
padding  : 2rem 2rem ; 

}

.ow {
      background-color:#F3F4F6;  
    /* background-color:  rgb(233, 227, 233);  */
   
}

/** fotter **/
.foot {
     background-color: var(--secoundary); 
    padding : 1px 0px 0px 0px;
    border-top-right-radius: 3rem;
    margin:0;
     box-shadow: 30px 0px 12px rgb(66, 139, 139); 
    /* box-shadow: 30px 0px 12px rgb(63, 137, 180); */

}

.project-item {

    padding : 2rem 1rem 3rem 1rem;
    margin:30px;
    border-radius: 2rem;
    max-width:350px;
    background-color:rgb(233, 227, 233);
     box-shadow: 3px 4px 6px  rgb(122, 197, 216) ; 
    /* box-shadow: 3px 4px 6px  rgb(124, 186, 223) ; */
    
}
.project-head{
    text-align: center;
    color:var(--secoundary);
}

h3 {
    padding-left: 0.3rem;
}
.logo{
    font-size: 1.8rem;
    padding:15px ;
    padding-bottom: 10px;
}
.tech{
    display:flex;
    flex-direction:row;
    justify-content: center;
    flex-wrap: wrap;
  padding:0px;
}
.tech-item{
    list-style-type:none;
}
.tech div{
padding:15px;
padding-bottom: 5px;
color:rgb(169, 209, 216);
}
.gmail-phone{
    color:var(--secoundary);
    font-size: 0px;
  }

  .gmail-laptop{
    font-size: 30px;
  }

@media screen and (max-width : 600px)
{
header.hero-head{
    text-align: left;
    padding : 2rem 0.5rem;
    
}
:root{
    --primary-color: #1c7ca8;
}
.bar {
    box-shadow: 3px 8px 12px rgb(63, 137, 180); 
}
.project-bar{
    box-shadow: 3px 8px 12px rgb(63, 137, 180);   
}
 .foot{
    box-shadow: 30px 0px 12px rgb(63, 137, 180);
} 
.project-item{
    box-shadow: 3px 4px 6px  rgb(124, 186, 223) ;
}
img.hero {
    max-width: 250px;
    text-align: center;
    
}
header h1{
    font-size:35px;
}
.gmail-laptop{
    color:var(--secoundary);
    font-size: 0px;
    margin:0px
}

.gmail-phone{
    font-size: 30px;
    color:white;
    margin:0;
}
}