/*
-----------------------------------------------
Styles for: C.A.T. Control Systems, Zaandam
Written by: www.tulipdesign.nl, Saskia Verlinden
Date: November-December 2007
-----------------------------------------------
colorset: red #ff0000;
*/

* {padding: 0; margin: 0;}

/* --------font-sizing--------*/

body {font-size: 100%; /*for IE*/}
html>body {font-size: 16px; /* for alle other browsers, IE cannot read this*/}


/* --------fonts and fontsize-------- */

html, body { 
   height: 100%;    /*important for 100% height*/
   font-family: Arial, Helvetica, Verdana, sans-serif;
   background:#fff;
   color: black;
   text-align:center;
}
	   
p, ul, li, form, table, th, td {
   font-family:  Arial, Helvetica, Verdana, sans-serif;
   font-size: 0.85em;
   line-height: 1.3;
   }

p, h1, h2, h3, ol, ul, table, td, th {
   text-align: left;
   }

p, ol, ul {padding: 5px 0 5px 0;}

ol, ul {padding: 15px 0 5px 0;}

ol {margin: 0 0 0 30px;}


h1 {
   font-family:  Arial, Helvetica, Verdana, sans-serif;
   color:  black;
   font-size: 0.9em;
   font-weight: bold;
   margin-bottom: 5px;
   padding: 10px 0 0 0;
   }

h2 {
   font-family: Arial, Helvetica, Verdana, sans-serif;
   color: #BD1417;
   font-size: 0.9em;
   font-weight: bold;
   font-variant: normal;
   padding: 10px 0 0 0;
   }

h3 {
   font-family: Arial, Helvetica, Verdana, sans-serif;
   color: black;
   font-size: 0.85em;
   font-weight: bold;
   font-variant: normal;
   margin-bottom: -5px;
   } 

hr {
   border:0px; /*for Firefox and Opera*/
   border-top:1px solid silver;
   border-bottom:1px solid white; /*for IE*/
   }

.red {color:#BD1417;}



/*--------LINKSTYLING--------*/

a:link {
   color:  #BD1417;
   text-decoration: underline;
   }	

a:visited {
   color: #BD1417;
   text-decoration: underline;  
   }

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

	
/*--------STRUCTUUR--------*/
#main {
   position: relative;
   min-height: 100%;
   height:auto !important; /* 100% height for modern browsers */
   height:100%; /*100% height for IE */
   overflow: auto;
   width:950px;
   top: 0;
   margin: 0 auto;
   text-align: center;
   background: transparent url(../images/bg-wrapper2.jpg) repeat-y left top;
   }

*html #main {overflow: visible;} /*so IE6  behaves for 100% height*/

#wrapper {
width:950px;
margin-left:auto;
margin-right: auto;
padding-top: 137px;
text-align:left;
background: transparent;
}


/*--------header--------*/
#header {
position: absolute;
top:0;
left:0;
background: red url(../images/bg-header.gif) no-repeat center top;                         
width: 100%;
height: 137px;
text-align:center;
margin:0;
}
  

/*--------contentleft--------*/
		
#contentleft {
width:208px;
padding:0;
float:left;
background:transparent;    
}

#contentleft ul {list-style: none;}

#contentleft h2 {
font-size: 0.9em;
color: #BD1417;
font-weight: bold;
padding-bottom:0;
margin-left: -10px;
margin-top:-7px;
}

/*--------navigatie--------*/
#nav {
padding-left: 15px;
}

#nav ul {
padding-top: 0;
padding-bottom: 0;
}

#nav a:link {
color: black;
text-decoration: none;
padding-left: 20px;
}

#nav a:visited {
color: black;
text-decoration: none;
padding-left: 20px;
}

#nav a:hover {
color: #BD1417;
text-decoration: underline;
background: url(../images/V.gif) no-repeat left;
}

#nav li {
padding-left: 20px;
font-size: 1em;
margin-left: -40px;
padding-left: 30px;
line-height: 1.25;
}

#nav li#huidig {
background: url(../images/V.gif) no-repeat left;
margin-left:-10px;
padding:0;
}


#nav li#huidig a {
color: #BD1417;
margin-left:0px;
}



/*--END navigatie--*/

#login {
width:173px;
margin:0 0 0px 0;
background: transparent;
}

#login-background {
background:url(../images/klant-login-center.gif) repeat-y;
padding-bottom:0;
}

#login p {
padding:0 0 5px 13px;
background:url(../images/klant-login-center.gif) repeat-y;
}

#login input {
background:#ececec;
}

#login h2 {
color: #565656;
text-align:center;
padding:10px 0 0 0;
margin:5px 0 0 0;
background:url(../images/klant-login-top.gif) no-repeat top;
}

