/* Start of CMSMS style sheet 'coolashade : coola_homeLayout' */
/*************layout by p.landgraf Updated by Nicola Hastings****************/


body

{ background-color: #FFFFFF ; font-family:Arial, Helvetica, sans-serif ; }


a,
a:link, 
a:active {
   text-decoration: none;
/* css validation will give a warning if color is set without background color. this will explicitly tell this element to inherit bg colour from parent element */
/*color: inherit;*/
color: #F7941E;

}

a:visited {
   text-decoration: none;
}

a:hover {
   text-decoration: none;
color: #F5CE4E;
}





/*******wrapper, center and margin to top********/
#page {
	width: 975px;
	background-color: #FFF2C0;
	
	margin: 15px auto 0 auto;
}



/********Header with logo 975x180px, replace the logo
********* and adjust the height of div) *********
****also styling for the strapline underneath the banner****/
#head {
	height: 183px;
	background-image: url(uploads/coolashade/header.jpg);
	background-repeat: no-repeat;
	background-color: #F7941E;
	padding: 0px 0 20px 0;
	border-top: 7px solid #F7941E;
	color: #D0131E;
	font-weight: bold;
	font-size: 14px;
	
}
#headerTel{ /*---right block of banner strapline---*/
	width: 260px;
	height: 15px;
	vertical-align: middle;
	line-height: 20px;
	margin-top: 184px;
	padding: 0 15px 0 0px;
	float: right;
	text-align: right;
font-size: 12px;
font-weight:normal;
}
#headerEmail{/*---left block of banner strapline---*/
	width: 150px;
	height: 15px;
	vertical-align: middle;
	line-height: 20px;
	margin-top: 184px;
	padding: 0 0px 0 15px;
	float: left;
	text-align: left;
}
#headerEmail a,
#headerEmail a:link, 
#headerEmail a:active {
   text-decoration: none;
/* css validation will give a warning if color is set without background color. this will explicitly tell this element to inherit bg colour from parent element */
color: inherit;
}
#headerEmail a:visited {
   text-decoration: none;
}

#headerEmail a:hover {
   text-decoration: none;
color: #F5CE4E;
}

#headerStrap{/*---middle block of banner strapline---*/
	height: 15px;
	vertical-align: middle;
	line-height: 20px;
	margin-top: 183px;
	padding: 0 0px 0 0px;
	text-align: center;
	
}
#headerStrap h1{
	color: #FFFFFF;
	font-weight: bold;
	font-size: 16px;
	margin: 0;
	letter-spacing: 1px;
}

/*******Wrapper for sidebar and content******/
#content_main {
	display: block;
	position: relative;
border: 1px solid #FFF2C0;
}



/****the sidebar with menu********/
#sidebar {
	float: left;
	width: 190px;
	margin-top: 20px;
    margin-left: 10px;
/* space top and left */
}

/*block to hold images for tel, skype and email*/
#imageMenu{ 
padding: 20px 0 20px 10px;
	width: 160px;
	background-color: #F7941E;
text-align: left;
clear: left;
color: #FFFFFF;
}
#flags{
padding: 0 0 10px 0;
}
#imageMenu img{
margin: 0 0 0px 0;
zoom: 1;
/*float: left;*/
}
#imageMenu p{
margin: 5px 0 10px 0;
font-size: 12px;
font-weight: bold;
}
#imageMenu .bold{
font-weight: bold;
font-size: 18px;
}
#imageMenu a{
color: #FFFFFF;
}
#imageMenu a:hover{
text-decoration: underline;
}
#espana img{
float: left;
zoom: 1;
clear:left;
}

#crossLink{
color: #D0131E;
font-size: 12px;
padding: 0;
margin: 3px 15px 0 0;
float: right;
}
#crossLink a{
color: #D0131E;
}
#crossLink a:hover{
text-decoration: underline;
}

/* a wrapper for the navbox-not used? */
#nav_container {
	width: 170px;
}

/* only a placeholder for the top of background - no image used now*/
#navbox_oben {
	background-color: #F7941E;
	width: 170px;
	height: 32px;
	float: left;
	z-index: 2;

}

/* the container for the menu */
#navbox {
	width: 170px;
	background-color: #F7941E;
	float: left;
	z-index: 1;
}

/* only a placeholder for the bottom of background - no image used now*/
#navbox_unten {
	height: 32px;
	width: 170px;
	background-color: #F7941E;
	float: left;
	z-index: 3;
}

/* this is only the style für the menu, createt to view in browser without cms, you can delete it */
 {* #menue {
	height: 37px;
	width: 170px;
	margin: 0 auto;
	background-image: url(images/menue_button.png);
	background-repeat: no-repeat;
	display: block;
	float: right;
	top: -20px;
	z-index: 4;}
 *} 



/* content with place between logo and content-box*/
#content {
	margin-top: 20px; font-size: 11px; text-align: left;
}

.cool_img {background:url(images/img_bg.jpg) no-repeat; width: 260px, height:176px; text-align:center;}



h1 {font-size:18px; font-weight:bold; color:#D0131E;}

/* placeholder for gontent-background*/
#content_head {
	width: 750px;
	float: right;
	margin-right: 20px;
	
	/*background-image: url(images/content_oben.png);
	background-repeat: no-repeat;*/
	background-color: #FFFFFF;
	height: 22px;
}

