/* 	style-example.css
	adapted for ExpressionEngine
*/

/********************
	=layout
********************/

* {
	margin: 0;
	padding: 0;
}

html {
	margin: 0;
	padding: 0;
}

body { 
	font-family: verdana, arial, helvetica, sans-serif;
	font-size: 62.5%; /* now, font-size: 1.2em = 12px */
	line-height: 1.5;
	margin: 0;
	padding: 0;
	background-color: #5f6062;
	color: #ffffff;
}

/********************
	=layout
	position & bg color only
********************/
#page-bg {
	margin: 0px auto 0px auto;
	padding: 0;
	position: relative;
	width: 759px;
	background-color: black;
}
/* .showLayout #page-bg { background-color: white; } */

#page-fg {
}
/* .showLayout #page-fg { background-color: gray; } */


#nav-top{
	width: 759px;
	height: 34px;
	background-color: #a0d6be;
}

#masthead  {
	width: 759px;
	height: 117px;
	background: url(backgroundbanner.jpg) no-repeat;
}


#page-contents {
	overflow: hidden; /* clears float for FF */
	margin: 0;
	position: relative;
	background: url(page-background.gif) repeat-y;
}

body.home #page-contents {
	background-image: none;
}
/* .showLayout #page-contents { background-color: white; } */

#main-content {
	padding-bottom: 30px;
	position: relative;
	width: 550px;
	float: left; 
	overflow: hidden; /* clears float for FF */
	font-size: 1.3em;
}

/* .showLayout #main-content { background-color: yellow; } */

#nav-main {
	width: 180px;
	margin-right: 20px;
	float: left;
}

#footer {
	margin: 1em 0;
	overflow: hidden;
	position: relative;
	
}
/*.showLayout #footer { background-color: green; }*/

/***** basic-page .home *****/
#basic-page.home #main-content {
	margin: 20px;
	width: 699px;
	padding-top: 15px;
	float:none;
}

body.home #nav-main {
	display:none;
}

body.home #main-content  table {
	border: none;
	margin: 0;
}

body.home #main-content td {
	padding: 0 20px;
}

body.home #main-content td {
	width: 33%;
}



/********************
	=html style
********************/
h1, h2, h3, h4, h5, h6 {
	color: #46d15c;
	margin-bottom: .7em;
}
h1 {
	font: normal bold 1.3em/1.6 verdana, arial, helvetica, sans-serif;
	margin: 10px 0;
}
/* h2 { 
	font: normal normal 1.6em/1.2 verdana, arial, helvetica, sans-serif;
} 

h4 { 
	font: italic bold 1.0em/1.5 verdana, arial, helvetica, sans-serif;
	margin-bottom: 0;
}This code is in style-richtext.css */

h5, h6 { 
	font: italic bold 1.0em/1.5 verdana, arial, helvetica, sans-serif;
	margin-bottom: 0;
}

a:link, a:visited, a:active {
	color: white;
}

a:hover {
	color: #46d15c;
}	

/* p, li, dd, th, td, caption, blockquote, q {
	font: normal normal normal 1.3em/1.4 verdana, arial, helvetica, sans-serif; 
}*/
#page-contents ul li { margin: 0px 15px;}
p { margin: 7px 0;}
b,strong { font-weight: bold; }
i,em { font-style: italic; }
q { }
q:lang(en) { quotes: '“', '”'; }
blockquote { margin: 5px; }
blockquote p {
	color: #f2cd8f;
	font: normal normal normal 12px/1.1 verdana, arial, helvetica, sans-serif;
}
blockquote p:before { content: open-quote; }
blockquote p:after { content: no-close-quote; }
blockquote p.last:after { content: close-quote; }

ul, ol { margin: 0 0 .5em 2em; padding: 0; }
li { margin-bottom: .5em; }

dt {
	font-weight: bold;
}
dd {
	margin-bottom: .5em;
}

