/* calco uk ltd bespoke coding 2008 */
/* lets zero the internal browser sheets */

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td { 
	margin:0;
	padding:0;
}

/* lets play sensible css */

body {
	font-family: verdana, arial, helvetica, sans-serif;
	font-size:100.1%; /*** Don't change this setting. Make all other
font-sizes in % (preferred) or ems ***/
	color:#333333;
	}
a {
	text-decoration: none;
	font-weight: bold;
	outline: none;
	color:#738390;
	}
a:visited {
	}
a:active {
	}
a:hover {
	text-decoration: underline;
	}
strong, b {
	font-weight: bold;
	}
hr {
	margin: 0px; /* fixes xhtml N6 bug where the hr sits to the left*/
	color: #ccc; /* for ie */
	background-color: #ccc; /* for everyone else */
	height: 1px;
	}
p {
	font-size: 90%;
	line-height: 1.1em;
	}
li {
	font-size: 90%;
	line-height: 1.1em;
	margin-top: 0.3em;
	margin-bottom: 0.2em; 
	}
ul {
	margin-top: 1.0em;
	margin-bottom: 1.0em; 
	}
td {
	font-size: 90%;
	}
hr {
	margin-top: 2.0em;
	margin-bottom: 2.0em;
	}
img {
	border: 0;
	}


div,p{margin:0}

.italics-test, .italics-test-side {
font-style: italic; 
text-align: justify; 
}

.clear{
  clear:both;
/*** these next attributes are designed to keep the div
height to 0 pixels high, critical for Safari and Netscape 7 ***/
  height:1px;
  overflow:hidden;
  line-height:1%;
  font-size:0px;
  margin-bottom:-1px;
}


* html .clear{height:auto;margin-bottom:0} /*** stops IE browsers from displaying
the clear div/br in the page, as these are for Moz/Opera and
Safari only. If IE 5.x Win DID display these, the page is too high ***/

/***
The following fixes prevent justified italic text
from destroying the layout in IE/win. The problem
is that those properties together make IE force the
container wider, which in this type of floated layout
causes a float drop.
Pre-IE6 gets "width: 100%" and "overflow: hidden",
while IE6 gets "width: auto" and "overflow: visible,
which is the default, but explicitly stating it seems
to keep IE6 happy. IE6 also needs to see the
"height: 1%" to give it some kind of box dimension.
Browser coddling we call it. Finally, Bruno Fassino
found that "word-wrap: break-word;" disarranged the
justified text in IE5.5 and 6, so it is defaulted to
"normal" for this text.
If you don't need justified and italicized text then
forget all these fixes.
Its also been seen - some odd
behavior with normal justified text in IE, so
this may be worth remembering.
***/

/* \*/
* html .italics-test, * html .italics-test-side {
overflow: hidden;
width: 100%;
o\verflow: visible;
w\idth: auto;
he\ight: 1px;
word-wrap: normal;
}
/* */


/* now the specific divs */

body{
	background-image:url(images/banner_fractal_fade.jpg);
	background-position:top;
	background-repeat:repeat-x;
	min-width:700px; /*** This is needed for moz. Otherwise, the header and footer will
slide off the left side of the page if the screen width is narrower than the design.
Not seen by IE. Left Col + Right Col + Center Col + Both Inner Borders + Both Outer Borders ***/
	text-align:left; /*** IE/Win (not IE/MAC) alignment of page ***/
}


/*#dummybody{
	background-image:url(images/banner.jpg);
	background-position:top;
	background-repeat:repeat-x;
	width:700px; 
} */

#container{
	width:700px;
	background-image:url(images/banner_fractal_fade.jpg);
	background-position:top;
	background-repeat:repeat-x;
 	margin-left:auto; /*** Mozilla/Opera/Mac IE 5.x alignment of page ***/
  	margin-right:auto; /*** Mozilla/Opera/Mac IE 5.x alignment of page ***/
  	text-align:left; /*** IE Win re-alignment of page if page is centered ***/
  	position:relative; /*** Needed for IE, othewise header and footer aren't contained */
}

#header{
	width:700px;
	height:186px;
}

#headerhome {
	height:60px;
	width:100px;
	position:relative;
	left:10px;
	top:109px
}

#contentholder {
	width:700px;
	}

#nav {
	width:310px;
	float:left;
	text-align:right;
	}
	
#nav_spry {
	width:130px;
	float:left;
	text-align:right;
	margin-left:180px;
	margin-top:26px;
	}
	
#nav_projects {
	width:310px;
	float:left;
	text-align:right;
	}
	
	
#content {
	float:right;
	width:360px;
}

#clear {
	clear:both;
	}
	
	
#footerline {
	width:100%;
	height:25px;
	background-image:url(images/architectural_footer.jpg);
	background-position:top;
	background-repeat:repeat-x;
	
}	

#footer {
	width:700px;
	height:100px;
	margin-left:auto; 
  	margin-right:auto; 
  	position:relative; 
}


#footercontent {
	width:360px;
	margin-left:340px;
	height:90px;
	color:#003366;
	font-size:9px;
}

/* these are the menu divs - invisible by default */

#layerprivate {}

#layersocial {}

#layerindustrial {}

#layeroffice {}

#layercommercial {}

#layercommunity {}


/* typog */

#links a{
color:#bc680d;
font-size:12px;
font-weight:normal;
text-decoration:underline;
}

#links a:hover{
	text-decoration:none;
}

.moorit {
color:#bc680d;
}

#header a{
	color:#FFFFFF;
	margin-top:10em !important;
	margin-left:0em;

}

.weeparas {
font-size:12px;
line-height:18px;
}

.leadparas {
font-size:14px;
line-height:18px;
}

#headerhome a.back{
	line-height:20px;

		color:#7d9eca;
}

#headerhome a.home{
	line-height:20px;
	color:#666666;
}

#content a{
color:#FF6600;
font-weight:normal;
text-decoration:underline;
font-size:12px;
}