/*
	Titel:			HB Almelo
	Auteur:			Mark Lindhout (Langdradig)
	Bestandsnaam:	style.css
	Omschrijving:	Dit bestand is onderdeel van het Pia systeem voor HB Almelo op http://www.hb-almelo.nl
*/

/* Standaard CSS */

html, body {
	min-height: 100%;
}

html * {
	margin: 0px;
	padding: 0px;
	font-size: 14px;
	line-height: 150%;
}

body {
	color: #3b3a3a;
	font: 16px Trebuchet, "Trebuchet MS", sans-serif;
	text-align: center;
	background: #fff url(/global_images/bg-shadow.gif) repeat-y center top;
}

body.PopupBody {
	color: #3b3a3a;
	font: 16px Trebuchet, "Trebuchet MS", sans-serif;
	margin: 0px;
	padding: 10px;
}

body.PopupBody ul, body.PopupBody ol {
	margin-left: 30px;
}

a {
	color: #333;
	text-decoration: none;
	outline: none;
}

a:hover {
	color: #121212;
	text-decoration: underline;
}

a#Home {
	width: 180px;
	height: 129px;
	position: absolute;
	margin: 0px 0px 0px -476px;
	left: 50%;
}

h1 {
	margin: 0;
	padding: 0 0px 10px;
	font-size: 20px;
	font-weight: normal;
	font-style: normal;
	color: #fa7a30;
}

h2 {
	margin: 0;
	padding: 0px 0px 10px 0px;
	font-size: 22px;
	font-weight: normal;
	font-style: normal;
	color: #4781ca;
}

/* Basis-elementen om de pagina in zijn vorm te houden */

#Container {
	width: 980px;
	margin-left: auto;
	margin-right: auto;
	padding: 0px;
	text-align: left;
	background-color: #fff;
	height: 100%;
}

#TopBar {
	width: 980px;
	height: 129px;
	background: url(/global_images/top-logo-world.gif) no-repeat center top;
}

#TopBar p {
	padding: 10px 272px 5px 5px;
	text-align: right;
}

#TopBar p a {
	font-size: inherit;
	color: #333;
	text-decoration: none;
	padding-left: 20px;
	padding-right: 10px;
	margin: 0px 3px;
	font-size: 10px;
	border-right: 1px solid #CCC;
}

#TopBar p a:hover {
	text-decoration: underline;
}

#TopBar p a.Nederlands {
	background: transparent url(/global_images/nl.png) no-repeat left center;
}

#TopBar p a.English {
	background: transparent url(/global_images/gb.png) no-repeat left center;
}

#TopBar p a.Deutsch {
	background: transparent url(/global_images/de.png) no-repeat left center;
}

#TopBar p a.Espanol {
	background: transparent url(/global_images/es.png) no-repeat left center;
}

#TopBar p a.Francais {
	background: transparent url(/global_images/fr.png) no-repeat left center;
}

#TopBar p a.Russian {
	background: transparent url(/global_images/ru.png) no-repeat left center;
}

#Page {
	background-repeat: no-repeat;
	line-height: 150%;
	min-height: 350px;
}

#Page #AfbeeldingDefault {
	background: url(/global_images/middle-image-home.jpg) no-repeat left top;
}

#Page #AfbeeldingDryKilns {
	background: url(/global_images/middle-image-dry-kilns.jpg) no-repeat left top;
}

#Page #AfbeeldingDehumidifiers {
	background: url(/global_images/middle-image-dehumidifiers.jpg) no-repeat left top;
}

#Page #AfbeeldingAirconditioning {
	background: url(/global_images/middle-image-airconditioning.jpg) no-repeat left top;
}

#Page #AfbeeldingRefrigeration {
	background: url(/global_images/middle-image-refrigeration.jpg) no-repeat left top;
}

#Page .TitelAfbeelding {
	width: 980px;
	height: 245px;
}

