@charset "UTF-8";
/* navigation.css */

body.preload *{
animation-duration: 0s !important;
-webkit-animation-duration: 0s !important;
transition:background-color 0s, opacity 0s, color 0s, width 0s, height 0s, padding 0s, margin 0s !important;}

.fixed-top {
	/*-webkit-transition: -webkit-transform .5s;
	transition: -webkit-transform .5s;
	transition: transform .5s;
	transition: transform .5s, -webkit-transform .5s;*/
	height: 90px;
	width: 100%;
}
		
nav, .navbar-brand {
	font-size: 1rem!important;
}
	
.navbar-brand {
	margin-top: 3px;
	margin-left: 20px;
}
	
.nav-item {
	margin-left: 40px;
	font-size: 18px;
}
	
/*SEARCH LUPE*/
a svg .lupe { 
  fill: #333;
}	

#lupe { 
	width: 25px;
	height: auto;
}
	
.navbar-light .navbar-nav .nav-link {
    color:rgba(0,0,0,.8);
}

.navbar-light .navbar-nav .nav-link:focus, .navbar-light .navbar-nav .nav-link:hover, .nav-link.active, .nav-link.icon.active a, .nav-item.active a {
    color:#009fe2!important; 
}

 .nav-link.icon {
    color:#666!important;
}
.nav-link.icon:hover {
	 color:#009fe2!important;
}
a svg:hover .lupe, .nav-item.active a svg .lupe, .nav-item:hover > a svg:hover .lupe, .nav-link.icon:hover svg .lupe{ 
	fill: #009fe2!important;
}	

.navbar-light .navbar-toggler {
	color:rgba(0,0,0,.5);
	border-color:rgba(0,0,0,0)!important;
}
	

/*.zigzag1 {
	height: 50px;
	width: 400px;
	background: linear-gradient(45deg, rgba(0, 0, 0, 0) 75%, #008000 75%) 0 0%, linear-gradient(-45deg, rgba(0, 0, 0, 0) 75%, #008000 75%) 0 0%;
	background-repeat: repeat-x;
	background-size: 30px 30px, 30px 30px;
	margin-top: -5px;
}

.zigzag2 {
	height: 50px;
	width: 400px;
	background: linear-gradient(45deg, #ff0000 25%, rgba(0, 0, 0, 0) 25%) 0% 100%, linear-gradient(-45deg, #ff0000 25%, rgba(0, 0, 0, 0) 25%) 0 100%;
	background-repeat: repeat-x;
	background-size: 30px 30px, 30px 30px;
}*/

.zigzag3 {
	/*position: absolute;
	left: -14px;
	height: 100%;
	width: 15px;
	display: inline-block;
	margin-left: 0px;
	background: linear-gradient(45deg, rgba(0, 0, 0, 0) 74%, rgba(255, 255, 255, 1) 75%) 0% 0, linear-gradient(135deg, rgba(0, 0, 0, 0) 74%, rgba(255, 255, 255, 1) 75%) 0% 0;
	background-repeat: repeat-y;
	background-size: 15px 15px, 15px 15px;
	-webkit-filter: drop-shadow(rgba(0, 0, 0, 0.3) 0px 1px 0px);
	-moz-filter: drop-shadow(rgba(0, 0, 0, 0.3) 0px 1px 0px);
	filter: drop-shadow(rgba(0, 0, 0, 0.3) 0px 1px 0px);*/
}

/*.zigzag4 {
	height: 50px;
	width: 30px;
	display: inline-block;
	background: linear-gradient(45deg, #0000ff 25%, rgba(0, 0, 0, 0) 25%) 100% 0, linear-gradient(135deg, #0000ff 25%, rgba(0, 0, 0, 0) 25%) 100% 0%;
	background-repeat: repeat-y;
	background-size: 30px 30px, 30px 30px;
	margin-left: 28px;
	position: absolute;
}*/


