/*
Style sheet voor www.epc-label.be
Auteur : Bert Stassen
info@epc-label.be

Structuur
1. defaults
2. header
3. banner
4. page-title
5. navigation
6. central-body
7. notfound
8. footer
9. special classes

*/

/*/////////////////////////////////*/
/* --------- 1. defaults --------- */
/*/////////////////////////////////*/

* {
	margin: 0px;	
	padding: 0px;
	}

body {
	color: #555555;
	font-family: "Trebuchet MS", Arial, Sans-Serif;
	background-color: #a9aeb1;
	text-align: center;
	}
	
#wrap {
	background: url("../images/all_dropshadow_left.gif") left top repeat-y; 
	text-align: left;
	width: 900px;
	position: absolute;
	top: 0%;
	left: 50%;
	margin-left: -450px;
	background-color: #ffffff;
	}
	
#body-container {
	background: url("../images/all_dropshadow_left.gif") left top repeat-y; 
	width: 900px;
	}	
	
			h3 {
				padding: 15px 0px 3px 0px;
				font-family: Arial, Sans-Serif;
				font-size: 14px;
				font-weight: bold;
				color: #666666;
				}	

			h4 {
				padding: 15px 0px 0px 0px;
				font-family: Arial, Sans-Serif;
				font-size: 12px;
				color: #666666;
				clear: both;
				}			

			p {
				text-align: justify;
				font-family: Arial, Sans-Serif;
				padding: 2px 0px 10px 0px;
				font-size: 12px;
				line-height: 17px;
				}
			
			.first {
				padding-top: 10px
				}
			
			ul {
				list-style-type: none;
				padding: 0px 0px 15px 0px;
				}
	
			.bullet { 
				display: block; 
				background: url(../images/arrow_blue_small.gif) no-repeat 4px center;
				font-family: Arial, Sans-Serif;
				font-size: 12px;
				line-height: 20px;
				padding: 0px 0px 0px 15px;
				}
			
			ol { 
				display: block; 
				font-family: Arial, Sans-Serif;
				font-size: 12px;
				line-height: 20px;
				padding: 0px 0px 15px 25px;
				}

			a {
				color: #59a5bf;
				}

			.aanvraag-epc {
    			text-decoration: none;
    			background: #59a5bf;  
    			border: none;
    			color: #fff;
    			font-size: 11px;
    			font-weight: 500;
				margin-top: 20px;
				padding: 5px 8px;
				text-transform: uppercase;
				width: auto;
  				}

img {
	padding: 1px;
	border: 5px solid #edede6;
	}

a img {
		border: none;
		}	
	
em {
	font-style: italic;
	}
	
strong {
	font-weight: bold;
	}	

/*/////////////////////////////////*/
/* --------- 2. header ----------- */
/*/////////////////////////////////*/

#header {
	background: url("../images/all_dropshadow_right.gif") right top repeat-y #ffffff; 
	width: 900px;
	height: 91px;
	clear: both;
	}
	
	#logo {
		background: url("../images/all_dropshadow_left.gif") left top repeat-y; 
		float: left;
		padding: 15px 0px 0px 20px;
		}
	
/*/////////////////////////////////*/
/* --------- 3. banner ----------- */
/*/////////////////////////////////*/

#banner {
	background-color: #50a842;
	width: 900px;
	height: 185px;
	clear: both;
	}
	
	#banner-text {
		background: url("../images/all_dropshadow_left.gif") left top repeat-y; 
		float: left;
		width: 500px;
		height: 135px;
		padding: 25px;
		}
		
			#banner-text h1 {
				text-indent: -9999px;
				}
				
			#banner-text h5 {
				padding: 5px 0px 5px 0px;
				margin: 0px;
				font-size: 22px;
				font-weight: bold;
				color: #ffffff;
				}

			#banner-text h6 {
				padding: 0px;
				margin: 0px;
				font-size: 14px;
				font-weight: bold;
				color:#ffffff;
				}

	#banner-links {
		background: url("../images/all_dropshadow_right.gif") right top repeat-y; 
		float: right;
		width: 263px;
		height: 165px;
		padding: 20px 30px 0px 30px;
		}
		
			#banner-links ul{
				list-style: none;
				display: block; 
				padding: 0px;
				margin: 0px;
				}
				
			#banner-links ul li{
				list-style: none;
				display: block;
				height: 29px;
				line-height: 29px;
				}
				
			#banner-links ul li a { 
				height: 29px; 
				display: block; 
				width: 263px; 
				text-decoration: none; 
				color: #d4f0ba; 
				background-image: url('../images/right_nav.gif');
				background-repeat: no-repeat; 
				background-attachment: scroll;
				margin-left: 0; 
				margin-right: 0; 
				margin-top: 7px;
				margin-bottom: 7px; 
				padding-left: 35px; 
				padding-right: 0;
				}
				
			#banner-links ul li a:hover { 
				display: block; 
				width: 263px; 
				text-decoration: none; 
				color: #d4f0ba; 
				background-image: url('../images/right_nav_a.gif');
				background-repeat: no-repeat; 
				background-attachment: scroll; 
				margin-left: 0; 
				margin-right: 0; 
				margin-top: 7px; 
              margin-bottom: 7px; 
              padding-left: 35px; 
              padding-right: 0; 
              padding-top: 0; 
              padding-bottom: 0; 
              background-position: 0px
              }
              
			#banner-links ul li a.current { 
           	height: 29px; 
           	display: block; 
           	width: 263px; 
           	text-decoration: none; 
           	color: #d4f0ba; 
           	background-image: url('../images/right_nav_a.gif');
           	background-repeat: no-repeat; 
           	background-attachment: scroll; 
           	margin-left: 0; 
           	margin-right: 0; 
           	margin-top: 7px; 
           	margin-bottom: 7px; 
           	padding-left: 35px; 
           	padding-right: 0; 
           	padding-top: 0; 
           	padding-bottom: 0; 
           	background-position: 0px
           	}