table {
	border: none;
	border-collapse: collapse;
	margin: 0 auto 0 auto;
}
thead th, thead td {
	font-weight: bold;
	background: #EA8F3E;
	color: black;
	vertical-align: bottom;
}
th, td { 
	border: none;
	padding: 3px;
	vertical-align: top;
}
th { text-align: left; padding-right: 13px; }
td { text-align: left; }
caption { font-style: italic; }
tfoot { color: #983468; font-style: italic; }

/********************
	=style elements
********************/


.hideFromSight {
	/* hidden from browser, but visible to screen readers */
	position: absolute;
	left: -10000px;
	top: auto;
	height: 1px;
	width: 1px;
	overflow: hidden;
}

#masthead img#logo { display: none; }
#masthead div.siteName { display: none; }

.clear { clear: both; }

.ie6br {
	display: inline;
	height: 0px;
	border: 1px solid white;
	float: right;
}

/* =more */
.more {
	text-align: right;
	margin-right: 25px;
}

.more:after { 
	content: " >>"; 
	color:#446162; 
	font-weight: bold; 
	font-size: 10px; 
	line-height: 14px; 
}

.more a {
	color: #446162;
	font-size: 14px;
	font-family: century gothic, tahoma, sans serif;
	font-weight: bold;
	margin-bottom: 14px;
	text-decoration: none;
}

.more a:hover {
	color: #9bb2b2;
}

.adminbox {
	border: 1px solid #666666;
	padding: 10px;
	margin-bottom: 10px;
}

ul.invoicebox {
	list-style:none;
	margin: 0;
}

ul.invoicebox li {
	list-style:none;
	padding: 7px;
	margin: 3px 0;
	border: 1px solid #666666;
}

.inlineform {  }
.inlineform form {display: inline; }
.inlineform form input {display: inline; }



/********************
	=calendar
********************/
table.calendarBG {
	border: none;
	margin: 1em;
	width: 100%;
}
.calendarHeader th {
	border-top: none;
	border-left: none;
	border-right: none;
	border-color: #a14e21;
	font-size: 16px;
	height: .8em;
	text-align: center;
}
.calendarHeader a {
	color: #585c55;
	text-decoration: none;
}

/* style S M T W TH F S */
table td.calendarDayHeading { 
	background: #cf8157;
	color: white;
	font-weight: bold;
	height: .3em;
text-align: center;
}

/* style the date cells */
.calendarBG td {
	border-color: #a14e21;
	height: 5.5em;
	padding: 0;
	width: 14%;
}
td.calendarBlank { background-color: #f8e6be; }
td.calendarCell { }
td.calendarToday { background-color: #e9ae4a; }

/* style the date */
.calendarCell .date, .calendarToday .date {
	color: #f8e6be;
	font-size: 49px;
	text-align: center;
	vertical-align: top;
	width: 13.3%;
}

/* style the events */
td.calendarBlank div, td.calendarCell div, td.calendarToday div {
	font-size: 12px;
	font-weight: normal;
	margin-bottom: 6px;
	padding: 0 .5% 0 .5%;
	position: absolute;
	text-align: left;
	width: 13.3%;
}
td.calendarBlank a, td.calendarCell a, td.calendarToday a {
	color: black;
}




/********************
	=table listing
********************/
table.listing { 
	border: none;
	border-collapse: collapse;
	empty-cells: show;
}
table.listing td, table.listing th {
	border: none;
	font-weight: normal;
	text-align: left; 
	padding-right: 20px; 
}
table.listing thead td { 
	background-color: transparent; 
	border-bottom: 1px solid #a14e21;
	font-weight: bold;
}
table.listing caption { margin-bottom: 6px; }


/********************
	=listings
********************/
ul.listing { 
	list-style-type: none; 
	margin-left: 0; 
	padding-left: 0;
}
.listing li { margin-bottom: 12px; }

ul#eventList a { text-decoration: none; }
.eventDate { 
	float: left;
	font-weight: bold;
	width: 8em;
}
.eventTitle {
}

/********************
	=menu
	Works with Structure.
********************/
/*
<ul id="nav-main" class="menu">
	<li class="sub-level-0 here"><a href='/index.php/structure_left/about/'>About AFCC</a>
		<ul>
			<li class="sub-level-1"><a href='/index.php/structure_left/about/history/'>History</a></li>
			<li class="sub-level-1"><a href='/index.php/structure_left/about/board-staff/'>Board & Staff</a></li>
			<li class="sub-level-1 last"><a href='/index.php/structure_left/about/contact-us/'>Contact Us</a></li>
		</ul>	
	</li>
	<li class="sub-level-0"><a href='/index.php/structure_left/childcare/'>Child Care Services</a></li>
	<li class="sub-level-0"><a href='/index.php/structure_left/providers/'>Providers</a></li>
	<li class="sub-level-0 last"><a href='/index.php/structure_left/training/'>Training</a></li>
</ul>
*/

/********************
	=home menu
	Works with Structure.
********************/

ul#home-main, ul#home-main li {
	margin: 0;
	padding: 0;
}

#top-home-nav { overflow: hidden; height: 258px;}

#home-main li.nav_industrial, #home-main li.nav_commercial, #home-main li.nav_residential, li.nav_firealarms, li.nav_datavoice, li.nav_audiovideo, li.nav_solar {
	display: block; float: left;
}


.home #main-content { clear:both; }
.home #ie6only #main-content { overflow: hidden; }

li.nav_firealarms, li.nav_datavoice, li.nav_audiovideo, li.nav_solar {
	margin: 15px 5px;
}
#home-secondary li.nav_firealarms, #home-secondary li.nav_datavoice, #home-secondary li.nav_audiovideo, #home-secondary li.nav_solar {
	margin: 4px;
}

