﻿/* Stylesheet based on The Perfect 3 Column Liquid Layout (Percentage widths) by Matthew James Taylor */
/* http://matthewjamestaylor.com/blog/perfect-3-column.htm */
/* General styles */
body {
	margin:0;
	padding:0;
	border:0;			/* This removes the border around the viewport in old versions of IE */
	width:100%;
	background:#96A590;     /* background colour */
	min-width:975px;		/* Minimum width of layout - remove line if not required */
					        /* The min-width property does not work in old versions of Internet Explorer */
	font-size:85%;
	font-family: Arial, Helvetica, sans-serif;
}
.container1  {
    width:100%;
    overflow:hidden;
    background:#FFF;
    float:left;
    position:relative;
    margin:0;
    padding:0;
}
.container2  {
    width:100%;
    background:#D4EACC;
    float:left;
    position:relative;
}
a   {
    color: #369;
    text-decoration: none;
    outline:none;
}
a:hover {
    color: #000000;
}
h1, h2, h3 {
	margin:.3em 0 .1em 0;
	padding:6px 0 1px 0;
}
h1	{
	margin:.3em 0 .1em 0;
	padding:15px 0 2px 0;
	position: relative;
	color:#5AB637;
}
h3	{
	border-top:2px solid #CDD0CD;
	color:#369;
	clear:both;
	font-size:115%;
}
h4	{
	clear:both;
}
p   {
	margin:.4em 0 .8em 0;
	padding:0;
}
ul  li{
    display: list-item;
    list-style-position:inside;
    padding:0 0 8px 0; 
}

