@charset "utf-8";
/* CSS Document */
body{
    background: #F9F4E0;
}
.wrapper-main{
    width:1100px;
    margin: 0 auto;
    
}
a{
    cursor: pointer;
    
}
.header-main{
    position: fixed;
    top: 0;
    width:100%;
    height: 60px;
    background-color: antiquewhite;
    display: flex;
    justify-content: space-between;
    z-index: 1000;
    
        
}

.header-main-logo{
    
    max-width: 100px;
    min-width: 60px;
    height: 100%;
    
}
.header-main-logo img{
    height: 60px;
    padding-left: 20px;
    
}

.header-main-nav{
    
    line-height: 60px;
      
}

.header-main-nav ul li{
    display: inline;
    float:left;
    font-family: "Lora", serif;
    color:#5C5C5C;
}
.header-main-nav ul li a{
    padding: 0 20px;
    display: block;
    height: 100%;
    
    
}
.header-main-nav ul li a:active{
    color:rgba(21,167,248,1.00);
    background-color:antiquewhite;
    
}
.header-main-sm{
    width:10px;
    
    display:block;
    <div class="burger-menu-btn"></div>
}
.heading-page{
    margin-top: 15vh;
    margin-bottom: 4vh;
    text-align: center;
}
  .heading-page h1{
    font-size: 2.1rem;
    line-height: 2.5rem;
    
}

.heading-page h2{
    font-size:1.7rem;
    line-height: 2rem;
    
}

.heading-page h3{
    font-size:1.4rem;
    line-height: 1.7rem;
    
}
    
 H1, H2, H3, H4, H5, H6 p{
   /* text-align: center;*/
    font-family: "Lora", serif;
    color:#5C5C5C;
}
.footer-nav{
    padding: 2rem 0;
}
.footer-nav ul {
    display: flex;
    justify-content: center;
     line-height: 1.7rem;   
    }
    .footer-nav ul li a h5{
        display: inline;
        text-shadow: 7px -7px 3 #111;
        padding: 0 1.0rem;
    }
.footer-nav ul li a{
        display: block;
        height: 100%;
    }
.footer-nav ul li a h5:hover{
        color:#0000DE;
    }
.copyright{
    text-align: center;
    font-family: "Lora",serif;
    font-style: italic;
    color:#5c5c5c;
    padding-bottom: 2rem;
    
}
.burger-menu,
.burger-menu-btn{
    display:none;
     
    
}
/*----600px, 601px, 768px, 992px, 1200px--------*/
@media (max-width:600px){
    .header-main-nav{
        display:none;
    }
    .header-main-sm{
    min-width:60px;
    
    }
    .burger-menu-btn{
        display:block;
        width:50px;
        height:50px;
        
        background-image: url("../images/icons/burgerBtn.png"),url("../images/icons/close.png");
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center, center left 50px;
        
    }
    .burger-menu{
        display:none;
        position:fixed;
        width:100%;
        padding-top:60px;
        /*height: calc(100vh-60px);*/
        z-index: 900;
        
    }
    .burger-menu ul{
        width:100%;
        /*height: calc(100vh-60px);*/
        background-color:#F9F4E0;
        display:flex;
        flex-wrap: wrap;
        align-content:flex-start;
    }
    .burger-menu ul li{
        flex-basis:100%;
        border-top: 2px solid #5C5C5C;
        
    }
    .burger-menu ul li:last-child{
        
        border-bottom: 2px solid #5C5C5C;
        
    }
    .burger-menu ul li a{
        display:block;
        height:100%;
        font-size:2rem;
        font-color:#5c5c5c;
        padding:30px 0;
        flex-basis:100%;
        text-align: center;
        
    }
    .footer-nav ul {
    display:block;
    
     line-height: 1.4rem;   
    }
    .footer-nav ul li{
        text-align: center;
         
        padding: 0 1.0rem;
    }
    .footer-nav ul li a:hover{
        color:#0D0080;
    }
    .wrapper-main{
    width:90%;
    }
    
}
@media (min-width:601px,max-width:768px){
   /* .header-main-nav{
        display:none;
    }
    .burger-menu-btn{
        display:block;
        width:50px;
        height:50px;
        
        background-image: url("../images/icons/burgerBtn.png"),url("../images/icons/close.png");
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center, center left 50px;
        
    }
    .burger-menu{
        display:none;
        position:fixed;
        width:100%;
        padding-top:60px;
        /*height: calc(100vh-60px);
        z-index: 900;
        
    }
    .burger-menu ul{
        width:100%;
        /*height: calc(100vh-60px);
        background-color:#F9F4E0;
        display:flex;
        flex-wrap: wrap;
        align-content:flex-start;
    }
    .burger-menu ul li{
        flex-basis:100%;
        border-top: 2px solid #5C5C5C;
        
    }
    .burger-menu ul li:last-child{
        
        border-bottom: 2px solid #5C5C5C;
        
    }
    .burger-menu ul li a{
        display:block;
        height:100%;
        font-size:2rem;
        font-color:#5c5c5c;
        padding:30px 0;
        flex-basis:100%;
        text-align: center;
        
    }*/
    
    .wrapper-main{
    width:100%;
    }
    
}
@media (min-width:769px,max-width:992px){
    .header-main-nav{
        display:none;
    }
    .burger-menu-btn{
        display:block;
        width:50px;
        height:50px;
        
        background-image: url("../images/icons/burgerBtn.png"),url("../images/icons/close.png");
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center, center left 50px;
        
    }
    .burger-menu{
        display:none;
        position:fixed;
        width:100%;
        padding-top:60px;
        /*height: calc(100vh-60px);*/
        z-index: 900;
        
    }
    .burger-menu ul{
        width:100%;
        /*height: calc(100vh-60px);*/
        background-color:#F9F4E0;
        display:flex;
        flex-wrap: wrap;
        align-content:flex-start;
    }
    .burger-menu ul li{
        flex-basis:100%;
        border-top: 2px solid #5C5C5C;
        
    }
    .burger-menu ul li:last-child{
        
        border-bottom: 2px solid #5C5C5C;
        
    }
    .burger-menu ul li a{
        display:block;
        height:100%;
        font-size:2rem;
        font-color:#5c5c5c;
        padding:30px 0;
        flex-basis:100%;
        text-align: center;
        
    }
    
    .wrapper-main{
    width:100%;
    }
    
}