/* Opmerkingen:

Optimaal voor IE6, IE7 en FireFox.

Met deze opzet schaleert de pagina altijd minimaal 100% in hoogte.
De positionering van de DIV's outer, innerwrap, left, centrecontent, right, header en footer is heel belangrijk.
Daarnaast is de hoogte van de outer van belang: height: 100%; is voor IE6 vereist en min-height: 100%; voor IE7 en FireFox.

De fontgrote wordt relatief gebruikt, zodat het goed schaleert en op elk beeldscherm hetzelfde is.
De basis fontgrote is 10 pixels (62,5%) en wordt aangeroepen in de body. Pas de fontgrote per div aan met 'em'.
1.0em komt overeen met 10 pixels. Houdt rekening met de cascading eigenschap van CSS.

De volgorde/indeling van de CSS komt overeen met de indeling van de site layout. Deze indeling is gekozen omdat het 
zoekmachine vriendelijk is. Eerst wordt de content getoond in de bron en daarna alle andere bestandsdelen van de website.

*/

/* MAC HIDE\*/
html, body {height:100%}
/* END HIDE */

/* ///////////////////////////////////////////////////////////// */

/* BODY */

body {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 62.5%; /* fontgrote is 10 (62,5% van 16); standaard fontgrote in browsers is 16 pixels */
	font-weight: normal;
	font-style: normal;
	color: #000;
	padding:0;
	margin:0;
	text-align:center;
	min-width:1000px; /* for mozilla*/
}

/* ///////////////////////////////////////////////////////////// */

/* ALGEMEEN */

h1 {
	font-size:1.2em; /* x 10 is de fontgrote in pixels */
	color: #cf4344;
	margin: 0px;
}

h2 {
	font-size: 1.4em; /* x 10 is de fontgrote in pixels */
	font-weight: bold;
	color: #ef9528;
	margin-top: 30px;
}

a:link, a:active, a:visited {
	color: #022080;
	text-decoration: underline;
}

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

img {
	border: 0px;
}

div,p  {margin-top:0}/*clear top margin for mozilla*/

/* ///////////////////////////////////////////////////////////// */

/* DIV OUTER */

html>body #outer{height:auto;}

#outer{
	min-height:100%;
	height: 100%;
	width:990px;
	color: #000000;
	text-align:left;
	margin:auto;
	position:relative;
}

/* ///////////////////////////////////////////////////////////// */

/* DIV INNERWRAP */

#innerwrap {/* enables content first */
	position: relative;
	float:left;
	width:900px;
}

/* ///////////////////////////////////////////////////////////// */

/* DIV CONTENT */

#centrecontent {
	width:900px;
	float:right;
	margin-top:280px;
	margin-bottom:20px;
	font-size: 1.2em;
	background: url(/images/splash_back.png) repeat-y;
}

#centrecontent div {
	float: left;
	width: 300px;
  text-align: center;
}

#centrecontent  .image_size {
	width: 300px;
	height: 125px;
}

#centrecontent div div {
	background: #dadada;
	height: 27px;
	width: 100%;
	display: block;
}

#centrecontent .beschrijving {
	background: none;
	line-height: 1.7em;
	margin-top: -17px;
	padding-left: 30px;
	padding-right: 10px;
	width: 260px;
  text-align: left;
}

.swoosh {
	margin-top: 250px;
	_margin-top: 0px;		
}

#cool_de_kikker {
	position: absolute;
	bottom: -5px;
	right: 0px;
}

/* FORMULIER */

form {
	border: 1px solid #878A35;
	background: #C7CA76;
	padding: 0px;
}

form th {
	background: #ef9528;
	color: white;
	padding: 5px;
	font-size: 1.6em;
	text-align: center;
}

form td {
	padding: 2px;
}

form table {
	margin: 0px;
	padding: 0px;
}

form .submit {
	background: #ef9528;
	color: white;
	border: 1px solid  #ef9528;
	font-weight: bold;
}

/* ///////////////////////////////////////////////////////////// */

/* DIV LEFT */

#left {
	display: none;
}

/* ///////////////////////////////////////////////////////////// */

/* DIV RIGHT */

#right {
	position:relative;
	width:90px;
	_width:85px;	
	height: 100%;
	float:right;
	margin-top:240px;
	_margin-top:0px;	
	margin-bottom:20px;
}

