/*=======================================================
 CSS Document for White Oak Homecare Services
=======================================================*/

@import url("global.css");

.hidden { display: none; }
.show { display: block; visibility: visible; }

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

.wrapper { background: url('../images/core/bg-repeat.jpg') repeat-y 0 0; width: 980px; height: auto; display: block; margin: 0 auto; }
#container { width: 980px; height: auto; display: block; background: url('../images/core/bg-container.jpg') no-repeat 0 0; clear: both; }
.wrapper:after, #container:after { height: 0; visibility: hidden; content: "."; display: block; clear: both; }

/*=============================================================
	Header - nav + logo + banner + ctas
=============================================================*/

#header { width: 950px; height: 415px; display: block; padding: 0 15px; float: left; clear: both; }
#logo { width: 270px; height: 175px; display: block; }

/*services navigation*/
#subnav { width: 240px; height: 195px; background: url('../images/core/bg-subnav.jpg') no-repeat 0 0; padding: 15px; display: block; }
#subnav h2 { margin: 0; background: url('../images/core/title-subnav.gif') no-repeat 0 0; width: 240px; height: 45px; text-indent: -9999em; line-height: 0; }
#subnav ul { width: 240px; height: 190px; display: block; overflow: hidden; padding:10px 0 0 0; }
#subnav li { width: 240px; height: 30px; float: left; display: inline; margin: 0; }
#subnav li a { display: block; width: 240px; height: 30px; overflow: hidden; text-indent: -9999em; }
#subnav a:hover { background-position: -240px 0!important; }
/*bg images*/
a#navservices1 { background: url('../images/core/nav-services1.gif') no-repeat 0 0; }
a#navservices2 { background: url('../images/core/nav-services2.gif') no-repeat 0 0; }
a#navservices3 { background: url('../images/core/nav-services3.gif') no-repeat 0 0; }
a#navservices4 { background: url('../images/core/nav-services4.gif') no-repeat 0 0; }
a#navservices5 { background: url('../images/core/nav-services5.gif') no-repeat 0 0; }
a#navservices6 { background: url('../images/core/images/nav-supportservices.gif') no-repeat 0 0; }
/*on stage*/
body#services1-page a#navservices1, body#services2-page a#navservices2, body#services3-page a#navservices3, body#services4-page a#navservices4, body#services5-page a#navservices5, body#services6-page a#navservices6 { background-position: -240px 0!important; }

/*main navigation*/
ul#nav { width: 440px; height: 45px; margin: 110px 0 0 0; display: block; float: left; clear: both; }
ul#nav li { display: inline; float: left; position: relative; z-index: 50; }
ul#nav a { height: 45px; overflow: hidden; text-indent: -9999em; display: block; float: left; }
ul#nav a:hover { background-position: 0 -45px!important; }
/*bg images*/
a#navhome { background: url('../images/core/nav-home.gif') no-repeat 0 0; width: 90px; }
a#navprofile { background: url('../images/core/nav-profile.gif') no-repeat 0 0; width: 90px; }
a#navteam { background: url('../images/core/nav-team.gif') no-repeat 0 0; width: 155px; }
a#navcontact { background: url('../images/core/nav-contact.gif') no-repeat 0 0; width: 105px; }
/*on stage*/
body#home-page a#navhome, body#profile-page a#navprofile, body#contact-page a#navcontact, body#team-page a#navteam { background-position: 0 -45px!important; }

/*banner*/
#banner { width: 665px; height: 245px; float: left; display: block; text-indent: -9999em; line-height: 0; clear: both; position: relative; z-index: 10;  }
body#home-page #banner { background: url('../images/core/bg-flash.jpg') no-repeat 0 0; text-indent: 0!important; }
body#profile-page #banner { background: url('../images/core/banner-profile.jpg') no-repeat 0 0; }
/*body#team-page #banner { background: url('../images/core/banner-staff.jpg') no-repeat 0 0; }*/
body#team-page #banner { background: url('../images/core/banner-profile.jpg') no-repeat 0 0; }
body#contact-page #banner { background: url('../images/core/banner-contact.jpg') no-repeat 0 0; }
body#services1-page #banner { background: url('../images/core/banner-pro.jpg') no-repeat 0 0; }
body#services2-page #banner { background: url('../images/core/banner-home-support.jpg') no-repeat 0 0; }
body#services3-page #banner { background: url('../images/core/banner-support.jpg') no-repeat 0 0; }
body#services4-page #banner { background: url('../images/core/banner-respite.jpg') no-repeat 0 0; }
body#services5-page #banner { background: url('../images/core/banner-mum1.jpg') no-repeat 0 0; }
body#services6-page #banner { background: url('../images/core/banner-social-support.jpg') no-repeat 0 0; }

