/*------------------------------------------------------------------
						Steven Johnston @ CoCreate
						for
						CoCreate
						10/08/2009

						Version 1.0

						Project: Cool Building Services

						**Please annotate amendments and log below**
						--------------------------------------------
						Amendments


						--------------------------------------------
##Designers Notes
-----------------
Colours
-------
--------------------------------------------------------------------*/
*{
    padding:0;
    margin:0;
}
html{
    min-height:100%;
    margin:0 0 1px 0;
}
body{
    background:#CAEBFC;
}
body.icicle{
    background:url("../images/bg_icicle.gif");
}
body.fan{
    background:url("../images/bg_fan.gif");
}
body.pencil{
    background:url("../images/bg_pencil.gif");
}
body.tool{
    background:url("../images/bg_tool.gif");
}
body.factory{
    background:url("../images/bg_factory.gif");
}
body.basket{
    background:url("../images/bg_basket.gif");
}
body.hat{
    background:url("../images/bg_hat.gif");
}
body.world{
    background:url("../images/bg_world.gif") #CFE3AF;
}
body.at{
    background:url("../images/bg_at.gif");
}
body.plain{
    background:url("../images/bg_plain.gif");
}
img{
    border:none;
}
/*---------------------------
		Structure
-----------------------------*/
#wrapper{
    margin:0 auto 0 auto;
    width:970px;
    padding:15px 0 0 0;
}
#header{
    width:970px;
    margin-bottom:5px;
}
#telno{
    float:right;
    text-align:right;
    width:300px;
    padding:35px 5px 0 0;
}
.menu, .menugreen{
    list-style:none;
}
.bannerflashwide{
    width:965px;
    height:200px;
	padding:5px 0 0 5px;
    background:url("../images/bg_bannerflash_wide.png");
    margin-bottom:5px;
}
.bannerflashnarrow{
	float:left;
	width:849px;
	height:295px;
	background:url("../images/bg_bannerflash_narrow.png");
	margin-bottom:5px;
	padding: 5px 0 0 5px;
}
#bannerlinks{
    float:left;
    width:97px;
    padding:5px 0 0 14px;
}
#bannerlinks a{
    display:inline-block;
    margin-bottom:8px;
}
#bannerlinks img{
    float:left;
    width:97px;
    height:67px;    
}
#content{
    width:1000px;
    margin:0 0 10px 0;
}
#contentleft{
    float:left;
    width:207px;
    margin:0 20px 0 0;
    clear:left;
}
#contentright{
    float:left;
    width:773px;
}
#contenttop, #contentbottom{
    width:743px;
    height:16px;    
}
#contenttop{
    background:url("../images/bg_content_top.png");
}
#contentmiddle{
    width:703px;
    background:url("../images/bg_content_middle.png") repeat-y;
    padding:9px 20px 9px 20px;
    line-height:1.6;
}
#contentmiddle h1{
    clear:both;
    margin-bottom:15px;
}
#contentmiddle p{
    clear:both;
    margin-bottom:15px;
}
#contentmiddle img{
    float:left;
    margin:12px 20px 12px 0;
}
#contentmiddle ul{
    float:left;
    margin:12px 0 12px 0;
    padding:0 0 0 20px;
    list-style:outside;
    width:430px;
}
#contentmiddle .leftcol, #contentmiddle .rightcol{
    float:left;
    width:335px;
}
#contentmiddle .leftcol img, #contentmiddle .rightcol img{
    width:335px;
}
#contentmiddle .leftcol{
    clear:left;
    margin-right:33px;
}
#contentbottom{
    background:url("../images/bg_content_bottom.png");
}
#instantdownload{
    float:left;
    width:202px;
    height:43px;
    margin:10px 0 10px 5px;
    background:url("../images/bg_download.png");
}
#instantdownload a{
	color:#FFFFFF;
	text-decoration:none;
    display:block;
    width:175px;
    height:30px;
    padding:8px 0 0 22px;
}
#contentleft img{
    margin:0 0 0 5px;
}
#contentleft img.contactus{
    margin:0 0 10px 0;
}
.imglink{
    float:left;
    margin:0 0 0 15px;
}
.imglinkleft{
    float:left;
    margin:0;
}
.imglink:hover, #bannerlinks a img:hover{
opacity:.80;
filter: alpha(opacity=80);
-moz-opacity: 0.8;
}
.divbottom{
    clear:both;
    width:1px;
    height:1px;
}
.titleblue, .titlebluenarrow{
    clear:both;    
    height:38px;
    padding:5px 0 0 20px;    
}
.titleblue{
    padding:5px 0 0 20px;
    width:253px; 
    background:url("../images/bg_title_blue.png");
}
.titlebluenarrow{
    padding:0;
    width:140px;
    background:url("../images/bg_title_blue_narrow.png");
}
.titlebluenarrow h2 a{
    display:block;
    height:38px;
    width:120px;
    padding:5px 0 0 20px;
}
.product{
    float:left;
    width:350px;
    height:100px;
}
#contentmiddle .leftcol .product img, #contentmiddle .rightcol .product img, #contentmiddle .product img{
    float:left;
    width:74px;
    margin-right:15px;
}
#contentmiddle img.accreditation{
    width:90px;
}
.producttext{
    float:left;
    width:225px;
}
table{
    float:left;
    width:456px;
}
.label{
    width:150px;
    vertical-align:top;
}
.input{
    width:300px;
    padding:3px;
    border:none;
    background:#DDDDDD;
}
td.input{
    background:none;
    padding:0 0 10px 0;
}
textarea.input{
    height:200px;
}
.submit{
    margin:15px 0 12px 0;
}
#address{
    float:left;
    width:220px;
    margin:0 0 0 25px;
}
#footer{
    width:1000px;
}
#indexice{
    position:absolute;
    z-index:10;
    margin:-75px 0 0 700px;
}
#ice{
    position:absolute;
    z-index:10;
    margin:-30px 0 0 470px;
}
#plant{
    position:absolute;
    z-index:10;
    margin:-200px 0 0 650px;
}
/*---------------------------
        Top Menu
---------------------------*/
#topmenu{
    width:955px;
    height:29px;
    background:url("../images/bg_top_menu.png");
    padding:9px 0 0 15px;
}
#topmenu ul li{
    float:left;
    margin:0 1em 0 0;
    
}
#topmenu ul li.home{
    width:40px
}
#topmenu ul li.about{
    width:70px
}
#topmenu ul li.contact{
    width:80px
}
#topmenu ul li img, #topmenu ul img{
    float:left;
    padding:2px 4px 0 0;
}
/*---------------------------
       Content Menu
---------------------------*/
#contentmenu{
    float:left;
    width:202px;
    margin:0 0 0 5px;
}
#contentmenutop, #contentmenutopgreen{
    width:180px;
    height:33px;
    padding:5px 0 0 22px;    
}
#contentmenutop{
    background:url("../images/bg_menu_top.png");
}
#contentmenutopgreen{
    background:url("../images/bg_menu_top_green.png");
}