#right img {

	position: fixed;
	bottom: 40px;
	margin-left: 10px;		

	_position: absolute;
	_bottom:10px;
}

/* ///////////////////////////////////////////////////////////// */

/* CLEARFOOTER */

#clearfooter {
	width:100%;
	height:47px;
	clear:both
}

/* ///////////////////////////////////////////////////////////// */

/* HEADER */

#header{
	position:absolute;
	top:0;
	left:0px;
	width:900px;
	height:280px;
	background: url(/images/koelairco/header.png) no-repeat;
	z-index:100;
}

#taal_menu {
	position: absolute;
	right: 15px;
	bottom: 173px;
}

#taal_menu img {
	padding-right: 10px;
}

/* DIV HOOFDMENU */

#menu {
	position: absolute;
	top: 114px;
	left: 0px;
	height: 30px;
	width: 900px;
	margin: 0px;
	padding: 0px;
	color: #fff;
	font-size: 1.2em;
	z-index: 900;
}

#menu ul {
	list-style: none;
	padding: 0;
	margin: 0 auto;
	height: 30px;
}

#menu ul li ul {
	list-style: none;
	padding: 0;
	margin: 0 auto;
	width: 180px;
	_width: 130px;	
	padding-left: 0px;
	margin-left: 0px;
	z-index: 100;
	
}

#menu li {
	display: block;
	float: left;
	width: 130px;
	height: 20px;	
	margin: 0;
	padding: 0;
	padding-top: 5px;
	padding-bottom: 3px;
	text-align: center;
	margin-left: 3px;
	text-transform: lowercase;
}

#menu li:hover, #menu li.sfhover {

}

#menu li ul {
	display: none;
}


#menu li a {
	display: block;
	width: 100%;
	padding: 0;
	color: #fff;
	text-decoration: none;
	font-weight: bold;
}

#menu li a:hover {
	color: #000;
}

/* submenu uitzetten + definitie */
#menu ul li ul{
	display: none;
	filter: Alpha(Opacity=80, FinishOpacity=80, Style=1);
	opacity: .8;
	padding-top: 5px;
	padding-bottom: 2px;
	text-transform: lowercase;
	height: auto;
	clear:left;
}

/* submenu aanzetten  */
#menu ul li:hover ul, #menu ul li.sfhover ul {
	display: block;
	margin: 0px;
	padding: 0px;
	padding-top: 3px;
	margin-top: 5px;
	margin-left: 0px;
}

#menu li:hover ul, li.sfhover ul{ 
	display: block; 
		
	*margin-left:-205px;
	*margin-top:2px;
}

/* subsubmenu uitzetten */
#menu ul li:hover ul li ul, #menu ul li.sfhover ul li ul {
	display: none;
}

#menu li li{
	height: auto;
	padding: 0px;
	float: none;
	margin: 0px;
	padding-top: 3px; 
	padding-bottom: 3px;
	padding-left: 7px; 
	background: #ff9999;
	text-align:left;
	border-bottom: solid 1px #fff;
	width: 180px;	
	_width: 123px;
}

#menu li li a {
	text-transform:lowercase;
	font-weight: normal;
	color: #000;
}
#menu li ul li {
	display:block;
	float:none;
}

/* einde menu */

#banner {
	width: 900px;
	height: 121px;
	background: url(/images/koelairco/beeld_airco_home.jpg);
	position: absolute;
	top: 142px;
	left: 0px;
	margin: 0px;
	padding: 0px;
	overflow: visible;
}

#bannertitel {
	position: absolute;
	top: 185px;
	right: 30px;
	font-size: 2.5em;
	color: #fff;
	font-weight:bold;
	letter-spacing: 2px;
}

/* ///////////////////////////////////////////////////////////// */

/* FOOTER */

* html #footer {/*only ie gets this style*/
	\height:29px;/* for ie5 & ie6 */
}
#footer {
	width:900px;
	min-height: 29px;
	clear:both;
	background: url(/images/footer.png) repeat-x;
	left:0;
	bottom:0;
	position: absolute;
	color: #9aa1a4;
	text-align: center;
	padding-top: 18px;
}

#footer_menu a {
	color: #9aa1a4;
	text-decoration: none;
}
