/* ----------------- COLOURS  ----------------- *
Dark Blue : #214A82
Mid Blue : #5EA2D4
Light Blue : #89BBDF
Very Light Blue: #E7F1F9
*/

body { background-color: #214A82; margin: 0 10px 0 10px; }
#frame { width: 760px; margin-left: auto; margin-right: auto; background-color: #E7F1F9; }

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

/* ----------------- DEFAULT FONT STYLES ----------------- */
body, td, div, h4, p, li, input, textarea { font-family: "Times New Roman", Times, serif; }

h3 { font-size: 120%; color: #214A82; font-weight: normal; margin: 0.5em 0; }
h4 {  font-size: 80%; line-height: 1.3em; margin: .5em 0 .8em 0; color: #214A82; font-weight:bold; }
p {  font-size: 90%; line-height: 1.3em; margin: .5em 0 .8em 0; color: #214A82; }
li {  font-size: 80%; line-height: 1.3em; margin: .5em 0 1em 0; color: #214A82; }
em { color: #f00; }
a:link, a:visited { color: #214A82; text-decoration: underline; }
a:active, a:hover { color: #4C7CBE; text-decoration: underline; }

/* ----------------- HEADER ----------------- */
#header { width: 760px; height: 118px; background-color:#FFF; }
#logo-sineway { width:211px; float:left; margin: 15px 0 15px 55px; display:inline; }
#logo-corgi { width: 39px; float:right; margin: 15px 55px 15px 0; display:inline; }

/* navigation-column */
#side-column { float: left; width: 190px; margin: 0 0 0 15px; padding: 10px 0 0 0; display: inline; }

/* navigation */
#navigation { width: 730px; height: 25px; padding: 15px 15px 0 15px; background: url(../images/navigation_background.gif) bottom left repeat-x #E7F1F9; }
#navigation div { height: 25px; float: left; background-position: top left; background-repeat: no-repeat;  }
#navigation a { height: 25px; 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: 72px; background-image: url(../images/nav_home.gif); }
#navigation .services, #navigation .services a:hover { width: 92px; background-image: url(../images/nav_services.gif); }
#navigation .gasServicing, #navigation .gasServicing a:hover { width: 124px; background-image: url(../images/nav_gas_servicing.gif); }
#navigation .portfolio, #navigation .portfolio a:hover { width: 102px; background-image: url(../images/nav_portfolio.gif); }
#navigation .testimonials, #navigation .testimonials a:hover { width: 124px; background-image: url(../images/nav_testimonials.gif); }
#navigation .contact, #navigation .contact a:hover { width: 93px; background-image: url(../images/nav_contact.gif); }
#navigation .links, #navigation .links a:hover { width: 83px; background-image: url(../images/nav_links.gif); }

/* ----------------- BODY ----------------- */
#main-column { float: left; width: 685px; padding: 0 30px 0 30px; }
#main-column-sub { float: left; width: 520px; padding: 0 10px 0 10px; }

#body { width: 760px; background: url(../images/content_background.gif) top left repeat-y; }
#body-sub { width: 760px; background: url(../images/content_background_sub.gif) top left repeat-y; }

/* homepage */
#home-bullets { float: left; width: 240px; margin: 20px 0 20px 15px; }
#home-van { float: left; text-align: right; width: 430px; padding-top: 20px; }

/* page titles */
#page-title { width: 730px; height: 40px; margin: 0 15px 0 15px; background: url(../images/title_background.gif) top left no-repeat; }
#page-title-sub { width: 730px; height: 40px; margin: 0 15px 0 15px; background: url(../images/title_background_sub.gif) top left no-repeat; }

#page-title-h1 { height: 40px; float: left; background-repeat:no-repeat; background-position: top left; }
#page-title-h2 { height: 40px; float: left; background-repeat:no-repeat; background-position: top left; }
#page-title-h1 h1, #page-title-h2 h2 { display: none; visibility: hidden; }

.h1-home { width: 157px; background-image: url("../images/title_h1_home.gif"); }
.h1-services { width: 173px; background-image: url("../images/title_h1_services.gif"); }
.h2-plumbingandheating { width: 257px; background-image: url("../images/title_h2_plumbingandheating.gif"); }
.h1-gasServicing { width: 201px; background-image: url("../images/title_h1_gasServicing.gif"); }
.h2-gasservicing { width: 198px; background-image: url("../images/title_h2_gasservicing.gif"); }
.h2-powerflushing { width: 227px; background-image: url("../images/title_h2_powerflushing.gif"); }
.h2-bathroominstallation { width: 307px; background-image: url("../images/title_h2_bathroominstallation.gif"); }
.h2-kitcheninstallation { width: 281px; background-image: url("../images/title_h2_kitcheninstallation.gif"); }
.h2-watersofteners { width: 236px; background-image: url("../images/title_h2_watersofteners.gif"); }

.h1-portfolio { width: 188px; background-image: url("../images/title_h1_portfolio.gif"); }
.h2-bathroom { width: 171px; background-image: url("../images/title_h2_bathrooms.gif"); }
.h2-showerroom { width: 206px; background-image: url("../images/title_h2_showerrooms.gif"); }
.h2-wetroom { width: 166px; background-image: url("../images/title_h2_wetrooms.gif"); }
.h2-kitchen { width: 150px; background-image: url("../images/title_h2_kitchens.gif"); }

.h1-testimonials { width: 235px; background-image: url("../images/title_h1_testimonials.gif"); }
.h1-contact { width: 175px; background-image: url("../images/title_h1_contact.gif"); }
.h1-links { width: 150px; background-image: url("../images/title_h1_links.gif"); }

/* pagination */
#pagination { width: 510px; height: 23px; margin: 15px auto 15px auto; }
#pagination div { height: 23px; float: left; background-position: top left; background-repeat: no-repeat;  }
#pagination a { height: 23px; outline: none; display: block; } 
#pagination a:hover { background-position: bottom left; background-repeat: no-repeat; }
#pagination span { display: none; visibility: hidden; }
#pagination .selected { background-position: bottom left; }

#pagination .first, #pagination .first a:hover { width: 62px; background-image: url(../images/pagination_first.gif); }
#pagination .prev, #pagination .prev a:hover { width: 58px; background-image: url(../images/pagination_prev.gif); }
#pagination .page-numbers { width: 274px; height: 20px; text-align: center; font: 76% Arial, Helvetica, sans-serif; color: #fff; font-weight: bold; 
background: url(../images/pagination_background.gif) bottom left repeat-x; padding-top: 3px; }
#pagination .page-numbers a { font-weight: normal; color: #fff; text-decoration: none; display: inline; }
#pagination .page-numbers a:hover { text-decoration: underline; }
#pagination .next, #pagination .next a:hover { width: 56px; background-image: url(../images/pagination_next.gif); }
#pagination .last, #pagination .last a:hover { width: 60px; background-image: url(../images/pagination_last.gif); }

/* gallery */
#gallery { width: 496px; margin: 10px auto 0 auto; }
#gallery img { border: 1px solid #214A82; float: left; margin: 0 20px 20px 0; }
.hidden { display: none; visibility: hidden; }

/* ----------------- FOOTER ----------------- */
#footer { width: 760px; padding: 35px 0 0 0; background: url(../images/footer_background.gif) top left no-repeat; background-color: #214A82; }
#footer-sub { width: 760px; padding: 35px 0 0 0; background: url(../images/footer_background_sub.gif) top left no-repeat; background-color: #214A82; }
#footer p, #footer-sub p { font-size: 80%; margin: .5em 0 .8em 0; text-align: center; color: #89BBDF; }