/*
Theme Name: Kooltec Ltd
Theme URI: http://www.kooltec.com
Description: Kooltec theme, design by Boosh Media ltd	
Version: 1.0
Author: Dan Sunderland, Jon Watkins
Author URI: http://www.boosh-media.co.uk
Tags: blue, jQuery header, business website, small business, air conditioning, cold
*/

/*Webkit button animation*/
@-webkit-keyframes buttonPulse {
from { background-color: #bbb; -webkit-box-shadow: 0 0 9px rgba(56, 176, 222, 0.2); }
50% { background-color: #ccc; -webkit-box-shadow: 0 0 18px rgba(56, 176, 222, 0.3); }
to { background-color: #bbb; -webkit-box-shadow: 0 0 9px rgba(56, 176, 222, 0.2); }
}

/*HTML Tags*/
body
{
margin: 0px;
font-family: Century Gothic, Apple Gothic, sans-serif;
min-height: 100%;
}

a
{
text-decoration: none;
color: #0099cc;
padding: 1px;
}

a img 
{
border: none; 
}

h2
{
font-size: 30px;
margin: 5px 5px;
color: #036;
}

h3
{
font-size: 24px;
font-weight: bold;
margin: 5px 0px;
}

blockquote
{
color: #036;
width: 175px;
height: 90px;
-moz-border-radius-topleft: 8px;
-webkit-border-top-left-radius: 8px;

-moz-border-radius-bottomright: 8px;
-webkit-border-bottom-right-radius: 8px;
padding: 5px;
float: left;
margin-left: 25px;
font-weight: bold;
}

textarea
{
resize: none;
}

/*End HTML Tags*/

/*Style classes*/
.strong
{
font-weight: bold;
}

.hide
{
display: none;
}
/* End Style classes*/

/*Structural divs*/

.container
/*Container class is used to position all elements on 
the page centrally, as all body divs are 100% width*/
{
margin: 0px auto;
position: relative;
width: 1040px;
}
/*End Structural divs*/

/*Header*/

#header
{
height: 265px;
width: 100%;
background: url(images/header_bg1.png) repeat top;
margin: 0px;
}
	#header img
	{
	margin-top:50px;
	}
	#snowflake
	{
	/*start animation*/
	-webkit-animation-name: spinnerRotate;
	-webkit-animation-duration: 60s;
	-webkit-animation-iteration-count: infinite;
	-webkit-animation-timing-function: linear;
	}
		/* defines spinnerRotate */
		@-webkit-keyframes spinnerRotate {
			from {
				-webkit-transform:rotate(0deg);
			}
			to {
				-webkit-transform:rotate(360deg);
			}
		}
		
	/*end animation*/

	#topbar
	{
	background-color: #006699;
	background-color: rgba(0,0,0, 0.36);
	width: 100%;
	height: 50px;
	font-weight: strong;
	color: #fff;
	font-size: 26px;
	}
		#topbar img
	{
	margin-top:2px;
	}
	#navbar
	{
	background-color: #000033;
	width: 100%;
	height: 40px;
	position: relative;
	margin: 0px;
	z-index:300;
	}
		ul#nav
		{
		list-style: none;
		display: block;
		float: left;
		color: #fff;
		margin: 0px;
		padding: 0px;
		}
		ul#nav li
		{
		float: left;
		margin-left: 15px;
		position:relative;
		}
			ul#nav li a
			{
			display:block;
			height:30px;
			padding-top:10px;
			color:#f5f5f5;
			}

		.dropdown
		{
		background-color: #000033;
		display:none;
		width:205px;
		list-style:none;
		position:absolute;
		margin:0px;
		padding:0px 0px 10px 0px;
		top:40px;
		left:0px;
		z-index:300;
		-moz-border-radius-bottomright: 40px;
		-webkit-border-bottom-right-radius: 40px;
		
		-moz-box-shadow: rgba(0,0,0,0.2) 5px 5px 3px; 
		-webkit-box-shadow: rgba(0,0,0,0.2) 5px 5px 3px;
		}
		
/*End header*/

/*Content*/
#content_wrapper
{
background: url(images/body_bg.png) repeat-x #fff;
min-height: 500px;
margin: 0px;
}

	#content
	{
	float: left;
	width:790px;
	min-height: 390px;
	-webkit-box-shadow: inset rgba(204,204,204,0.9) 3px 3px 3px;
	-moz-box-shadow: inset rgba(204,204,204,0.9) 3px 3px 3px;
	background: url(images/content_bg.png) no-repeat;
	background-image: -webkit-gradient(linear, 0% 0%, 0% 90%, from(rgba(204, 204, 204, 0.5)), to(rgba(1, 1, 1, 0)));
	margin: 45px 15px 45px 0px;
	padding: 10px;
	}
	
		.entry img
		{
		text-align: center;
		margin: 0px 0px 0px 95px;
		-webkit-border-bottom-right-radius: 40px;
		-moz-border-radius-bottomright: 40px;
		
		-webkit-box-shadow: rgba(0,0,0,0.5) 5px 5px 3px;
		-moz-box-shadow: rgba(0,0,0,0.5) 5px 5px 3px;
		
		}
	
#sidebar
{
height: 390px;
width: 180px;
-moz-box-shadow: inset rgba(204,204,204,0.7) 3px 3px 3px;
-webkit-box-shadow: inset rgba(204,204,204,0.7) 3px 3px 3px;
background: url(images/sidebar_bg.png) no-repeat;
background-image: -webkit-gradient(linear, 0% 0%, 0% 90%, from(rgba(204, 204, 204, 0.5)), to(rgba(1, 1, 1, 0)));
float:right;
margin: 45px 0px;
padding: 10px;
border: none;
}
	
	#sidebar img
	{
	/*float: left;*/
	margin: 5px 15px;
	border: none;
	}
	
/* End content*/

/*Home page*/

	.service
	{
	width: 250px;
	background: url(images/footer_item_bg.png) repeat-y right;
	height: 300px;
	float: left;
	text-align: center;
	}

		.homepage_thumb
		{
		float: left;
		margin-left: 40px;
		border: 3px #666 solid;
		-moz-border-radius: 5px;
		-webkit-border-radius: 5px;
		}
/*End home page*/

/* Footer */
#footer
{
width: 100%;
min-height: 510px;
background: url(images/footer_bg.png) repeat-x #333;
float: left;
color: #fff;
}

	#tagline
	{
	width: 100%;
	text-align: center;
	margin-top: 15px;
	/*background: url(images/tagline_bg.png) repeat-x bottom;*/
	border-bottom: 1px #888 solid;
	padding: 5px 0px;
	}

	#write
	{
	height: 400px;
	width: 300px;
	background: url(images/footer_item_bg.png) repeat-y right;
	padding: 2px;
	margin: 5px 0px;
	float: left;
	border-top: 1px #333 solid;
	}

	#quick_contact
	{
	min-height: 400px;
	width: 450px;
	background: url(images/footer_item_bg.png) repeat-y right;
	padding: 2px;
	margin: 5px 5px;
	float: left;
    }
		#quick_contact form
		{
		display: block;
		width: 405px;
		height: 350px;
		margin: 10px 0px;
		padding: 10px;
		-moz-border-radius-bottomright: 30px;
		-webkit-border-bottom-right-radius: 30px;
		background-color: #999;
		background-color: rgba(255,255,255,.25);
		background-image: none;
		background-image: -webkit-gradient(linear, 0% 0%, 0% 90%, from(rgba(204, 204, 204, 0.5)), to(rgba(1, 1, 1, 0)));
		color: #ccc;
		}
		
		#quick_contact input, #quick_contact textarea
		{
		float: right;
		width: 250px;
		-moz-border-radius-bottomright: 10px;
		-webkit-border-bottom-right-radius: 10px;
		resize: none;
		border: none;
		position: inherit;
		}
		
			#quick_contact input:focus
			{
			border: none;
			outline: none;
			}
		
		#quick_contact textarea
		{
		height: 80px;
		}
	
		#quick_contact input#qc_radio
		{
		width: 15px;
		margin-right: 240px;
		}

	#sitemap
	{	
	height: 250px;
	width: 260px;
	padding: 0px;
	margin: 0px;
	float: right;
	text-align: left;
	}
	
		#sitemap ul
		{
		list-style: none;
		}

/*End Footer*/

/*Contact forms*/

	#quote_form, #brochure_form
	{
	width: 450px;
	margin: 10px 0px;
	padding: 10px;
	-moz-border-radius-bottomright: 30px;
	-webkit-border-bottom-right-radius: 30px;
	background: #999;
	background-color: rgba(0,0,0,.5);
	background-image: none;
	color: #ccc;
	}
		#quote_form textarea, #quote_form input, #brochure_form textarea, #brochure_form input
		{
		-moz-border-radius-bottomright: 10px;
		-webkit-border-bottom-right-radius: 10px;
		border: none;
		float: right;
		width: 270px;
		}
		
		#quote_form textarea, .your-message
		{
		width: 100%;
		height:50px;
		margin-bottom: 10px;
		float:left;
		}
		
		input.form_button /*This also applies to the quick contact form button element. Quick hack, sorry*/
		{
		float: right;
		margin: 10px 0px 0px 151px;
		width: 150px;
		-webkit-animation-name: buttonPulse;
		-webkit-animation-duration: 2s;
		-webkit-animation-iteration-count: infinite;
		}