#Page .TitelAfbeelding h1 {
	color: #FFF;
	font-size: 30px;
	text-align: left;
	text-shadow: #302f2e -3px 2px 0;
	height: 100%;
	filter: Shadow(Color=#302f2e, Direction=230, Strength=2);
	opacity: 0.9;
	padding: 15px 0 0 20px;
}

/* drie-koloms layout */

#Page #LeftPage {
	width: 190px;
	float: left;
	padding: 0 10px 0 15px;
	margin: 15px 10px 0 0;
	overflow: hidden;
}

#Page #LeftPage h1 {
	color: #b3b6b6;
	font-size: 14px;
	display: block;
	margin-top: 20px;
	margin-bottom: 0;
}

#Page #LeftPage h1 a {
	color: #b3b6b6;
	font-size: 14px;
	display: block;
	margin-top: 20px;
	margin-bottom: 0;
}

#Page #LeftPage ul {
	list-style-type: square;
	margin: 0 0 0 10px;
	padding: 0px;
	color: #e3e3e3;
	list-style-position: outside;
}

#Page #LeftPage ul li ul{
	list-style-type: square;
	margin: 0 0 0 10px;
	padding: 0px;
	color: #e3e3e3;
	list-style-position: outside;
}

#Page #LeftPage ul li a.ActivePage {
	color: #fa7a30;
	font-weight: bold;
}

#Page #MiddlePage {
	width: 420px;
	float: left;
	border-right: 1px solid #ddd;
	border-left: 1px solid #ddd;
	padding: 0px 10px;
	margin: 15px 10px 15px 0px;
	min-height: 50%;
	overflow: hidden;
}

/* De pagina-opmaak voor het bewerkbare gebied van de website */

#Page #MiddlePage h1 {
	font-size: 18px;
	color: #fa7a30;
}

#Page #MiddlePage h2 {
	font-size: 16px;
	color: #4781ca;
	margin-top: 5%;
}

#Page #MiddlePage h3 {
	font-size: 15px;
	color: #333;
	margin-top: 3%;
	font-weight: bold;
	font-style: normal;
}

#Page #MiddlePage h4 {
	font-size: 14px;
	color: #333;
	margin-top: 3%;
	font-weight: bold;
	font-style: normal;
}

#Page #MiddlePage h5 {
	color: #333;
	margin-top: 3%;
	font-weight: bold;
	font-style: normal;
}

#Page #MiddlePage p {
	margin: 0px 0px 5px 0px;
}

#Page #MiddlePage a {
	text-decoration: underline;
}

#Page #MiddlePage a:hover {
	color: #000;
}

#Page #MiddlePage ul {
	margin: 0 0px 0 10px;
	list-style-position: outside;
	list-style-type: square;
	padding: 5px;
}

/*Nieuwsberichten hebben een paar specifieke items zoals datum en 'terug'-links*/

#Page #MiddlePage .ReadMore {
	display: block;
	padding: 5px 0px;
	margin: 10px 0px 0px 0px;
	border-top: 1px solid #c8cdc6;
}

#Page #MiddlePage .NewsDate {
	float: right;
	display: block;
	padding: 0 0 5px 5px;
	color: #9ea3a0;
}

#Page #MiddlePage form.shortForm { position: relative; margin-top: 20px; border-top: 1px solid #dddddd; }
#Page #MiddlePage form.shortForm ul li { color: #FF0000; }
#Page #MiddlePage form.shortForm fieldset { border: none; }
#Page #MiddlePage form.shortForm fieldset legend { display: none; }
#Page #MiddlePage form.shortForm fieldset p { display: block; vertical-align: top; }
#Page #MiddlePage form.shortForm fieldset p label { display: inline-block; width: 150px; }
#Page #MiddlePage form.shortForm fieldset p span.required { color: #FF0000; }

#Page #RightPage {
	float: right;
	width: 300px;
	background: url(/global_images/rechts-bg-rond.gif) no-repeat right top;
	margin: 0px 0px 10px 0px;
	overflow: hidden;
	text-align: center;
	padding: 70px 0px 0px;
}

