/* main CSS Document */

/* Notes */
/* the page is a fluid width but has min-width and max-widths set */
/* IE6 and 5.5. use an expression to imitate min and max widths */
/* Ie5 just gets full width */
/* a lot of images were transparent pngs due to shadows underneath and through the image therefore transparent pngs are the only solution. IE6 uses the alpha image loader to get this effect but IE5.x will just get transparent gifs instead.*/



/* general styling first */
/* reset css styles individually instead of universal selector. */
/* based on http://meyerweb.com/eric/thoughts/2007/05/01/reset-reloaded/ */
html, body{
	margin: 0;
	padding: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
	border-left:0;
} 
div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
}
body {
	line-height: 1;
	color: black;
	background: white;
	font-family: Arial, Verdana, Helvetica, sans-serif;
}
ol, ul {	list-style: none;}
table {
	border-collapse: separate;
	border-spacing: 0;
}
caption, th, td {
	text-align: left;
	font-weight: normal;
}
/* end reset styles */
/* clearing technique */
.clearfix:after {
    content:"."; 
    display:block; 
    height:0; 
    clear:both; 
    visibility:hidden;
}
.clearfix {display:inline-block;}
/* mac hide \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
 /* End hide */
/*........... do not change or amalgamate the above clearfix styles..................*/

/* a few defaults */
ul{list-style:none}
p,h1,h2,h3,h4,h5,h6,ul {margin-bottom:.7em}
a img,img{border:none;display:block;}
a{cursor:pointer!important;text-decoration:none}
a:link{color:#666;}
a:visited{color:#666}
a:hover{color:#0e55a7}
a:active{color:#0e55a7}
input{font-family: Arial, Verdana, Helvetica, sans-serif}
h1,h2,h3,h4,h5,h6{font-weight:bold}
h1{	
	color:#226a9c;
	font-size:153.9%;
	font-weight:normal
}
h2{
	color:#226a9c;
	font-size:153.9%;
	font-weight:normal;
}
h3,h4{
	color:#f90;
	font-size:138.5%;
}
body{
	color:#666; 
	font-size: 13px; 
	text-align:center;/* for ie5.+*/
	background:#79abd5;
}

/* ......outer carries left page shadow and inner holds right page shadow ...... */
#outer{
	max-width:1250px;
	min-width:890px;
	text-align:left;
	margin:auto;
	position:relative;
	background:#fff url(images/lcol.jpg) repeat-y 0 0;
}
#inner{
	background: url(images/rcol.jpg) repeat-y 100% 0;
	padding:0 10px;
	min-height:0;
	position:relative;
}
/*..... header section..............*/
/* this is more long winded than it needs to be due to IE6 needing special attention for the alpha image loader and because ie5 hides everything with text indent unless we do it like this.*/
#header{
	height:163px;
	background:url(images/headerbg.jpg) no-repeat 100% 0;
}
/* image replacement for logo */
p.logo{
	width:394px;
	height:107px;
	position:absolute;
	margin:0;
	left:30px;
	top:40px;
	clear:both
}
p.logo span{
	background:url(images/logo-8.png) no-repeat 0 0;
	display:block;
	width:394px;
	height:107px;
}
p.logo a{
	display:block;
	z-index:99;
	cursor: pointer;
	text-decoration:none;
	width:394px;
	height:107px;
	position:relative;
}
p.logo em{
	display:block;
	text-indent:-999em;
}
#header ul{
	margin:17px 0 0 0;
	float:right;
}
#header li {
	float:right;
	margin:0 28px 0 0;
	display:inline;
}
/* main navigation */
#nav{
	margin:0;
	padding:2px 0 0 0;
	clear:both;
	width:100%;
	background:url(images/navbg.jpg) repeat-x 0 50%;
	line-height:32px;
}
#nav li{
	font-size:85%;
	float:left;
	color:#fff;
	margin-left:58px;
	display:inline;
}
#nav li a,#nav li span,#nav li strong{
	color:#fff;
	float:left;
	font-weight:bold;
}
#nav li a,#nav li strong{padding:0 0 0 7px}
#nav li span{padding:0 12px 0 5px;cursor:pointer}
#nav li a:hover,#nav li strong{
	background:url(images/ltab.jpg) no-repeat 0 0;
	color:#000;
}
#nav li a:hover span ,#nav li strong span{
	background:url(images/rtab.jpg) no-repeat 100% 0;
	color:#000;
}
#nav li a:hover{visibility:visible}

/*.... subnav styles ....*/
#subnav{
	margin:0;
	clear:both;
	width:100%;
	background:#d8dde2 url(images/subnavbg.jpg) repeat-x 0 0;
	line-height:24px;
	font-size:85%;
}
#subnav li,#subnav li a{
	display:inline;
	color:#000;
	padding:0 4px;
}
#subnav li {border-right:1px solid #000}
#subnav li.last{border:none}
#subnav li.first{padding-left:13px}
#subnav li a:hover{text-decoration:underline;}

