﻿
/* reset */
html, body, div, span, h1, h2, h3, h4, h5, h6, p, em, font, img, center, ol, ul, li, fieldset, form, label, table, caption, tbody, tfoot, thead, tr, th, td {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    vertical-align: baseline;
    background: transparent;
}


html,body{
/* \*/
  height:100%;
  color:#272d47;
  background-color:#FFFCF2;
font-family: "Gill Sans MT", Calibri, Arial;
    background-image: url(graphics/bg4.jpg); 
  background-position: center top;
  background-repeat:no-repeat;
  background-attachment: fixed;
}

.insert{
	color: #fff;
	margin-top: 35px;
	padding: 6px 4px 0 10px;
	line-height: 110%;
	font-style: italic;
}

.logo{
position: absolute;
top:5px;
left:0;
}

body{
  min-width:966px;
  text-align:center;
  	font-family: "Gill Sans MT", Calibri, Arial;
  line-height: 101%;
  font-size:100.1%; /* Don't change. other font-sizes in % (preferred) or ems */
}



/* EXTRAS */
.wideR  a:link {
	text-decoration: none;
	font-weight: normal;
	outline: none;
	color: #272d47;
}
.wideR a:visited {
	color:#fff;
}
.wideR  a:active {
	color:#e8d395;
}
.wideR  a:hover {
	text-decoration: none;
	color: #272d47;
}

hr {
	margin: 0;
	color: #ccc;
	background-color: #ccc;
	height: 1px;
	margin-top: 2.0em;
	margin-bottom: 2.0em;
	}
p {
	line-height: 1.5em;
	margin: 0 20px 20px 20px;
	text-align: justify;
	}

h1{
	font-size: 17px;
	margin:18px 0 15px 20px;
	padding: 0;
	font-family: Geneva, Arial, Helvetica, sans-serif;
	font-weight: normal;
	text-transform: uppercase;
}

h2{
	font-size: 17px;
	font-weight: normal;
	margin:0 0 10px 20px;
	padding:0 0 5px 0;
	font-family: Geneva, Arial, Helvetica, sans-serif;
	border-bottom: 1px dotted #fffcf2;

}

h3{
	font-size: 16px;
	font-weight: normal;
	margin:0 0 10px 20px;
	padding:0 0 5px 0;
	font-family: Geneva, Arial, Helvetica, sans-serif;
	border-bottom: 1px dotted #fffcf2;
}

h4{
	font-size: 14px;
		font-family: Geneva, Arial, Helvetica, sans-serif;
		margin:0 0 10px 20px;
}

li {
	font-size: 90%;
	line-height: 1.5em;
	margin: 0.3em 0 0.2em 1.2em;
	padding: 0 0.9em 0 0;
	}
	
ul {
	margin: 1.0em 0;
	list-style: circle;
   list-style-position: outside;
	}
	
td {
	font-size: 90%;
	vertical-align: top;
	}

label{
	font-weight: normal;
	width:25%;
	float: left;
	display: block;
	text-align: left;
}
	
.clear{
  clear:both;
  height:1px;
  overflow:hidden;
  line-height:1%;
  font-size:0;
  margin-bottom:-1px;
}
* html .clear{height:auto;margin-bottom:0}

.hide{
	color: #0061b3;
}

.img{
	margin: 0 0 15px 0;
}

.img1st{
	margin: 0 0 15px 0;
	padding:25px 0 0 0;
}

.arrow{
	float:left;
	vertical-align: text-top; 
	clear: both;
	margin-right:2px;
}

.breadcrumb {
	padding: 0 0 1px 0;
	font-size: 12px;
	color:#30c8e3;
}

.breadcrumb a:link, .breadcrumb a:visited{
	color:silver;
	text-decoration:none;
}

.breadcrumb a:hover, .breadcrumb a:active{
	color:silver;
	text-decoration:none;
}

.photo{
	margin: 0;
	padding:0;
	font-size: 12px;
	line-height:12px;
}

/* GLOBAL */
#fullheightcontainer{
  margin-left:auto;
  margin-right:auto;
  text-align:left;
  position:relative;
  width:966px;
/* \*/
  height:100%;

}
#wrapper{
  min-height:100%;
/* \*/
  height:100%;

 

}
#wrapp\65	r{
  height:auto;
}
/* \*/
* html #wrapper{
  height:100%;
}

#outer{
  z-index:1;
  position:relative;
/* \*/
  height:100%;
}

#gfx_bg_middle{
  top:0;
  position:absolute;
  height:100%;
  overflow:hidden;
  width:966px;
}
* html #gfx_bg_middle{
  display:none;
}

/* CONTENT */
#container-center{
width: 966px;
background-color:transparent;
margin: 0;
padding: 0;

}

/* CLASSES: */

/* text or content contained in one wide column */
.contentfull{
width:906px;
margin: 0 30px;
}

