/*------------------------------------------------------------------
						Steven Johnston @ CoCreate
						for
						CoCreate
						18/06/2009

						Version 1.0

						Project: Open House

						**Please annotate amendments and log below**
						--------------------------------------------
						Amendments

						.servicetab changed to individual colours (cms compatability)

						--------------------------------------------
##Designers Notes
-----------------
Colours
-------

--------------------------------------------------------------------*/
*{
    padding:0;
    margin:0;
}
html{
    min-height:100%;
    margin:0 0 1px 0;
}
body{
    background:url("../images/bg_body.jpg") no-repeat #000000 top center;
}
img{
    border:none;
}
/*-------------------------------------------------------------------*/
#wrapper{
    width:985px;
    margin:39px auto 0 auto;    
}
#banner{
    width:985px;
    height:68px;
}
#bannerright{
    float:right;
    width:200px;
    height:68px;
}
#banner img{
    float:left;
}
#tel{
    float:right;
    width:195px;
    height:23px;
    color:#F36E20;
    text-align:right;
    padding:2px 5px 0 0;
}
#content{
    width:985px;
    margin-top:19px;
}
#leftcol{
    float:left;
    width:209px;
}
#mailing{
    width:190px;
    height:77px;
    padding:6px 0 0 15px;
    margin-bottom:6px;
    background:url("../images/bg_join_mailing.png") no-repeat;    
}
#mailing label{
    margin-top:5px;
}
#mailingemail{
    margin-top:5px;
    float:left;
    width:150px;
}
#submitcont{
    margin:8px 0 0 6px;
    float:left;
}
#indexnews{
    width:194px;
    height:215px;
    margin-top:7px;
    padding:5px 0 0 15px;
    background:url("../images/bg_indexnews.png") no-repeat;
}
#indexnews h1{
    margin-bottom:13px;
}
.newsitem{
    margin:4px 0 10px 0;
    width:175px;
    line-height:1.4;
}
#newproduct{
    margin-top:3px;
    width:209px;
}
#newproducttop{
    width:209px;
    height:76px;
    background:url("../images/bg_newproduct_top.png");
}
#newproductdetails{
    width:209px;
    background:url("../images/bg_newproduct_strip.png");
}
#newproductdetails img{
    width:140px;
    margin-left:35px;
}
#newproductfooter{
    width:209px;
    height:9px;
    background:url("../images/bg_services_footer.png");
}
#midcol{
    min-height:300px;
    float:left;
    width:560px;
}
#flash{
    width:538px;
    height:310px;
    margin-left:15px;
}
#maincontent{
    clear:both;
    width:538px;
    min-height:450px;
    margin-left:15px;
    padding-top:8px;
    background:url("../images/bg_maincontent.png");
}
#maincontent h2{
    width:500px;    
}
.contentimgright{
    float:right;
    margin:0 15px 10px 15px;
}
.intro h2, .productitem h2, #newproductdetails h1, .clientinfo h2{
    border-top:1px dotted #F36E20;
    border-bottom:1px dotted #F36E20;
    padding:4px 0 4px 0;    
}
.clientinfo h2{
margin:0 0 10px 0;
}
.intro h2, .productitem h2, #newproductdetails h1{
    margin:14px 0 14px 0;
}
#newproductdetails h1, #newproductdetails p{
    width:171px;
    line-height:1.4;
}
#newproductdetails p{
    margin-left:15px;
}
#newproductdetails a img{
    width:199px;
    height:35px;
    margin:5px 0 0 1px;
}
.intro p{
    margin:10px 0 0 0;
    line-height:1.4;
    width:475px;
}
.productitem h2{
    clear:both;
}
.productitemlinks{
    margin:0 23px 0 0;
    padding-top:10px;
    float:right;
    width:108px;
}
.clientlink{
    margin:0px 23px 0 0;
    float:right;
}
.clientlink img{padding:5px 0 0 0;}
#back{
    float:right;
    margin:2px 23px 0 0;
}
#back a img, #back a{
    float:left;
}
#back a img{
    padding:0;
    margin:0;
    width:10px;
}
#back a{
    padding:0;
    margin:-2px 0 0 6px;
    width:80px;
}
.buynow, .clientlink, #back{
    width:102px;
    height:18px;
    padding:0 0 5px 6px;
    background:url("../images/bg_buy_now.gif");
}
.buynow a img, .clientlink a img{
    margin:0 4px 0 0;
    float:right;
}
.specs{
    width:102px;
    height:35px;
    margin-top:4px;
    padding:5px 0 0 6px;
    background:url("../images/bg_specs.gif");
}
.specs a img{
    margin:15px 4px 0 0;
    float:right;
}
.productitem img{
    float:left;
    margin:5px 0 0 15px;
}
.productitem p{
    float:left;
    width:250px;
    margin:10px 0 0 15px;
    line-height:1.4;
}
#contenttitleshadow{
    width:553px;
    height:61px;
    background:url("../images/bg_title_shadow.png");
}
.contenttitle{
    float:left;
    margin-left:15px;
    padding:5px 0 0 15px;
    width:515px;
    height:56px;
}
#contentbanner{
    margin:0 0 0 15px;
    padding:0;
    float:left;
    width:500px;
}
#maincontentbottom{
    clear:both;
    width:538px;
    height:25px;
    margin:0 0 15px 15px;
    background:url("../images/bg_maincontent_bottom.png");
}
#rightcol{
    padding-left:11px;
    float:left;
    width:205px;
    height:310px;
}
.indexlink, .indexlinkbottom{
    width:205px;
    height:74px;    
    background:url("../images/bg_indexlink.png") no-repeat;
}
.indexlink{
    margin:0 0 5px 0;
}
.indexlinkbottom{
    margin:-1px 0 0 0;
}
.indexlinktop{
    padding:6px 0 0 15px;
}
.indexlinktop img, .linktab img{
    padding:2px 15px 0 0;
    float:right;
}
.indexlinktop p, .linktab p{
    float:left;
}
.linklogo{
    margin:4px 0 0 33px;
}
.linktab{
    width:190px;
    height:34px;
    padding:7px 0 0 15px;
    margin:2px 0 0 0;
    background:url("../images/bg_external_link.png");
}
.whoweworkwithtop{
    width:205px;
    height:55px;
    padding:5px 0 0 0;
    margin:2px 0 0 0;
    background:url("../images/bg_who_we_work_with_top.png");
}
.whoweworkwith{
	width:205px;
	margin-left:0;
	background:url("../images/bg_who_we_work_with.png");
	text-align: center;
}
.whoweworkwith img{
    margin:10px 0 10px 0;
}
.whoweworkwithbottom{
    width:205px;
    height:60px;
    margin-left:0;
    background:url("../images/bg_who_we_work_with_bottom.png");
}
#imageboxtop{
    width:205px;
    height:27px;
    margin:5px 0 0 0;
    background:url("../images/bg_imagebox_top.png");
}
#imagebox{
    width:205px;
    margin:0 0 0 0;
    background:url("../images/bg_imagebox.png");
}
#imagebox img{
    margin:7px 0 7px 10px;
}
#imageboxbottom{
    width:205px;
    height:8px;
    margin:0 0 0 0;
    background:url("../images/bg_imagebox_bottom.png");
}
.clientinfo{
    margin:10px 23px 10px 5px;
    width:500px;
}

