/* 

iPhone CSS document
iPhone.css
client: Providence Baptist Church
author: Atlantic BT - www.atlanticbt.com
date: 9/15/08

Base iPhone Styles, rest are inherited from screen.css, etc.

*/


/*======================================
	=Main Styles
======================================*/

body {
	font: 14px/1.5em Helvetica, Tahoma, Arial, sans-serif;					
	color: #000;
	text-align: center;
	background: #959080;
	-webkit-text-size-adjust: none;
}

div { text-align: left; font-size: inherit; }

/*======================================
	=Typography Styles
======================================*/

	/* remove sIFRs */
	#container #content .sIFR-replaced { font-size: 14px; line-height: 1.2em; margin: 1em 0 .25em; }
	#container #content .sIFR-replaced span.sIFR-alternate
	{ position: relative; left: auto; top: auto; width: auto; height: auto; display: inline; overflow: auto;
  		line-height: 1.2em; margin: 1em 0 .25em; }
	#container #content .sIFR-replaced .sIFR-flash { visibility: hidden !important; display: none; }

	/* section header */
	#content p#section { margin: 0; position: relative; right: auto; top: auto;
						font: bold 30px/46px "Times New Roman", Times, Georgia, serif;
						color: #6b2019; }
	

	
/*======================================
	=Other Element Styles
======================================*/

#content #cse-search-results,
#content #cse-search-results iframe,
#content #sitemap { width: 440px; height: 100%; }
	
	
/*======================================
	=Base Form Styles
======================================*/
	



/*======================================
	=Layout Styles
======================================*/

#container { 
	margin: 0 auto;
	padding: 0;
	width: 480px;
	background: none;
}

/* =floats and widths */
#wrap, #masthead, #mast-wrap, #navigation, #main-area, #site-info { width: 480px; }

#wrap { padding: 0; background: none; overflow: hidden; }

#container div#masthead { height: 235px; background: none; }

	div#masthead #mast-wrap { height: 235px; background: #2f789a url(/images/iphone_bg-masthead.gif) no-repeat 0 0; }
	
	#masthead #logo,
	#masthead #logo a { width: 131px; height: 60px;	}
		#masthead #logo { top: 0px; left: 20px; }
		