input#loginButton {
margin:0 0 0 -13px;
padding:0;
background:transparent;
}

#ingelogd {
   border:1px solid red;
   width:180px;
   margin: 10px 0 5px -7px;}

#ingelogd p {
  color: red;
  text-align:center;
  }

/*---adres en vcard styles---*/
.vcard{
font-size:.8em;
color:#767676;
margin-top: 20px;
line-height: 1.5;
}

#nav .vcard a, #nav .vcard a:link,#nav .vcard a:hover {
font-size:1em;
color:#767676;
text-decoration:none;
background: transparent;
padding-left:0;
}

/*---END adres---*/

/*--END content left--*/

/*--------CONTENT CENTER--------*/
	
#contentcenter {
width:650px;
padding: 0px 20px 20px 20px;
float:left;
background:transparent;
margin-bottom:10px;
}

#contentcenter ul {
list-style: outside none none;
}

#contentcenter li {
background: url(../images/V.gif) no-repeat;
padding: 0 0 0 20px;
margin-left: 0 0 0 -40px;
}

ul.OK, ul.OK2 {margin-top: -20px;}

#contentcenter ul.OK li, #contentcenter ul.OK2 li{
font-size: 1em;
background: url(../images/list-style-image.gif) no-repeat;
padding: 0 0 0 20px;
margin-left:0;
} 

/* styles for ul class=OK2 to show correctly besides an image */

ul.OK2 {overflow: hidden; margin-left: 2em;}

* html ul.OK2{ /* for IE6 */
overflow: visible;
height: 1%;
}

ul.OK2 li {
margin-left: 4em;
}
/* END special styles ul class=OK2 */

/* ----special styles for first paragraph---- */
#FirstPar {
border:1px solid #d6d6d6;
background:#fefefe url(../images/bg-par1.jpg) repeat-x left top;
line-height: 1.1;
margin-top: 10px;
}

#FirstPar h2 {
clear:both;
margin-top: -10px;
}

#FirstPar p, #FirstPar h2 {
margin-left: 5px;
margin-right: 5px;
}

#imgFirstPar {
margin: 0 5px 5px;
float:right;
}

#pLast {padding-bottom: 10px;}

#topLeft {
margin: -18px 0 0 -18px;
float:left;
}

#topRight {
margin:-16px -16px 0 0;
float:right;
}

#bottomLeft {
margin: -18px 0 0 -17px; 
float:left;
height:35px;
}

#bottomRight {
margin:-18px -17px 0 0;
float:right;
} 
/*---END first paragraph---*/

p.important { /* styles for important paragraph */
background: #F2F1F1;
padding:5px;
}

h1#bedrijfsnaam {
font-size:1.5em;
padding:0px 10px 10px 0px;
margin-top: -40px;
color: white;
font-weight: lighter;
position: relative;
}

h1#bedrijfsnaam span {color:black}

#imgBrandweer {
margin-top:-137px;
margin-left: 480px;
position:relative;
display:inline-block;
line-height: 1;
}

h1#title {margin-top:-10px}
 
.marktsegmenten1, .marktsegmenten2 {
margin: 10px 6px 0 0;
}

.marktsegmenten1 {
margin-top: -10px;
}

a .marktsegmenten1,a .marktsegmenten2  {
border:none;
}

#contact table, #contact form {
font-size: 1em;
}

.firstcol {
vertical-align: top;
}

/*---referenties---*/
#referenties h2 {
clear:both;
font-size: 0.9em;
margin-bottom: -5px;
margin-top:10px;
border-top:1px solid silver;
}

#referenties img {
float:right; 
margin:5px 0 5px 5px;
width:215px; 
padding-left: 10px;
border-left: 1px solid silver;
}
/*---END referenties*/

/*---special styles FAQ---*/

div#faq {
font-size: 0.85em;
}

ol#faq-to-do li {background-image: none; padding-left:0;}

/*---END special FAQ styles--*/



/*---sitemap---*/
#sitemap ul, #sitemap li li {
font-size: 1em;
padding-top:0;
}

#sitemap li a, #sitemap li a:link {
color: black;
text-decoration:none;
}

#sitemap li a:hover {
color: #BD1417;
text-decoration: underline;
}

#sitemap li li {
background: url(../images/bullet-red.gif) no-repeat;
}


/*---END sitemap---*/


/*--END content center--*/

/*---footer---*/

#footer {
position:absolute;
overflow: hidden;
bottom:0; 
background:transparent;
margin-left:200px;
height:2em;
}

#footer p {
width:672px;
height: 2em;
font-size: 0.75em;
text-align:center;
/* background:transparent url(../images/bg-footer.jpg) top left repeat-x; */
margin-left:6px;
}
	
        
/*--END footer--*/

/*--END STRUCTURE--*/