.clientinfo .thumb{width:94px; height:61px; margin:0 10px 0; float:left;}

.clientlogo{
    float:left;
    width:94px;
    height:61px;
    margin:10px 0 10px 0;
}
#categories{
    clear:both;
    width:985px;
    padding-top:7px;
}
.category, .categoryright{
    float:left;
    width:101px;
}
.category{
	margin: 4px;
}
.categoryright{

}
.cattop{
    width:101px;
    height:12px;
}
.cattitle{
    width:101px;
    height:44px;
    background:url("../images/bg_cattitle.gif");
}
.cattitle a{
    display:block;
    width:81px;
    padding:6px 10px 4px 10px;
}
.catimg{
    width:101px;
    height:72px;
    background:url("../images/bg_catimg.gif");
}
.catimg img{
    margin:2px 0 0 2px;
}
.catlink{
    width:101px;
    height:23px;
}
.catreflect{
    width:101px;
    height:41px;
    background:url("../images/bg_catreflect.png");
}
#footer{
    clear:both;
    width:980px;
    height:43px;
    background:url("../images/bg_footer.gif") repeat-x;
}
#footerreflect{
    width:980px;
    height:54px;
    background:url("../images/bg_footerreflect.png") repeat-x;
    margin-bottom:50px;
}
.spacer{
    width:1px;
    height:1px;
    clear:both;
}
/*-----------------------------
           Menu
-----------------------------*/
#menu{
    width:980px;
    height:34px;
    border-top:1px solid #FFFFFF;
    border-bottom:1px solid #FFFFFF;
}
#menu ul{
    list-style:none;
}
#menu ul li{
    float:left;
    width:121px;
    padding-top:9px;
    text-align:center;
}
#menu ul li a{
    display:block;
    width:121px;
    height:15px;
    border-right:1px solid #F36E20;
}
#menu ul li.last a{
    border-right:none;
}
/*-----------------------------
       Services Menu
-----------------------------*/
#services{
    width:209px;
}
#servicestitle{
    width:194px;
    height:24px;
    padding:5px 0 0 15px;
    background:url("../images/bg_services_title.png");
}
.serviceitem{
    width:209px;
    height:29px;
    background:url("../images/bg_services_item.png");
    text-decoration:none;
}
.serviceitem:hover{
    background:url("../images/bg_services_item_hover.png");
    text-decoration:underline;
}