.navbar-side {
	height: 100%;
	width: 25%;
	position: fixed;
	top: 0px;
	right: 0px;
	padding: 0;
	list-style: none;
	background-color: rgba(255, 255, 255, 0.9);
	z-index: 1000;
	margin: 0px!important;
	padding: 0px!important;
	-webkit-animation-duration: 0.5s;
	animation-duration: 0.5s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
	transform: translateX(100%);
	-webkit-transform: translateX(100%);
	-ms-transform: translateX(100%);
	-webkit-transition: all 1s ease;
	-moz-transition: all 1s ease;
	-ms-transition: all 1s ease;
	-o-transition: all 1s ease;
	transition: all 1s ease;
	-webkit-box-shadow: 18px 0px 24px 10px rgba(50, 50, 50, 0.42);
	-moz-box-shadow: 18px 0px 24px 10px rgba(50, 50, 50, 0.42);
	box-shadow: 18px 0px 24px 10px rgba(50, 50, 50, 0.42);
}

.reveal{
	-webkit-animation-name: fadeInRight;
	animation-name: fadeInRight;
	transform: translateX(100%);
	-webkit-transform: translateX(100%);
	-ms-transform: translateX(100%);
}

@keyframes fadeInRight {
	from {
		-webkit-transform: translate3d(100%, 0, 0);
		transform: translate3d(100%, 0, 0);
	}

	to {
		-webkit-transform: translate3d(0%, 0, 0);
		transform: translate3d(0%, 0, 0);
	}
}


.navbarSideContent {
	height: 100%;
	overflow-y: scroll;
	-webkit-overflow-scrolling: touch;
	padding-top: 70px;
	padding-right: 40px;
	list-style: none;
}

.navbarSideContent ul {
	margin: 0px!important;
	padding: 0px!important;
	display: block;
	list-style-type: none;
}

.navbar-side-item {
	margin: 0px!important;
	padding: 0px!important;
	margin: 0;
	border-bottom: 2px solid #ccc;
	height: 5rem;
}

.side-link {
	padding-left: 2rem;
}


.navoverlay {
	position: fixed;
	display: none;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	width:100%;
	height:100%;
	/*background-color: #fff;*/
	/*background-image: url(../../../mycustomextensions/img/monitor_stripes.png);*/
	z-index: 990;
}

/*
FIREFOX SVG:
The # character in a URL is reserved
You must URL encode the data URL contents, which means converting any hash characters in the data URL to %23
*/



.navoverlay::before {
	display: block;
    content: '';
    position: fixed;
	width:100%;
	height:100%;
    z-index: 989; 
 	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: #009fe2; /*#E5CB30;*/ /*#589CD6;*/  /*#474748;*/
    /*background: url(../../../mycustomextensions/img/monitor_stripes.png) top left repeat;*/
	opacity: 0.6;
	background-repeat: repeat;
}


/*
.navoverlay::after {
   display: block;
    content: '';
    position: fixed;
	width:100%;
	height:100%;
    z-index: 991; 
 	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 841.9 595.3' style='enable-background:new 0 0 841.9 595.3;' xml:space='preserve'><style type='text/css'>.st0{fill:none;stroke:%23000000;stroke-width:80;stroke-miterlimit:10;}.st1{stroke:%23000000;stroke-width:80;stroke-miterlimit:10;}</style><circle id='XMLID_1_' class='st0' cx='388.8' cy='300' r='248.2'/><line id='XMLID_2_' class='st0' x1='388.8' y1='300' x2='198.9' y2='438.6'/><circle id='XMLID_4_' class='st1' cx='388.8' cy='300' r='79.2'/></svg>");
	opacity: 0.05;
	background-repeat: no-repeat;
	background-size: 160%;
	background-position: -400px center;
}

*/


.navbtnholderx {
	position: absolute; 
	right: 25px;
	z-index: 1600;
	-webkit-transform:scale3d(0.6, 0.6, 1);
	-moz-transform:scale3d(0.6, 0.6, 1);
	-ms-transform:scale3d(0.6, 0.6, 1);
	transform: scale3d(0.6, 0.6, 0.6);
}

.pointer {
	cursor: pointer!important;
	}
	
