/* HEADER.....  HEADER..... HEADER..... HEADER..... HEADER..... HEADER..... HEADER..... HEADER..... HEADER..... HEADER..... */
	@font-face {
		font-family:"capture";
		src: url("../fonts/Capture_it.ttf")  format("truetype"); 
		font-weight:normal;
		font-style:normal;
		}
	@font-face {
		font-family:"capture_block";
		src: url("../fonts/Capture_it_2.ttf")  format("truetype"); 
		font-weight:normal;
		font-style:normal;
		}
	@font-face {
		font-family:"nc";
		src: url("../fonts/NewsCycle-Bold.ttf")  format("truetype"); 
		font-weight:normal;
		font-style:normal;
		}
	@font-face {
		font-family:"Franklin";
		src: url("/fonts/LibreFranklin-Regular.ttf")  format("truetype"); 
		font-weight:normal;
		font-style:normal;
		}
	@font-face {
		font-family:"FranklinI";
		src: url("/fonts/LibreFranklin-Italic.ttf")  format("truetype"); 
		font-weight:normal;
		font-style:normal;
		}
	@font-face {
		font-family:"FranklinB";
		src: url("/fonts/LibreFranklin-SemiBold.ttf")  format("truetype"); 
		font-weight:normal;
		font-style:normal;
		}
	#header {         
		position:absolute;
		left:0;
		margin:0px 0 0 0px;
		height:122px;
		width:100%;
		background-color:#34291e;
		box-shadow:3px 3px 24px 0px black;
		z-index:105;
		border-bottom:1px #d8a860 solid;
		border-top:1px #d8a860 solid;
		}
	#header-logo-box {
		position:relative;
		float:left;
		display:block;
		z-index:130;
		height:122px;
		width:245px;
		background-color:#d8a860;
		overflow:hidden;
		}
	#header-logo-box img{
		position:relative;
		float:left;
		width:245px;
		height:122px;
		}
	#header-worship-box{display:none;}
	#header-luther-box{display:none;}
	#header-contact-box {display:none;}
	#header-elca-box {display:none;}
	#header-address-box {display:none;}
	#navbar {display:none;}
	#label-box{
		display:block;
		position:absolute;
		right:0px;
		width:100%; 
		height:122px;
		background-color:#34291e;
		
		
		overflow:hidden;
		z-index:120;
		}
	#menu-toggle{display:none;} /* hide input checkboxes - label visible - clicking on label checks hidden box */
	label[for="menu-toggle"] { /* mobile menu button */
		display:block;
		position:absolute;
		top:47px;
		right:4px;
		width:29px;
		height:23px;
		z-index:100;
		border:1px #d8a860 solid;
		background-color:#34291e;
		}
	.menuladder{
		margin-top:3px;
		margin-left:4px;
		height:3px;/*4px,23px;*/
		width:21px;
		background-color:#cc883a;
		}
	label[for="menu-toggle"] .margintop {margin-top:4px;}
	label[for="menu-toggle"]:hover .menuladder{opacity:1; filter:alpha(opacity=100);}
	#menubox{
		visibility:hidden;
		position:relative;
		float:left;
		margin-left:0px;
		display:block;
		z-index:100;
		height:auto;
		width:272px;
		}
	#menu.js, #menu.nojs {
		display:block;
		position:absolute;
		visibility:visible;
		top:-695px;
		z-index:12;
		width:100%;
		height:auto;
		overflow:hidden;
		background-color:#34291e;
		border-left:1px #d8a860 solid;
		border-right:1px #d8a860 solid;
		opacity:.9;
		filter:alpha(opacity=90);
		}
	#menu.nojs {																			
		-webkit-transition: top .9s;
		-moz-transition: top .9s;
		transition: top .9s;
		}
	#menu-toggle:checked ~ #menubox #menu.nojs { top:0px;}
	#menu ul{
		position:relative;
		float:left;
		width:100%;
		}
	#menu li{
		position:relative;
		float:left;
		width:100%;
		display:block;
		color:#d3cba6;
		border-bottom:1px #d8a860 solid;
		}
	#menu li:hover {background-color:#6a361e;}
	#menu li a {															
		display:block;
		padding:8px 8px 8px 12px;
		text-align:left;
		font:16px "SansB", "arial black", "gadget", sans-serif;
		text-decoration:none;
		color:#e5c672;
		}
	#menu li a.first {padding-top:9px;}
	#menu li a.last {padding-bottom:9px;}
	.drop_arrow{
		position:absolute;
		top:14px;
		right:6px;
		overflow:hidden;
		background-position:0px 7px;
		width:11px;
		height:7px;
		background-image:url("../images/drop_sprite.jpg");
		}
	#menu li ul.js, #menu li ul.nojs {
		display:none;
		position:relative;
		float:left;
		z-index:90;
		margin-left:26px;
		border:none;
		height:auto;
		width:100%;
		overflow:hidden;
		}
	#menu li ul.nojs {
		display:block;
		height:0px;
		-webkit-transition: height 1s;
		-moz-transition: height 1s;
		transition: height 1s; 
		}
	#about-menu-toggle, #learning-menu-toggle, #community-menu-toggle, #sermons-menu-toggle {display:none;} /* hide input checkboxes */
	#menu li:hover .drop_arrow, #menu li:hover .drop_arrow, #menu li:hover .drop_arrow{background-position:11px 7px;}
	
	
	label[for="about-menu-toggle"], label[for="learning-menu-toggle"], label[for="community-menu-toggle"], label[for="sermons-menu-toggle"] {display:block;}
	#about-menu-toggle:checked ~ ul.nojs {height:150px;} /*transition won't work if height=auto. must be specified.*/
	#community-menu-toggle:checked ~ ul.nojs {height:180px;}
	#learning-menu-toggle:checked ~ ul.nojs {height:180px;}
	#sermons-menu-toggle:checked ~ ul.nojs {height:72px;}
	#menu li li{width:100%;}
	#menu li li:hover {background-color:#34291e;}
	
