﻿
/*
main body style and background divs
*/

* {
margin:0; padding:0;
}

body {
background: #c4c4c4 url(../images/bg-body-tile-y.gif) top center repeat-y;
margin:0px;
font-family: Verdana,Helvetica,Arial,sans-serif;
font-size:11px;
color:#cfcfcf;
}
div#body {
background: url(../images/bg-body-tile-x.gif) top center repeat-x;
line-height:1.4em;
text-align:justify;
}


/*
global styles etc
*/


a:link 		{color:#b90000; text-decoration:none;}
a:visited {color:#b90000; text-decoration:none;}
a:hover		{color:#ffffff; text-decoration:none;}

.inside a:link 		{color:#b90000; text-decoration:none;}
.inside a:visited {color:#b90000; text-decoration:none;}
.inside a:hover		{color:#ffffff; text-decoration:none; background:#b90000;}

a:hover.nobg		{background:none;}

h1 {font-size: 1.8em; font-weight: normal; padding:0px; margin: 20px 0 15px 0;}
h2 {font-size: 1.6em; font-weight: normal; padding:0px; margin: 20px 0 15px 0;}
h3 {font-size: 1.2em; font-weight: normal; padding:0px; margin: 20px 0 15px 0;}

img {border:0px;}
address {font-style: normal;}
acronym {border:none;}

.left {float:left;}
.right {float:right;}
.clearer {clear: both;height: 0px;overflow: hidden;line-height: 0px;font-size: 0px;}
.clear {clear: both;}
.clear-r {clear:right;}
.clear-l {clear:left;}
.margin-r {margin-right:10px;}
.aleft {text-align: left;}
.aright {text-align: right;}

.pad-left {padding-left: 25px;}

.color {color:#b90000;}
.big   {font-size:1.4em;}
b.big  {font-weight:normal;}

.inside {padding:10px;}

ul {list-style-image: url(../images/li.png);}

p {padding-bottom:10px;}

.details {display: none;}

.photo {
padding: 4px;
border: 1px solid #bfc6ca;
background: #dedede;
}

/*
table styles
*/

th {
border: 1px solid #cecece;
padding: 2px;
margin-top: 8px;
font-size: 1.1em;
}
td {
border: 1px solid #cecece;
padding: 2px;
}
td.left-td {
width: 30%;
}
td.no-bord {
border: none;
height: 10px;
}
#thelaw th {
width: 260px;
text-align: right;
}
#thelaw td {
width: 40px;
}
#thelaw table.clear {
margin-top: 15px;
}
#thelaw table.clear th {
width: 578px;
}

/*
page backgrounds and structure
*/


div#page-wrap {
margin:auto;
}
div.content-wrap {
width:974px;
margin:auto;
position:relative;
}

div#bg-page-top {
background: url(../images/bg-page-top.png) top center no-repeat;
overflow:hidden;
}
div#bg-page-tile {
background: url(../images/bg-page-tile-y.png) top center repeat-y;
}
div#bg-footer {
background: url(../images/bg-footer.png) bottom center no-repeat;
}





/*
content styles and positioning
working from top down
*/

#see-details {
display: inline-block;
height: 33px;
width: 141px;
background: url(../images/see-details.png) 0 0;
}
#see-details:hover {
background: url(../images/see-details.png) 0 33px;
}

#landlords-btn {
display: inline-block;
height: 33px;
width: 168px;
background: url(../images/landlords.png) 0 0;
}
#landlords-btn:hover {
background: url(../images/landlords.png) 0 33px;
}

#electrical-safety-guide-btn {
display: inline-block;
height: 33px;
width: 217px;
margin-left: 30px;
background: url(../images/electrical-safety-guide.png) 0 0;
}
#electrical-safety-guide-btn:hover {
background: url(../images/electrical-safety-guide.png) 0 33px;
}

#pricing-btn {
display: inline-block;
height: 33px;
width: 141px;
background: url(../images/pricing-policy.png) 0 0;
}

#pricing-btn:hover {
background: url(../images/pricing-policy.png) 0 33px;
}

#read-more {
display: inline-block;
height: 33px;
width: 141px;
background: url(../images/read-more.png) 0 0;
}

#read-more:hover {
background: url(../images/read-more.png) 0 33px;
}

/*
nav and top links
*/

a#bookmark-us {
background: url(../images/star.gif) 0 94% no-repeat;
padding-left: 20px;
margin-left: 48px;
}


ul#nav {
list-style-image:none;
list-style-type:none;
display:inline;
position:absolute;
z-index:10;
top:0;
right:0;
}
ul#nav li {
display:block;
float:left;
}

ul#nav li a#homelink {
display: block;
height: 48px;
width: 216px;
background: url(../images/nav-home.gif) 0 0;
}

ul#nav li a#homelink:hover, #home ul#nav li a#homelink {
background-position: 0 48px;
}

ul#nav li a#aboutlink {
display: block;
height: 54px;
width: 121px;
background: url(../images/nav-about-periodic-electrical-testing.gif) 0 0;
}

ul#nav li a#aboutlink:hover, #about ul#nav li a#aboutlink {
background-position: 0 54px;
}

ul#nav li a#serviceslink {
display: block;
height: 54px;
width: 138px;
background: url(../images/nav-electrical-inspection-services.gif) 0 0;
}

ul#nav li a#serviceslink:hover, #services ul#nav li a#serviceslink {
background-position: 0 54px;
}

ul#nav li a#thelawlink {
display: block;
height: 50px;
width: 252px;
background: url(../images/nav-electrical-testing-law.gif) 0 0;
}

