/**************** Style Resets **********************/

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,p,blockquote,th,td {margin:0; padding:0;}
h1,h2,h3,h4,h5,h6,p,pre,blockquote,ol,dl,address {margin:1em 0;}
li, dd, blockquote {margin-left:1em;}
html, body, fieldset {font:100.1%/120%  Arial, Helvetica, sans-serif;}
input, select, textarea {font-size:100.1%;}
h1, h2, h3, h4, h5, h6 {font-size:100%;}
form label{cursor:pointer;}
fieldset, img{border:none;}
table{border-collapse:collapse; border-spacing:0;}
hr {height: 1px; background-color: #E5E5E5;  color: #E5E5E5;   border: none;  padding: 0; margin: 1em 1em;}

/**************** General rules *********************/

html{height:100%; }
body {height:101%; line-height:150%; color: #333; text-align: center; }

/**************** General Links ***********************************/
a:link            { color: #555; text-decoration: none;border-bottom:1px solid#ccc;}
a:visited         { color: black; text-decoration: none;border-bottom:1px solid#ccc;}
a:focus, a:hover, a:active {color: #555;background-color:#efefef;border-bottom:1px solid#555; }

/********************** Navigation ******************/
#navlist { font-size:99%;padding-bottom:10px; margin:0 5px 0 5px;line-height:normal;height:3em;font-weight:bold;background: #fff url(../images/line.gif) no-repeat center bottom;}
#navlist ul { margin:0  ;padding:0 0 0 0;list-style:none;width:20em;}
#navlist li {list-style-type:none;float:left; margin:0 15px 0 0 ; padding:0;}
#navlist li {border-right: 1px solid #ccc;float: left;line-height: 1.1em;margin: 0 .5em 0 -.5em;padding: 0 .5em 0 .5em;}
#navlist li.last {border-right:none;}
#navlist a:link, #navlist a:visited {border-bottom:none;color:black;}
#navlist a:focus, #navlist a:hover, #navlist a:active {color:#c20c0c; }
#home #nav-home, #services #nav-page2, #experience #nav-page4, #contact #nav-contact, #approach #nav-page5, #news #nav-page3 {color:#c20c0c;}
/***************** Image Replacement ****************/

/* General IR statements */
.replace {clear:both;position: relative;  overflow: hidden; margin: 10px 0 0 10px;padding: 0;   font-size: 100%; }
.replace em {     display: block;   position: absolute;  top: 0;  /* left: 0; */ z-index: 1;    /* for opera5 (?) and o6/mac */     }
/* General IR statements for IE5.x mac only */
* html>body .replace {  position: static; overflow: visible;   font-size: 10px;  /* for ie5.x/mac */  }
* html>body .replace em  { position: static; }
* html>body .replace a {text-decoration: none;  /* ie5.0-5.1.x/mac  must have this value or the underline shows through the image. */   }
/* Each pair of statements per instance of IR */
#myh1, #myh1 em {font-color:#555;padding-bottom:0; background-color:#ggg;     width:277px;     height: 46px; background: url(../images/logo.gif) top left no-repeat;}
* html>body #myh1 em { /* for ie5.x/mac only */ margin-bottom: -46px;  /* Required to bring text underneath image. Use the negative height of the image here.*/  }

/***************** Headings ********************/

/* h1 {font-size:110%; color: #000; font-weight:normal;} */
h2 {font-size:180%; color: #000; font-weight:normal;font-family: Arial, Verdana, Helvetica, sans-serif;margin-left:10px;}
h3 {font-size:150%; color:#c00606;font-weight:normal;font-family:  Arial, Verdana, Helvetica, sans-serif;margin-left:10px;}
h4 {font-size:140%; color:#c00606;font-weight:normal; font-family: Arial, Verdana, Helvetica, sans-serif;margin-left:10px;}
h5 {font-size:120%; color:#c00606;font-weight:bold; font-family: Arial, Verdana, Helvetica, sans-serif;margin-left:10px;}

#box h3 {margin: 8px 0 0px 20px;}
/***************** Page Sections *********************/

#container {position:relative; margin:2.3em auto;text-align:left; background-color:white; width:760px;font-size:85%;}
img.printlogo {display:none;}
#skiplink {font-size:76%;}
#skiplink a{display: block; position:absolute; top:0; left:0; width:100%; padding: 0; background: transparent; font-weight: bold; text-align: center;}
#skiplink a:link, #skiplink a:visited {color: #fff;border-bottom:none;}
#skiplink a:hover, #skiplink a:focus, #skiplink a:active {color:#c00606;border-top:6px solid #c00606;background: #fff url(../images/arrow.gif) no-repeat center top;}
#content {clear:both;padding-bottom:10px;}
#content p {margin:1em 20px 1em 10px;}
#content img {float:right; clear:both;background:#fff;margin: 0 0 5px 4px;}
#content img.nofloat {float:none;padding:0;border:none;margin:10px 0 0 20px;}
#content ul  {margin-left:0px;}
#content #box {font-size:90%;float:right; border:1px solid #c00606;width:40%;padding:0 5px 0 5px;}
#box ol {margin-left:20px;}
#box p, #box h4 {font-weight:bold; color: #c00606;margin-top:3px;}
#box h4 {margin-top:5px;font-size:110%;margin-bottom:3px;}
#news #content h4 {margin-bottom:-5px;}
#box ol {margin-top:0;margin-bottom:3px;}
#services #content ul {margin-top:0;}
#services h3 {margin-bottom:3px;}
#content p.bold {font-size:110%;}
#content ul li {list-style-type:none;background: #fff url(../images/bullet.gif) no-repeat 0 0.65em;padding-left:10px;}
#content div.box p {padding:0;margin:0 8px ;}
#footer {clear:both; padding:1em 0 1em 0;overflow:hidden;background: #fff url(../images/line.gif) no-repeat center top;width:750px; margin:1em auto;text-align:center;}
#footer .left {float:left; width:40%;text-align:left;margin-left:10px;}
#footer .right {float:right; width:50%; text-align:right;margin-right:10px;}
#content p.date {margin-top:0;font-weight:bold;}
em {color:#c00606;font-style:normal;}
#content img.icon {float:none;border:none;margin:0;padding:0;}
#admin form {margin-left:10px;}
#admin #content .dbimages {float:left;}
#admin #content .dbimages img {float:none;}

/*************** Other bits *************/
ul.list {display:inline;float:left;width:30%;}
ul.border {border-right:1px solid #ccc}
.box h3 {color: #ce071e;background-color:#f1f1f1;border-bottom:1px solid #eaeaea;margin-left:0;padding-left:1em;font-size:120%;margin-top:0;font-weight:bold;}
.box {width:29%; height:15em;float:left; margin:10px 15px 20px 0; border:1px solid #cbcbcb; background-color: #fff;display:inline;}
.box p  {padding:0 0 0 0;margin:0px;}
div.first {margin-left:20px;}
img.bigpic {margin-left:10px;}
#addresslist  {margin-left:20px;}
#addresslist dt {font-weight:bold;}
#addresslist dd {font-weight:normal;margin-bottom:8px;margin-left:0;}

/*************** Forms ******************/

#contactformh3 {margin-bottom:0;padding-bottom:0;}

#gbcf-form{ clear:both; color: #08365d;    margin: 10px 0 0 -5px;    width: 90%; }
#gbcf-form fieldset { margin-top:0px;  border: 1px solid #c00606;padding:12px 8px 8px 8px;margin-bottom:15px; }
#gbcf-form legend {  font-weight:bold; color:#c00606;padding-bottom:5px;}
#gbcf-form #formwrap{border:none;}
.main-legend {font-size:130%;margin-bottom:0; color:#19598e;font-weight:normal;font-family:"Trebuchet MS", Helvetica, sans-serif;}

#gbcf-form input {   background: #fff;    border: 1px solid #777;    width: 80%;    padding: 5px 3px 5px 3px;    vertical-align: middle;    margin: 0 0 5px 0; }
#gbcf-form textarea {   background: #FFF;    border: 1px solid #777;    width: 80%;    margin-left: 0;    font-size: 130%;    padding: 3px;    vertical-align: middle; }
#gbcf-form input.button {   border: 1px solid #fff;    clear: both;    color: white;    font-size: 100%;    width: 30%;    margin: 10px 0 20px 0;    font-weight: bold;   background: #c00606 url(../images/greenbar.gif) left bottom repeat-x; }
#gbcf-form input:hover, #gb_form_div textarea:hover {   border: 1px solid #777;    }
#gbcf-form input.button:focus, #gb_form_div input.button:hover, #gb_form_div input.button:active {   clear: both;    color: #0e0a22;    font-size: 100%;    width: 30%;    margin: 10px 0 20px 0;    font-weight: bold;   background: #c00606 url(../images/greenbar.gif) left top repeat-x;  }
#gbcf-form input.short {width:10%;}
.required {   color: #c2537a;    font-weight: normal;    margin-left: 10px; }
.validationerrors ol {   color: #000;    margin-left: 20px;    padding-left: 15px;    margin-bottom: 10px; }
#enquiryErrorID  a:focus, #enquiryErrorID  a:hover, #enquiryErrorID  a:active {   background-color: #538b37;    color: white; }

#gbcf-form input.text-short {width:20%;}
#gbcf-form select#subject {display:none;}
#gbcf-form #subject-error {display:none;}
#form-div {margin:-10px 0 0 10px;}

#lightbox{
   position: absolute;
   left: 0;
   width: 100%;
   z-index: 100;
   text-align: center;
   line-height: 0;
   }

#lightbox a img{ border: none; }

#outerImageContainer{
   position: relative;
   background-color: #fff;
   width: 250px;
   height: 250px;
   margin: 0 auto;
   }

#imageContainer{
   padding: 10px;
   }

#loading{
   position: absolute;
   top: 40%;
   left: 0%;
   height: 25%;
   width: 100%;
   text-align: center;
   line-height: 0;
   }
#hoverNav{
   position: absolute;
   top: 0;
   left: 0;
   height: 100%;
   width: 100%;
   z-index: 10;
   }
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}

#prevLink, #nextLink{
   width: 49%;
   height: 100%;
   background: transparent url(../images/blank.gif) no-repeat; /* Trick IE into showing hover */
   display: block;
   }
#prevLink { left: 0;
   float: left;
   }
#nextLink { right: 0;
   float: right;
   }
#prevLink:hover, #prevLink:visited:hover {
   background: url(../images/prevlabel.gif) left 15% no-repeat;
   }
#nextLink:hover, #nextLink:visited:hover {
   background: url(../images/nextlabel.gif) right 15% no-repeat;
   }


#imageDataContainer{
   font: 10px Verdana, Helvetica, sans-serif;
   background-color: #fff;
   margin: 0 auto;
   line-height: 1.4em;
   overflow: auto;
   width: 100%
   }

#imageData {
   padding:0 10px;
   color: #666;
   }
#imageData #imageDetails{
   width: 70%;
   float: left;
   text-align: left;
   }
#imageData #caption{
   font-weight: bold;
   }
#imageData #numberDisplay{
   display: block;
   clear: left;
   padding-bottom: 1.0em;
   }
#imageData #bottomNavClose{
   width: 66px;
   float: right;
   padding-bottom: 0.7em;
   }

#overlay{
   position: absolute;
   top: 0;
   left: 0;
   z-index: 90;
   width: 100%;
   height: 500px;
   background-color: #000;
   }