/*/////////////////////////////////*/
/* --------- 4. page-title ------- */
/*/////////////////////////////////*/

#page-title {
	background: url("../images/all_dropshadow_right.gif") right top repeat-y #ffffff; 
	width: 900px;
	height: 57px;
	clear: both;
	}
	
	#page-title h2 {
		background: url("../images/all_dropshadow_left.gif") left top repeat-y;
		float: left;
		padding: 20px 0 10px 195px;
		font-size: 22px;
		color: #50a842;
		}

/*/////////////////////////////////*/
/* --------- 5. navigation ------- */
/*/////////////////////////////////*/

#navigation {
	background: url("../images/all_dropshadow_left.gif") left top repeat-y; 
	float: left;
	width: 155px;
	clear: left;
	height: 100%;
	padding: 10px 0px 0px 10px;
	}
	
			#navigation ul {
				margin: 0;
				list-style-type: none;
				}
				
			#navigation li {
				background: none;
				padding: 0;
				}				

			#navigation li a {
				font-family: Arial, Sans-Serif;
				text-decoration: none;
				border-bottom: 1px solid #b5c5ce;
				color: #666;
				display: block;
				font-size: 13px;
				font-weight: 800;
				padding-bottom: 1px;
				margin-bottom: 9px;
				}
				
			#navigation li.first a {
				border-top: 0;
				}
			
			#navigation li a:hover {
				text-decoration: none;
				color: #000;
				}
			
			#navigation li.current,
			#navigation li.current a:hover {
				text-deceration: none;
				color: #000;
				}
			
			#navigation li li {
				background: none;
				padding: 0;
				}				

			#navigation li li a {
				font-family: Arial, Sans-Serif;
				background: url(../images/arrow_blue_small.gif) no-repeat 4px center;
				text-decoration: none;
				border-bottom: none;
				color: #59a5bf;
				display: block;
				font-size: 12px;
				font-weight: 700;
				padding: 0px 0px 0px 15px;
				}
					
			#navigation li li a:hover {
				background: url(../images/arrow_black_small.gif) no-repeat 4px center;
				text-decoration: none;
				color: #000;
				}
			
			#navigation li li.current,
			#navigation li li.current a:hover {
				background: url(../images/arrow_black_small.gif) no-repeat 4px center;
				text-decoration: none;
				color: #000;
				}			
	
/*/////////////////////////////////*/
/* --------- 6. central body ----- */
/*/////////////////////////////////*/

#central-body {
	background: url("../images/all_dropshadow_right.gif") right top repeat-y;
	float: left;
	width: 675px;
	padding: 0px 30px 15px 30px;
	}

/* --------- Contact --------------------- */

#small-contact {
	float: right;
	background: #f8f8f8;
	border: 1px solid #b5c5ce;
	width: 238px;
	padding: 0px 10px 10px 15px;
	margin: 15px 0px 20px 20px;
	}

#contact-form {
	float: left;
	background:#f8f8f8;
	border:1px solid #b5c5ce;
	width: 430px;
	padding: 5px 10px 10px 10px;
	margin: 20px 0px 0px 0px;
	}

			.small_form_row{
				float: left;
				width: 400px;
				padding: 4px 0px 4px 0px;
				}
			
			input.contact_input_medium {
				width: 270px;
				height: 18px;
				float: left;
				border: 1px #ced6ec solid;
				background-color: #dbedf3;
				color: #000;
				}
				
			textarea.contact_textarea_medium {
				width: 270px;
				height: 80px;
				float: left;
				border: 1px #ced6ec solid;
				background-color: #dbedf3;
				color: #000;
				}

	
