/*width percent*/
.w-1-p{ width:1%; }
.w-2-p{ width:2%; }
.w-3-p{ width:3%; }
.w-4-p{ width:4%; }
.w-5-p{ width:5%; }
.w-6-p{ width:6%; }
.w-7-p{ width:7%; }
.w-8-p{ width:8%; }
.w-9-p{ width:9%; }
.w-10-p{ width:10%; }
.w-15-p{ width:15%; }
.w-17-p{ width:17%; }
.w-18-p{ width:18%; }
.w-19-p{ width:19%; }
.w-20-p{ width:20%; }
.w-23-p{ width:23%; }
.w-25-p{ width:25%; }
.w-30-p{ width:30%; }
.w-35-p{ width:35%; }
.w-40-p{ width:40%; } 
.w-45-p{ width:45%; }
.w-47-p{ width:47%; }
.w-49-p{ width:49%; }
.w-50-p{ width:50%; }
.w-55-p{ width:55%; }
.w-60-p{ width:60%; }
.w-65-p{ width:65%; }
.w-70-p{ width:70%; }
.w-75-p{ width:75%; }
.w-80-p{ width:80%; }
.w-85-p{ width:85%; }
.w-90-p{ width:90%; }
.w-95-p{ width:95%; }
.w-100-p{ width:100%; }

.sidebar2{ position:fixed; background:rgba(0,0,0,.5); height:100vh;width:0;top:0;right:0;overflow:hidden;z-index:999;} 
.side-menu2{ background:#fff;height:100vh;margin-left:60%;}
.side-container2{ max-width:calc(100% - 20%);height:100vh; margin:0 auto;position:relative;}
.side-close2{ position:absolute;z-index:999;cursor:pointer;top:5%;right:10%;}

.menu-container2{ width:100%;height:100vh;position:relative; }
.main-menu2{ width:100%;padding-left:10%;height:100%;padding-top:10%;padding-bottom:10%; }
.sub-menu2{ width:45%; padding-right:10%;height:100%;padding-top:10%;padding-bottom:10%;padding-left:5%;display:none; }
.main-menu-list2{ list-style-type: none;font-size:35pt;line-height:70pt; }
.sub-menu-list2{ list-style-type: none; font-size:20pt; line-height:50pt;margin-block-start:1em;margin-block-end:1em;margin-top:60px; }

.main-menu-link2:link{ color:#3c2415; }
.main-menu-link2:hover{ color:#3c2415; }
.main-menu-link2:visited{ color:#3c2415; }
.main-menu-link2:active{ color:#3c2415; }

.sub-menu-link2:link{ color:#000; }
.sub-menu-link2:hover{ color:#2b211d !important; font-family:SourceSansPro-Bold;text-decoration:underline;text-decoration-color: #a7a9ac; }
.sub-menu-link2:visited{ color:#000; }
.sub-menu-link2:active{ color:#000; }

@media only screen and (max-width: 1400px) {

}

@media only screen and (max-width: 1100px) {
    .main-menu2{ width:100%;padding-left:5%;}
    .main-menu-list2{ font-size:25pt;}
}

@media only screen and (max-width: 800px) {
    .main-menu-list2{ font-size:20pt;}
    .sub-menu-list2{ font-size:16pt; }
}

@media only screen and (max-width: 768px) {
    .side-menu2{ width:100%; margin-left:0;}
}

@media only screen and (max-width: 500px) {
    .main-menu-list2{ font-size:16pt;}
    .sub-menu-list2{ font-size:14pt; }
    
}