/********* RESET CSS *************/

body, html {
margin:0;
padding:0;
width:100%;
}

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	background: transparent;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}

/* remember to define focus styles! */
:focus {
	outline: 0;
}

/* remember to highlight inserts somehow! */
ins {
	text-decoration: none;
}
del {
	text-decoration: line-through;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}




/********* Basic styles *************/

a, a:visited, a:active {
color: #007AB3;	
text-decoration:none;
}

a:hover {
	color: #EF7D0B;
}

#container {
	margin:20px auto;
width:950px;
}

#header {
width:950px;
height:85px;
}

#header #logo {
	width:190px;
	height:85px;
	background: #fff url(../_img/logo.gif) center center no-repeat;
	float:left;
}

#header #logo a {
	width:190px;
	height: 85px;
	display:block;
}

#header #img-area {
	width:760px;
	height:85px;
	background: url(../_img/header-home_1.jpg) no-repeat center center;
	float:left;
}

#demonstration-projects #header #img-area {
	width:760px;
	height:85px;
	background: url(../_img/header-home.jpg) no-repeat center center;
	float:left;
}

#dutch-water-sector #header #img-area {
	width:760px;
	height:85px;
	background: url(../_img/header-youronestopshop.jpg) no-repeat center center;
	float:left;
}

#contact-us #header #img-area {
	width:760px;
	height:85px;
	background: url(../_img/header-contact.jpg) no-repeat center center;
	float:left;
}

#participants #header #img-area {
	width:760px;
	height:85px;
	background: url(../_img/header-participants.jpg) no-repeat center center;
	float:left;
}


#top-area {
	position:relative;
	height:78px;
	width:950px;
}

#top-area #colorblock {
	float:left;
	width:190px;
	height:78px;
	background-color:#007ab3;
}

#top-area #navigation {
	float:left;
	width:570px;
	height:78px;
	background:#EF7D0B;
}

#top-area #holland-logo {
	width:190px;
	height:78px;
	background:#fff url(../_img/holland.jpg) no-repeat center center;
	float:left;
}

#content {
	width:950px;
}

.content-block {
float:left;
padding-bottom:50px;
background:url(../_img/border-bottom.gif) no-repeat bottom left;
}

#content .left-area {
width: 190px;
float:left;
}

#content .left-area img {
margin-top:130px;	
}

#content .mid-area {
width: 570px;
float:left;
}

#content #right-area {
width:190px;
background:#007AB3;
float:right;
padding-top:50px;
}

h1 {
margin:50px 10px 0 10px;
font-family: Arial, Helvetica, sans-serif;
font-size:16px;
font-weight:bold;
line-height:18px;
color: #007AB3;
}

.mid-area p {
padding:10px 40px 10px 10px;
font-family: Arial, Helvetica, sans-serif;
font-size:12px;
line-height:18px;
color: #333;
}

.mid-area h3 {
padding:10px 40px 10px 10px;
display:block;
font-family: Arial, Helvetica, sans-serif;
font-size:18px;
font-weight:bold;
line-height:18px;
color: #EF7D0B;
}

.mid-area li {
	font-family: Arial, Helvetica, sans-serif;
font-size:12px;
line-height:18px;
color: #333;
list-style: square;
color: #007AB3;
margin:0 25px 3px;
}

.ul-styled {
margin-top:10px;	
}

#content .mid-area .ul-styled li, #content .mid-area ul li{
	color: #333333 !important;
	}

#contact-us .mid-area li {
	font-family: Arial, Helvetica, sans-serif;
font-size:12px;
line-height:18px;
color: #333;
margin-left:0px;
margin-right:0px;
color: #333333;
margin-bottom:0px;
margin-top:0px;
}


.mid-area strong {
color: #007AB3;
font-size:13px;
line-height:30px;

}

/* photos right */

#home #right-area .photo-right {
	background:url(../_img/home-right-photo.jpg);
	width:190px;
	height:200px;
}

#demonstration-projects #right-area .photo-right {
	background:url(../_img/demonstration-projects-right-photo.jpg);
	width:190px;
	height:200px;
}


.clear {
clear:both;
display:none;
height:1px;
}

.stripe {
background: #F2F8F9 url(../_img/border-bottom.gif) no-repeat bottom left;	
}