/*  Add elca to header. */
@media only screen and (min-width: 520px) {
	
	#header {height:148px;}
	#header-logo-box {
		height:148px;
		width:297px;
		}
	#header-logo-box img{
		width:297px;
		height:148px;
		}
	#label-box{height:148px;}
	label[for="menu-toggle"] { /* mobile menu button */
		top:59px;
		}
	
	#header-logo-box {border-right:1px #d8a860 solid;}
	#header-elca-box {
		display:block;
		position:relative;
		float:left;
		margin:0px 45px 0 0px;
		width:148px;
		height:148px;
		z-index:400;
		overflow:hidden;
		}
}
/*  Add address box to header. */
@media only screen and (min-width: 660px){ 
	#header-address-box{
		display:block;
		position:relative;
		float:left;
		margin:0px 0 0 0px;
		width:148px;
		height:148px;
		background-color:#51341e;
		border-right:1px #d8a860 solid;
		background-image:url("../images/h_address_r.jpg");
		z-index:220;
		}
	#header-address-box p{
		position:relative;
		float:left;
		margin:16px 0px 0px 0px;
		font:18px/18px  "capture", "SansB", "arial black", "impact";
		font-weight:normal;
		text-align:center;
		color:  #edd289;  /* blue #343d64; brown #edd289;*/
		word-spacing:0px;
		letter-spacing:0px;
		}
	#header-address-box a{
		color:#edd289;
		text-decoration:none;
		}
	#header-address-box span.header_luther {		
		display:inline-block;
		padding-left:0px;
		font:22px/20px "capture_block", "SansB", "arial black", "impact";
		font-weight:normal;
		word-spacing:-1px;
		letter-spacing:0px;
		padding-bottom:8px;
		}
}
/*  Add worship box to header */
@media only screen and (min-width: 814px) {
	#header-worship-box{
		display:block;
		position:relative;
		float:left;
		margin:0px 0px 0 0px;
		width:148px;
		height:148px;
		overflow:hidden;
		z-index:470;
		background-color:#d8a860;
		border-right:1px #d8a860 solid;
		background-image:url("../images/worship.jpg");
		}
	#header-worship-box a{
		text-decoration:none;
		color:#e5c672;
		}
	#worship-head-text{
		position:relative;
		padding:17px 0 0 0px;
		color:#e5c672;
		z-index:470;
		text-align:left;
		}
	.worship{
		font:23px/21px "capture_block", "SansB", "arial black", "impact";
		text-align:center;
		}
	.etc {
		position:relative;
		float:left;
		padding:7px 0px 0 0px;
		line-height:14px;
		text-align:left;
		font-weight:normal;
		word-spacing:-3px;
		font-family:"capture", "arial";
		font-size:17px;}
		

	p.sunday, p.sundaytime {
		position:relative;
		float:left;
		padding:27px 0px 0px 0px;
		text-align:center;
		width:100%;
		font-weight:normal;
		word-spacing:0px;
		font:22px/18px "capture", "SansB", "arial black", "impact";
		}

	
}
/*  Add contact box to header */
@media only screen and (min-width: 958px) {

	#header-contact-box div:hover{background-position:37px 0px;}
	#header-contact-box .h_phone{
		left:26px;
		top:26px;
		background-image:url("../images/h_phone_b.jpg");
		background-position:0px 0px;
		}
	#header-contact-box .h_face{
		right:26px;
		top:26px;
		background-image:url("../images/h_face_b.jpg");
		background-position:0px 0px;
		}
	#header-contact-box .h_mail{
		left:26px;
		top:84px;
		background-image:url("../images/h_mail_b.jpg");
		background-position:0px 0px;
		}
	#header-contact-box .h_maps{
		right:26px;
		top:84px;
		background-image:url("../images/h_maps_b.jpg");
		background-position:0px 0px;
		}
	#header-contact-box {
		display:block;
		position:relative;
		float:left;
		margin:0px 0 0 0px;
		width:148px;
		height:148px;
		background-color:#51341e;
		border-right:1px #d8a860 solid;
		background-image:url("../images/h_contact_b.jpg");
		z-index:220;
		}
	#header-contact-box div{
		display:block;
		position:absolute;
		float:left;
		margin:0px 0 0 0px;
		width:37px;
		height:37px;
		}
	#header-contact-box div:hover{background-position:37px 0px;}
}
/* 1.) START DESKTOP, NAVBAR. 2.) Add luther to header */
@media only screen and (min-width: 1055px) {
	#header {        
		position:absolute;
		left:50%;
		margin-left:-522px;
		height:181px;
		width:1044px;
		box-shadow:3px 3px 24px 0px black;
		z-index:105;
		
		}
	#header-logo-box {border-left:1px #d8a860 solid;}
	#header-luther-box{
		display:block;
		position:relative;
		float:left;
		margin:0px 0px 0 0px;
		width:148px;
		height:148px;
		overflow:hidden;
		z-index:470;
		background-color:#d8a860;
		border-right:1px #d8a860 solid;
		background-image:url("../images/h_luther.jpg");
		}
	#header-elca-box {
		display:block;
		position:relative;
		float:left;
		margin:0px 0 0 0px;
		width:148px;
		height:148px;
		z-index:400;
		overflow:hidden;
		border-right:1px #d8a860 solid;
		}
	#menu.js, #menu.nojs,  #label-box, label[for="menu-toggle"], #menu-toggle:checked + #menu.js, #menu-toggle:checked + #menu.nojs, #menubox {display:none;}
	#navbar{
		position:relative;
		float:left;
		margin:0px 0 0 0px;
		width:1042px;
		z-index:180;
		display:block;
		background-color:#34291e;
		border:1px #d8a860 solid;
		border-bottom:none;
		border-right:1px #d8a860 solid;
		opacity:.90;
		filter:alpha(opacity=90);
		}
	#navbar ul {
		position:relative;
		float:left; 
		z-index:90;
		}
	#navbar li {
		position:relative;
		float:left;
		display:inline;
		width:148px;
		border-left:1px #d8a860 solid;
		z-index:100;
		}
	#navbar li.nav1 {
		margin-left:148px;
		border-left:none;
		border-left:1px #d8a860 solid;
		}

	#navbar li:hover {background-color:#6a361e;}
	#navbar li:hover .drop_arrow {
		top:25px; 
		border:1px solid #d8a860;
		border-bottom:none;
		background-position:0px 0px;
		}
	#navbar li a {
		position:relative;
		float:left;
		display:block;
		padding:6px 0px 8px 0px;
		text-align:center;
		width:148px;
		font:16px/18px "SansB", "arial black", "gadget", sans-serif;
		text-decoration:none;
		color:#e5c672;
		}
	#navbar li a .drop_arrow{																	
		position:absolute;
		top:32px;
		right:50%;
		margin-right:-8px;
		overflow:hidden;
		background-position:0px 7px;
		width:11px;
		height:7px;
		background-image:url("../images/drop_sprite.jpg");
		z-index:900;
		border:1px solid #d8a860;
		border-top:none;
		}
	#navbar a:hover .drop_arrow {background-position:0px 0px;}
	#navbar li a.sublast {}
	#navbar div.submenu{ /*hidden container that submenu drop down into, height must be appropriate to longest sub */
		visibility:hidden;
		position:absolute;
		display:block;
		z-index:90;
		overflow:hidden;
		top:32px;
		margin-left:-1px;
		height:218px;
		width:150px;
		overflow:hidden;
		}
	#navbar li ul {
		visibility:visible;
		position:absolute;
		top:-166px;
		height:auto;
		width:150px;
		overflow:hidden;
		z-index:90;
		border-bottom:1px solid #e5c672;
		}
	#navbar li ul.nojs {
		-webkit-transition: top 0.1s;
		-moz-transition: top 0.1s;
		transition: top 0.1s;
		}
	#navbar li ul.aboutus{top:-169px;}		/*                     */															
	#navbar li ul.learning{top:-169px;}
	#navbar li ul.community{top:-187px;}
	#navbar li ul.sermons{top:-169px;}
	#navbar li:hover ul.nojs {top:0px;}
	#navbar li li{
		width:148px; 
		background-color:#6a361e;
		border-top:1px solid #e5c672;
		border-right:1px solid #e5c672;
		}
	#navbar li li:hover {
		margin-left:1px;
		border-left:none;
		border-right:none;
		background-color:#34291e;}
}
/* END HEADER */