.hamburger .line{
	width: 50px;
	height: 6px;
	background-color: #009fe2; /*#787878;*/
	display: block;
	margin: 9px auto;
	-webkit-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}

.hamburger:hover{
	cursor: pointer;
}	

#hamburger-9{
	position: relative;
	-webkit-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}

#hamburger-9.is-active{
	-webkit-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	-o-transform: rotate(45deg);
	transform: rotate(45deg);
}

#hamburger-9.is-active .line{
	background-color: #009fe2; /*#787878;*/
}

#hamburger-9:before{
	content: "";
	position: absolute;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	width: 70px;
	height: 70px;
	border: 5px solid transparent;
	top: calc(50% - 35px);
	left: calc(50% - 35px);
	border-radius: 100%;
	/*-webkit-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;*/
}

#hamburger-9.is-active:before{
	border: 6px solid #009fe2; /*#787878;*/
}



/*NAV HOVER COLOR*/
.navbtnholderx:hover > #hamburger-9.is-active:before{
	/*border: 5px solid red;*/
}
.navbtnholderx:hover > .hamburger .line, .navbtnholderx:hover > #hamburger-9.is-active .line{
	/*background-color: red;*/
}

#hamburger-9.is-active .line:nth-child(2){
	opacity: 0;
}

#hamburger-9.is-active .line:nth-child(1){
	-webkit-transform: translateY(14px);
	-ms-transform: translateY(14px);
	-o-transform: translateY(14px);
	transform: translateY(14px);
}

#hamburger-9.is-active .line:nth-child(3){
	-webkit-transform: translateY(-15px) rotate(90deg);
	-ms-transform: translateY(-15px) rotate(90deg);
	-o-transform: translateY(-15px) rotate(90deg);
	transform: translateY(-15px) rotate(90deg);
}	

/*---------------------------------------------------------------*/


/*.navbar-side {
		 width: 16%;
	}*/
	
.navbar{
		justify-content: initial;
	}

.site-title {
	display: inline-block;
	-webkit-transition: all .5s;
	transition: all .5s;
	color: rgba(0,0,0,.8);
	font-size: 24px;
}

.scrolled-nav h1.site-title  {
	font-size: 16px;
}


.pagination>li>a {
	background-color: rgba(223,189,6,1.00);
	border-color: #009fe2;
	color: #009fe2!important;
}

.pagination>li>a, .pagination>li>a:hover {
  background-color: rgba(223,189,6,1.00)!important;
	color: #009fe2!important;
}



.footer-nav ul {
	padding: 0px;
	margin: 0px;
}

.footer-nav ul li {
	padding: 0px;
	margin: 0px;
	list-style-type: none;
}

.footer-nav ul li .nav-link-footer {
	display: block;
	padding: 0px 0px 4px 0px;
	text-decoration: none;
	color: #fff;
	font-weight: 600;
	font-size: 14px;
	line-height: 20px;
}

.nav-link-footer:hover, .nav-link-footer.active, .nav-link-footer.icon.active a, .nav-item-footer.active a {
	color: #009fe2!important;
}





@media (max-width: 200em) {
	.navbar-side {
		 width: 16%;
	}
	
	
}	
	
@media (max-width: 160em) {
	.navbar-side {
		 width: 18%;
	}
}	
	

@media (max-width: 120em) {
	.navbar-side {
		 width: 24%;
	}
}	

@media (max-width: 85.9em) {
	.navbar-side {
		 width: 32%;
	}
}	
	
@media (max-width: 74.9em) {
	.navbar-side {
		 width: 40%;
	}
}

@media (max-width: 61.9em) {
	.navbar-side {
		 width: 50%;
	}
	
}

@media (max-width: 47.9em) {
	.navbar-side {
		width: 60%;
	}
	
}


@media (max-width: 33.9em) {
	.navbar-side {
		width: 100%;
	}
	
	.navbar-brand img {
		height: 50px!important;
	}
}

@media (max-width: 28.9em) {
	
	
	.navbar-brand img {
		height: 45px!important;
	}
}

@media (max-width: 25.9em) {
	
	
	.navbar-brand img {
		height: 30px!important;
	}
}