/* content-box */
#content_box {
	float: right;
	width: 750px;
	margin-right: 20px;
	background-color: #FFFFFF;
}

/* content-area*/
.content {
	width: 710px;
	margin-left: 20px;
}


/* placeholder for background */
#content_foot {
	width: 750px;
	background-color: #FFFFFF;
	margin-right: 20px;
	float: right;
	height: 34px;
	
}


/*----wrapper for products/adverts underneath content on home page----*/
#advertSpace{
	width: 710px; /*750px minus 40px for padding*/
	margin: 30px 0 0 0;
	padding: 0 20px 0 20px;
}

/*---special offer panel---*/
#specialOffer{
	width: 250px;
	float: right;
background-color: #F5CE4E;
}
#specialOffer h1{
background-color: #03AEEF;
color: #FFF;
font-size: 14px;
font-weight: bold;
padding: 3px 3px 3px 5px;
margin: 0;
}
#specialOffer p{
background-color: #F5CE4E;
padding: 10px 5px 10px 5px;
margin: 0 0 0px 0px;
font-size: 12px;
lineheight: 16px;
}
#specialOffer a{
	width: 250px;
height: 20px;
	font-size: 12px;
	font-weight: bold;
color:#FFF;
}
#specialOffer p.specialText{
background-color: #03AEEF;
padding: 5px 5px 5px 5px;
margin-top: 3px;
text-align: right;
}
#specialOffer p.specialText:hover{
background-color: #D0131E;
}

/*product boxes with links to product pages for home page only*/
#product1{
	width:210px;
margin:0 0 10px 0;
	float:left;
background-color: #03AEEF;
}
#product2{
	width:210px;
float: left;
	margin-left: 10px;
margin-bottom: 10px;
background-color: #03AEEF;
}
#product3{
	width:210px;
	float:left;
clear: left;
background-color: #03AEEF;
}
#product4{
	width:210px;
float:left;
	margin: 0px 0 0px 10px;
background-color: #03AEEF;
}

#product1 h1.productHead,
#product2 h1.productHead,
#product3 h1.productHead,
#product4 h1.productHead{	
	color: #FFFFFF;
	line-height: 18px;
padding: 3px 3px 3px 5px;
	margin: 0;
	font-size: 16px;
	font-weight: normal;
}
#product1 p.productText, 
#product2 p.productText,
#product3 p.productText,
#product4 p.productText{
	color: #FFFFFF;
	margin: 0;
padding: 3px 3px 3px 5px;
	font-size: 12px;
	letter-spacing: 0px;
}
#product1 img,
#product2 img,
#product3 img,
#product4 img{
border:0;
}

#product1:hover,
#product2:hover,
#product3:hover,
#product4:hover{
	background-color: #D0131E;
}
#product1 a,
#product2 a,
#product3 a,
#product4 a{
	color: #FFF;
}

#advert{
	width: 250px;
	float: right;
	margin-top: 10px;
	background-color: #F5CE4E;
	border-bottom: 6px solid #03AEEF;
	clear: right;
}
#advert h2{
	background-color: #03AEEF;
	color: #FFFFFF;
	height: auto;
	line-height: 110%;
	margin: 0;
	padding: 6px 5px 6px 5px;
	font-size: 15px;
	font-weight: bold;
margin: 0;
}
#advertSpace img{
	width: 210px;
	height: 138px;
margin 0;
padding 0;
border: 0;
}

#advertSpace .small{
font-size: 10px;
}
#specialOffer .small{
font-size: 9px;
font-weight: normal;
}
#advert p{
	padding: 6px 5px 6px 5px;
	background-color: #F5CE4E;
font-size: 12px;
	color: #000000;
	line-height: 16px;
margin:0;
}

#advert p a,
#advert p a:link, 
#advert p a:active {
	padding: 0;
   text-decoration: none;
color: #D0131E;
display: inline;
}

#advert p a:visited {
   text-decoration: none;
}

#advert p a:hover{
   text-decoration: none;
color: #FFFFFF;
background-color: #F5CE4E;
display: inline;
}


/* footer */
#footer {
	width: 975px;
        height: 20px;
        color: #ffffff; 
        text-align: center;
        background-color: #F7941E;
	clear: both;
font-size: 12px;
line-height: 20px;
}
#footer a{
color:#FFF;
}
#footer a:hover{
text-decoration:underline;
}

.imgright {
	float:right;
	margin-left:10px; 
	padding: 3px;
border-top:1px solid #C6C6C5;
border-left:1px solid #C6C6C5;
	border-bottom: 3px solid #C6C6C5; 
	border-right: 3px solid #C6C6C5;
}
.imgleft   {
	float:left;
	margin-right:10px;
	padding: 3px;
border-top:1px solid #C6C6C5;
border-left:1px solid #C6C6C5;
	border-bottom: 3px solid #C6C6C5; 
	border-right: 3px solid #C6C6C5;
}
.clearBoth{
clear: both;
height: 1px;
}

/* End of 'coolashade : coola_homeLayout' */