#Page #RightPage img {
	max-width: 280px;
	margin-bottom: 20px;
}

#Page #RightPageNews {
	float: right;
	width: 300px;
	min-height: 300px;
	background: url(/global_images/rechts-bg-rond.gif) no-repeat right top;
	padding-top: 60px;
	text-align: left;
}

#Page #RightPageNews ul {
	margin: 0px 40px 0px 20px;
	padding: 0px;
	list-style-position: outside;
	list-style-type: square;
	color: #fa7a30;
}

#Page #RightPageNews ul li {
	border-bottom: 1px solid #ddd;
	padding: 5px;
}

#Page #RightPageNews ul li a {
	color: #444;
	font-weight: normal;
	font-style: normal;
}

#BottomBar {
	position: relative;
	padding: 10px 0px;
	margin: 10px 0px;
	display: block;
	height: 60px;
	background: url(/global_images/simply-better-logo.gif) no-repeat right center;
	border-top: 1px solid #e5e6e2;
}

#BottomBar img.iso { position: absolute; top: 10px; left: 10px; z-index: 10; } 
#BottomBar address { position: relative; margin: 0 auto; padding-top: 40px; font-style: normal; font-size: 12px; color: #aaa; text-align: center; }

#BottomBar ul {
	text-align: center;
	margin-top: 30px;
	color: #ddd;
}

#BottomBar ul li {
	display: inline;
	margin: 0px 5px 0px 0px;
	padding: 0px 10px 0px 0px;
}

#BottomBar ul li a {
	color: #aaa;
	font-weight: normal;
	font-style: normal;
	text-decoration: none;
}

#BottomBar ul li a:hover {
	text-decoration: underline;
}

/* Nieuwsartikelen-kolom op de voorpagina */

#NewsBlock {
	
}

/* Zoekbalk */

#SearchBox {
	text-align: right;
	margin: 3px 3px 0px 3px;
	float: right;
	padding: 0px;
	width: 150px;
	height: 30px;
}

#SearchBox form {
	margin: 0px;
	padding: 0px;
}

#SearchBox input.text {
	color: #333;
	background-color: #FFF;
	border: 1px solid #666;
	padding: 0px 2px;
	margin: 0px;
	font-size: 12px;
	height: 16px;
	width: 90px;
}

#SearchBox input.button {
	padding: 0px;
	margin: 2px;
	font-size: 12px;
	line-height: 16px;
	width: 50px;
	border: 1px outset #6b3c0b;
	background-color: #fbb36e;
	color: #6b3c0b;
}

/* De Sitemap */

ul#sitemap {
	margin: 0px 0px 0px 20px;
	padding: 0px;
}

ul#sitemap li {
	border-bottom: 1px solid #DDD;
	padding: 5px 0px;
}

ul#sitemap li ul {
	padding: 0px;
	margin: 0px 0px 0px 20px;
}

ul#sitemap li ul li {
	border: none;
	border-left: 1px solid #666;
	padding: 0px 0px 0px 10px;
	margin: 0px 0px 0px 10px;
	list-style-type: none;
}

/* Verzendformulier styling */

.form-container {
	width: auto;
	margin: 0px auto;
}

.form-row {
	padding: 5px 10px 15px 5px;
	border-bottom: 1px dotted #666;
	vertical-align: bottom;
}

.form-row p {
	color: #888;
	font-size: 12px;
}

.form-row .required {
	color: #FF0000;
	font-weight: bold;
}

.form-row input {
	padding: 3px;
	margin: 0px;
	width: 100px;
}

.form-row select {
	padding: 3px;
	margin: 0px;
	width: 100px;
}

.form-row textarea {
	padding: 3px;
	margin: 0px;
	width: 97%;
}

input.checkbox {
	padding: 5px;
	margin: 3px;
	width: 20px;
}