/* main section that holds 2 columns - has shadow at top */
#main{
	clear:both;
	background: url(images/mainfade.jpg) repeat-x 0 0;
	min-height:0;
}
/* main inner also holds the columns but - has shadow at bottom */
#main-inner{
	background: url(images/base-shade.jpg) repeat-x 0 100%;
	min-height:0;
	padding:0 0 41px 0;
}
/* shadow will rub out vertical column sahdow so we need to replace the missing section at the bottom of the left column*/
p.lbase{
	margin:0;
	position:absolute;
	top:-48px;
	left:265px;
	width:14px;
	height:48px;
	background: url(images/lcol-base.jpg) no-repeat 0 0;
}
#content{
	margin-left:289px;
	min-height:0;
	padding:40px 40px 0 0;
}
.cont-inner{float:left;width:100%}
#content p.house{
	float:left;
	margin:0 15px 15px 0;
}
#content p.toppics{
	margin:0 15px 15px 0;
}
#content p.topimagesinline img{
	display:inline;
	margin-right:8px;
}
ul.commonlist {list-style:disc;margin-left:16px;line-height:1.5em}
#content p{
	font-size:93%;
	margin:10px 0 2.1em 0;
	line-height:1.5em;
}
/* add a class of nowrap if you don't want p tag to wrap under the floated image */
.nowrap p,.nowrap blockquote {overflow:auto}
.testimonials{
	clear:both;
	background: url(images/nav-dots.gif) repeat-x 0 3px;
	min-height:0;
	padding:29px 8px 0;
}
.testimonials h2 {	
	color:#f90;
	font-size:138.5%;
	margin:0 0 1em 0;
}
#content p.house2{
	float:right;
	margin:-7px 0 15px 0;
	padding-left:15px;
}
.testimonials blockquote{
	font-style:italic;
	line-height:1.42em;
	margin:1em 0 1em 0;
}
#content .testimonials p{
	color:#0e55a7;
	margin:0;
	font-size:93%;
	font-style:italic;
	font-weight:bold;
	line-height:1.2em;
}

/*............... sidebar contents ..........*/
/* the sidebar carries a little top image to rebuild the border and shadow which has been rubbed out by the shadow on #main */
#sidebar{
	width:289px;
	background: url(images/sidetop.jpg) no-repeat 265px 0;
	float:left;
	padding:27px 0 0 0;
}
#sidebar h2{
	color:#fff;
	width:234px;
	height:31px;
	background: url(images/our-products2.jpg) no-repeat 0 0;
	padding:15px 0 0 15px;
	margin:0 0 18px 10px;
	font-weight:normal
}

/* ....... navigation in sidebar .......*/
ul.sidenav{
	margin:0 0 24px 14px;
	width:234px;
	font-size:93%;
}
ul.sidenav li,ul.sidenav li a{color:#666}
ul.sidenav li{
	background: url(images/nav-dots.gif) no-repeat 0 100%;
	padding:9px 0 10px;
}
ul.sidenav li a{padding:0 10px 0 0}
ul.sidenav li span{
	color:#829a23;
	padding:0 10px 0 5px;
	position:relative;
	top:-2px;
}
ul.sidenav li a:hover{color:#000;}
ul.sidenav li a:hover span{
	color:#f90;
}

/*email link */
p.send-email,p.send-email a, p.send-email em{
	width:246px;
	height:55px;
	display:block;
	overflow:hidden;
	text-decoration:none;
	position:relative;
}
p.send-email{	margin:0 0 0 8px}
p.send-email em{
	position:absolute;
	left:0;
	top:0;
	z-index:99;
	cursor: pointer;
	background:url(images/email.jpg) no-repeat 0 0;
}
/* fensa link */
p.fensa{
	margin:23px 0 0 14px;
	width:234px;
	text-align:center;
	padding:0 0 1px 0;
}
p.fensa a{
	width:176px;
	height:68px;
	display:block;
	cursor: pointer;
	background:url(images/fensa.png) no-repeat 0 0;
	margin:0 auto;
}
p.fensa span{
	display:block;
	text-indent:-999em
}

/* fed masters link */
p.kite-fed{
	margin:23px 0 0 14px;
	width:234px;
	text-align:center;
	padding:0 0 1px 0;
}
p.kite-fed a{
	width:176px;
	height:70px;
	display:block;
	cursor: pointer;
	background:url(images/kite-fed.jpg) no-repeat 0 0;
	margin:0 auto;
}
p.kite-fed span{
	display:block;
	text-indent:-999em
}


/*.................. footer styles .........*/
#footer{
	position:relative;
	clear:both;
	min-height:0;
	background:#fff url(images/footer-bg.jpg) repeat-x 0 0;
	padding:33px 0;
	text-align:center;
}
#footer ul{
	margin:0 0 1.7em 0;
	font-size:85%;
}
#footer ul li,#footer ul li a{
	display:inline;
	color:#094fa4;
	padding:0 5px;
}
#footer ul li a{padding:0 7px 0 0px }
#footer ul li a:hover{text-decoration:underline}
#footer p.small-logo a,
#footer p.small-logo{
	display:block;
	cursor: pointer;
	text-decoration:none;
	width:150px;
	height:32px;
	margin:auto;
}
#footer p.small-logo a{position:relative}
#footer p.small-logo{
	background:url(images/small-logo.png) no-repeat 0 0;
}
#footer p.copy{
	font-size:77%;
	color:#2e69b1;
	margin:1.4em 0 0 0;
}
.portfolioimg{
	border:#999999 1px solid;
}
.extraimg{
	border:#999999 1px solid;
}
#content p.floatleftimg{
	float:left;
	margin:0 15px 15px 0;
	min-height:170px;
}
.smalltext{
	font-size:10px;
}
.errorfont{ color:#FF0000; }
.successfont{ color: #009900; }