#home-main li.nav_industrial a, #home-main li.nav_commercial a, #home-main li.nav_residential a, li.nav_firealarms a, li.nav_datavoice a, li.nav_audiovideo a, li.nav_solar a {
	display: block; float: left;
}

#home-main li.nav_industrial a span, #home-main li.nav_commercial a span, #home-main li.nav_residential a span, li.nav_firealarms a span, li.nav_datavoice a span, li.nav_audiovideo a span, li.nav_solar a span {
	left: -10000px;
	top: auto;
	height: 1px;
	width: 1px;
	overflow: hidden;
	display: block;
}

#home-main li.nav_industrial a {
	width: 251px;
	height: 258px;
	background: url(home-industrial-portal.jpg) no-repeat;
}

#home-main li.nav_industrial a:hover {
	background: url(home-industrial-portal.jpg) no-repeat bottom;
}

#home-main li.nav_commercial a {
	width: 257px;
	height: 258px;
	background: url(home-commerical-portal.jpg) no-repeat;
}

#home-main li.nav_commercial a:hover {
	background: url(home-commerical-portal.jpg) no-repeat bottom;
}

#home-main li.nav_residential a {
	width: 251px;
	height: 258px;
	background: url(home-residential-portal.jpg) no-repeat;
}

#home-main li.nav_residential a:hover {
	background: url(home-residential-portal.jpg) no-repeat bottom;
}

li.nav_firealarms a {
	width: 157px;
	height: 45px;
	background: url(secondarylink-firealarm.gif) no-repeat;
}

li.nav_firealarms a:hover {
	background: url(secondarylink-firealarm.gif) no-repeat bottom;
}

li.nav_audiovideo a {
	width: 157px;
	height: 45px;
	background: url(secondarylink-audiovideo.gif) no-repeat;
}

li.nav_audiovideo a:hover {
	background: url(secondarylink-audiovideo.gif) no-repeat bottom;
}

li.nav_datavoice a {
	width: 157px;
	height: 45px;
	background: url(secondarylink-datavoice.gif) no-repeat;
}

li.nav_datavoice a:hover {
	background: url(secondarylink-datavoice.gif) no-repeat bottom;
}

li.nav_solar a {
	width: 157px;
	height: 45px;
	background: url(secondarylink-solar.gif) no-repeat;
}

li.nav_solar a:hover {
	background: url(secondarylink-solar.gif) no-repeat bottom;
}



/********************
	=vmenu, left nav, main nav
	Works with Structure.
********************/
/* colors */
#nav-main ul li a { color: white; }
#nav-main ul li.here a { color: #46d15c; }
#nav-main ul li a:hover { color: #46d15c; }

/* code */
#nav-main ul#sidebar-main, #nav-main ul#sidebar-main-secondary {
	list-style: none;
	margin: 10px 0 0 0;
	padding: 0px 0 0 0;
}
#nav-main ul#sidebar-main li {
	display: block;
	margin: 5px 0 0 14px;
	width: 150px;
	height: 29px;
	background-color: #000000;
	border: 1px solid #ffffff;
}

#nav-main ul#sidebar-main li a {
	display:block;
	margin: 0px auto;
	width: 150px;
	height: 29px;
}

#nav-main ul#sidebar-main-secondary li {
	display: block;
	margin: 5px 0 0 35px;
	width: 100px;
	height: 30px;
	background-color: none;
	border: none;
}

#nav-main ul#sidebar-main-secondary li a {
	display:block;
	margin: 0px auto;
	width: 100px;
	height: 30px;
}

#nav-main ul#sidebar-main li.nav_industrial a { background: url(sidebar-industrial.gif) no-repeat; }
#nav-main ul#sidebar-main li.nav_commercial a { background: url(sidebar-commercial.gif) no-repeat; }
#nav-main ul#sidebar-main li.nav_residential a { background: url(sidebar-residential.gif) no-repeat; }