.servicetab{float:left;width:6px; height:29px; }
.menu_blue{  float:left;width:6px; height:29px; background:#00ADEF;}
.menu_red{  float:left;width:6px; height:29px; background:#D2232A;}
.menu_green{  float:left;width:6px; height:29px; background:#A7C539;}
.menu_yellow{  float:left;width:6px; height:29px; background:#FAA619;}
.menu_purple{  float:left;width:6px; height:29px; background:#842990;}
.menu_grey{  float:left;width:6px; height:29px; background:#6D6F71;}
.menu_pink{  float:left;width:6px; height:29px; background:#EC008C;}
.menu_dgreen{  float:left;width:6px; height:29px; background:#277E33;}
.menu_royalblue{  float:left;width:6px; height:29px; background:#24408F;}
.menu_lgreen{  float:left;width:6px; height:29px; background:#98FF66;}
.menu_lpurple{  float:left;width:6px; height:29px; background:#9966FF;}
.menu_brown{  float:left;width:6px; height:29px; background:#993400;}
.menu_black{  float:left;width:6px; height:29px; background:#000000;}
.menu_lbrown{  float:left;width:6px; height:29px; background:#FFB061;}
.menu_turquoise{  float:left;width:6px; height:29px; background:#009999;}
.menu_lilac{  float:left;width:6px; height:29px; background:#CC99FE;}
.menu_orange{  float:left;width:6px; height:29px; background:#FAA61A;}

.serviceitem a{
    float:left;
    margin:6px 0 0 9px;
}
#servicesfooter{
    width:209px;
    height:9px;
    background:url("../images/bg_services_footer.png");
}
/*-----------------------------
        Footer Menu
-----------------------------*/
#footerlinks{
    float:right;
    margin:1px 10px 0 0;
    width:350px;
    text-align:right;
}
#footerlinks ul{
    list-style:none;
    text-align:right;
}
#footerlinks ul li{
    text-align:right;
    float:right;
    padding-left:15px;
}
#credits{
    float:left;
    margin:1px 0 0 15px;
}
#credits p{
    padding:4px 0 0 0;
}
/*-----------------------------
       Enquiry Form
-----------------------------*/
#enquiryform, .label, .input, textarea{
    width:275px;
}
.input, textarea{
    margin:5px 0 12px 25px;
    background:#E6E7E8;
    border:none;
    padding:5px;
}
#enquiryform .label, .submit{
    margin-left:25px;
}
/*-----------------------------
           Search
-----------------------------*/
#search{
    float:right;
    width:183px;
    height:36px;
    padding:2px 0 0 5px;
    background:url("../images/bg_search.png") no-repeat;
}
#search p, #searchlabel, #search input{
    float:left;
}
#searchlabel{
    width:45px;
    padding-top:3px;
}
#searchterm{
    width:100px;
    height:15px;
    padding:0 0 0 4px;
    margin:0 5px 0 5px;
}
#submitsearch{
    float:left;
    margin-top:3px;
}
/*-----------------------------
        Typography
-----------------------------*/
body{
    font-family:Verdana,Arial,Helvetica,sans-serif;
}
.bodytitle{font-size:0.9em; color:#F36E20; width:500px; border-top:1px dotted #F36E20; border-bottom:1px dotted #F36E20; padding:4px 0 4px 0; margin:14px 0 14px 0;clear:both;}
.bodycopy{ font-size:0.7em; color:#4E4E4E;margin:0 0 0 15px;line-height:1.4;width:475px; display:block;}
.bodycopy p{margin:0 0 10px 0;}
.bodycopy p a{color:#F36E20; text-decoration:none;}
.bodycopy p a:hover{color:#F36E20; text-decoration:none;text-decoration:underline;cursor:pointer;}

.maincontentbody{padding:0 0 0 10px;}

.clientinfo .textarea{font-size:0.7em; color:#4E4E4E; width:240px; float:left; display:block;}

#tel{
    font-size:17px;
}
#search, #menu ul li a, #footerlinks ul li a, #credits, #maincontent p, .buynow a, .specs a, #newproductdetails p, .clientlink a, #back a, .label{
    font-size:11px;
}
#search, #menu ul li a, #mailing, #indexnews h1, .indexlinktop a, #footerlinks ul li a, #credits, #credits p a, #servicestitle h1, .contenttitle h1, .buynow a, .specs a, .linktab a, .whoweworkwithtop h1, .clientlink a, #back a{
    color:#FFFFFF;
}
#mailing h1, .contenttitle h1{
    font-size:16px;
    font-weight:100;
}
.contenttitle h1{
    font-size:20px;
    font-weight:100;
    letter-spacing:-1px;
}
#mailing label{
    font-size:9px;
}
#indexnews h1, .indexlinktop a, #servicestitle h1, #maincontent h2, #newproductdetails h1, .linktab a, .whoweworkwithtop h1{
    font-size:14px;
}
.category a, .categoryright a, .serviceitem a, #indexnews h1, .indexlinktop p, #servicestitle h1, #maincontent h2, #newproductdetails h1, .whoweworkwithtop h1{
    font-weight:100;
}
.indexnewstitle, .newsitem a, .category a, .categoryright a, #maincontent h2, .productitem p a, #newproductdetails h1, #newproductdetails p a, .label{
    color:#F36E20;
}
.category a, .categoryright a, .serviceitem a{
    font-size:12px;
}
#menu ul li a, .newsitem a, .indexlinktop a, .category a, .categoryright a, #footerlinks ul li a, #credits p a, .productitem p a, .buynow a, .specs a, .serviceitem a, #newproductdetails p a, .linktab a, .clientlink a, #back a{
    text-decoration:none;
}
#menu ul li a:hover, .newsitem a:hover, .indexlinktop a:hover, .category a:hover, .categoryright a:hover, #footerlinks ul li a:hover, #credits p a:hover, .productitem p a:hover, .buynow a:hover, .specs a:hover, .serviceitem a:hover, #newproductdetails p a:hover, .linktab a:hover, .clientlink a:hover, #back a:hover{
    text-decoration:underline;
    cursor:pointer;
}
.indexnewstitle, .newsitem a, .label{
    font-weight:bold;
}
.indexnewstitle, .newsitem p{
    font-size:10px;
}
#maincontent p, #newproductdetails p, .serviceitem a, .newsitem{
    color:#4E4E4E;
}