ul#nav li a#thelawlink:hover, #thelaw ul#nav li a#thelawlink {
background-position: 0 50px;
}

div#top-links {
width:634px;
height: 96px;
}
div#top-links b,
div#top-links a {
display:block;
position:relative;
padding-top: 70px;
padding-bottom: 5px;
}
.number {
text-align: right;
}

#logo {
display: block;
float: left;
width: 313px;
height: 69px;
top: 20px;
position: relative;
}

#domain {
text-shadow: #7f7f7f 1px 1px 0px;
color: #222222;
font-size: 1.7em;
}

/*
Banner
*/

div#banner {
height:292px;
width:974px;
position: relative;
top: 4px;
z-index: 230;
}
div#banner h1 {
background: url(../images/banner-h1.gif) repeat-x;
text-shadow: #7f7f7f 1px 1px 0px;
color:#fff;
font-size:1.7em;
font-weight:normal;
text-align:center;
margin:246px 4px 0 4px;
height: 44px;
width:966px;
line-height: 44px;
position: absolute;
bottom: 5px;
left: 0;
z-index: 300;
}
div#banner-fade {
width: 974px;
height: 287px;
position: relative;
z-index: 249;
overflow: hidden;
background-position: 4px 0;
}
div#mask {
background: url(../images/mask.png) no-repeat;
width: 986px;
height: 298px;
position: absolute;
top: -9px;
left: -6px;
z-index: 250;
}






/*
Content Area - left box and buttons
*/

div#content {
margin: 0px 30px 50px 30px;
}

div#bg-left-box-tile {
background: url(../images/bg-left-box-tile.gif) top left repeat-y;
margin-left:3px;
margin-top:4px;
}
div#bg-left-box-top {
background: url(../images/bg-left-box-top.gif) top left no-repeat;
}
div#left-box-wrap {
width:294px;
min-height: 127px;
}
div#bg-left-box-end {
background: url(../images/bg-left-box-end.gif) bottom left no-repeat;
height:45px;
margin-left:3px;
}



div#buttons {
width:642px;
height:150px; /* stops the auto height of this stretching the left box */
overflow: visible;
}


.inside ul li {
margin-left: 20px;
}
.inside ul li ul li {
margin-left: 40px;
}

.inside ul.with-spans li {
width: 400px;
font-size: 1.1em;
border: 1px solid #cecece;
padding: 2px;
}

.inside ul.with-spans li span {
display: inline-block;
width: 100px;
float: right;
clear: right;
border-left: 1px solid #cecece;
padding-left: 2px;
}

/*
Footer sections
*/

div#footer {
height:190px;
color: #cecece;
}
div#footer a {
color: #fff;
}
div#footer a:hover {
color: #b90000;
}
div#footer div.left {
width:270px;
text-align:left;
margin-left:25px;
margin-top:40px;
color:#fff;
}
div#footer div.left p:first-line {
line-height:3em;
}
div#footer div#quick-links.left,
div#footer div#info.left {
margin-left:57px;
}
div#footer div#quick-links.left p {
padding-bottom:0px;
}
div#quick-links a {
display:block;
}

div#footer img {
margin-right: 5px;
vertical-align: top;
}

/*
page specific styles
*/

#services div.first {
padding-right: 100px;
}

#services div.left ul li {
margin-bottom: 5px;
font-size: 1.2em;
background: url(../images/bullet.gif) top left no-repeat;
list-style: none;
padding-left: 28px;
line-height: 25px;
}

#services div.left ul li a {
color: #cfcfcf;
}

#services div.left ul li a.thickbox {
color: #b90000;
}
#services div.left ul li a.thickbox:hover {
color: #cfcfcf;
}

/*
Contact page - will change this to a better default style
*/

#about #contact-left img {
float: left;
margin-left: 30px;
vertical-align: top;
border: 1px solid #BFC6CA;
}

#about #contact-left img.first {
margin-left: 15px;
}

#form_div {
width: 360px;
color: #555;
font-weight: bold;
margin: 15px 0 50px 0;
}

#contact-left {
float: left;
width: 475px;
}

.form {
background: url(../images/formgradient.jpg) repeat-x #ffffff;
border: 1px solid #bfc6ca;
padding: 10px;
height: 400px;
}

.input {
width: 200px;
font-size: 12px;
border: 1px solid #cccccc;
background: url(../images/formgradient.jpg) repeat-x #ffffff;
margin-bottom: 15px;
padding: 5px;
float: right;
}

.input:hover {
border: 1px solid #aaaaaa;
}

.input:focus {
border: 1px solid #aaaaaa;
background: #fffbdf;
}

.textarea {
font-family:Verdana, Arial, Helvetica, sans-serif;
padding: 0px; line-height: 14px; margin: 0px;
width: 200px;
height: 150px;
line-height: 18px;
font-size: 12px;
border: 1px solid #cccccc;
background: url(../images/formgradient.jpg) repeat-x #ffffff;
margin-bottom: 10px;
padding: 5px;
float: right;
}

.textarea:hover {
border: 1px solid #aaaaaa;
}

.textarea:focus {
border: 1px solid #aaaaaa;
background: #fffbdf;
}

.submit {
float: right;
height: 33px;
width: 141px;
background: url(../images/send-email.png) 0 0;
cursor: pointer;
clear: both;
border: none;
}
.submit:hover {
background: url(../images/send-email.png) 0 33px;
}

label {
width: 150px;
float: left;
font-size: 12px;
margin: 10px 0 -18px 0;
}

.enquiry {
margin: 10px 0 -10px !important;
}

#readmore {display:none}