#nav-main ul#sidebar-main-secondary li.nav_firealarms a { background: url(sidebar-firealarms.gif) no-repeat top; }
#nav-main ul#sidebar-main-secondary li.nav_datavoice a { background: url(sidebar-datavoice.gif) no-repeat top; }
#nav-main ul#sidebar-main-secondary li.nav_audiovideo a { background: url(sidebar-audiovideo.gif) no-repeat top; }
#nav-main ul#sidebar-main-secondary li.nav_solar a { background: url(sidebar-solar.gif) no-repeat top; }

#nav-main ul#sidebar-main-secondary li.nav_firealarms a:hover { background-position: bottom; }
#nav-main ul#sidebar-main-secondary li.nav_datavoice a:hover { background-position: bottom; }
#nav-main ul#sidebar-main-secondary li.nav_audiovideo a:hover { background-position: bottom; }
#nav-main ul#sidebar-main-secondary li.nav_solar a:hover { background-position: bottom; }


#nav-main ul#sidebar-main li a span {
	left: -10000px;
	top: auto;
	height: 1px;
	width: 1px;
	overflow: hidden;
	display: block;
}

#nav-main ul#sidebar-main li ul li a span {
	left: auto;
	top: auto;
	height: auto;
	width: auto;
	overflow: hidden;
	display: block;
}

#nav-main ul#sidebar-main  li ul li {
	background-image: none;
}

/********************
	=breadcrumbs
	Works with Structure.
********************/

#breadcrumbs {
	font-size: .8em;
	color: #ffffff;
	margin: 5px 0 0 0;
}
	
#breadcrumbs a {
	color: #ffffff;
	text-decoration: none;
}

#breadcrumbs a:hover {
	text-decoration: underline;
}

/********************
	=hmenu, top nav
	Works with Structure.
********************/
/* colors */
#nav-top ul li a { color: white; font-size: 12px; }
#nav-top ul li.here a { color: white; }
#nav-top ul li a:hover { color: #46d15c; }

/* code */
#nav-top ul {
	list-style: none;
	margin: 6px 10px 0 0;
	padding: 0;
	z-index: 10;
	float: right;
	height: 22px;
}
#nav-top li {
	float: left;
	font: bold 11px tahoma, verdana, arial, sans-serif;
	line-height: 22px;
	display: block;
	height: 22px;
	padding-left: 10px;
	margin-left: 10px;
	background: url(toplink-right.png) no-repeat;
}

#nav-top ul.loginbutton li {
	font-weight: normal;
}

#nav-top li a span {
	display: block;
	height: 22px;
	background-color: #000000;
	float: left;
}

#nav-top li a {
	text-decoration: none;
	height: 22px;
	display: block;
	float: left;
	padding-right: 10px;
	background: url(toplink-left.png) no-repeat top right;
	cursor: pointer;
}

#ie6only #nav-top li {
	zoom:1;
	position:relative;
}

#nav-top li.last {  }

/********************
	=submenu, right nav, sub nav
	Works with Structure.
********************/
/* colors */
ul#nav_sub li a { font-weight: bold; display: block; border: 1px solid #46d15c; padding: 2px 5px; float: left; color: #ffffff; text-decoration: none; background-color: #5f6062; font-size: .9em; }
ul#nav_sub li.here a { color: #6a9e77; }
ul#nav_sub li a:hover { color: #46d15c; }

/* code */
ul#nav_sub{
	list-style: none;
	margin: 0;
	padding: 0;
}

/* don't show submenus */
/* #nav-sub ul { display: none; } */


/********************
	=forms
********************/
/* As per grid960, labels are 140px, fields are the remainder */

form {}
input, textarea {
	background-color: #635454;
	color: #ffffff;
	font: normal normal normal .9em/1.1 verdana, arial, helvetica, sans-serif;
	margin-bottom: 10px;
	border: 1px solid #46d15c;
}

input.submit {
	background-color: #645353;
	border-color: #ffffff;
	padding: 5px;
}

textarea {
	margin-left: 85px;
}
label, legend {
	font: normal normal bold .9em/1.4 verdana, arial, helvetica, sans-serif;
}

span.fieldRequired { color: red; }
div.formHelp { display: none; }

div.stringWidget { margin: 2px; position: relative; overflow: hidden; }
.stringWidget label { float: left; padding-top: .5em; text-align: right; width: 140px; }
.stringWidget input { margin-left: 10px; }
.stringWidget select { margin-left: 10px; }

div.textAreaWidget { margin: 2px; position: relative; }
.textAreaWidget label { position: absolute; padding-top: .5em; text-align: right; width: 120px; }
.textAreaWidget textarea { padding: 2px; margin-left: 130px; }

