@charset "UTF-8";
/* CSS Document */
/*========================================= **** MAINNAV BUTTON **** =============================================== */

.show{
	display: block;
}
#MenuBtn{
	position:fixed;
    width: 0vw;
    height: 0vw;
	margin: 0;
	padding: 0;
	top:0px;
	z-index: 99;
	opacity: 0;
	overflow: hidden;
	display: none;
	
	-webkit-transition: all .4s ease-in-out;
	-moz-transition: all .4s ease-in-out;
	-ms-transition: all .4s ease-in-out;
	-o-transition: all .4s ease-in-out;
	transition: all .4s ease-in-out;
	
}


.navi{
	position:fixed;
	top: 0;
	margin-left: auto;
	margin-right: auto;
	z-index: 15;
	/*left: 6.25vw;*/
	width:100vw;
	height: auto;
	
	-webkit-transition: all .7s ease-in-out;
	-moz-transition: all .7s ease-in-out;
	-ms-transition: all .7s ease-in-out;
	-o-transition: all .7s ease-in-out;
	transition: all .7s ease-in-out;
	
}

header{
	height:auto;
	max-width: 100%;
	position:relative;
	top: 0px;
	left: 0px;
	-webkit-transition: all .7s ease-in-out;
	-moz-transition: all .7s ease-in-out;
	-ms-transition: all .7s ease-in-out;
	-o-transition: all .7s ease-in-out;
	transition: all .7s ease-in-out;
	overflow: hidden;
	
	
	
}

body.down .navi{
	top:-6vw;
}
body .navi{
	top:0vw;
}


#setmenu{
	margin-left: auto;
	margin-right: auto;
	height: auto;
	display: flex;
	align-items:center;
  justify-content:space-between;
}
#webheaderline{
	margin-left: auto;
	margin-right: auto;
	height: 3vw;
	width: 3vw;
	float: left;
	margin:10px;
	margin-left: 0px;
	margin-right: 0px;
}

.nav-container{
	height: auto;
	margin-left: auto;
	margin-right: auto;
	padding: 0px;
	
}

.nav-container ul{
	max-width:100%;
	list-style: none;
	list-style-type: none;
	margin: 0;
	padding: 0;
	
	-webkit-transition: all 1s ease-in-out;
	-moz-transition: all 1s ease-in-out;
	-ms-transition: all 1s ease-in-out;
	-o-transition: all 1s ease-in-out;
	transition: all 1s ease-in-out;
}

.nav-container ul li{
	max-width: 100%;
	
}

#menu-main li{
	
	display: inline-flex;
	text-align:left;
	overflow: hidden;
	height: auto;
	padding-right: 20px;
	-webkit-transition: all 1s ease-in-out;
	-moz-transition: all 1s ease-in-out;
	-ms-transition: all 1s ease-in-out;
	-o-transition: all 1s ease-in-out;
	transition: all 1s ease-in-out;
}

#menu-main li:last-child{
	
	padding-right: 0px;
}

#menu-main li a{
	color: #000;
}







#menu-footer ul{
	max-width: 100%;
	
	list-style: none;
	list-style-type: none;
	margin: 0;
	padding: 0;
}

#menu-footer li{
	
	display: inline-flex;
	text-align:left;
	overflow: hidden;
	height: auto;
	padding-left: 10px;
	padding-right: 10px;
	border-right:  1px solid #fff;
	-webkit-transition: all 1s ease-in-out;
	-moz-transition: all 1s ease-in-out;
	-ms-transition: all 1s ease-in-out;
	-o-transition: all 1s ease-in-out;
	transition: all 1s ease-in-out;
}

#menu-footer ul li:first-child{
	
	padding-left: 0px;
}
#menu-footer ul li:last-child{
	border-right:  0px solid #fff;
	border: none;
	padding-right: 0px;
}

#menu-footer li a{
	color: rgba(25,25,25,1.00);
}
/* ===================================================================================================================== */
/* ================================================= **** MOBILE **** ================================================== */
/* ===================================================================================================================== */
@media screen and (max-width: 1140px) {
#setmenu{
	align-items:center;
  justify-content:flex-start;
}
	