/* for text contained in three equal sections */
/* left section*/
.threeL {width:282px; float:left; margin:0 15px 0 30px;padding:0 15px 0 0; }
.threeL li a { font: normal 13px Arial, Helvetica, sans-serif; color:#023485; text-decoration:none;}
.threeL li a:hover { color:#ccc; text-decoration: none; background-color: #fff;}
.threeL h2, #container-center .three-middle h2, #container-center .three-right h2 {font-size:19px;	margin:0 0 10px 0; padding:0 0 10px 0;}	

.threeL h1{
font-size: 15px;
margin:0 0 17px 0;
padding: 0 0 5px 0;
}

/* right section*/
.threeR {
width:282px; float:left; margin:0 15px 0 0; padding: 0 0 0 15px;}/* padding required to place border in the middle between two sections if used*/
.threeR ul {
margin:5px 0; padding:0; list-style:square; list-style-position: inside;}
.threeR li {
 padding:4px 2px 0 0; margin:0; background: url(graphics/ul_li_left.gif) left no-repeat;}
.threeR li a { 
font: normal 13px Arial, Helvetica, sans-serif; color:#023485; text-decoration:none;}
.threeR li a:hover { 
color:#ccc; text-decoration: none;}

.threeR h2 {
font-size:18px;
margin:0 0 5px 0;
padding:0 0 3px 0;
}
/* middle section: */
.threeM { width:282px; float:left; margin:0 15px 0 0;}
.threeM h2{
font-size:18px;
margin:0 0 0 6px;
padding:0;
}

.threeM a:link {
color:#023485;
}
/* three equal sections end */

/*  wide left for text - narrow right for nav or photos  */
.wideL{
	width:554px;
	float: left;
	margin:0 15px 25px 30px;
	padding:0 20px 0 0;
}

.narrowR{
	width:190px;
	float: right;
	margin:0;
	padding:0;
	background-image: url(graphics/gradient.jpg);
	background-position: right;
}
 
/*  wider right for text  - narrower left for nav or photos */
.wideR{
	width:640px;
	float: right;
	margin:6px 0 0 0;
	padding:0 50px 0 0;
	background-color: transparent;
}

.wideR li {
	list-style-image: url(graphics/ul-li.png);
	background-repeat: no-repeat;
	list-style-position: outside;
	font-size: 94%;
	margin: 0 0 0 40px;
	padding:8px 0 8px 0;
	line-height: 1em;
}

.wide ul {
	margin: 0;
	padding:0;
	list-style: none;
   list-style-position: outside;
	}

.narrowL{
	width:187px;
	float: left;
	margin:0;
	padding:0 0 0 85px;
}

.narrowL img{
margin: 0 auto 2px auto;
display: block;
border:1px solid white;
padding: 7px;
}

/* two equal columns */
.halfL{
	width:417px;
	float: left;
	margin:0 15px 25px 30px;
	padding:0 38px 0 0;
	border-right: 1px dashed #fff;
}

.halfR{
	width:417px;
	float: right;
	margin:0 30px 25px 15px;
	padding: 0;
}

/* FOOTER */
#footer{
  z-index:1;
  position:absolute;
  clear: both;
  width:966px;
  height:110px;
  overflow:hidden;
  margin-top:-110px;

}
#subfooter1{
  text-align:center;
  height:20px;

}
#subfooter2{
  text-align:center;
  height:55px;
    border-top: 1px dashed #fff;
    padding-top: 10px;
}

#subfooter3{
  text-align:center;
  height:25px;


}
#clearfootercenter{
  height:110px;
  overflow:hidden;
}

/* footer classes*/
.footer { margin:0 auto; padding:0; font: 13px "Lucida Sans Unicode", "Lucida Grande", sans-serif; color:#272d47;}
.footer a { font: 13px "Lucida Sans Unicode", "Lucida Grande", sans-serif; color:#272d47; text-decoration:none;}
.footer a:hover { text-decoration:underline;color:silver;}

.nav-bottom { margin:0 auto; padding:0 0 0 50px; font: 13px "Lucida Sans Unicode", "Lucida Grande", sans-serif; color:#272d47; }
.nav-bottom a { font: 13px "Lucida Sans Unicode", "Lucida Grande", sans-serif; color:#272d47; text-decoration:none;}
.nav-bottom a:hover { text-decoration:underline;color:silver;}

/* HEADER */
#header{
  z-index:1;
  position:absolute;
  top:0;
  width:100%;
  height:60px;
  overflow:hidden;
  padding:0; 
  margin:0 auto;
  background-color: transparent;
}
#subheader1{
  text-align:left;
  height:60px;
  background-color: transparent;
}

#subheader2{
  text-align:center;
  height:25px;
  background-color: transparent;

}

#clearheadercenter{
  height:60px;
  overflow:hidden;
}

.frame{
border:1px solid #FFFCF2;
}

.frame td{
width:25%;
}

.frame img{
margin:8px 0 0 8px;
}

/* menu */	
.nav{
	width:181px;
	font-family: "Gill Sans MT", Calibri, Arial;
	font-size: 110%;
	float: left;
	margin-top:117px;
	color: #272d47;
}

.nav li, .nav ul{
	margin:0;
	padding: 0;
}

.nav li{
	background-image: url(graphics/menu.jpg);
	height:30px;
	line-height: 30px;
	list-style: none;
	width: 181px;
	padding-left: 10px;
}


.nav a:link, .nav a:visited{
	color: #272d47;
	text-decoration: none;
}

.nav a:hover, .nav a:active{
	color: silver;
}


/* page id */
/* add to body of each relevant page: <body id="home">  etc */
/* add to link in nav file: class="home" etc */
#home .home, #profile .profile, #portfolio .portfolio, #contact .contact, #services .services, #enquiries .enquiries
{
/* navtop */

background:url(images/hover.gif) top repeat-x;
}


#home .homebottom, #profile .profilebottom, #enquiries .enquiriesbottom, #contact .contactbottom, #services .servicesbottom
{
/* navbottom */
border: 1px dotted #fed428;
padding: 5px;
}