#main-area { background: #fff; }
	
	#content { float: left; padding: 20px; width: 440px; }
	
		#map-area { float: left; display: inline; width: 440px; }
		#map { width: 434px; height: 300px; }
	
	#secondary-content { width: 480px; background: #8d372c url(/images/themes/bg_side-magnum.gif) repeat-x left bottom; }
		#container #main-area #service-times,
		#container #main-area #secondary-navigation
		{ margin: 0 0 5px; padding: 12px; width: 456px; background: none; border: 0; color: #fff; }
			#container #main-area #service-times ul,
			#container #main-area #secondary-navigation ul { border-top: 1px solid #a6635a; }
			#container #main-area #secondary-navigation ul { border-bottom: 1px solid #a6635a; }
			#container #main-area #secondary-navigation ul ul { border: 0; }
			
			
			#graphic-buttons { clear: both; padding: 0 12px 12px; width: 456px; text-align: center; }
				#graphic-buttons .graphic-button { float: none; margin: 5px 0; width: 456px; }
				#graphic-buttons .graphic-button a { float: none; display: block; padding: 5px; width: 446px;
														text-align: center;	background: #974035; }
			


#container #site-info { padding: 48px 0 0; width: 480px; font-size: 12px; color: #2f2d28; }
	#container #site-info div, #container #site-info p,	#container #site-info a { font-size: 12px; line-height: 1.1em; }


	#container #site-info address.vcard
	{ clear: both; float: left; display: block; margin-top: 20px; padding: 20px; width: 460px;
		background: #959080; color: #2f2d28; }
		#container #site-info address.vcard a { color: #2f2d28; }
	#container #site-info #church-address { padding-top: 0; height: auto; background: none; }		
	#container #site-info #site-copyright
	{ clear: both; float: left; display: block; margin-top: 0; padding: 20px 20px 30px; width: 460px;
		background: #959080; color: #2f2d28; }
		#container #site-copyright #abt-link,
		#container #site-copyright #abt-link a { color: #d5d0be; }
	
	
	#container #top-link { position: absolute; left: 26px; top: 9px; }
		#container #top-link, #top-link a
		{ float: left; display: inline; width: 48px; height: 35px; text-indent: -9000em;
									background: url(/images/sp_top-link.gif) no-repeat 0 0; }
			#container #top-link a:hover { background-position: 0 -35px; }

	#container p.top-link a { right: -20px; }
	

	
/*======================================
	=Page Styles
======================================*/


/* homepage specific */
	#outreach-links { margin: 10px 0 0; }
	#main-area #outreach-links ul { position: relative; top: auto; right: auto; }
		#main-area #outreach-links ul, #main-area #outreach-links ul li,
		#main-area #outreach-links ul li h3,
		#main-area #outreach-links ul li a
		{ float: left; display: inline; margin: 0; padding: 0; width: 140px; line-height: 1.1em; background: none; }
		#main-area #outreach-links ul { margin: 5px 0 20px; width: 480px; }
		
		#main-area #outreach-links ul li h3 { margin-bottom: .5em; }
		
		#main-area #outreach-links ul li,
		#main-area #outreach-links ul li a { height: auto; color: #fc7969; text-decoration: none; text-indent: 0; }
		#main-area #outreach-links ul li#ol-welcome,
		#main-area #outreach-links ul li#ol-welcome a { color: #60b4df; }
		#main-area #outreach-links ul li#ol-prayer,
		#main-area #outreach-links ul li#ol-prayer a { color: #ffcc40; }
		
		#main-area #outreach-links ul li a
		{ position: absolute; left: 0; top: 0; padding: 5px; width: 140px; height: 86px; }
		#main-area #outreach-links ul li { position: relative; margin: 0 5px; padding: 40px 5px 5px; height: 46px;
											text-indent: 0;	background: #000; text-align: center; }
		
	#container #upcoming-events { width: 440px; font-size: 14px; }
		#container #upcoming-events h3,
		#container #upcoming-events p { font-size: 14px; }
		
		#container #upcoming-events ul { margin: 1em 0 0 0; width: 440px; }
			#container #upcoming-events ul li { margin-left: 10px; width: 210px; }
				#container #upcoming-events ul li.more-link { width: 440px; }
				
				#container #upcoming-events ul li a.thumbnail { display: none; }
/* end homepage specific */


/* all inner pages specific */
	#content div.volunteerList,
	#content div.eventList,
	#content div.staffList,
	#content div.volunteerList ul,
	#content div.eventList ul,
	#content div.staffList ul,
	#content div.volunteerList ul li,
	#content div.eventList ul li,
	#content div.staffList ul li,
	#content div.volunteerList ul ul,
	#content div.eventList ul ul,
	#content div.staffList ul ul,
	#content div.volunteerList ul ul li,
	#content div.eventList ul ul li,
	#content p.open-close-all { width: 440px; /* 530's */}
	
	#content div.volunteerList ul ul ul,
	#content div.volunteerList ul ul li.job-category,
	#content div.eventList ul ul ul,
	#content div.eventList ul ul li.event-category,
	#content div.staffList ul ul ul,
	#content div.staffList ul ul li.staff-category,
			#content div.volunteerList ul ul li.job-category ul,
			#content div.eventList ul ul li.event-category ul,
			#content div.volunteerList ul ul li.job-category li,
			#content div.eventList ul ul li.event-category li { width: 400px; /* 490's */}
	
	#content div.volunteerList ul ul ul ul,
	#content div.volunteerList ul ul ul li.job-category,
	#content div.eventList ul ul ul ul,
	#content div.eventList ul ul ul li.event-category,
	#content div.staffList ul ul ul ul,
	#content div.staffList ul ul ul li.staff-category,
			#content div.volunteerList ul ul ul li.job-category ul,
			#content div.eventList ul ul ul li.event-category ul,
			#content div.volunteerList ul ul ul li.job-category li,
			#content div.eventList ul ul ul li.event-category li { width: 360px; /* 450's */}
	
	#content div.volunteerList h2,
	#content div.eventList h2,
	#content div.staffList h2 { width: 430px; /* 520's */}
	
	#content div.volunteerList ul ul h2,
	#content div.eventList ul ul h2,
	#content div.staffList ul ul h2 { width: 390px; /* 480's */}
	#content div.volunteerList ul ul ul h2,
	#content div.eventList ul ul ul h2,
	#content div.staffList ul ul ul h2 { width: 350px; /* 440's */}
	
	
	#content div.staffList dl,
	#content div.staffList dl dt,
	#content div.staffList dl dd { width: 200px; /* 245's */}
	
	#content div.staffList ul ul ul dl,
	#content div.staffList ul ul ul dl dd { width: 170px; /* 215's */}
	#content div.staffList ul ul ul dl dt { width: 156px; /* 201's */}
	#content div.staffList ul ul ul ul dl,
	#content div.staffList ul ul ul ul dl dd { width: 105px; /* 175's */}
	#content div.staffList ul ul ul ul dl dt { width: 67px; /* 161's */}
	
	#content div.staffList dl dt { width: 186px; /* 231's */}
	
	
	#content #leader-list-nav,
	#content #leader-list,
	#content #leader-list ul,
	#content #leader-list ul li { width: 440px; }
/* end inner pages specific */



/*======================================
	=Navigation Styles
======================================*/

#container #main-nav { z-index: 700; }
#container #site-tools { z-index: 10; }

#main-nav ul, #main-nav ul li, #main-nav ul li a { text-indent: 0; }
#container #main-nav ul { left: 0; top: 93px; width: 480px; }
#container #main-nav ul li { width: auto; height: 46px; }
#container #main-nav ul li a,
#container #main-nav ul li span
{ padding: 0 10px; width: auto; height: 46px; line-height: 46px; color: #fff;
	font-size: 14px; font-weight: bold; text-decoration: none; border-right: 1px solid #4789a5;	text-align: center; }

	#container #main-nav ul li#n-about a,
	#container #main-nav ul li#n-ministries a,
	#container #main-nav ul li#n-about span,
	#container #main-nav ul li#n-ministries span { padding: 0; width: 239px; }
	#container #main-nav ul li#n-calendar { clear: both; }
	#container #main-nav ul li#n-ministries a,
	#container #main-nav ul li#n-ministries span,
	#container #main-nav ul li#n-services a { background: none; border: 0; }
	
	#container #navigation #main-nav ul li#n-about a.no-link,
	#container #navigation #main-nav ul li#n-ministries a.no-link { position: relative; left: auto; top: auto; }
	
	#container #navigation #main-nav ul li:hover a,
	#container #navigation #main-nav ul li a:hover,
	#container #navigation #main-nav ul li:focus a,
	#container #navigation #main-nav ul li a:focus,
	#container #navigation #main-nav ul li#n-about a,
	#container #navigation #main-nav ul li#n-about span { background: none; }
	
	/* remove drop downs altogether */
	/*#container #main-nav ul li div.drop,
	#container #main-nav ul li div.drop-inner,
	#container #main-nav ul li ul,
	#container #main-nav ul li ul li,
	#container #main-nav ul li ul li  { display: none; }*/
	
	/* drop down resets */
	#container #navigation #main-nav ul li div.drop ul { position: relative; left: auto; top: auto; }
	#container #navigation #main-nav ul li div.drop li,
	#container #navigation #main-nav ul li div.drop li a { height: auto; line-height: 1.1em; padding: 0; }
	
	/* drop down styling */
	#container #navigation #main-nav ul li div.drop {
		top: 36px; left: 4px; /* top = height of primary nav button */
		margin: 0; padding: 4px 0;
		width: 200px;
		background: url(/images/bg_drop-down-cap.png) no-repeat 0 0;
		color: #66695e;
		z-index: 800;
	}
		#container #navigation #main-nav ul li#n-about div.drop ul li a,
		#container #main-nav ul li span { border: 0; }
		
		#container #navigation #main-nav ul li#n-ministries div.drop
		{ left: auto; right: 4px; width: 407px; background-image: url(/images/bg_site-tools-cap.png); }
		
		 #container #navigation #main-nav ul li div.drop li,
		 #container #navigation #main-nav ul li div.drop a { float: none; display: block; width: auto; }
				
	#container #navigation #main-nav ul li div.drop-inner {
		float: left; display: inline;
		margin: 0; padding: 3px 7px 7px;
		width: 186px;
		background: url(/images/bg_drop-down.png) no-repeat left bottom;
		color: #66695e;
	}
		#container #navigation #main-nav ul li#n-ministries div.drop-inner
		{ width: 399px; background-image: url(/images/bg_site-tools.png); }
	
	
	#container #navigation #main-nav ul li div.drop div.group1,
	#container #navigation #main-nav ul li div.drop div.group2 {
		float: left; display: inline;
		margin: 0; padding: 0 0;
		width: 186px;
	}
		#container #navigation #main-nav ul li div.drop div.group2 { margin-left: 20px; }
	
	#container #navigation #main-nav ul li div.drop ul {
		margin: 0; padding: 0;
		width: 186px;
		background: none;
		line-height: 1em;
		font-size: 11px; /* override height from nav */
	}
		#container #navigation #main-nav ul li#n-ministries ul { margin: .25em 0; }
		#container #navigation #main-nav ul li#n-ministries ul#nm-guidance-group,
		#container #navigation #main-nav ul li#n-ministries ul#nm-equip-group,
		#container #navigation #main-nav ul li#n-ministries ul#nm-outreach-group,
		#container #navigation #main-nav ul li#n-ministries ul#nm-media-group
		{ padding: .25em 0; border-top: 1px solid #d8dad4; }
		
		#container #navigation #main-nav ul li#n-ministries ul#nm-media-group,
		#container #navigation #main-nav ul li#n-ministries ul#nm-equip-group { padding-bottom: 0; }
		#container #navigation #main-nav ul li#n-ministries ul#nm-adult-group,
		#container #navigation #main-nav ul li#n-ministries ul#nm-student-group { padding-bottom: .25em; }
	
	#container #navigation #main-nav ul li div.drop ul li {
		margin: 0; padding: 0;
		width: 186px;
		background: none;
		line-height: 1em;
	}
	
	#container #navigation #main-nav ul li#n-about div.drop div.drop-inner ul li a,
	#container #navigation #main-nav ul li div.drop div.drop-inner ul li a,
	#container #navigation #main-nav ul li div.drop div.drop-inner ul li strong {
		padding: 7px 11px 7px 18px;
		width: 157px;
		background: url(/images/pray-icons/i_arrow-rt-dkgr.gif) no-repeat 5px 50%;
		text-decoration: none;
		text-align: left;
		color: #66695e;
	}
	

	/* 2nd level + */
	/*#container #navigation #main-nav ul li ul li div.drop ul li div.drop,
	#container #navigation #main-nav ul li ul li div.drop { top: -4px; left: 184px; }
	#container #navigation #main-nav ul li ul li div.drop div.drop { left: -9000em; top: 0; }*/
	#container #navigation #main-nav ul li#n-about ul li div.drop,
	#container #navigation #main-nav ul li#n-about ul li div.drop ul li div.drop,
	#container #navigation #main-nav ul li#n-about ul li div.drop div.drop { left: -9000em; top: 0; }
	
	
	
	/* site tools */
	#container #info-menu ul { right: 110px; }
	#container #site-tools
	{ position: absolute; top: 12px; right: 16px; font-size: 11px; line-height: 1em; z-index: 1000; }
		
	#container #site-tools h5,
	#container #site-tools h6,
	#container #site-tools #font-tools,
	#container #site-tools #n-sitemap,
	#container #site-tools #search-tool label { display: none; }
	#container #site-tools #site-tools-wrap { position: relative; left: 0; top: 0; float: none; width: auto; }
		
		#container #site-tools:hover #site-tools-wrap,
		#container #site-tools #site-tools-wrap ul,
		#container #site-tools #site-tools-wrap ul li
		{ top: auto; right: auto; left: auto; float: none; margin: 0; padding: 0; width: auto;
			background: none; line-height: 1em; }
		#container #site-tools ul li#n-access-info
		{ margin: 0; width: 94px; text-align: right; color: #fff; font-weight: normal; }
			#site-tools li#n-access-info a { color: #fff; }
					
	#container #site-tools #site-tools-wrap ul #search-tool
	{ position: absolute; /*left: -362px; top: 175px;*/ left: -130px; top: 20px; border: 0; width: 320px; z-index: 10; }
		#container #site-tools #search-tool input { width: 130px; }
		#container #site-tools #search-tool input#sa { border: 0; padding: 0; width: auto; background: none; }
		#container #site-tools #search-tool input#sa { vertical-align: middle; }
		
		
	#container #site-tools #site-tools-wrap ul #sharing-tools
	{ position: absolute; right: -100px; top: 180px; width: 37px; height: 37px; 
		background: url(/images/iphone_b-share.gif) no-repeat 0 0; }
	
	#container #site-tools #site-tools-wrap ul li#sharing-tools ul.level2
	{ position: absolute; right: 0; top: 35px; float: left; display: inline; margin: 0; padding: 10px 5px 10px 10px;
		width: 210px; height: 37px;
		background: url(/images/iphone_bg-share.png) no-repeat 0 0; }
	#container #site-tools #site-tools-wrap ul li#sharing-tools ul.level2 li,
	#container #site-tools #site-tools-wrap ul li#sharing-tools ul.level2 li a
	{ float: left; display: inline; width: 37px; height: 37px; text-indent: -9000em;
		background: url(/images/iphone_b-facebook.gif) no-repeat 0 0; }
	#container #site-tools #site-tools-wrap ul li#sharing-tools ul.level2 li { margin-right: 5px; }
	
	#container #site-tools #site-tools-wrap ul li#sharing-tools ul.level2 li#n-myspace,
	#container #site-tools #site-tools-wrap ul li#sharing-tools ul.level2 li#n-myspace a
	{ background-image: url(/images/iphone_b-myspace.gif); }
	#container #site-tools #site-tools-wrap ul li#sharing-tools ul.level2 li#n-stumble,
	#container #site-tools #site-tools-wrap ul li#sharing-tools ul.level2 li#n-stumble a
	{ background-image: url(/images/iphone_b-stumble.gif); }
	#container #site-tools #site-tools-wrap ul li#sharing-tools ul.level2 li#n-google,
	#container #site-tools #site-tools-wrap ul li#sharing-tools ul.level2 li#n-google a
	{ background-image: url(/images/iphone_b-google.gif); }
	#container #site-tools #site-tools-wrap ul li#sharing-tools ul.level2 li#n-delicious,
	#container #site-tools #site-tools-wrap ul li#sharing-tools ul.level2 li#n-delicious a
	{ background-image: url(/images/iphone_b-delicious.gif); }