#webheaderline{
	margin-left: auto;
	margin-right: auto;
	height: 5vw;
	width: 5vw;
	
	position: fixed;
	top: 0;
	left: 4vw;
	z-index: 2;
	
	float: left;
	margin:10px;
	margin-left: 0px;
	margin-right: 0px;
}
.show{
	display: none !important;
}
body.down .navi{
	top:0vw;
}
	
header .wrap{
	width: 100% !important;
}	

#nav-main{
	
	height:0vh;
	max-width:100%;
	overflow: hidden !important;
	
	display: flex;
	align-items: center;
	-webkit-transition: all .8s ease-in-out;
	-moz-transition: all .8s ease-in-out;
	-ms-transition: all .8s ease-in-out;
	-o-transition: all .8s ease-in-out;
	transition: all .8s ease-in-out;
	
}
#nav-main.active{
	
	height:100vh;
}
	
.nav-container{
	position: relative;
	z-index: 2;
	height:auto;
	max-width:100%;
	margin-top: -20vh;
	margin-left: 0;
	margin-right: auto;
	padding: 0px;
	padding-left: 50px;
	padding-right: 50px;
	overflow: hidden;
	-webkit-transition: all .4s ease-in-out;
	-moz-transition: all .4s ease-in-out;
	-ms-transition: all .4s ease-in-out;
	-o-transition: all .4s ease-in-out;
	transition: all .4s ease-in-out;
}

.nav-container.active{
	padding: 50px;
}
	
#menu-main{
	
	height:auto;
	max-width:100%;
	-webkit-transition: all .4s ease-in-out;
	-moz-transition: all .4s ease-in-out;
	-ms-transition: all .4s ease-in-out;
	-o-transition: all .4s ease-in-out;
	transition: all .4s ease-in-out;
	
}
	
#menu-main ul{
	position: relative;
	height: auto;
	max-width: 100%;
	list-style: none;
	list-style-type: none;
	margin: 0;
	padding: 0;
}
#menu-main.active ul{
	position: relative;
	list-style: none;
	list-style-type: none;
	margin: 0;
	padding: 0;
}
	
#menu-main li{
	height: 0px;
	max-width: 100%;
	opacity: 0;
	
	display: flex;
	align-items:center;
	text-align:left;
	-webkit-transition: all .4s ease-in-out;
	-moz-transition: all .4s ease-in-out;
	-ms-transition: all .4s ease-in-out;
	-o-transition: all .4s ease-in-out;
	transition: all .4s ease-in-out;
}	
#menu-main.active li{
	height: 6vh;
	opacity: 1;
	-webkit-transition: all 1s ease-in-out;
	-moz-transition: all 1s ease-in-out;
	-ms-transition: all 1s ease-in-out;
	-o-transition: all 1s ease-in-out;
	transition: all 1s ease-in-out;
}

#menu-main li a{
	
	display: flex;
	align-items:center;
	font-size: 3.5vh;
	color: #000;
}
#menu-main.active li a{
	font-size: 3.5vh;
}



	
	
	
	
	


	
#MenuBtn{
	position:fixed;
    width: 10vw;
    height: 10vw;
	margin: 0;
	padding: 0;
	right: 15px;
	top:0px;
	z-index: 99;
	float: right;
	opacity: 1;
	overflow: hidden;
	display: block;
	
	-webkit-transition: all .4s ease-in-out;
	-moz-transition: all .4s ease-in-out;
	-ms-transition: all .4s ease-in-out;
	-o-transition: all .4s ease-in-out;
	transition: all .4s ease-in-out;
	
}	


.button-nav-toggle{
	position:absolute;
    width: 10vw;
    height: 10vw;
	margin: 0;
	padding: 0;
	right: 0px;
	top:0px;
	float: right;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	
	
	box-shadow: none;
	border-radius: 0;
	cursor: pointer;
	display:block;
 }
 
.button-nav-toggle:before, :after{
	content: "";
	position: absolute;
	-webkit-transition: transform .7s ease-in-out;
	-moz-transition: transform .7s ease-in-out;
	-ms-transition: transform .7s ease-in-out;
	-o-transition: transform .7s ease-in-out;
	transition: transform .7s ease-in-out;
}

/* Vertical line */

.button-nav-toggle:before{
	top:5vw;
	left:3vw;
	width: 4vw;
	height: 2px;
	margin-top:-4px;
	
	background-color: #000;
}