#contactgegevens {
	float: right;
	width: 180px;
	padding: 20px 0px 0px 0px;
	height: 550px;
	}
	
		.contacttel {
			padding: 0px 0px 2px 18px;
			background:url("../images/icon_tel.gif") left 0em no-repeat;
			}
		.contactfax {
			padding: 0px 0px 2px 18px;
			background:url("../images/icon_fax.gif") left 0em no-repeat;
			}
		.contactemail {
			padding: 0px 0px 2px 18px;
			background:url("../images/icon_email.gif") left 0em no-repeat;
			}
		.contactblanc {
			padding: 0px 0px 2px 18px;
			}
		.padding-after{
			padding: 0px 0px 12px 18px;
			}

#aanvraagformulier {
	background:#f8f8f8;
	border:1px solid #b5c5ce;
	width: 900px;
	width: 650px;
	padding: 10px 10px 10px 10px;
	margin: 20px 0px 0px 0px;
	}
			
			.form_row{
				float: left;
				width: 630px;
				padding: 4px 0px 4px 0px;
				clear: both;
				}
				
			label{
				width: 110px;
				float: left;
				padding: 3px 5px 0px 0px;
				font-size: 12px;
				color: #59a5bf;
				text-align: right;
				}
				
			input.contact_input_large{
				width: 150px;
				height: 18px;
				float: left;
				border: 1px #ced6ec solid;
				background-color: #dbedf3;
				color: #000;
				}
				
			input.contact_input_small{
				width: 50px;
				height: 18px;
				float: left;
				border: 1px #ced6ec solid;
				background-color: #dbedf3;
				color: #000;
				}
				
			textarea.contact_textarea_large{
				width: 490px;
				height: 80px;
				float: left;
				border: 1px #ced6ec solid;
				background-color: #dbedf3;
				color: #000;
				}
				
			textarea.contact_textarea_small{
				width: 350px;
				height: 30px;
				float: left;
				border: 1px #ced6ec solid;
				background-color: #dbedf3;
				color: #000;
				}
				
			.send { 
				width: 62px; 
				height: 24px; 
				display: block; 
				background-color: #ced6ec;
				line-height: 22px; 
				color: #ffffff; 
				text-decoration: none;
				float: right; 
				margin: 10px; 
				padding-left: 40px;
				background-position: 0px
				}
				
			.submit { 
    			background: #59a5bf;  
    			border: none;
    			color: #fff;
    			font-size: 11px;
    			font-weight: 500;
				margin-left: 115px;
				padding: 5px 8px;
				text-transform: uppercase;
				width: auto;
  				}	

table {
	border-collapse: collapse;
	margin: 10px 0px 20px 0px;
	}

td {
	padding: 3px 5px;
	font-size: 12px;
	vertical-align: top;
	}

th {
	padding: 5px 10px;
	font-size: 18px;
	font-weight: bold;
	color: #59a5bf;
	}
	
			.table-with-border {
				padding: 5px 0 10px 0;
				border: 1px solid #ced6ec;
				}
	
			.column-header {
				width: 150px;
				}

			.no-border {
				border: none;
				}

			.division-row {
				border: 1px solid #ced6ec;
				background-color: #dbedf3;
				}
	
			.map-list {
				list-style-type: none;
				width: 150px;
				}

			.table-link {
				font-size: 12px;
				color: #777777;
				}

/*/////////////////////////////////*/
/* --------- 7. notfound --------- */
/*/////////////////////////////////*/

#notfound {
	background: url("../images/all_dropshadow_right.gif") right top repeat-y;
	float: left;
	width: 890px;
	padding: 30px 0px 15px 10px;
	}
	
			#notfound p{
				color: #000;
				font-size: 14px;
				font-weight: 700;
				}
			
			#notfound a{
				color: #336699;
				}
				
			#notfound a:hover{
				color: #000;
				}

/*/////////////////////////////////*/
/* --------- 8. footer ----------- */
/*/////////////////////////////////*/

#footer {
	clear: both; 
	width: 100%;
	height: 40px; 
	color: #fff;
	background: url("../images/footer_repeat.gif") left top repeat-x #a9aeb1; 
	}

			.copyright{
				float:left;
				background: url("../images/footer_tl.gif") left top no-repeat;
				padding: 10px 0px 0px 15px;
				}
			
			.footer-links{
				float:right;
				background: url("../images/footer_tr.gif") right top no-repeat;
				padding: 10px 0px 0px 15px;
				}
				
			.footer-links a{
				text-decoration:none;
				color: #fff;
				}
				
			.footer-links a:hover{
				text-decoration:underline;
				color: #fff;
				}

/*/////////////////////////////////*/
/* --------- 9. special classes -- */
/*/////////////////////////////////*/

.float-right {
	float: right;
	}

.float-left {
	float: left;
	}