input.button {
	font-size: 12px;
	padding: 0px;
	margin: 3px;
	float: right;
	width: 200px;
	height: auto;
}

form span.ico_phone { display: inline-block; width: 26px; background: url(../global_images/ico_phone.gif) left 6px no-repeat; }
form span.ico_fax { display: inline-block; width: 26px; background: url(../global_images/ico_fax.gif) left 6px no-repeat; }
form span.ico_mail { display: inline-block; width: 26px; background: url(../global_images/ico_mail.gif) left 6px no-repeat; }
form span.ico_web { display: inline-block; width: 26px; background: url(../global_images/ico_web.gif) left 6px no-repeat; }

/* Zoekresultaten op de resultatenpagina */

.ZoekResultaat {
	border-bottom: 1px solid #999;
	margin: 7px;
	padding: 7px;
	list-style-type: square;
	list-style-position: inside;
}

.ZoekResultaat strong {
	font-weight: bold;
	text-decoration: none;
}

.ZoekResultaat .vlakkelink {
	font-weight: normal;
	font-style: normal;
	text-decoration: none;
	color: inherit;
}

.ZoekResultaat .vlakkelink:hover {
	text-decoration: underline;
}

.ZoekResultaat .uri {
	clear: both;
	border-top: 1px solid #eee;
	margin-top: 5px;
	padding-top: 5px;
}

/* Popup styling */

div#PopUp {
	text-align: left;
	line-height: 130%;
	color: #000;
}

/* Menu-dropdown CSS */

/*
	This copyright notice must be untouched at all times.
	
	The original version of this stylesheet and the associated (x)html
	is available at http://www.cssplay.co.uk/menus/dd_valid.html
	Copyright (c) 2005-2007 Stu Nicholls. All rights reserved.
	This stylesheet and the assocaited (x)html may be modified in any 
	way to fit your requirements.
*/

/* common styling */

.menu {
	width: 780px;
	background: #fa8e2c url(/global_images/oranje-menubalk.gif) repeat-x;
	z-index: 100;
	line-height: 27px;
	padding: 0px 80px 0px 120px;
}

.menu ul {
	list-style: none;
	height: 27px;
}

.menu ul li {
	float: left;
	position: relative;
	background: transparent url(/global_images/oranje-menubalk-divider.gif) no-repeat left center;
	width: 160px;
}

.menu ul li.lastNode {
	float: left;
	position: relative;
	background: transparent url(images/oranje-menubalk-divider.gif) no-repeat left center;
	width: 220px;
}

.menu ul li a {
	display: block;
	text-decoration: none;
	color: #FFF;
	text-align: left;
	overflow: hidden;
	padding: 0px 10px;
	width: 100%;
	line-height: 27px;
}

.menu ul li ul {
	display: none;
	opacity: 0.90;
	width: auto;
}

.menu ul li ul li {
	background: none;
	clear: both;
	white-space: normal;
	width: 200px;
}

.menu ul li ul li a {
	border-top: 1px solid #111;
	background-color: #333;
	width: auto;
}

/* specific to non IE browsers */

.menu ul li:hover a {
	color: #FFF;
}

.menu ul li:hover ul {
	display: block;
	position: absolute;
	top: 27px;
	left: 0;
}

.menu ul li:hover ul li a.hide {
	background: #333 url(/global_images/menu-pijltje.gif) no-repeat 97% center;
}

.menu ul li:hover ul li:hover a.hide {
	color: #FFF;
	background-color: #fa801a;
}

.menu ul li:hover ul li ul {
	display: none;
}

.menu ul li:hover ul li a {
	display: block;
	color: #FFF;
}

.menu ul li:hover ul li a:hover {
	background-color: #fa801a;
	color: #FFF;
	text-decoration: underline;
}

.menu ul li:hover ul li:hover ul {
	display: block;
	position: absolute;
	left: 100%;
	top: 0px;
}

.menu ul li:hover ul li:hover ul.left {
	
}