body#home-page #banner .image-cycle { position: absolute; z-index: 10; right: 0; top: -105px; width: 260px; height: 344px; float: right; text-align: right; }
.image-cycle img { display: block; text-align: right!important; float: right; clear: both; }

/*cta*/
#calls-to-action { width: 950px; height: 135px; display: inline; clear: both; float: left; padding: 0 15px; margin-bottom: 15px; }
#contact-info { float: left; width: 455px; height: 100px; display: block; padding: 20px 15px 15px 160px; background: url('../images/core/bg-contact.jpg') no-repeat 0 0; }
#contact-info .h3-style { height: 25px; margin: 0; float: left; padding-left: 20px; width: 205px; }
a#view-map { text-indent: -9999em; float: right; display: inline; width: 150px; height: 25px; background: url('../images/core/button-map.gif') no-repeat 0 0; float: right; margin:-25px 0 25px 0;}
ul#contact-details { overflow: hidden; display: block; clear: both; float: left; width: 455px; }
ul#contact-details li { display: block; float: left!important; clear: none!important; font-size: 1.2em; line-height: 16px; color: #000; margin: 0; padding-left: 25px; }
ul#contact-details li em { color: #6a7162; font-style: normal; }
a#cta-whiteoakbaby { background: url('../images/core/cta-whiteoakbaby.jpg') no-repeat 0 0; width: 305px; height: 135px; overflow: hidden; display: block; float: right; text-indent: -9999em; }
a#cta-whiteoakbaby:hover { background-position: 0 -135px!important; }
#side-contact-info { width: 305px; height: auto; background: url('../images/core/bg-side-contact.gif') no-repeat 0 0; float: right; display: inline; margin: 0 -15px 15px 25px; }
#side-contact-info h2 { padding: 21px 0 10px 20px; margin: 0; }
#side-contact-info p { padding: 0 35px; margin: 0 0 5px 0; line-height: 17px; color: #000; }
#side-contact-info em { color: #6a7162; font-style: normal; }
#side-contact-info a#cta-whiteoakbaby { clear: both; margin-top: 20px; }

/*=============================================================
	Main body - left + right
=============================================================*/

#main-contents { width: 950px; height: auto; display: block; margin: 0 auto; clear: both; }
.text { padding: 0 20px 20px 20px; display: block; }
ul.gallery { width: 910px; height: auto; display: block; margin: 0 0 20px 0; clear: both; float: left; }
ul.gallery li { width: 100px; height: 180px; border: 1px solid #d8ecb9; display: inline; float: left; margin-right: 11px; }
ul.gallery li img { width: 100px; height: 150px; clear: both; display: block; line-height: 0; margin: 0; overflow: hidden; }
ul.gallery li h3 { margin: 0; height: 27px; padding-top: 3px; text-align: center; background-color: #edf5e1; font-size: 1.4em; display: block; }

/*=============================================================
	Footer
=============================================================*/

#footer { width: 980px; height: 90px; background: url('../images/core/bg-footer.gif') no-repeat 50% 0; margin: 0 auto; padding-top: 40px; clear: both; }
#footer b { color: #000; }
#footer ul { font-family: "Arial", Helvetica, sans-serif!important; font-size:1.1em; line-height: 18px; color: #72a26d; }
#footer li { display: inline; float: left; }
#footer li#crumbs { width: 550px; margin-left: 0; position: relative; padding-left: 100px; }
#footer li#crumbs img { float: left; position: absolute; left: 15px; top: -67px; }
* htm\l #footer li#crumbs { padding-left: 120px; width: 490px; }
a#emailus { background: url('../images/core/footer-email.gif') no-repeat 0 0; width: 100px; height: 18px; text-indent: -9999em; display: block; clear: both; line-height: 0; float: left; margin: 0; }
a#bookmark { background: url('../images/core/footer-bookmark.gif') no-repeat 0 0;width: 100px; height: 18px; text-indent: -9999em; display: block; clear: both; float: left; margin: 0; line-height: 0; }
#footer a { color: #72a26d; text-decoration: none;}
#footer a:hover { color: #72a26d; text-decoration: underline;}


/*=======================================================
 End of CSS Document for 
=======================================================*/