/* ---------------------------------- 
	DISPLAY
	---------------------------------- */
	#burger-outer,
	#mobilenav { display: none; }
	
	/* ------------------------ 
	SMALL LOGO
	------------------------ */	
	#logo-small img {
		width: auto;
		height: auto;
		object-fit: none;
		transform: scale(1) translate(0%);
		margin-top: 0px;
	}

	#extrapages { padding-top: 15px;} 
	
	/* ------------------------ 
	HEADER
	------------------------ */	
	header {
		position: fixed; 
		top: 30px; 
		height: 50px; 
		z-index: 5;
	}
	header .contain {
		position: relative;
		width: 96%; 
		margin: auto; 
	}
	
	/* nav-color */
	nav a, 
	nav a:link, 
	nav a:visited { color: #292929; }
	
	/* NAV */
	nav ul,
	nav li {
		margin: 0px;
		padding: 0px;
		vertical-align: top;	
	}
	nav ul {
		padding-top: 10px; 
	}
	nav li {
		font-size: 1.3rem;
		padding: 0 1rem; 
		display: inline-block;
	}
	nav li a {
		font-size: .9em;
		position: relative;
	}
	
	nav li a:after {
		content: '';
		position: absolute;
		bottom: 11px;
		right: -15px;
		width: 0;
		height: 0;
		border-style: solid;
		border-width: 6px 6px 0 6px;
		border-color: #292929 transparent transparent transparent;
		display: none;
	}
	nav li a:hover:after {display: block;}
	nav li a.active { 
		text-decoration: underline;
	}
	
	/* CHANGE NAV  */
	body.change-nav header  { 
		top: 0px;
		background: rgba(255, 255, 255, 1);
	}

	
	/* 1279 */
	@media only screen and (max-width: 1279px) { 
		/*nav li {padding-left: 2rem;}*/	
	}
	@media only screen and (max-width: 599px) { }
	
	/* ---------------------------------- 
	BURGER
	---------------------------------- */
	#burger-outer { 
		position: absolute;
		top: 30px;
		right: 30px;
		cursor: pointer;
		z-index: 100; 
	}
	
	/* ------------------------ 
	animate BURGER
	------------------------ */
	.cmn-toggle-switch {
		display: block;
		position: relative;
		overflow: hidden;
		width: 32px;
		height: 25px;
		
		font-size: 0;
		text-indent: -9999px;
		border: none;
		cursor: pointer;
		background: transparent !important;
	}
	
	.cmn-toggle-switch span:before, 
	.cmn-toggle-switch span:after,
	.cmn-toggle-switch span {
		position: absolute;
		display: block;
		height: 3px;
		background: #fff;
		background: #292929;
	}
	.cmn-toggle-switch span {
		top: 10px;
		left: 0px;
		right: 0px;
	}
	.cmn-toggle-switch span:before, 
	.cmn-toggle-switch span:after {
		left: 0;
		width: 100%;
		content: "";
	}
	.cmn-toggle-switch span:before { top: -10px;}
	.cmn-toggle-switch span:after { bottom: -10px;}
	
	.cmn-toggle-switch__htx span:before {
		-webkit-transition-property: top, -webkit-transform;
		transition-property: top, transform;
	}
	.cmn-toggle-switch__htx span:after {
		-webkit-transition-property: bottom, -webkit-transform;
		transition-property: bottom, transform;
	}
	.cmn-toggle-switch__htx span:before, 
	.cmn-toggle-switch__htx span:after {
		-webkit-transition-duration: 0.3s, 0.3s;
		transition-duration: 0.3s, 0.3s;
		-webkit-transition-delay: 0.3s, 0;
		transition-delay: 0.3s, 0;
	}
	
	/* active */
	.cmn-toggle-switch__htx.active span {background: none;}
	.cmn-toggle-switch__htx.active span:before {
		top: 0;
		-webkit-transform: rotate(45deg);
		-ms-transform: rotate(45deg);
		transform: rotate(45deg);
	}
	.cmn-toggle-switch__htx.active span:after {
		bottom: 0;
		-webkit-transform: rotate(-45deg);
		-ms-transform: rotate(-45deg);
		transform: rotate(-45deg);
	}
	.cmn-toggle-switch__htx.active span:before, 
	.cmn-toggle-switch__htx.active span:after {
		-webkit-transition-delay: 0, 0.3s;
		transition-delay: 0, 0.3s;
	}
	
	/* 1159 */
	@media only screen and (max-width: 1160px) { 
		nav li a {font-size: .8em;}
		nav li  {padding: 0 .8rem;}
	}
	
	
	/* MOBILE 850 */
	@media only screen and (max-width: 850px) { 
	
		/* ------------------------------- 
		/*header*/
		header {top: 0px;}
		body.change-nav header {background: rgba(255, 255, 255, 0);}
		
		body.data header,
		body.error404 header {background: #fff;}
		
		header .contain {
			width: 100%;
			margin: auto;
			height: auto;
			top: 0px;
		}
		header .contain .col { vertical-align: top; }
		
		/*burger*/
		#burger-outer { display: block;}
		.cmn-toggle-switch__htx.active span:before,
		.cmn-toggle-switch__htx.active span:after { background: #2D3645;}
		
		/*nav*/
		nav.col-12 { width: 300px;}
		nav {
			position: fixed; 
			top: 0px;
			right: -300px; 
			
			height: 100vh;
			/*background: #D9D8CB;*/
			background: #B5D0B7;
			
			overflow-y: scroll;
  			-webkit-overflow-scrolling:touch; 
			transition: all .4s ease;
			
			z-index: 100;
			box-shadow: -2px 0px 10px rgba(57, 63, 72, 0.1);
		}
		nav.open {right: 0px;}
		
		nav ul {
			margin: 10px;
			float: none;
		}
		nav ul li {
			padding-left: 0rem;
			width: 100%;
			text-align: left;
			padding: 5px 25px;
			margin-bottom: 10px; 
		}
		nav li a {font-size: 1.1em;}
		
		nav li a.active { 
			color: #fff;
			text-decoration: none; 
			font-family: 'museo-sans-700';
		}
		
		nav a, 
		nav a:link, 
		nav a:visited {color: #2D3645;}
		
		
		/* CHANGE MOBILE NAV  */
		/*header contain*/
		body.change-nav header .contain {top: 0px;}
		/* burger active */
		body.change-nav .cmn-toggle-switch__htx.active span {background: none;}
		
	}
	
	
	@media only screen and (max-width: 599px) { 
		/*nav*/
		nav.col-12 { width: 270px;}
		nav {right: -270px; }
		
		nav ul {padding-top: 15px;}
		nav ul li {padding: 5px 25px;}
	}

	@media only screen and (max-width: 479px) { 
		/* NAV */
		/*nav.col-12 {width: 220px;}
		nav {right: -220px;}*/
	}