#contentmenu ul li{
    width:202px;  
	background:url("../images/bg_menu.png");
	height:33px;  
}

#contentmenu ul li a{
    display:block;
    width:175px;
    padding:6px 0 0 22px;
}


#contentmenu ul li.last{
    height:39px;
	background-image:url(../images/bg_menu_last.png);
}
#contentmenu ul li.greenlast{
    height:39px;
	background-image:url(../images/bg_menu_green_last.png);
}


#contentmenu ul li.green{
    background:url("../images/bg_menu_green.png");
}
#contentmenu ul li.greenlast{
    height:39px;
	background:url("../images/bg_menu_green_last.png");
}


#contentmenu ul li:hover{
    background:url("../images/bg_menu_hover.png");
}
#contentmenu ul li.last:hover{
    background:url("../images/bg_menu_hover_last.png");
}
#contentmenu ul li.greenlast:hover{
    background:url("../images/bg_menu_hover_last.png");
}

/*---------------------------
        Typography
---------------------------*/
#telno p a, #contentmenutop{
    font-family:'Times New Roman',Times,serif;
}
#footer p, #contentmiddle{
    font-family:Arial,Helvetica,sans-serif;
}
.telno, .telnogreen{
    font-size:1.6em;
}
#telno p a, #contentmenu h1, #contentmiddle h1, .titleblue h2, .producttext h3, #address h2{
    font-size:1.15em;
}
#contentleft, #contentmiddle h2.bluetext{
    font-size:1em;
}
#contentmenu h1, #contentmiddle h1, .titleblue h2, .producttext h3{
    font-weight:100;
}
.producttext p a, #address h2{
    font-weight:bold;
}
#contentmiddle{
    font-size:0.75em;
}
#footer p{
    font-size:0.65em;
}
#contentmenutop, #contentmenutopgreen, #instantdownload p a, .titleblue h2, .titlebluenarrow h2 a{
    color:#FFFFFF;
}
#telno p a, .producttext h3, #address h2.blueh2{
    color:#00BBF2;
}
#telno p a.green{
    color:#82C03E;
}
#contentmiddle, #contentmiddle p a{
    color:#3F3F3F;
}
.telno, .menu li a, .menugreen li a,  #footer p, #footer p a, #contentmiddle .producttext p a, #contentmiddle .bluetext, .label{
    color:#243F8E;
}
.telnogreen, #footer p.green, #footer p.green a, .menu li a.green, .menugreen li a.green, .menugreen li a.greenlast{
    color:#2F8C39;
}
#telno p a:hover, .telno:hover, #contentmenu ul li:hover a{
    color:#777777;
}
#telno p a, .menu li a, .menugreen li a, #footer p a, #instantdownload p a, .producttext p a, .titlebluenarrow h2 a{
    text-decoration:none;
}
#telno p a:hover, #footer p a:hover, .producttext p a:hover{
    text-decoration:underline;
}