/* formulier */

form {
width:540px !important;
}

.form-generated label {
	font-style: italic;
font-size:12px !important;	
}

.form-generated form ul {
width:540px;
}

.form-generated form ul li {
width:540px;
}

.form-generated label {
padding:0px 10px;
width: 310px;
}

.form-generated fieldset fieldset label.error {
margin-left:0px !important;
width:200px !important;
}		

	
.form-generated .text, 
.form-generated .button,
.form-generated .group,
.form-generated .control,
.form-generated .submit,
.form-generated textarea,
.form-generated select {
	width: 250px !important;
	font-family: Arial, Helvetica, sans-serif;
}
		

/*** FIELDSETS AND LEGENDS ***/

#contact-us .content-block {
padding-bottom:0px;	
background: #fff !important;
}

.form-generated fieldset {
margin: 0 0 1.5em 0;
padding: 0 0 10px 0px;
border: 1px dotted #888;
border: 1px solid #BFBAB0;
background-color: #F2EFE9;
background-color: #fff;
width: 100%;	
}
	
.form-generated fieldset.submit {
padding: 0px 10px 10px 190px;
border-style: none;
		
background-color: transparent;
background-image: none;
		
float: none;
width: auto;
}
	
.form-generated legend {
color: #000000;
font-size:1.3em;
font-weight: bold;
font-variant:small-caps;
margin-left: 1em;
padding:0px 5px;
}
		
.form-generated fieldset p{
margin:10px 0px 0px 10px;
}
	
/*** FORM BLOCKS ***/

.form-generated form ul.controls{

list-style: none;
margin-top:5px;
}
	
.form-generated form ul.controls li{
width: 100%;
background: #EFF4F6;	
margin: 2px 0 2px 0 !important;
padding:4px 0px 4px 0;

		
display:block;
float: left;
clear: left;
}

.form-generated textarea {
width:200px;
height:70px;
padding: 4px !important;
}
	
.form-generated form ul.controls li:first-child	{
		border:none;
}


	
/*** FORM BLOCK ELEMENTS ***/

.form-generated label{
padding:0px 10px;
width: 250px;
float: left;
}

		
.form-generated label.info{
font-size: 100%;
font-weight: bold;
font-variant:small-caps;
		
margin:8px 0px 0px 180px;
padding:3px 0px 0px 5px;
}

.form-generated fieldset fieldset, .form-generated .group {
width:200px;
		
margin: 0;
border:none;
	
background:none;
		
float:left;
clear: none;
}
		
.form-generated fieldset fieldset label {
width:auto !important;
white-space:nowrap;
padding:0px;
margin:0px;
display:block;
clear:both;
}
		
.form-generated label label.error{
margin-left:0px;
}

.form-generated label.centered,
.form-generated label.text{
padding:0px 0px;
width:330px !important;
}
		
	
.form-generated fieldset fieldset label.spaced{
margin-bottom:3px;
}

/*** FORM ELEMENT COLUMNS ***/

.form-generated .col-1,	.form-generated fieldset fieldset.col-1 label {
width:100%;
}

.form-generated .col-2,	.form-generated fieldset fieldset.col-2 label	{
width:50%;
}

.form-generated .col-3,	.form-generated fieldset fieldset.col-3 label	{
width:33%;
}

.form-generated .col-4,
fieldset fieldset.col-4 label {
width:25%;
}

/*** FORM ELEMENTS ***/

.form-generated input.submit{
margin:10px 0px 10px 180px;
padding:0px 2px;
}

.form-generated input, .form-generated textarea, .form-generated select, .form-generated label{
font-size:1.2em;
line-height:1.6em;
}

.form-generated input, .form-generated textarea, .form-generated select {
	background: #fff ;
	border-top:1px solid #dadfe5;
	border-right:1px solid #e2e7ed;
	border-bottom: 1px solid #e3e9ef;
	border-left:1px solid #e3e8ee;
	font-size:11px;
	padding:4px;
}

.form-generated .input[type="text"], .form-generated textarea {
padding:1px;
}
		
.form-generated .input[type="radio"], .form-generated .input[type="checkbox"] {
margin:0px;
padding:0px;
position:relative;
top:3px;
}
		
