#mainNavigation { display: none; }	
.overlay { 	top: 0px; margin-top: 140px;  
  	background: rgba(0,0,0,0.85); 
 	position: absolute;
	padding-bottom: 188px;
  } 



#navBar {
	width: 100%;
	display: block;
	height: 150px;
	transform: translateY(-10px);
	padding-top: 10px;
    transition: all 1.2s cubic-bezier(0.680, 0, 0.265, 1.550); /* easeInOutBack */

	box-shadow: 0px 0px 1px 2px #999999;
	background-color: #FFFFFF;
}

#navBar.resized {
	transform: translateY(-80px);
}

#navBar #greenRect {
	position: relative;
	width: 30px;
	height: 110px;
	top: -25px;
	background-color: #99CC1D;
	border-top-right-radius: 7px;
	border-bottom-right-radius: 7px;
    transition: all 1.2s cubic-bezier(0.680, 0, 0.265, 1.550); /* easeInOutBack */	
}

#navBar.resized #greenRect {
	top: 12px;
}

#navBar #searchposition { float: right; position: absolute; top: 10px; right: 0px; width: 30%; transition: all 1.2s cubic-bezier(0.680, 0, 0.265, 1.550); /* easeInOutBack */}
#navBar #metamenu { position: absolute; top: 30px; right: 29%;}

#metamenu  ul { display: inline; float: right; }
#metamenu  ul li {
	display: inline;
	float: left;	
    font-family: 'Lato', sans-serif;
	font-size: 14px;
}

#metamenu  ul li a, #metamenu  ul li span.separator { color: rgba(0,0,0,0.65); padding: 0px 5px; font-weight: 400; border-right: 1px solid #979797; padding: 0px 10px; padding-bottom: 2px; line-height: 10px;}
#metamenu  ul li a.highlight, #metamenu  ul li span.highlight { color: #D11E2F; font-weight: 400; border-right: none;}
#metamenu  ul li a:hover { background-color: #FFFFFF; color: #222222; }

#metamenu  ul li.divider { margin-top: -8px; }



#navBar #mainMenu { position: absolute; float: right; top: 110px; right: 35px; width: 80%; margin: 0px; transition: all 1.2s cubic-bezier(0.680, 0, 0.265, 1.550); /* easeInOutBack */}
#navBar.resized #mainMenu {top: 105px; }

#mainMenu ul { display: block; float: right; margin-top: 0px; position: relative;}
#mainMenu  ul.nav li a { font-family: 'Lato', sans-serif; font-size: 18px; font-weight: 400; color: #222222; padding: 0px; padding-left: 10px; padding-right: 10px; margin-left: 20px; padding-bottom: 5px; border-bottom: 3px solid #FFFFFF;} 
#mainMenu  ul.nav li a.active,
#mainMenu  ul.nav li a:hover { color: #000000; background-color: #FFFFFF; border-bottom: 3px solid #D11E2F;} 


#searchposition  form[role="search"] {
	top: 0px;
	right: 0px;
	padding: 0px;
	margin: 0px;
	z-index: 0;
	display: inline; float: right;
	margin-right: -15px;
	width: 100%;
}


#searchposition  form[role="search"] button,
#searchposition  form[role="search"] input {
	padding: 8px 12px;
	border-radius: 0px;
	border-width: 0px;
	color: #FFFFFF;
	font-size: 18px;
	top: 6px;
	background-color: transparent;
	background-color: transparent;
	border: none;
	box-shadow: none;
	outline: none;
}

#searchposition  form[role="search"] button:active,
#searchposition  form[role="search"] button:active:focus {
	background-image: none;
	background-color: #000000;
}

#searchposition  form[role="search"] button.searchReal {
	color: #99CC1D;	
}

#searchposition  form[role="search"] button.searchClose {
	color: #D11E2F;	
	font-weight: 300;
	font-size: 14px;
	top: 9px;
}
	
	
#searchposition  form[role="search"] input {
	padding: 5px 0px;
	font-style: normal;
	color: #000000;
	box-shadow: none;
	font-size: 13px;
	top: 12px;
	border-top: 0px solid #FFFFFF;
	border-bottom: 1px dotted #999999;
	margin-right: -35px; 
	width: 100%;
}

input#navSearchWhite { width: 100%; }

input#navSearchWhite::placeholder {	color: #999999; }

#searchposition  form[role="search"] button[type="reset"] {
	display: none;
	float: left;
}

.navMenuOpener { display: none; }

@media screen and (max-width: 960px) {
 	#startMainMenu, #desktophead, #startLeadingContainter { display: none;}
	.overlay { 	top: 0px; margin-top: 0px;  
  	background-color: #FFFFFF; }


.navMenuOpener { display: block; top: 25px; position: absolute; float: right; right: 20px; }

.navMenuOpener.active { opacity: 0.35; }

#navBar {
	height: 70px;
	overflow: hidden;
	z-index: 100;
}


#navBar.open {
	height: auto;
	padding-bottom: 100px;
	overflow: allow;
}

#navBar.open.resized {
	transform: translateY(-10px);

}
#navBar.resized #mainMenu {top: 10px; }

#navBar #greenRect {
	position: relative;
	width: 30px;
	height: 60px;
	top: -25px;
}
#navBar.resized #greenRect {
	top: -25px;
}



#navBar #searchposition { display: block; float: right; width: 95%; position: relative; padding-top: 20px; top: 2px; right: 8%; }
#navBar #metamenu { position: relative; display: inline-block; float: left;  margin-top: 30px; top: 10px; left: 8%; right: 0px; width: 30%;}
#metamenu  ul { display: block; float: left; width: 100%; }
#metamenu  ul li {
	display: block;
	width: 100%;
	float: left;	
    font-family: 'Lato', sans-serif;
	font-size: 14px;
}


#metamenu ul li a, #metamenu ul li span.highlight { border-right: 0px solid #FFFFFF; padding: 8px 0px; line-height: 1.5em;}
#metamenu ul li span.highlight {display: block; margin-top: 20px; }

#navBar #login-form { margin: 0px; padding: 0px; margin-top: 10px;}

#navBar #mainMenu { position: relative; display: inline-block; float: right; margin-top: 30px; top: 10px; right: 10%; width: 53%;}
#mainMenu ul.nav { display: block; float: right; text-align: right; width: 100%; }
#mainMenu ul.nav li { display: block; float: right; text-align: right; width: 100%;}
#mainMenu ul.nav li a { display: block; float: right; text-align: right; margin: 0px; padding: 10px 0px;}