/* Theme Name: ASAP Sitters Theme Theme URI: http://asapsitters.com Description: ASAP Sitters Theme is designed as a custom WordPress theme for asapsitters.com Version: 1.0 Author: Erik Yowell Author URI: http://shortfusemedia.com Copyright © 2008 Erik Yowell This theme was designed and coded by Erik Yowell http://shortfusemedia.com */ /* RESET */ html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; } body { line-height: 1; } ol, ul { list-style: none; } blockquote, q { quotes: none; } /* remember to define focus styles! */ :focus { outline: 0; } /* remember to highlight inserts somehow! */ ins { text-decoration: none; } del { text-decoration: line-through; } /* tables still need 'cellspacing="0"' in the markup */ table { border-collapse: collapse; border-spacing: 0; } img.aligncenter { text-align: center} /* IE PNG FIX */ * html span#charachter_a, * html span#charachter_b, * html #masthead.home div h2, #masthead.home div h3, * html #masthead div.hr, * html #content div.hr { behavior: url("/lib/iepngfix.htc") } /* HEADER AND BODY STYLING */ body {margin:0 auto; padding:0; font: 14px Tahoma, Arial, Helvetica, sans-serif; color: #cc6699; background: #fef6f9 url(/images/page_bg.gif) repeat-y top center;} body > div.container { height: 100%; padding-bototm: 15px; } a, a:visited, a:focus {color: #df9534;} #header {width: 100%; background: #f264c4;} #header > div.container {position: relative; margin: 0 auto; width: 100%; min-width:960px; height: 94px; background: url(/images/asap_header.png) no-repeat top center; overflow: hidden} #header h1 {margin: 0 auto; width: 960px; position: relative;} #header h1 a {display: block; height: 35px; width: 315px; position: absolute; top: 10px; left: 65px; text-indent: -999px; } #header #navigation {width: 960px; margin: 0 auto; position: relative;} #header #navigation .primary { position: absolute; top: 65px; left: 20px; } #header #navigation .primary ul { display: inline; } #header #navigation .primary ul li { display:inline; float: left; } #header #navigation .primary .page_item a { display: block; text-decoration: none; background-repeat: no-repeat; background-position: 0px -40px; height: 25px; background-color: transparent; } #header #navigation .primary .page_item a span { visibility:hidden; width: 194px; } #header #navigation .primary .page_item { height: 25px; background: url(/images/nav_divider.png) no-repeat top right; padding-right: 10px; } #header #navigation .primary li.testimonials { background-image: none; } #header #navigation .primary .page_item a:hover { background-position: 0px 0px !important; } #header #navigation .secondary { position: absolute; right: 25px; top: 5px; } #header #navigation .secondary ul { } #header #navigation .secondary ul li { display: inline; } #header #navigation .secondary ul li.client-application { border-right: 2px solid #9b2c74; } #header #navigation .secondary ul li a {font-weight: bold; color: #ffffff; text-decoration: none; margin: 0 5px;} #header #navigation .secondary ul li a:hover {color: #df9534;} #header #navigation li.about-us a { width: 139px; background-image: url(/images/nav_who_we_are.png); } #header #navigation li.how-asap-works a { width: 194px; background-image: url(/images/nav_how_asap_works.png); } #header #navigation li.service-fees a { width: 125px; background-image: url(/images/nav_service_fees.png); } #header #navigation li.sitter-gallery a { width: 135px; background: url(/images/nav_sitter_gallery.png); } #header #navigation li.testimonials a { width: 121px; background-image: url(/images/nav_testimonials.png);} #header #navigation li.resources a { width: 105px; background-image: url(/images/nav_resources.png);} /* IE Fix */ * html #header #navigation li {padding-left: 5px;} * html #header #navigation li.about-us a { background-image: url(/images/nav_who_we_are.gif); } * html #header #navigation li.how-asap-works a { background-image: url(/images/nav_how_asap_works.gif); } * html #header #navigation li.sitter-gallery a { background-image: url(/images/nav_sitter_gallery.gif); } * html #header #navigation li.service-fees a { background-image: url(/images/nav_service_fees.gif); } * html #header #navigation li.testimonials a { background-image: url(/images/nav_testimonials.gif); } * html #header #navigation li.resources a { background-image: url(/images/nav_resources.gif); } /* MASTHEAD STYLING */ #masthead {position: relative; background: url(/images/masthead_bg.jpg) repeat top left;padding-top: 30px;} #masthead.home { height:350px; } * html #masthead div.hr {height: 9px !important;} #masthead div.hr { position: absolute; left: 0; top: 0; display: block; height: 12px !important; width:100%; background: url(/images/masthead_divider.png) repeat-x !important;} #masthead div.hr hr {display: none;} #masthead.home div.container { position: relative; margin: 0 auto; width: 890px; height: 320px; background: transparent url(/images/masthead_interior.gif) no-repeat top center;} #masthead.home div h2 { width: 680px; height: 55px; background: url(/images/h_babysitter_referral_svc.png) no-repeat; position: absolute; left: 20px; top: 20px;} #masthead.home div h3 { width: 680px; height: 65px; background: url(/images/h_babysitter_high_standards.png) no-repeat; position: absolute; left: 30px; top: 70px;} #masthead.home div h2 span { width: 100%; height: 50px; background-image: none; left: 0; top: 0; visibility: hidden; } #masthead.home div h3 span { width: 100%; height: 50px; background-image: none; left: 0; top: 50px; visibility: hidden; } #masthead.home div div.interior { top: 155px; left: 90px; display: block; position: absolute; width: 610px; height: 134px; background: transparent url(/images/masthead_content.gif);} #masthead.home div div.interior p {text-align: justify; padding: 10px;} #masthead.home div span#charachter_a {display: block; width: 235px; height: 295px; position: absolute; left:auto; right: -40px !important; top: 5px !important; background: transparent url(/images/char_home_a.png) no-repeat top left;} #masthead.home div span#charachter_b {display: block; width: 137px; height: 134px; position: absolute; right:auto; left: -50px !important; bottom: 5px !important; background: transparent url(/images/char_home_b.png) no-repeat top left;} #masthead.interior { height: 115px; } #masthead.interior div.container { position: relative; margin: 0 auto; width: 892px; height: 93px; background: transparent url(/images/masthead_interior_b.gif) no-repeat top center;} #masthead.interior div span#charachter_a {display: block; width: 235px; height: 295px; position: absolute; left:auto; right: -80px !important; top: -25px !important; background: transparent url(/images/char_5_a.png) no-repeat top left;} .who-we-are #charachter_a {background-image: url(/images/char_5_a.png) !important; } .how-asap-works #charachter_a {background-image: url(/images/char_1_a.png) !important; } .service-fees #charachter_a {background-image: url(/images/char_2_a.png) !important; } .sitter-gallery #charachter_a {background-image: url(/images/char_4_a.png) !important; } .resources #charachter_a {background-image: url(/images/char_3_a.png) !important; } /* PAGE STYLING */ #content div.hr { display: block; height: 5px; width:100%; background: url(/images/page_divider.png) repeat-x;} #content div.hr hr {display: none;} #page {position: relative; margin: 0 auto; width: 940px; } #page.home .container {padding-left: 30px; padding-top: 30px; margin-right: 320px;} #page.interior .container {padding-left:30px; margin-right: 320px; padding-bottom: 15px;} #page #sidebar {width: 285px; position: absolute; right: 20px; top: 30px; background: url(/images/sidebar_bg.png) no-repeat bottom right; font-size: 13px;} #page.interior #sidebar {top: 0px; border-bottom: 15px solid #fff;} #page #sidebar p {margin: 10px 25px;} #page.interior #sidebar p { text-align: justify; } #page.interior #sidebar blockquote {color: #996699; font-size: 12px; font-style:italic; margin-left: 25px; background: url(/images/blockquote_bg.gif) no-repeat top left;} #page.interior #sidebar blockquote p {margin: 10px 25px;} #page.interior #sidebar blockquote p.signature {text-align: right;} #page.interior div.container ul {margin-bottom: 10px; list-style: disc;} #page.interior div.container ul li {margin-left: 35px; margin-bottom: 5px; } .FB_ElementReady { padding-left: 20px; } #page.home #sidebar .contentbox { border-bottom:10px solid white; } #page.home #sidebar h2.toregister { background: url(/images/s_to_register.png) no-repeat top right; display: block; height: 77px; width: 285px;} #page.interior #sidebar h2 { background: url(/images/sidebar_bg_top.png) no-repeat top right; height: 10px; } #page.interior #sidebar ol {margin-left: 45px; list-style-type: decimal; margin-bottom: 10px;} #page.interior #sidebar ol li {margin-bottom: 5px;} #page #sidebar h2 span {visibility: hidden;} #page.home #sidebar a.contact {padding: 5px 0px 10px 40px; display: block; margin: 0 auto; font-size: 16px; } #page.home h4 {display: block; width: 576px; height: 34px; background: url(/images/h_why_choose.png) no-repeat top left; } #page.home h4 span {visibility: hidden;} #page .container p { margin: 15px 0; text-align: justify; padding: 0 10px; } /* PAGE HEADERS */ #content #masthead.interior .container h2 { position: absolute; display: block; left: 20px; top: 13px; height: 60px; background-position: top left; background-repeat: no-repeat} #content #masthead.interior .container h2 span { visibility: hidden; } #content.who-we-are #masthead .container h2 { background-image: url(/images/h_who_we_are.png); width: 480px; } #content.how-asap-works #masthead .container h2 { background-image: url(/images/h_how_asap_works.png); width: 620px; } #content.service-fees #masthead .container h2 { background-image: url(/images/h_service_fees.png); width: 300px; } #content.sitter-gallery #masthead .container h2 { background-image: url(/images/h_sitter_gallery.png); width: 430px; } #content.resources #masthead .container h2 { background-image: url(/images/h_resources.png); width: 260px; } #content.testimonials #masthead .container h2 { background-image: url(/images/h_testimonials.png); width: 300px; } #content.terms-and-conditions #masthead .container h2 { background-image: url(/images/h_terms_conditions.png); width: 500px; } #content.client-application #masthead .container h2 { background-image: url(/images/h_client_application.png); width: 420px; } #content.sitter-application #masthead .container h2 { background-image: url(/images/h_sitter_application.png); width: 420px; } #content.client-application #sidebar, #content.sitter-application #sidebar {display: none;} #content.client-application #page .container, #content.client-application #footer, #content.sitter-application #page .container, #content.sitter-application #footer, #content.sitter-gallery #page .container, #content.sitter-gallery #footer {margin-right: 0;} #content.sitter-gallery #page .container .sitter { clear: both;} #content.sitter-gallery .image { padding: 0 5px; width: 160px; display: inline-block; display: -moz-inline-block; float: left; } #content.sitter-gallery .description { padding: 10px; display: inline-block; display: -moz-inline-block; text-align: justify; vertical-align: top; font-size: 12px; width: 440px; float: left;} #content.sitter-gallery .detail { padding: 10px; vertical-align: top; display: inline-block; display: -moz-inline-block; float: left; font-size: 12px; width:220px; } #content.sitter-gallery img { border: 1px solid #C6669A; padding: 5px;} table.fees td, table.fees th { padding: 4px; font-size: 12px; text-align: center; vertical-align: bottom; } /* FOOTER STYLING */ #footer {margin: 0 auto; width: 940px; text-align: center; padding-top: 45px; font-size: 12px; padding-bottom: 10px} #footer ul { margin: 5px 0 0; display: inline-block; display: -moz-inline-block;} #footer ul li {display: inline; border-right: 1px solid #cc6699; padding-left: 4px; padding-right: 5px; margin-bottom: 5px;} #footer ul li:last-child {border: none;} #footer p {padding-top: 5px;} .interior #footer { margin-right: 320px; width: auto; } #footer a {color: #cc6699; text-decoration: none; background: none !important;} #footer a:hover {color: #df9534; text-decoration: underline;} .BBBLogo { position: relative; right: 55px; } .SSLLogo { position: absolute; padding-left: 120px; padding-top: 2px; }