/* ----------------- COLOURS  ----------------- *
Dark Green : #006633
Mid Green : #3EA639
Very Light Green: #B2DDA4
Mustard : #977F09
Magenta: #96004B
*/

body { background-color: #006633; margin: 15px 10px 10px 10px; background: url(../images/page_background.gif) top left; }
#frame { width: 760px; margin-left: auto; margin-right:auto;  }

/* ----------------- MISC STYLES ----------------- */
.clear { clear: both; }

hr { border:0; border-top: 1px solid #B2DDA4; height: 1px; }

/* ----------------- DEFAULT FONT STYLES ----------------- */
body, td, div, h4, p, li, input, textarea { font-family: Arial, Helvetica, sans-serif; }

h4 {  font-size: 80%; line-height: 1.3em; margin: .5em 0 .8em 0; color: #006633; font-weight:bold; }
p {  font-size: 80%; line-height: 1.3em; margin: .5em 0 .8em 0; color: #006633; }
li {  font-size: 80%; line-height: 1.3em; margin: .5em 0 1em 0; color: #006633; }
em { color: #3EA639; }
a:link, a:visited { color: #3EA639; }
a:active, a:hover { color: #96004B; }
a { outline: none; }


/* ----------------- HEADER ----------------- */
#header { width: 760px; height: 148px; margin-bottom: 5px; background: url(../images/header_grass.gif) top left no-repeat; }
#header h1 { display: none; visibility: hidden; }
#header h2 { display: none; visibility: hidden; }
#logo { width: 70px; height: 100px; float: right; margin: 18px 31px 2px 0; display:inline; }

/* navigation */
#navigation { width: 740px; height: 28px; margin-left: 10px;}
#navigation div { height: 28px; float: left; background-position: top left; background-repeat: no-repeat;  }
#navigation a { height: 28px; display: block; outline: none; } 
#navigation a:hover { background-position: bottom left; background-repeat: no-repeat; }
#navigation span { display: none; visibility: hidden; }
#navigation .selected { background-position: bottom left; }

/* navigation buttons */
#navigation .home, #navigation .home a:hover { width: 53px; background-image: url(../images/nav_home.gif); }
#navigation .aboutus, #navigation .aboutus a:hover { width: 72px; background-image: url(../images/nav_aboutus.gif); }
#navigation .services, #navigation .services a:hover { width: 69px; background-image: url(../images/nav_services.gif); }
#navigation .faq, #navigation .faq a:hover { width: 42px; background-image: url(../images/nav_faq.gif); }
#navigation .lawncare, #navigation .lawncare a:hover { width: 81px; background-image: url(../images/nav_lawncare.gif); }
#navigation .accolades, #navigation .accolades a:hover { width: 79px; background-image: url(../images/nav_accolades.gif); }
#navigation .freeestimate, #navigation .freeestimate a:hover { width: 101px; background-image: url(../images/nav_freeestimate.gif); }
#navigation .franchising, #navigation .franchising a:hover { width: 88px; background-image: url(../images/nav_franchising.gif); }
#navigation .contact, #navigation .contact a:hover { width: 65px; background-image: url(../images/nav_contact.gif); }

/* ----------------- BODY ----------------- */
#body { width: 760px; background: url(../images/background.gif) top left repeat-y; }
#side-column { width: 205px; float: left; }
#main-column { width: 515px; float: left; padding: 0 20px 20px 20px; background-color:#fff; }
#main-column-curve { width: 555px; height:30px; float: right;  background: url(../images/bottom_corner.gif) bottom left no-repeat; }

/* side */
#side-title { width: 205px; height: 45px; }
.didyouknow { background: url(../images/side_title_didyouknow.gif) top left no-repeat; }
.inthissection { background: url(../images/side_title_inthissection.gif) top left no-repeat; }
#side-title h3 { display: none; visibility: hidden; }
#side-body, #side-body-menu { width: 180px; margin: 0 5px 0 0; padding: 8px 10px 5px 10px; background-color:#3EA639;  }
#side-body p, #side-body-menu p { font-size: 75%; color: #fff; }
#side-body h4, #side-body-menu h4 { font-size: 75%; color: #fff; margin: 0 0 .2em 0; }
#side-body ul, #side-body-menu ul { margin: 0; padding: 0 0 0 0; }
#side-body li, #side-body-menu li { list-style: none; font-size: 75%; color: #B2DDA4; margin: 0 0 .2em 0; }
#side-body li.bulleted, #side-body-menu li.bulleted { margin-left: 15px;list-style: disc; }
#side-body a:link, #side-body a:visited, #side-body-menu a:link, #side-body-menu a:visited  { color: #fff; text-decoration: none; }
#side-body a:active, #side-body a:hover, #side-body-menu a:active, #side-body-menu a:hover { color: #006633; text-decoration: none; }
#side-body li.bulleted a:link, #side-body li.bulleted a:visited, #side-body-menu li.bulleted a:link, #side-body-menu li.bulleted a:visited { color: #B2DDA4; text-decoration: none; }
#side-body li.bulleted a:active, #side-body li.bulleted a:hover, #side-body-menu li.bulleted a:active, #side-body-menu li.bulleted a:hover { color: #006633; text-decoration: none; }
#side-footer { margin: 0 5px 5px 0; height: 30px; width: 200px; background: url("../images/side_bottom_corner.gif") bottom left no-repeat; }

/* call now */
#side-callnow { width: 205px; height: 125px; margin-bottom: 5px; background: url("../images/side_callnow.gif") top left no-repeat; }
#side-callnow p { display: none; visibility: hidden; }

/* download franchise */
#side-downloadfranchise { width: 205px; height: 80px; margin-bottom: 5px; background: url("../images/side_download_franchiseinfo.gif") top left no-repeat; }
#side-downloadfranchise p { display: none; visibility: hidden; }
#side-downloadfranchise a { width: 205px; height: 80px; display: block; }

/* download pre-franchise form */
#side-downloadpreappform { width: 205px; height: 80px; margin-bottom: 5px; background: url("../images/side_download_preappform.gif") top left no-repeat; }
#side-downloadpreappform p { display: none; visibility: hidden; }
#side-downloadpreappform a { width: 205px; height: 80px; display: block; }

/* fill out preliminary application */
#side-filloutpreliminaryform { width: 205px; height: 80px; margin-bottom: 5px; background: url("../images/side_fill_out_preliminary_application_form.gif") top left no-repeat; }
#side-filloutpreliminaryform p { display: none; visibility: hidden; }
#side-filloutpreliminaryform a { width: 205px; height: 80px; display: block; }

/* home */
#side-fromonly { width: 205px; height: 185px; background: url("../images/side_fromonly.gif") top left no-repeat ; }
#side-fromonly p { display: none; visibility: hidden; }
#side-offer { width: 205px; height: 155px; margin-bottom: 5px; background: url("../images/side_offer.gif") top left no-repeat; }
#side-offer p { display: none; visibility: hidden; }
#side-offer a { height: 155px; display: block; }

#side-find-specialist { width: 205px; height: 55px; background: url(../images/side_find_specialist.gif) top left no-repeat; }
#side-find-specialist p { display: none; visibility: hidden; }
#quick-search-form { padding: 1px 17px 10px 28px; width: 160px; background: url(../images/side_find_specialist_bottom.gif) bottom left no-repeat; margin-bottom: 5px; }
#quick-search-form p { color: #fff; margin: 0.4em 0; font-size: 74%; }

#recommend-a-friend { width: 205px; height: 115px; background: url(../images/side_recommend_a_friend.gif) top left no-repeat; }
#recommend-a-friend p { display: none; visibility: hidden; }

/* page titles */
#page-title { width: 445px; height: 22px; float: left; margin: 14px 0 9px 0; background-repeat:no-repeat; background-position: top left; }
#page-title h3 { display: none; visibility: hidden; }
.home { background-image: url("../images/title_home.gif"); }
.aboutus { background-image: url("../images/title_aboutus.gif"); }
.services { background-image: url("../images/title_services.gif"); }
.services-servicespring { background-image: url("../images/title_services_spring.gif"); }
.services-serviceearlysummer { background-image: url("../images/title_services_earlysummer.gif"); }
.services-servicemidsummer { background-image: url("../images/title_services_midsummer.gif"); }
.services-servicelatesummer { background-image: url("../images/title_services_latesummer.gif"); }
.services-serviceautumnwinter { background-image: url("../images/title_services_autumnwinter.gif"); }
.services-servicescarification { background-image: url("../images/title_services_scarification.gif"); }
.services-servicehollowtineaeration { background-image: url("../images/title_services_hollowtineaeration.gif"); }
.faq { background-image: url("../images/title_faq.gif"); }
.lawncare-mowing { background-image: url("../images/title_lawncare_mowing.gif"); }
.lawncare-moss { background-image: url("../images/title_lawncare_moss.gif"); }
.lawncare-thatch { background-image: url("../images/title_lawncare_thatch.gif"); }
.lawncare-hollowtineaeration { background-image:  url("../images/title_lawncare_hollowtineaeration.gif"); }
.lawncare-scarification { background-image: url("../images/title_lawncare_scarification.gif"); }
.lawncare-weeds { background-image: url("../images/title_lawncare_weeds.gif"); }
.lawncare-toadstools { background-image: url("../images/title_lawncare_toadstools.gif"); }
.lawncare-fairyrings { background-image: url("../images/title_lawncare_fairyrings.gif"); }
.lawncare-drypatch { background-image: url("../images/title_lawncare_drypatch.gif"); }
.lawncare-diseases { background-image: url("../images/title_lawncare_diseases.gif"); }
.lawncare-lichenslimemould { background-image: url("../images/title_lawncare_lichenslimemould.gif"); }
.lawncare-castingworms { background-image: url("../images/title_lawncare_castingworms.gif"); }
.lawncare-chaferleather { background-image: url("../images/title_lawncare_chaferleather.gif"); }
.lawncare-molesbadgers { background-image: url("../images/title_lawncare_molesbadgers.gif"); }
.accolades { background-image: url("../images/title_accolades.gif"); }
.freeestimate { background-image: url("../images/title_freeestimate.gif"); }
.franchising { background-image: url("../images/title_franchising.gif"); }
.franchising-franchisehome { background-image: url("../images/title_franchising_franchisehome.gif"); }
.franchising-ourfranchisepackage { background-image: url("../images/title_franchising_ourfranchisepackage.gif"); }
.franchising-trainingandsupport { background-image: url("../images/title_franchising_trainingandsupport.gif"); }
.franchising-finances { background-image: url("../images/title_franchising_finances.gif"); }
.franchising-nextsteps { background-image: url("../images/title_franchising_nextsteps.gif"); }
.contact { background-image: url("../images/title_contact.gif"); }
.contact { background-image: url("../images/title_contact.gif"); }
.unsubscribe { background-image: url("../images/title_unsubscribe.gif"); }

/* page titles */
#page-subtitle { width: 445px; height: 19px; margin: 10px 0 0 0; background-repeat:no-repeat; background-position: top left; }
#page-subtitle h4 { display: none; visibility: hidden; }
.subservices { background-image: url("../images/subtitle_services.gif"); }

/* franchise show promotion on homepage */
#franchise-show { margin-top: 20px; border: 1px solid #006633; width: 513px; }
#franchise-show-image { float: left; width: 125px; }
#franchise-show-text { float: left; width: 378px; padding: 5px; text-align: center; font-size: 96%; }

/* side franchise promotion */
#side-franchiseshow { width: 205px; height: 90px; margin-bottom: 5px; }

/* page anchor */
#page-anchor { width: 70px; height: 20px; float:left; margin: 14px 0 11px 0 }
#page-anchor span { display: none; visibility: hidden; }
.supatip { background: url("../images/supatip_anchor.gif") top right no-repeat; }
#page-anchor a { height: 20px; display: block; }

/* supatip box */
.supatip-box-title { width: 465px; height: 26px; float:left; background:url("../images/supatip_title.gif") top left no-repeat #977F09; }
.supatip-box-title h4 { display: none; visibility: hidden; }
.supatip-box-top { width: 50px; height: 26px; float:left; background:url("../images/supatip_go_top.gif") top right no-repeat #977F09;}
.supatip-box-top a { height: 26px; display: block; }
.supatip-box-top span { display: none; visibility: hidden; }
.supatip-box-body { margin: 0; padding: 5px 15px 5px 15px; background: url("../images/supatip_bottom_corner.gif") bottom left no-repeat #977F09; }
.supatip-box-body p { color:#ffffff; margin-top:0; }


#contact-left { width: 250px; float:left; margin-right: 15px; }
#contact-right { width: 250px; float:left; }

/* your Supagrass box */
.yoursupagrass-box-title { width: 250px; height: 26px; float:left; background:url("../images/yoursupagrass_title.gif") top left no-repeat #B2DDA4; }
.yoursupagrass-box-title h4 { display: none; visibility: hidden; }
.yoursupagrass-box-body { margin: 0; padding: 5px 10px 5px 10px; background: url("../images/yoursupagrass_bottom_corner.gif") bottom left no-repeat #B2DDA4; }
.yoursupagrass-box-body p { margin-top:0; }

/* thank you box */
.thankyou-box-title { width: 515px; height: 26px; float:left; background:url("../images/thankyou_title.gif") top left no-repeat #B2DDA4; }
.thankyou-box-title h4 { display: none; visibility: hidden; }
.thankyou-box-body { margin: 0; padding: 5px 10px 5px 10px; background: url("../images/yoursupagrass_bottom_corner.gif") bottom left no-repeat #B2DDA4; }
.thankyou-box-body p { margin-top:0; }


/* ----------------- FORMS ----------------- */
form { display: inline; }
label { font-size: 75%; color: #006633; display:block; }
.form-table { border: 1px solid #B2DDA4; background-color:#F0F8ED; }
.form-table td { padding: 4px; vertical-align:top; }
.form-table td.right { text-align: right; }
.form-table th { font-size: 80%; color: #006633; padding: 4px; vertical-align:top; font-weight: bold; text-align: center; background-color: #B2DDA4; }
.input-text { font-size: 75%; color: #006633; width: 95%; border: 1px solid #B2DDA4; padding:2px; }
.input-text-nowidth { font-size: 75%; color: #006633; border: 1px solid #B2DDA4; padding:2px; }
.input-select { font-size: 75%; color: #006633; border: 1px solid #B2DDA4; padding:2px; }
.input-button { font-size: 75%; color: #006633; border: 1px solid #B2DDA4; padding:2px;  background-color:#fff; }
.submit-box { padding: 4px; border: 1px solid #B2DDA4; background-color:#F0F8ED; margin-top:10px; text-align: center; }
.error { color: #c00; }

/* ----------------- FOOTER ----------------- */
#footer { width: 555px; float: right; }
#footer p { font-size: 70%; margin: .5em 0 .8em 0; text-align: center; color: #fff; }




