@charset "UTF-8";
/* CSS Document */


*
      {margin:0;
            padding:0;


}
        
        
        body{
                      
            background-color:#f8f1e4;
             font-size:14px;
          font-weight:100;
          letter-spacing: 1px;
            color:white;
            font-family:"Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
 
        }
        main{
            width:80%;
            margin:0 auto;
            background-color:#f8f1e4;

        }
        
        header{
            background-color:#d4c1a0;
              padding:20px;
            margin-top:-12px;
            border-bottom:4px solid #9eaabe;
        }
        
        h1{
            font-size:20px;
            font-weight: 500;
            text-align: center;
            color:white;
            letter-spacing:0.8vw;
            margin-top: -20px;
        }
        
         h2{
            font-size:14px;
            font-weight: 100;
            text-align: center;
            color:white;
        }

.name{
    margin-top:10px;        
    width:100%;
            max-width:400px;
        }
        
        a:link {
         text-decoration:none;
         color:white;
     }
     a:visited{
        color:white; 
     }
     
     a:hover{
          color:#ba4e31;
     }


 a.sections2:link {
         text-decoration:none;
         color:white;
     }
     a:visited{
        color:white; 
     }
     
     a:hover{
         color:#ba4e31;
     }
     
     
     
nav{
        list-style-type: none;
         width:60%;
         margin:0 auto;
         display:grid;
        grid-template-columns:1fr 1fr 1fr;
        grid-column-gap: 50px;
        justify-items:center;
     }

footer{
     background-color:#d4c1a0;
              padding:20px;
            margin-top:20px;
            border-top:4px solid #9eaabe;
    
    
}

nav2{
        list-style-type: none;
         width:90%;
         margin:0 auto;
        color:black;
         display:grid;
        grid-template-columns:1fr 1fr 1fr;
        grid-column-gap: 50px;
        justify-items:center;
     }
        
        .dot{
            height:35px;
            padding:0;
            margin:0;
            font-size:40px;
            text-align: center;
              color:#e49a85;
        }
     
        .dotHide{
            visibility:hidden;
        }
        
       
        
        
        
        img{
            margin:20px auto;
            width:100%;
           max-width:1000px;
            display:block;
        }
        .img_details{
          text-align: center;
            
        }
        
        
        .content{
            width:95%;
            margin:0 auto;
            display:grid;
            grid-gap:40px;
           
             
        }
        
        @media screen and (max-width:800px){
            h1{
                font-size:2.5vw;
            } 
            
            .content{
            grid-gap:20px 80px;
        }
             main{
            width:100%;
            

        }
            nav{
        
         width:100%;
         
     }
        }
        
        
      /*   @media screen and (max-width:600px){
            h1{
                font-size:3.5vw;
            } 
        }
        */