.form-generated optgroup{
margin-bottom:5px;
padding:5px 0px 2px 5px;
}
.form-generated optgroup option{
padding:2px 20px;
}
		
/*** SUPPORTING CLASSES ***/

.form-generated .clear{
clear:both;
}
		

.form-generated .button {
	background: #EF7D0B;
	color: #fff ;
	width:110px !important;
	border:0;
/*	border-bottom: #EF7D0B solid 1px;
	border-right: #EF7D0B solid 1px;
	border-top: #EF7D0B solid 1px;
	border-left: #EF7D0B solid 1px;*/
	font-weight:bold;
}

.button-contact {
background: #fff !important;	
}

.form-generated input.submit {
margin-left:380px !important;
}		

.form-generated .centered{
margin-left:429px !important;
width:100px !important;
}

/* contact us styles */

#contact-us #content #right-area {
}

#contact-us #right-area p {
font-family:Arial, Helvetica, sans-serif;
font-size:11px;
color: #e5edf0;
padding:10px 20px 10px 20px;
line-height:17px;
}

#contact-us #right-area strong {
	padding:20px 20px 0px 20px;
font-size:14px;	
display:block;
font-family:Arial, Helvetica, sans-serif;
color: #fff;
}

#contact-us #right-area a {
color: #fff;
}

#contact-us #right-area a:hover {
text-decoration:underline;	
}

/* taskforce water styles */

.taskforce-water #content #right-area {
	padding-bottom:25px;
}

.taskforce-water #right-area p {
font-family:Arial, Helvetica, sans-serif;
font-size:11px;
color: #dfecf6;
padding:10px 20px 10px 20px;
line-height:17px;
}

.taskforce-water #right-area strong {
	padding:0px 0px 0px 0px;
font-size:14px;	
display:block;
font-family:Arial, Helvetica, sans-serif;
color: #dfecf6;
}

.taskforce-water #right-area a {
color: #fff;
}

.taskforce-water #right-area a:hover {
text-decoration:underline;	
}

.c-block {
margin: 0 0 0 10px !important;	
}

.c-block ul{
padding: 0 !important;
margin:0 5px 0 0px;
border:0;
list-style:none !important;
width:48%;
float:left;
}

.c-block ul li {
clear:left;
float:left;
list-style:none !important;
background:#EFF4F6 none repeat scroll 0 0;
display:block;
margin:2px 0 !important;
padding:4px 0 4px 0px;
width:100%;
}

#participants .c-block ul li label {
float:left;
display:block;
color: #000;
padding-left:10px;
font-size:11px;
border:0px solid red;
width:80px;
}

.c-block ul li label {
float:left;
display:block;
color: #000;
padding-left:10px;
font-size:11px;

}

/*
#participants .c-block ul li em {
display:block;
float:left;
padding-right:15px;
width:145px;
font-style:normal;
}*/


.c-block ul li em {
display:block;
float:right;
padding-right:15px;
width:155px;
font-style:normal;
}

.c-block ul li em a {
color: #EF7D0B;	
}




.c-block .pers-contact {
	width:97% !important;
}

.c-block .pers-contact li em {
display:block;
/*float:right;*/
/*padding-right:15px;*/
padding-left:30px;
float:left;
width:290px/*;auto !important*/;
font-style:normal;

}

.img-content {
margin: 10px 10px 10px 0;
float:left;
clear:left;
}

#language {
position:absolute;
margin-left:480px;
margin-top:10px;
width:100px;
}
#language ul {
	width:100px;
}
#language ul li {
float:left;	
font-family:Arial, Helvetica, sans-serif;
color: #fff;
font-size:11px;
margin:0 2px 0 2px;
}
#language ul li a {
	color: #fff;
}
#language ul li a:hover {
text-decoration:underline;	
}

.en .en {
font-weight:bold;	
}

.cn .cn {
font-weight:bold;	
}

#colofon a {
background:transparent url(http://www.ango.nl/_img/puntnl_colofon_off.gif) no-repeat scroll 0 50%;
display:block;
height:36px;
width:55px;
}
#colofon a:hover {
background:transparent url(http://www.ango.nl/_img/puntnl_colofon_on.gif) no-repeat scroll 0 50%;
}
#colofon i {
display:none;
}