#header { position:relative; z-index:100; background:white; box-shadow: 0 2px rgba(0,0,0,.25); }
#header>.container { position:relative; }

@media (min-height:800px) and  (min-width:992px) {
	#header { position:fixed; top:0; left:0; right:0; }
	#site-wrapper { padding-top:100px; }
}
@media (min-height:800px) and (min-width:1230px) {
	#site-wrapper { padding-top:140px; }
}

#banner { position:relative; margin-right:70px; }

#logo { float:left; max-width:100%; margin:10px auto; position:relative; z-index:0; } 
#logo a { display:block; padding:0 10px; }
/*#logo a:hover { background:rgba(0,0,0,0.1); }*/
#logo a .logo-image { display:block; width:242px; height:80px; max-width:100%; background:url(../images/svg/sbc-logo.svg) no-repeat center center; background-size:contain; }
#logo a .site-title { display:block; height:0; overflow:hidden; text-indent:-9999px; }

#navigation { float:right; z-index:1000; padding-top:28px; } /* 71px */

#mainnav-collapse .nav-item .nav-toggle a:hover { background-color:rgba(0,0,0,0.1); } 
#mainnav-collapse .nav-item .nav-toggle button:hover { background-color:rgba(0,0,0,0.1); }

#header-social-media-links { display:inline-block; }
#header-social-media-links .link { float:left; display:block; margin-right:1px; }
#header-social-media-links .link a { display:block; width:50px; height:50px; text-indent:-9999px; background-color:rgba(0,0,0,0.1); background-repeat:no-repeat; background-position:center center; background-size:25px 25px; }
#header-social-media-links .link a:hover { background-color:rgba(0,0,0,0.2); }
 
#header-social-media-links .link.facebook a { background-image:url(../images/svg/social-facebook.svg); }
#header-social-media-links .link.flickr a { background-image:url(../images/svg/social-flickr.svg); }
#header-social-media-links .link.instagram a { background-image:url(../images/svg/social-instagram.svg); }
#header-social-media-links .link.twitter a { background-image:url(../images/svg/social-twitter.svg); }
#header-social-media-links .link.youtube a { background-image:url(../images/svg/social-youtube.svg); }

#mainnav { display:inline-block; }

#mainnav-button { padding:15px 20px; height:50px;}

/*#mainmenu-search { padding:10px 10px 10px 5px; border-top:1px solid #d9d9d9; }*/
#mainmenu-search { padding:10px 15px; border-top:1px solid #d9d9d9; }
#mainmenu-search .form-control { border:0; padding:0 10px; background-color:rgba(0,0,0,0.1); -webkit-box-shadow:none; box-shadow:none; border-radius:0; height:30px; line-height: 30px; }
#mainmenu-search button { background-color:transparent; border-radius:7px; font-size:20px; height:30px; padding: 0 10px; }
#mainmenu-search button:hover { opacity:0.7; }

@media (min-width:414px) {
	#logo { z-index:101; }
	#navigation { position:relative; }
	#mainmenu-inner { position:relative; }
}

@media (max-width:767px) {
	#header-social-media-links { display:none; }
	#navigation { font-size:0; text-align:center; margin-left:-70px; }
	#mainnav { font-size:18px; text-align:left; }
}

@media (min-width:768px) {
	#banner:before { display:none; }
	#mainnav { float:right; }
}

@media (min-width:992px) {
}

@media (min-width:1230px) {
	#header>.container { height:140px; }
	#logo { float:none; position:absolute; top:0; left:0; z-index:1001; margin:0; }
	#logo a .logo-image { width:350px; height:140px; }
	#navigation { float:none; position:absolute; bottom:10px; right:15px; left:15px; padding-top:0px; }
	#header-social-media-links { float:none; position:absolute; bottom:60px; right:210px; }
	#header-social-media-links .link:last-child { margin-right:0; }

	#navigation .nav-panel-level-1>.nav-item>.nav-toggle>a { color:#333; font-size:16px; font-weight:600; line-height:30px; }
	#navigation .nav-panel-level-1>.nav-item>.nav-toggle>a:hover { color:#333; font-size:16px; font-weight:600; line-height:30px; background:rgba(0,0,0,0.1); }
	#navigation .nav-panel-level-1>.nav-item>.nav-toggle.on>a { background:rgba(0,0,0,0.1); }

	#mainmenu-search { position:absolute; bottom:10px; right:0; width:200px; padding:0; margin-bottom:0; background:rgba(0,0,0,0.1); border-top:0; color:#333; }
	#mainmenu-search .form-control { background-color:transparent; color:#333; height:50px; line-height:50px; }
	#mainmenu-search button { height:50px; padding:0 12px; }
	#mainmenu-search button:hover { color:#333; }
}
