﻿/* 
Styles for:	Busy Bee Nannies Website
Author:		Daniel Ma
Version:	9 March 2006
Purpose:	Screen stylesheet
*/
body { font-family: Arial, Helvetica, sans-serif; background-color: #63A2ED; color: #666666; MARGIN: 0px; margin-top: 10px;	COLOR: #444444; }

#backgroundcontainer { width: 770px; BACKGROUND-POSITION: center; BACKGROUND-IMAGE: url(../images/background.gif); BACKGROUND-REPEAT: repeat-y; margin-left: auto; margin-right: auto; }
#footerbackground { background-image: url(../images/background_bottom.gif); background-position: top; background-repeat: repeat-x; height: 4px;	width: 768px; margin-left: auto; margin-right: auto; }
#pagecontainer { width: 765px; padding-bottom: 0px; margin-left: auto; margin-right: auto; text-align: left; }
#header { background-color: #FFFFFF; height: 110px; width: 100%; background-image: url(../images/top_children.jpg); background-position: right;	background-repeat: no-repeat; padding: 0px 0px; }
#header h1 { margin: 5px 0 0px 10px; float: left; padding: 96px 0 0 0px; overflow: hidden; display: block; width: 426px; background-image: url(../images/logo.gif);	background-repeat: no-repeat; height: 0px !important; height /**/:105px; }

/* Site Info styles */
#siteinfo { float: right; margin: 0px; display: inline; }
#siteinfo ul { list-style-type: none; margin: 0; }
#siteinfo ul li { display: inline; padding: 0px 6px; margin: 0;	}
#siteinfo ul li a { color: #0B436C;	font-size: 70%;	text-decoration: none; font-weight: bold; }
#siteinfo ul li a:hover { text-decoration: underline; }
#contentcontainer {	background-color: #E4EFFC; float: right; }
#rightcontent { width: 565px; float: right;}

/* Navigation styles */
#navigation { list-style-type: none; margin: 0; padding: 0;	width: 100%; height: 28px; background-color: #155BB0; display: block; }
#navigation li { display: inline; padding: 0px; margin: 0; float: left;	text-align: center; }
#navigation li a { color: #eeeeee; font-size: 75%; font-weight: bold; text-decoration: none; display: block; width: 90px; height: 21px;	padding: 6px 10px 0px 10px;	}
#navigation li a:hover { color: #ffffff; text-decoration: underline; }
#navigation li a.selected { color: #ffffff; }

/* Left content style */
#leftcontent { width: 180px; float: right; padding: 210px 10px 10px 10px; background-repeat: no-repeat; }
#leftcontent h2 { font-size: 85%; color: #555577; margin: 15px 0 4px 0;	padding-left: 22px;	background-repeat: no-repeat; background-position: left; }
#leftcontent h2.contactus { background-image:url(../images/icon_telephone.gif); }
#leftcontent h2.latestjobs { background-image:url(../images/icon_person.gif); }
#leftcontent p { font-size: 70%; margin: 5px 0px; line-height: 120%; color: #666688; }

/* Latest Jobs Panel */
.latestjobs { font-size: 70%; list-style-type: none; padding: 0; margin: 0; }
.latestjobs li { line-height: 125%; }
.latestjobs a, .contactus a {	color: #666688;	text-decoration: none;}
.latestjobs a:hover, .contactus a:hover { text-decoration: underline; }

/* Content Styles */
#content { 	width: 535px; float: right; display: block;	background-color: #FFFFFF;	padding: 15px; }
#leftcolumn { width: 245px; float: left; border-right: 1px solid #63A2ED; padding-right: 15px;}
#rightcolumn { width: 259px; float: left; padding-left: 15px; }
#content p { font-size: 75%; }
#content h1 { font-size: 120%; color: #155BB0; margin-top: 0; }
#content h2 { font-size: 90%; color: #155BB0; }
#content h3 { font-size: 80%; font-weight: bold; font-style: italic; }
#content ul { font-size: 75%; }
#content label { font-size: 75%; }
#content .question { font-weight: bold;	color: #155BB0; }
#content .jobapply { float: left; padding-left: 0px; }
#content .jobemail { float: right; padding-right: 0px; }

/* Award block */
#content .award { display: block; width: 75%; background-color: #FFCC00; margin-left: auto; margin-right: auto; margin-top: 10px; margin-bottom: 10px; padding: 0px; }
#content .award h2 {  margin: 5px 10px; color: #6F3000;  }
#content .award p {  margin: 3px 0 10px 10px; }
#content .award blockquote {font-size: 75%; font-family: Georgia, "Times New Roman", Times, serif; font-style: italic; margin: 7px 25px; }

/* Rounded corners effect */
b.rtop, b.rbottom{display:block;background: #FFF}
b.rtop b, b.rbottom b{display:block;height: 1px; overflow: hidden; background: #FFCC00;}
b.r1{margin: 0 5px;}
b.r2{margin: 0 3px;}
b.r3{margin: 0 2px;}
b.rtop b.r4, b.rbottom b.r4{margin: 0 1px;height: 2px;}

/* CTA Button Link */
a.ctabutton { text-decoration: none; font-weight: bold;	color: #0B436C;	cursor: pointer; font-size: 90%; }
a.ctabutton:hover { color: #155BB0; }
a.ctabutton .text { background-image: url(../images/ctabuttontile.gif);	background-repeat:repeat-x;	height: 26px; float: left; padding: 0px 4px; padding-top: 5px; }
a.ctabutton .begin { height: 29px; width: 18px;	float: left; background-image: url(../images/ctabuttonbegin.gif); background-repeat:no-repeat; }
a.ctabutton .end { height: 29px; width: 29px; float: left; background-image: url(../images/ctabuttonend.gif); background-repeat:no-repeat; }

/* Detail Container */
#detailcontainer { background-color: #FFFFDD; padding: 10px; margin: 0; border: 1px solid #CCCCAA;}
#detailcontainer div.extended { padding-left: 40px; margin: 0; }
#detailcontainer div.extended p { margin-top: 0; }
#detailcontainer h4 { width: 105px; float: left; margin: 0; font-weight: normal; font-size: 75%;}

/* Footer Styles */
#footer { width: 98%; height: 17px; background-color: #155BB0; color: #ccccff; padding: 6px 1%; clear: both; font-size: 70%; font-weight: bold; }
#footer #supportlinks { float: right; }
#footer #copyright { float: left; font-size: 100%; margin: 0;}

/* Vacancy Classes */
#vacancydetails label { display: block;	width: 100px; float: left; }
table { width: 100%; font-size: 75%; margin: 0;	border-collapse: collapse; border-spacing: 0; }
table td { padding: 3px 2px; }
table caption { font-size: 120%; text-align: left; font-weight: bold; color: #155BB0; padding: 5px 0;}
table thead tr { background-color: #63A2ED;	color: #ffffff; }
table thead th { padding: 3px 2px; }
table tbody a { color: #155BB0; text-decoration: none; display: block; width: 100%;}
table tbody a:hover { text-decoration: underline;}
table tbody a.cta { border: 1px solid #63A2ED; padding: 2px 3px; display: block; white-space: nowrap; background-color: #E4EFFC; width: auto;}
table tbody a.cta:hover { border: 1px solid #155BB0; background-color: #FFFFFF;	text-decoration: none;}

/* Featured Nannies */
#overview h1 { float: left; }
#overview h2 { font-size: 100%; margin: 0; font-style:italic; }
#overview a { float: right; margin-top: 15px; margin-bottom: 5px; }
.column { float: left; width: 256px;}
.column p { float: left; width: 150px; margin: 0 0 5px 0;} 
.column ul { float: left;  padding: 0; margin: 0 0 6px 0; list-style: none; }


/* Generic Classes */
.noshow { position:absolute; left:0px; top:-100px; width:0px; height:0px; overflow:hidden; }
.clearer { float: none; clear: both; height: 0px;}