fieldset.booleanWidget { margin: 2px 2px 2px 100px; position: relative; }
.booleanWidget legend { }
.booleanWidget input { width: auto; float: left;  }
.booleanWidget label { font-weight: bold; line-height: 2em; margin-left: 0.5em; }
.booleanWidget span.fieldDetail { margin-left: 10px; }

fieldset.selectionWidget { border: none; margin: 0; padding: 12px 0; }
.selectionWidget legend { }
.selectionWidget input { float: left; width: 15px; }
.selectionWidget label { float: left; margin-left: 5px; width: 115px; }
.selectionWidget span.fieldDetail { margin-left: 10px; font: normal normal normal 1.3em/1.4 verdana, arial, helvetica, sans-serif; }

div.oneRow { clear: both; overflow: hidden; }

div.formControls { clear: both; }
.formControls input { margin: 10px 0 10px 150px; }

input.searchsubmit { background: none; }

form table { border: none; }
form thead th, form thead td { background: transparent; color: #585c55; }
form th, form td { 
	border: 0px solid #eaaf4b; 
	padding: 10px 0 0 0;
}

form tbody th, form tbody td { border-width: 1px 0 0 0; vertical-align: middle; }
form tbody tr:first-child th, form tbody tr:first-child td { border: 0px solid #eaaf4b; }

form th.stringField { text-align: left; }
form th.selectField { text-align: center; }
form th.booleanField { text-align: left; }
form th.dateField { text-align: left; }

form table input { margin-right: 6px; }

form td.oneRow { width: 180px; }
form td.oneRow input { float: left; width: auto; }
form td.oneRow select { float: left; margin-right: 3px; width: auto; }

form table .booleanWidget { white-space: nowrap; margin: 2px; }
form table .booleanWidget input { margin: 0; }
form table .booleanWidget label { margin: 0; white-space: nowrap; line-height: 15px; }

form table .selectionWidget {}

/* =fields that require unique formatting */
.oneRow #fieldname-city { float: left; }
.oneRow #fieldname-state { float: left; }
.oneRow #fieldname-postalcode { float: left; }
.oneRow #fieldname-state label { width: 40px; }
.oneRow #fieldname-state input { margin-left: 10px; }
.oneRow #fieldname-postalcode label { width: 25px; }
.oneRow #fieldname-postalcode input { margin-left: 10px; }


/********************
	=sIFR
	These are standard sIFR styles... do not modify
	http://wiki.novemberborn.net/sifr/How+to+use
********************/
/*
.sIFR-flash {
	visibility: visible !important;
	margin: 0;
}

.sIFR-replaced {
	visibility: visible !important;
}

span.sIFR-alternate {
	position: absolute;
	left: 0;
	top: 0;
	width: 0;
	height: 0;
	display: block;
	overflow: hidden;
} */

/* Hide Adblock Object tab: the text should show up just fine, not poorly with a tab laid over it. */
/*
.sIFR-flash + div[adblocktab=true] {
  display: none !important;
}
*/
/* These "decoy" styles are used to hide the browser text before it is replaced... the negative-letter spacing in this case is used to make the browser text metrics match up with the sIFR text metrics since the sIFR text in this example is so much narrower... your own settings may vary... any weird sizing issues you may run into are usually fixed by tweaking these decoy styles */

/*
.sIFR-hasFlash #nav-main li {
	visibility: hidden;
	font-size: 14px;
	line-height: 16px;
}

.sIFR-hasFlash #contentindex h1 {
	visibility: hidden;
}

.sIFR-hasFlash #contentsecondary h1 {
	visibility: hidden;
}

.sIFR-hasFlash #nav-top li {
	visibility: hidden;
	text-align: center;
}

.sIFR-hasFlash .rightsidebar h2 {
	visibility: hidden;
}

*/

/********************
	=colors
********************/
/*
	f8e6be	tan			pageBG
	ffffff	white		contentBG
	EAAF4B	orange		topBG
	a14e21	brown		left col BG, submenu link
	E8DAC2	tan2		right col BG
	
	39571E	dkGreen		h1
	2a4513	dkGreen2	h2 on l1, l2 pages.


	585c55	gray		body text
						h2, headlineText
	868380	gray		footer text
	575552	dkGray		footer text hover
	698b4a	ltGreen		submenu you are here
	cf8157	ltBrown		submenu hover
	FCE0B2	ltBrown2	topmenu hover
	f2cd8f	ltBrown		quote text
	e9ae4a	dkOrange	quote source
*/