.button-nav-toggle:hover:before{
	top:5vw;
	left:3vw;
	width: 4vw;
	height: 2px;
	margin-top:0;
	background-color: #000;
}

/* horizontal line */

.button-nav-toggle:after{
	top:5vw;
	left:3vw;
	width: 4vw;
	height: 2px;
	margin-top:4px;
	
	background-color: #000;
}

.button-nav-toggle:hover:after{
	top:5vw;
	left:3vw;
	width: 4vw;
	height: 2px;
	margin-top:0;
	background-color: #000;
	
	transform: rotate(90deg);
}



.button-nav-toggle.active {
}    

.button-nav-toggle.active:before {
	width:  4vw !important;
	transform: rotate(-45deg);
	cursor: pointer;
	
	margin-top:0;
	background-color: #000;
}

.button-nav-toggle.active:after{
	width: 4vw !important;
	transform: rotate(45deg);
	cursor: pointer;
	
	margin-top:0;
	background-color: #000;
}

	
}

@media screen and (max-width: 568px) {
	
	
#webheaderline{
	margin-left: auto;
	margin-right: auto;
	height: 10vw;
	width: 10vw;
}
	
#MenuBtn{
	position:fixed;
    width: 15vw;
    height: 15vw;
	margin: 0;
	padding: 0;
	right: 0px;
	top:0px;
	z-index: 99;
	float: right;
	opacity: 1;
	overflow: hidden;
	display: block;
	
	-webkit-transition: all .4s ease-in-out;
	-moz-transition: all .4s ease-in-out;
	-ms-transition: all .4s ease-in-out;
	-o-transition: all .4s ease-in-out;
	transition: all .4s ease-in-out;
	
}	


.button-nav-toggle{
	position:absolute;
    width: 15vw;
    height: 15vw;
	margin: 0;
	padding: 0;
	right: 0px;
	top:0px;
	float: right;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	
	
	box-shadow: none;
	border-radius: 0;
	cursor: pointer;
	display:block;
 }
 
.button-nav-toggle:before, :after{
	content: "";
	position: absolute;
	-webkit-transition: transform .7s ease-in-out;
	-moz-transition: transform .7s ease-in-out;
	-ms-transition: transform .7s ease-in-out;
	-o-transition: transform .7s ease-in-out;
	transition: transform .7s ease-in-out;
}

/* Vertical line */

.button-nav-toggle:before{
	top:7.5vw;
	left:3vw;
	width: 8vw;
	height: 2px;
	margin-top:-4px;
	
	background-color: #000;
}

.button-nav-toggle:hover:before{
	top:7.5vw;
	left:3vw;
	width: 8vw;
	height: 2px;
	margin-top:0;
	background-color: #000;
}

/* horizontal line */

.button-nav-toggle:after{
	top:7.5vw;
	left:3vw;
	width: 8vw;
	height: 2px;
	margin-top:4px;
	
	background-color: #000;
}

.button-nav-toggle:hover:after{
	top:7.5vw;
	left:3vw;
	width: 8vw;
	height: 2px;
	margin-top:0;
	background-color: #000;
	
	transform: rotate(90deg);
}



.button-nav-toggle.active {
}    

.button-nav-toggle.active:before {
	width:  8vw !important;
	transform: rotate(-45deg);
	cursor: pointer;
	
	margin-top:0;
	background-color: #000;
}

.button-nav-toggle.active:after{
	width: 8vw !important;
	transform: rotate(45deg);
	cursor: pointer;
	
	margin-top:0;
	background-color: #000;
}
	
	
	
	
	
	#menu-footer{
		padding-bottom: 30px;
}
	
	
#menu-footer li{
	
	display:block;
	text-align:center;
	overflow: hidden;
	height: auto;
	padding-left: 0px;
	padding-right: 0px;
	border-right:  0px solid #fff;
	border: none;
	-webkit-transition: all 1s ease-in-out;
	-moz-transition: all 1s ease-in-out;
	-ms-transition: all 1s ease-in-out;
	-o-transition: all 1s ease-in-out;
	transition: all 1s ease-in-out;
}

#menu-footer ul li:first-child{
	
	padding-left: 0px;
}
}