.more {  
	font-size: smaller; 
}
span.full_width img{
	border:1px solid #aaa;
	width: 99%;
}
span.logo img{
    padding:18px 10px 0 0;
    position:relative; 
    float:left;
    width: 30px;
}
span.client_logo img{
    display:block;
    margin-left:auto;
    margin-right:auto;
    width:150px;
    border:none;
}
span.logo_100 img{
    display:block;
    margin-left:auto;
    margin-right:auto;
    width:100px;
	border:1px solid #aaa;
}
span.left_35 img{
    border: 2px solid #aaa;
    margin: 5px 15px 10px 0;
    position: relative;
    float: left;
    width: 40%;
}
span.left_65 img{
    border: 2px solid #aaa;
    margin: 5px 15px 10px 0;
    position: relative;
    float: left;
    width: 65%;
}
span.right_30 img{
    border: 2px solid #aaa;
    margin: 5px 0 10px 15px;
    position: relative;
    float: right;
    width: 30%;
}
span.left_people img{
    border: 2px solid #aaa;
    margin:.2em 0 .8em 0;
    position:relative;
    float:left;
    width: 100px;
}
table.width_100{
    width:100%;
}
td.width_15{
    vertical-align:top;
    width:15%;
}
td.width_30{
    vertical-align:top;
    width:30%;
    padding:0 5px;
}
td.width_35{
    vertical-align:top;
    width:35%;
    font-size:80%;
}
td.width_50{
    vertical-align:top;
    width:50%;
}
/* Header styles */
#header {
	clear:both;
	float:left;
	padding:0;
}
#header img{
	width: 100%;
	position: relative;
	margin:0;
	border:none;
	/*border-top: 1px solid #C3D2C3;
	border-bottom: 1px solid #95AF95;
	border-left: 1px solid #C3D2C3;
	border-right: 1px solid #95AF95;
	-moz-border-radius-topright:8px;
	-moz-border-radius-bottomright:8px;
	-moz-border-radius-topleft:8px;
	-moz-border-radius-bottomleft:8px;
	-webkit-border-bottom-right-radius:6px;
	-webkit-border-bottom-left-radius:6px;
	box-shadow: 3px 3px 3px #CCC;
	-moz-box-shadow: 3px 3px 3px #CCC;
	-webkit-box-shadow: 3px 3px 3px #CCC;*/
}
#menu {
	clear:both;
	float:left;
	width:100%;
	margin:0;
	padding:0;
	background:#DDD;
	border-top: 1px solid #C3D2C3;
	border-bottom: 1px solid #95AF95;
	/*border-left: 1px solid #C3D2C3;
	border-right: 1px solid #95AF95;
	border-radius:6px;
	-moz-border-radius:6px;
	-webkit-border-radius:4px;*/
	box-shadow: inset 0px 13px 15px #FFF;
    -moz-box-shadow: inset 0px 13px 15px #FFF;
	-webkit-box-shadow: inset 0px 13px 15px #FFF;
}
#menu ul {
	clear:left;
	float:left;
	list-style: none;
	font-weight:bold;
	font-size:95%;
	margin:0;
	padding:0;
}
#menu ul li {
	display:inline;
	list-style:none;
	margin:0;
	padding:0;
}
#menu ul li a {
	border-right: 1px solid #CCC;
    text-shadow: 0px 1px #FFF;
	display:block;
	float:left;
	margin:0;
	padding: 5px 9px;
	text-align:center;
	color:#5F755E;
	
}
#menu ul li a:hover {
	background:#9ED69E;
    text-shadow: 1px 1px #555;
	color:#fff;
	box-shadow: 0 0 1px 1px #BCFFBC inset, inset 0px -10px 10px #8BBC8B;
	-webkit-box-shadow: 0 0 1px 1px #BCFFBC inset, inset 0px -10px 10px #8BBC8B;
    -moz-box-shadow: 0 0 1px 1px #BCFFBC inset, inset 0px -10px 10px #8BBC8B;
}
#menu ul li a span {
	display:block;
}
/* column container */
.colmask {
	position:relative;	    /* This fixes the IE7 overflow hidden bug */
	clear:both;
	float:left;
	width:100%;			    /* width of whole page */
	overflow:hidden;		/* This chops off any overhanging divs */
	margin:7px 0 0 0;
	background:#D4EACC;		/* background colour */
	padding:0 0 7px 0;
}
/* content container */
.contmask {
	float:left;
	width:400%;			    /* 1/width of  right column% */
	position:relative;
}
/* common column settings */
.colright,
.colmid,
.colleft {
	float:left;
	position:relative;
	border-top:solid 1px #C3D2C3;
	border-left:solid 1px #C3D2C3;
	border-bottom:solid 1px #95AF95;
	border-right:solid 1px #95AF95;/**/
	border-radius:6px;
	-moz-border-radius:6px;
	-webkit-border-radius:4px;
	box-shadow: 0 0 1px 1px #FFF inset, 2px 2px 2px #CCC;
	-moz-box-shadow: 0 0 1px 1px #FFF inset, 2px 2px 2px #CCC;
	-webkit-box-shadow: 0 0 1px 1px #FFF inset, 2px 2px 2px #CCC;
}
.col1,
.col2,
.col3 {
	float:left;
	position:relative;
	padding:0 0 1em 0;	    /* no left and right padding on columns, we just make them narrower instead 
					        only padding top and bottom is included here, make it whatever value you need */
	overflow:hidden;
}
/* 3 Column settings */
.threecol {
    position:relative;
}
.threecol .colleft {
	left:0.75%;			    /* width of the background padding */
	width:25%;			    /* width of left column */
	background-color:#F1F4F1;	    /* left column background colour */
	 /*background-image:url("http://localhost:2896/Energy_Website/images/test_label.gif");
	background-repeat:no-repeat;
	background-position:top; */
}
.threecol .colmid {         /* expressed in terms of left column width */
	left:103%;			    /* 100% of left column + 1%/left mid column % */
	background:#fff;        /* center column background colour */
	width:188%;             /* width of centre column / left column x 100*/
	margin:-1px 0;              /* adjusts for border offset*/	
}
.threecol .colright {       /* expressed in terms of mid column width */
	left:101.6%;			    /* width of the background padding */
	width:53%;			    /* 100/centre column width x width of right column */
	background:#F1F4F1;	    /* left column background colour */
	margin:-1px 0;              /* adjusts for border offset*/
}
.threecol .contmask {
	left:103%;			    /* 100% of right col + 8% extral to clear page */
	background:#D4EACC;        /* background colour */	
	margin:0;
}
.threecol .col1 {
	width:44%;			    /* width of center column content (column width minus padding on either side) */
	right:95%;			    /* 100% plus left padding of center column */
	z-index:1;
}
.threecol .col2 {
	width:23%;			    /* Width of left column content (column width minus padding on either side) */
	right:98.75%;			    /* width of (right column) plus (center column left and right padding) plus (left column left padding) */
	z-index:1;
}
.threecol .col3 {
	width:23%;			    /* Width of right column content (column width minus padding on either side) */
	right:91.7%;			    /* Please make note of the brackets here:
					        (100% - left column width) plus (center column left and right padding) plus (left column left and right padding) plus (right column left padding) */
}
.threecol img{
	width: 100%;
	position: relative;
	margin:0;
}
/* Footer styles */
#footer {
    background:#EEF8EC;
	clear:both;
	float:left;
	width:100%;
	margin:0;
    border-top:solid 1px #C3D2C3;
    /*border-left:solid 1px #C3D2C3;
	border-right:solid 1px #95AF95;
	border-top-right-radius:6px;
	border-top-left-radius:6px;
	-moz-border-radius-topright:6px;
	-moz-border-radius-topleft:6px;
	-webkit-border-top-right-radius:4px;
	-webkit-border-top-left-radius:4px;*/
	box-shadow: 0px -10px 10px #CCC inset;
	-moz-box-shadow: 0px -10px 10px #CCC inset;
	-webkit-box-shadow: 0px -10px 10px #CCC inset;
}
#footer p {
	padding:3px;
	margin:0;
	white-space:nowrap;
}
#footer a {
	padding:6px;
	font-weight:bold;
}
#footer h2 {
    padding:0 5px 0 0;
    margin:0;
	text-align:right;
    font-size:large;
}
img#background  {
    position:absolute;
    clear:left;
    width:100%;
    z-index:+1;
    left:0%;
    bottom:0%;
	border-top-right-radius:6px;
	border-top-left-radius:6px;
    -moz-border-radius-topright:6px;
	-moz-border-radius-topleft:6px;
	-webkit-border-top-right-radius:4px;
	-webkit-border-top-left-radius:4px;
}
