/**
 * i-Aspect
 * @version: $Id: styles.css 133 2010-06-21 07:29:40Z danielvandebilt $
 */
 
/* Standaard tags
 *****************************************************************************/
	html,body{
		font-family:Arial, Helvetica, sans-serif;
		color: #474747;
		margin:0;
		padding:0
	}
	
	html{ background: url(../img/bg-top.jpg) repeat-x top; }
	
	body{ font-size:62.5%; }
	
	h1,h2,h3{
		font-family: Arial, Helvetica, sans-serif;
		margin: 0;
		padding: 0;
	}
	
	ul, li , ol, p, dl, dd, dt{
		list-style: none;
		margin: 0;
		padding: 0;
	}
	
	a{ color:#474747; text-decoration: underline; }
	a:hover{ text-decoration: none; }
	
	div.contentPortfolio img.no-border {
   	border: none;
	}
	
/* Standaard formulier
 *****************************************************************************/
	.formulier fieldset{ border: 0; }
	.formulier legend{ display: none; }
	.formulier label{
		color: #343434;
		font-family: Arial, Helvetica, sans-serif;
		float: left;
		cursor:pointer;
	}
	.formulier input, .formulier select, .formulier textarea{
		background: #FFF;
		border: 1px solid #d2d2d2;
		color: #343434;
		font-style:normal;
		font-size: 1.2em;
		font-family: Arial, Helvetica, sans-serif;
		padding:0.3em 0.2em;
		margin: 0;
	}
	.formulier button{
		font-family: Arial, Helvetica, sans-serif;
		color: #FFF;
		border: 0;
		cursor:pointer;
		font-weight: bold;
      background: url(../img/button-groen.png) no-repeat top left;
      margin-top: 10px;
      margin-left: -5px;
      font-size: 1.2em;
      padding: 9px 45px 11px 10px;
	}
	.formulier .errorMessage{
      border: 1px solid #bf3734;
      background: #ec9f9f;
   }
   .formulier span#singleErrorMessage{
      font-size: 1.2em; 
      padding-right: 45px; 
      padding-top: 10px; 
      float: right; 
      color:#bf3734;
   }
	.formulier label.errorMessage{display:none; }

/* Body en achtergronden
 *****************************************************************************/
  #top, #topvervolg, #inhoudhome, #inhoudwrapper, #afsluiter, #voet{
      width: 100%;
      position: relative;
      padding: 0;
   }
      .uitlijning{
         width: 980px;
         position: relative;
         margin: auto;
			overflow: hidden;
      }
      .uitlijningHome{
         width: 980px;
         position: relative;
         margin: auto;
      }
   #topvervolg{ margin-bottom: 60px; }
   #top{
      background: url(../img/bg-header.jpg) repeat-x bottom;
      border-bottom: 1px solid #d5d5d5;
   }
   #inhoudhome, #inhoudwrapper{ background: url(../img/bg-intro.jpg) repeat-x bottom; }
   #afsluiter{ background: url(../img/texture-met-schaduw.jpg) repeat center top; }
   #voet{ background: url(../img/texture-zonder-schaduw.jpg) repeat center top; }

/* Logo en hoofd
 *****************************************************************************/
   #hoofd{min-height: 440px; }
   #slimme-pad{display: none; }
	#logo{
		padding-top:3px;
      padding-left: 20px;
      width: 120px;
		z-index:300;
      position:relative;
	}
		#logo a,
		#logo img{ border:0; }
			
      #hoofd h1{
         font-family: arial;
         font-size: 2.6em;
         line-height: 1.2em;
         font-weight: normal;
         color: #252525;
         width: 310px;
         padding: 30px 20px 10px 20px;
      }
         #hoofd h1 span{
            color: #19a840;
            letter-spacing: 0.1em;
         }
      #hoofd h2{
         background:url(../img/caseHome/home-case-whiteline.png) no-repeat left top;
         font-family: arial;
         font-size: 2.0em;
         line-height: 1.2em;
         font-weight: normal;
         color: #5c5d5d;
         width: 310px;
         padding: 27px 20px 8px 20px;
         font-weight:bold;
      }
         #hoofd h2 span{
          color:#19a840;
          font-weight:normal;
         }
      #hoofd p{
         font-size: 1.4em;
         line-height: 1.6em;
         color: #989797;
         padding: 0 20px 10px 20px;
			width: 280px;
      }
      #hoofd span.knop{
         background: url(../img/knop1.png) no-repeat top left;
         width: 188px;
         min-height: 10px;
         float: left;
         padding: 10px 0 0 0;
         margin-top: 20px;
         margin-left: -20px;
      }
         #hoofd span.knop a{
           background: url(../img/knop2.png) no-repeat bottom left;
           color: #FFF;
           font-weight: bold;
           text-decoration: none;
           text-shadow: 0em -0.08em #0f822e;
           font-size: 1.2em;
           width: 105px;
           min-height: 39px;
           display: block;
           padding: 0 35px 0 40px;
         }
		#hoofd #case{
			height:400px;
			width:800px;
			position:absolute;
			top:80px;
			right: 0px;
		}
            .business-associates{
               background:url(../img/caseHome/home-case-business-associates.png) no-repeat;
            }
            .fcutrecht{
               background:url(../img/caseHome/home-case-fcutrecht.png) no-repeat;
            }
            .fcutrecht-mobiel{
               background:url(../img/caseHome/home-case-fcutrecht-mobiel.png) no-repeat;
            }
            .hoogeholt{
               background:url(../img/caseHome/home-case-hoogeholt.png) no-repeat;
            }
            .iaspect{
               background:url(../img/caseHome/home-case-iaspect.png) no-repeat;
            }
            .kanwel{
               background:url(../img/caseHome/home-case-kanwel.png) no-repeat;
            }
            .m24{
               background:url(../img/caseHome/home-case-m24.png) no-repeat;
            }
            .pdf-fw{
               background:url(../img/caseHome/home-case-pdf-fw.png) no-repeat;
            }
            .skishop{
               background:url(../img/caseHome/home-case-skishop.png) no-repeat;
            }
            .stol{
               background:url(../img/caseHome/home-case-stol.png) no-repeat;
            }
            .vsart{
               background:url(../img/caseHome/home-case-vsart.png) no-repeat;
            }
			#hoofd #case a{
				height:400px;
				width:670px;
				display:block;
            margin-left:130px;
			}
				#hoofd #case h2{
					display:none;
				}
				#hoofd #case p{
					display:none;
				}
      #hoofd #filmpje{
      }
         #hoofd #filmpje .bal1{
            background:url(../img/bal1.png) no-repeat;
            width: 105px;
            height: 135px;
            position: absolute;
            top: 180px;
            left: -65px;
            z-index: 20;
         }
         #hoofd #filmpje .ballen{
            background:url(../img/ballen.png) no-repeat;
            width: 72px;
            height: 47px;
            position: absolute;
            top: 220px;
            right: 50px;
            z-index: 5;
         }
         #hoofd #filmpje .schaduw{
            background:url(../img/bg-player-schaduw.jpg) no-repeat;
            width: 600px;
            height: 24px;
            position: absolute;
            top: 300px;
            right: 84px;
            z-index: 5;
         }

/* Diensten op home
 *****************************************************************************/
    #diensten{
      width: 980px;
      background: url(../img/bg-inhoud.jpg) no-repeat bottom left;
      float: left;
      margin-bottom: 40px;
      padding-left: 20px;
   }
      #diensten dt{
         font-size: 1.6em;
         color: #252525;
         padding: 20px 0;
      }
      #diensten dl{ padding-bottom: 40px; }
      #diensten dd{
         background: url(../img/iaspect-bulletje.gif) no-repeat left;
         float: left;
         font-size: 1.4em;
         margin: 0 20px 0 0;
         padding-left: 15px;
      }

/* Inhoud
 *****************************************************************************/
   .inhoud{
      margin-top:10px;
      margin-bottom: 30px;
      background: url(../img/bg-inhoud.jpg) no-repeat bottom left;
   }
   .portfolioPagina .inhoud,
   .casesPagina .inhoud{ background: none; margin-bottom: 0; }
    
   #inhoud{
      float: right;
      width: 650px;
      padding: 0 10px 20px 10px;
      margin-bottom: 30px;
   }
   #inhoudbreed{
      float: left;
      background: url(../img/bg-inhoud.jpg) no-repeat bottom left;
      width: 100%;
      padding: 0 20px;
      margin-bottom: 30px;
   }
      .casesPagina  #cases,
      .portfolioPagina #cases{
         background: url(../img/bg-case-schaduw.jpg) no-repeat bottom center;
         float: left;
         padding-bottom: 35px;
         margin-bottom: 10px;
         padding-left: 0;
      }
      #inhoud h1, #inhoudbreed h1{
         font-size: 2.2em;
         color: #252525;
         margin: 5px 0 20px 20px;
      }
      #inhoudbreed h1{
         margin: 0;
         padding-bottom: 15px;
      }
      
      #inhoud h2.koptekst{
         font-size: 1.8em;
         line-height: 1.6em;
         color: #0d0d0d;
         font-weight: normal;
         font-style: italic;
         background-color:#f8f8f8;
         padding: 20px;
         margin-bottom:20px;
      }
       #inhoud blockquote{
          float: left;
          width: 100%;
          padding: 0;
          margin: 0 0 20px 0;
       }
       
      .redenenPagina #inhoud blockquote{ 
         background: url(../img/werkwijze/10redenen.gif) no-repeat 420px 0px; 
      }
      .pakkettenPagina #inhoud blockquote{ 
         background: url(../img/werkwijze/pakketten.gif) no-repeat 500px 0px; 
      }
      .technologiePagina #inhoud blockquote{
          background: url(../img/werkwijze/technologie.gif) no-repeat 500px 0px; 
       }
      .totaalconceptPagina #inhoud blockquote{ 
         background: url(../img/werkwijze/totaalconcept.gif) no-repeat 360px 5px; 
      }
       
         #inhoud blockquote p{
            float: left;
            font-size: 1.2em;
            line-height: 2.0em;
            color: #474747;
            font-style: italic;
            padding: 10px 20px 10px 20px;
         }
            .redenenPagina #inhoud blockquote p{ width: 380px; }
            .pakkettenPagina #inhoud blockquote p{ width: 450px; }
            .technologiePagina #inhoud blockquote p{ width: 450px; }
            .totaalconceptPagina #inhoud blockquote p{ width: 320px; }

      #inhoud h3{
         color:#474747;
         font-size: 1.4em;
         clear: both;
         padding: 0 20px;
      }
       #inhoud p, #inhoudbreed p{
         font-size: 1.3em;
         line-height: 1.6em;
         padding: 5px 20px 15px 20px;
      }
      #inhoudbreed p{ padding: 10px 0; }
      
     .klantenPagina #inhoud li,
     .vacaturePagina #inhoud li{
         list-style: disc;
         font-size: 1.3em;
         line-height: 1.6em;
         margin: 0 30px 10px 50px;
         padding: 0;
      }
      #inhoud img.rechts{float: right; margin-left: 5px; margin-right: -15px; }
      #inhoud img.links{float: left; margin-top: 5px; margin-right: 15px; }
      #inhoud a, #inhoudbreed a{color: #19a840; }
      #inhoud img.sfeerhearder{
         width: 650px;
         height: 115px;
         margin-top: -10px;
         margin-bottom: 20px;
      }
      #inhoud img.ontwikkeling{ 
         float:left; 
         border:3px solid #f8f8f8;
         margin-top: 10px;
         margin-bottom: 10px; 
      }
            
		#inhoud #filmpje{
         position: relative;
         z-index: 10;
         width: 635px;
         height: 313px;
         left: 70px;
			margin-bottom: 20px;
      }
         #inhoud #filmpje .bal1{
            background:url(../img/bal1.png) no-repeat;
            width: 105px;
            height: 135px;
            position: absolute;
            top: 180px;
            left: -65px;
            z-index: 20;
         }
         #inhoud #filmpje .ballen{
            background:url(../img/ballen.png) no-repeat;
            width: 72px;
            height: 47px;
            position: absolute;
            top: 220px;
            right: 50px;
            z-index: 5;
         }
         #inhoud #filmpje .schaduw{
            background:url(../img/bg-player-schaduw-overons.jpg) no-repeat;
            width: 600px;
            height: 24px;
            position: absolute;
            top: 300px;
            right: 84px;
            z-index: 5;
         }
			
/* Inhoud totaalconcept
 *****************************************************************************/
.totaalconceptPagina #inhoud{margin-bottom: 20px; }
.totaalconceptPagina #inhoud h3{padding-top: 20px; font-size: 1.6em; }
  
/* Inhoud team
 *****************************************************************************/
   #inhoud  ul.team{
      padding-left: 20px;
      width: 100%;
   }
      #inhoud  ul.team li{
         float: left;
         list-style: none;
         width: 130px;
         height: 200px;
         margin: 0 30px 10px 0;
         padding: 0;
      }
         #inhoud  ul.team li img{
            margin:0; 
            padding:0; 
            border: 2px solid #d7d7d7; 
         }
         #inhoud  ul.team li a{
            font-size: 1.2em; 
            display: block; 
            padding: 3px 0; 
         }
         #inhoud  ul.team li em{ font-size: 1.2em; }
            
   #inhoud .profiel{
      float: left;
      width: 350px;
      margin-bottom: 30px;
   }
      #inhoud .profiel img{border: 2px solid #d7d7d7; margin-right: 20px; }
   #inhoud .functie{
       float: right;
       width: 250px;
       margin-bottom: 30px;
    }
      #inhoud .functie h2 { padding-bottom: 10px; }
      #inhoud .functie li{
         background: url(../img/iaspect-bulletje.gif) no-repeat left;
         float: left;
         width: 100%;
         display: block;
         font-size: 1.2em;
         margin: 0 20px 5px 0;
         padding-left: 15px;
      }
      
/* Inhoud profiel nieuws
 *****************************************************************************/
   #inhoud #profielnieuws{
      color: #0d0d0d;
      float: left;
      background-color:#f8f8f8;
      padding: 20px;
      margin-bottom:20px;
   }
      #inhoud #profielnieuws h2{
         font-size: 1.2em;
         padding-bottom: 10px;
      }
      #inhoud #profielnieuws li{
         font-size: 1.2em;
         float: left;
         width: 100%;
         line-height: 1.8em;
      }
         #inhoud #profielnieuws li em{
            padding-right: 10px;
            font-style: normal;
         }
      #inhoud #profielnieuws a.rechts{
         float: right;
         font-size: 1.2em;
         margin: 10px 0;
         padding-right: 20px;
      }

/* Inhoud breed (portfolio, detail + cases)
 *****************************************************************************/
   #inhoudbreed ul.korteinhoud{
      float: left;
      width: 600px;
   }
    #inhoudbreed p.korteinhoud{
      float: left;
      width: 600px;
   }
    #inhoudbreed ul.korteinhoud {
      background: url(../img/bg-cases-korteinhoud.jpg) no-repeat top left;
      min-height: 120px;
      margin-bottom: 20px;
   }
      #inhoudbreed ul.korteinhoud li{
         float: left;
         width: 130px;
         font-size: 1.2em;
         padding: 15px 15px 0px 2px;
			height: 40px;
      }
         #inhoudbreed ul.korteinhoud li em{font-size: 1.0em; }
   
      #inhoudbreed #directContact{
         
         width: 250px;
         margin-top: 20px;
		 margin-bottom: 30px;
      }
      #inhoudbreed #directContact h2{
         background: url(../img/bg-contact-case.jpg) no-repeat bottom right;
         
         width: 250px;
         min-height: 29px;
         font-size: 1.6em;
         color: #0d0d0d;
         padding: 0 0 23px 0px;
         margin: 0 45px 0 0;
      }
      #inhoudbreed #directContact p{
         background: url(../img/bg-contact-case-full.jpg) no-repeat bottom right;
         width: 210px;
         font-size: 1.3em;
         min-height: 80px;
         padding: 10px 20px;
         margin: 0 45px 0 0;
      }
         #inhoudbreed #directContact p em{font-weight: bold; }

/* cases overzicht pagina */
   #caseThumbs img {
       border: none;
       clear: both;
   }

   #caseThumbs a {
      display: block;
      clear: both;
      font-size: 1.2em;
   }

   #inhoudbreed p.case-knop {
      display: block;
      margin: 20px 10px 0px 0px;
      border: 1px solid #159838;
      padding: 6px 10px;
      float: left;
      background: url(../img/bg-navigatie-actief.jpg) repeat-x scroll left top #0F8A32;
      -moz-border-radius: 3px;-webkit-border-radius: 3px;
   }

   span.browse-case {
      position: absolute;
      top: 10px;
      left:418px;
      font-size: 1.3em;
   }

   #inhoudbreed p.case-knop a.external, 
   #inhoudbreed p.case-knop a{
      color: white;
      background: none;
      padding-right: 0px;
      text-decoration: none; 
   }

   #inhoudbreed p.case-knop a.external:hover, 
   #inhoudbreed p.case-knop a:hover{
      text-decoration: underline; 
   }

   #inhoudbreed p.case-knop a.external {
      padding-right: 20px;
      background: url(../img/externe-link-white.gif) no-repeat scroll right center transparent;
   }

   div.volgende-case {
      float: right;
      margin-right: 50px;
   }
      div.volgende-case img {
         margin-bottom: 0px;
         padding-bottom: 0px;
      }
      div.volgende-case h3{
         padding-left: 22px;
         margin-bottom: 25px;
      }

   img.alignRight {
      float: right;
      margin: 0px 0px 20px 20px;
      border: 2px solid #d7d7d7;
   }

   img.alignLeft {
      float: left;
      margin: 0px 20px 20px 0px;
      border: 2px solid #d7d7d7;
   }

/* Inhoud breed portfolio
 *****************************************************************************/
   #inhoudbreed ul#portfolio{
      float: left;
      width: 670px;
      margin-bottom: 30px;
	  border-right:1px solid #EAEAEA;
   }
       #inhoudbreed ul#portfolio li{
         float: left;
         width: 300px;
         margin: 10px 30px 10px 0;
         padding: 0;
       }
          #inhoudbreed ul#portfolio li h2{
            color: #0d0d0d;
            font-size: 1.4em;
            padding-left: 10px;
            margin-bottom: 5px;
          }
          #inhoudbreed ul#portfolio li img{
            border:0;
            background: #333; 
            width: 300px;
            height: 190px;
            margin-bottom: 10px;
         }
         #inhoudbreed ul#portfolio li a{ margin-right: 20px; }
         #inhoudbreed ul#portfolio li span a,
         {
            background: url(../img/externe-link.gif) no-repeat right;
            padding-right: 20px;
         }
         #inhoudbreed ul#portfolio li p{margin: 0 0 5px 0; padding:0 0 0 10px; }
         
/* Inhoud breed klanten
 *****************************************************************************/
   #caseThumbs ul{
      float: left;
      margin-bottom: 30px;
      margin-top: 25px;
   }
      #caseThumbs ul li {
         width: 94px;
         height: 65px;
         display: block;
         float: left;
         text-indent: -5000px;
         margin: 0px 20px 20px 0px;
         padding: 0;
      }

      #caseThumbs ul li {
         background: url(../img/klanten/cases.gif) no-repeat;
         width: 94px;
         height: 65px;
         display: block;
         border: 1px solid #eee;
      }
         #caseThumbs ul li a {
            display:block;
            width: 94px;
            height: 65px;
         }

   #referenceThumbs ul{
      float: left;
      margin-bottom: 30px;
      margin-top: 25px;
   }
      #referenceThumbs ul li {
         width: 94px;
         height: 65px;
         display: block;
         float: left;
         text-indent: -5000px;
         margin: 0px 20px 20px 0px;
         padding: 0;
         background: url(../img/klanten/referenties.gif) no-repeat;
         border: 1px solid #eee;
      }

		#caseThumbs ul li a:hover {
		border: 1px solid #474747;
		}
		
		div.case-logo {
		width: 94px;
		height: 65px;
		background: url(../img/klanten/cases.gif) no-repeat;
		float: left;
		margin-top: 15px;
		border: 1px solid #eee;
		margin-right: 20px;
		}
		
		div#inhoudbreed div.contentPortfolio h3#case-opsomming {
		float: left;
		width: 482px;
		display: block;
		}
		
		/* case afbeeldingen */
		
      #caseThumbs ul li.laplace,
      #referenceThumbs ul li.laplace { background-position: 0px 0px; }

      div.contentPortfolio div.fcutrecht, 
      #caseThumbs ul li.fcutrecht,
      #referenceThumbs ul li.fcutrecht { background-position: 0px -65px; }

      div.contentPortfolio div.bainbusiness, 
      #caseThumbs ul li.bainbusiness,
      #referenceThumbs ul li.bainbusiness{ 
         background-position: 0px -190px; 
      }

      #caseThumbs ul li.versatel a,
      #referenceThumbs ul li.versatel { background-position: -93px 0px; }

      div.contentPortfolio div.kanwel, 
      #caseThumbs ul li.kanwel,
      #referenceThumbs ul li.kanwel { background-position: -90px -128px; }

      #caseThumbs ul li.biretco,
      #referenceThumbs ul li.biretco { background-position: 0px -130px; }

      #caseThumbs ul li.kleingalgenwaard a , 
      #referenceThumbs ul li.kleingalgenwaard { background-position: -93px -65px; }

      .contentPortfolio .stol, 
      #caseThumbs ul li.stol,
      #referenceThumbs ul li.stol { background-position: -90px -321px; }

      div.contentPortfolio div.m24, 
      #caseThumbs ul li.m24,
      #referenceThumbs ul li.m24 { background-position: 0px -321px; }

      div.contentPortfolio div.fcutrechttv, 
      #caseThumbs ul li.fcutrechttv,
      #referenceThumbs ul li.fcutrechttv { background-position: -90px -385px; }

      div.contentPortfolio div.skishopnieuwegein, 
      #caseThumbs ul li.skishopnieuwegein,
      #referenceThumbs ul li.skishopnieuwegein { background-position: -90px -257px; }

      div.contentPortfolio div.fietswereld, 
      #caseThumbs ul li.fietswereld,
      #referenceThumbs ul li.fietswereld { background-position: 0px -257px; }

      div.contentPortfolio div.profile, 
      #caseThumbs ul li.profile,
      #referenceThumbs ul li.profile { background-position: -90px -193px; }

      div.contentPortfolio div.vsart, 
      #inhoudbreed  #caseThumbs ul li.vsart,
      #referenceThumbs ul li.vsart { background-position: 0px -385px; }


   .contentPortfolio{
      float: left;
      width: 620px;
	  border-right:1px solid #EAEAEA;
	  padding-right: 40px;
      margin-bottom: 40px;
   }
      .contentPortfolio h2{
         font-size: 1.6em;
         margin-bottom: 15px;
      }
      .contentPortfolio em{
         font-size: 1.1em;
         color: #515151;
      }
      .contentPortfolio h3, #inhoudbreed h3{
         font-size: 1.5em;
         line-height: 1.6em;
         color: #0d0d0d;
         font-weight: normal;
         font-style: italic;
         background-color:#f8f8f8;
         padding: 10px;
         margin: 15px 0;
      }
	  
	  a.buttonVisitSite img{
	  display: block;
	  border: none;
	  margin-top: 30px;
	  float: right;	
	  }
	  
	  #inhoudbreed h3 {width: 610px;}
	  
      .contentPortfolio a{ color:#27ad4c; }

   .sidebarPortfolio{
      float: right;
      width: 280px;
      margin-bottom: 40px;
   }

/* Inhoud nieuws
 *****************************************************************************/
   #inhoud .laatstenieuws{
      background: #f8f8f8;
      float: left;
      width: 100%;
      font-size: 1.2em;
      padding: 10px 0px 10px 20px;
      margin-bottom: 20px;
   }
   #inhoud .nummers{
      float: right;
      padding: 5px 30px;
   } 
      #inhoud .laatstenieuws em{ line-height: 2.0em; }
      #inhoud .laatstenieuws strong{ padding-right: 10px; }

  #inhoud .laatstenieuws a{
      color: #212121;
      border: 1px solid #d6d6d6;
      text-decoration: none;
      padding: 3px 8px 3px 7px;
   }
      #inhoud .laatstenieuws a:hover{ background: #e0e0e0; }
      #inhoud .laatstenieuws a.actief{
         background: #1aaa41;
         color: #FFF;
         border: 1px solid #d6d6d6;
      } 
   #inhoud ol.nieuws{ margin: 20px 0; }
      #inhoud ol.nieuws li{
         float: left;
         width: 100%;
         padding: 0 0 15px 0;
         margin-left: -15px;
      }
         #inhoud ol.nieuws li h2,
         #inhoud ol.nieuws li p{
            float: right;
            width: 480px;
            padding: 0; 
            margin: 0 8px 0px 10px;
         }
         #inhoud ol.nieuws li h2 a{ color:#474747; line-height: 1.8em; }
         #inhoud ol.nieuws li p{ padding-bottom: 5px; }
            #inhoud ol.nieuws li p strong{
               background: none;
               font-size: 1.0em;
               color: #7f7f7f;
               display: inline;
               float: none;
               padding: 0;
               margin: 0;
             }
          #inhoud ol.nieuws li img{
            float: right;
            width: 75px;
            border: 1px solid #e1e1e1;
            margin-top: -42px;
            margin-right: 0px;
         }
         #inhoud ol.nieuws li img a{ border: 1px solid #e1e1e1; }
         #inhoud ol.nieuws li strong{
            background: #1aaa41 url(../img/bg-nieuws-datum.jpg) repeat-x bottom left;
            font-size: 1.6em;
            line-height: 1em;
            text-align: center;
            color: #FFF;
            display: block;
            float: left;
            width: 44px;
            min-height: 39px;
            padding-top: 5px;
            margin-top: -42px;
            margin-left: 20px;
         }
             #inhoud ol.nieuws li strong em{
               font-size: 80%;
               text-transform: uppercase;
               font-style: normal;
            }

/* Inhoud nieuws item
 *****************************************************************************/
   #inhoud .nieuws .laatstenieuws em{
      color: #19a840;
      font-style: normal;
      padding-right: 5px;
   }
   #inhoud .nieuws .laatstenieuws strong{
      padding-left: 5px;
      padding-right: 0;
   }
      #inhoud .nieuws .laatstenieuws a{
         float: right;
         text-decoration: underline;
         border: 0;
         padding: 0;
         padding-right: 15px;
      }
         #inhoud .nieuws .laatstenieuws a:hover{
            background: none;
            text-decoration: none;
         }
      #inhoud .nieuws img{
         float: left;
         margin: 0 10px 10px 0;
         border: 1px solid #e1e1e1;
      }
       #inhoud .nieuws h2{
         clear: both;
         margin-left: 20px;
      }

/* Inhoud contact
 *****************************************************************************/
   #inhoud .contact{
      float: left;
      width: 100%;
   }
      #inhoud .contact p{
         float: left;
         width: 400px;
      }
      #inhoud .contact h2{
         padding: 0;
         margin: 0 0 0 20px;
         float: left;
      }
      #inhoud .contact span a{
         float: left; 
         font-weight:bold;
         font-size: 1.4em;
         padding: 2px 0 0 10px; 
         margin: 0;
      }
      #inhoud .contact address{
         float: right;
         width: 200px;
         font-size: 1.2em;
         line-height: 1.6em;
         font-style: normal;
      }
      #inhoud .formulier{
         background: #f8f8f8; 
         float: left;
         padding: 10px 0;
         margin-top: 20px;
      }
      
        #inhoud .formulier label{font-weight:bold; font-size: 14px;}
        #inhoud .formulier em{color: #bf3734; font-size: 12px; font-weight:normal; }
      
      #inhoud .formulier p{
         padding: 10px 0 0 30px;
         font-size: 11px;
         margin: 0;
      }
      #inhoud  .formulier fieldset{
         float: left;
         width: 310px;
         padding: 0;
         margin: 0;
      }
      #inhoud .formulier input{ width: 200px; display:block; margin-bottom: 5px;}
      #inhoud .formulier textarea{
         width: 220px;
         height: 170px;
      }
        
      #inhoud .formulier #postcode{ width: 60px; }
      #inhoud .formulier #woonplaats{ width: 130px; }
      #inhoud .formulier button{
         float: right;
         margin-right: 45px;
      }
      
       #inhoud .formulier p.reageren {display:block;float:left; padding-right:20px;}

/* Inhoud support
 *****************************************************************************/
.supportPagina #inhoud .formulier h2{
   padding: 0 30px;
   margin: 0;
}
   .supportPagina #inhoud .formulier h2 span{
      font-size: 12px;
      font-weight: normal;
      color: #bf3734;
      font-style: italic;
   }
      .supportPagina #inhoud .formulier p{
         padding:0 30px;
         margin:0;
      }
         .supportPagina #inhoud .formulier select,
         .supportPagina #inhoud .formulier input,
         .supportPagina #inhoud .formulier textarea{ margin: 5px 30px 15px 30px; }
         
         .supportPagina #inhoud .formulier select{ font-size: 1.4em;font-weight:bold; }
         
            .supportPagina #inhoud .formulier input{
               width: 350px;
            }
   
   .supportPagina  #inhoud .formulier textarea{
         width: 530px;
         height: 100px;
      }
   
      .supportPagina  #inhoud .formulier button{
         float: left;
         background: url(../img/support/button-groen.png) no-repeat top left;
         margin-left: 25px;
        }
        
        .supportPagina  #inhoud .formulier p.uitleg{
            font-size: 11px;
         }
        
             .supportPagina  #inhoud .formulier p.uitleg2{
                float:left;
                clear:both;
                padding-left:30px;
                font-size: 11px;
                padding-top:5px;
                font-style:normal;
             }

/* Inhoud vacature
 *****************************************************************************/
a.vacature-knop {
	display: block;
	margin-top: 20px;
	border: 1px solid #d5d5d5;
	padding: 10px;
	width: 60%;
	background: url(../img/bg-vacature-knop.gif) repeat-x bottom right;
	-moz-border-radius: 3px;-webkit-border-radius: 3px;
	text-decoration: none; 
 }
 
 a.vacature-knop span.underline{
	font-weight: bold;
	text-decoration: underline; 
	color: #19a840;
 }
 
 a.vacature-knop span{
	font-weight: normal;
	color: #474747;
 }
 
 a.vacature-knop:hover {
	border: 1px solid #aeaeae;
 }
			 
			 
/* Extra aan rechterkant
 *****************************************************************************/
   #extra{
      float: left;
      width: 300px;
      border-right: 1px solid #eaeaea;
      margin-bottom: 30px;
   }
      #extra .icoon{
         background: url(../img/icoontjes-extra.png);
         position: absolute;            
         width:50px;
         height:50px;
      }      
      #extra h2{
         font-size: 1.8em;
         padding-left: 50px;
         padding-bottom: 10px;
         padding-top: 5px;
      }

      #extra .twitter.icoon{ background-position: 0px -3px; }
      #extra #showcase .icoon{ background-position: -50px -5px; }
      #extra #nieuwsbrief .icoon{ background-position: -150px -5px; }
      #extra #flickr .icoon{ background-position: -100px -5px; }
      #extra .chat .icoon{ background-position: -50px -5px; }
      #extra .server .icoon{ background-position: -150px -5px; }
      #extra h3{ margin-bottom: 5px; margin-left: 10px; }
         
      .twitter a,
      #showcase a,
      #flickr a,
      #nieuwsbrief a {
         font-size: 12px;
         color: #19a840;
         padding-left: 10px;
      }
      .externelink{
        background: url(../img/externe-link.gif) no-repeat right; 
        padding-right: 20px; 
        color: #19a840;
      }
 
/* Extra: Twitter
 *****************************************************************************/
   .twitter{ padding: 20px; }
   .twitter p{ padding-bottom: 10px; }   
      .twitter ul{
         list-style: none;
         padding: 0;
      }
      .twitter li{
         font-size: 1.2em;
         padding-bottom: 20px;
         position: relative
      }
         .twitter li .twitterPrefix{
            position: absolute;
            bottom: 20px;
            left: 30px;
            font-size: 0.9em;
         }
         .twitter li .twitterStatus{
            line-height: 1.6em;
            background: #f0f0f0;
            display: block;
            padding: 10px 8px;
            margin-bottom: 0px;
         }
            .twitter li .twitterStatus a{ color: #19a840; padding: 0; }
         .twitter li .twitterTime{
            background: url(../img/twitter-quote.png) no-repeat 10px 0;
            padding-left: 100px;
            font-weight: normal;
         }

/* Extra: Showcase
 *****************************************************************************/
   #showcase{
      padding: 20px;
      overflow: hidden;
      height: 250px;
      border-bottom: 1px solid #eaeaea;
   }
      #showcase img{
         display: block;
         border: 0;
      }

/* Extra: Nieuwsbrief
 *****************************************************************************/
   #nieuwsbrief{
       padding: 0 20px 20px 20px;
       border-bottom: 1px solid #eaeaea;
    }
      #nieuwsbrief .nieuwsbrief{
         background: #f0f0f0 url(../img/bg-nieuwsbrief.jpg) repeat-x bottom;
         padding-bottom: 20px;
         margin-bottom: 20px;
         margin-right: 20px;
      }
         #nieuwsbrief .nieuwsbrief  fieldset{ padding: 15px 10px; }
         #nieuwsbrief .nieuwsbrief p{
            font-size: 1.2em;
            line-height: 1.6em;
            padding-bottom: 15px;
         }
         #nieuwsbrief .nieuwsbrief a{
            font-size: 1.0em;
            color: #474747;
            float: left;
            width: 190px;
            padding-left: 0;
         }
         #nieuwsbrief .nieuwsbrief input{
            width: 200px;
            margin-top: 5px;
         }
            #nieuwsbrief .nieuwsbrief #voorwaarden{
               width: 20px;
               float: right;
               border: 1px solid #d2d2d2;
            }

/* Extra: Flickr
 *****************************************************************************/
   #flickr{ margin: 20px 0 0 20px; }
      #flickr ul{
         float: left;
         width: 100%;
         background: url(../img/bg-flickr.png) no-repeat bottom left;
         padding: 10px 0 20px 2px;
      }
         #flickr ul li a{
            float: left;
            margin: 0 2px 2px 2px;
            padding-left: 0;
         }
         #flickr ul li img{
            border: 1px solid #FFF;
            background: url(../img/bg-flickr-pics.gif) no-repeat top left;
            width: 71px;
            height: 47px;
            padding: 2px;
         }


/* Extra: Chat
 *****************************************************************************/
   .chat,
   .server{
      border-bottom: 1px solid #eaeaea;
      padding: 10px 0;
   }
   .server{ border-bottom: 0px solid #eaeaea; }
      .chat ul,
      .server ul{ margin: 5px; }

      .chat li,
      .server li,
      .server p,
      .chat p{
         font-size: 1.2em;
         line-height: 1.4em;
         padding: 5px; 
      }
         .chat li img,
         .server li img  {
            padding-left: 2px;
            padding-right:5px;
            margin-bottom: -1px;
         }
         .chat li a, .server p a{ color: #19a840; font-weight:bold; }
 
/* Extra: Hulp
 *****************************************************************************/
   .server p.status{
      padding: 5px;
      font-size: 11px;
      margin:0 10px 5px 10px;
      border:0px solid #cecece;
   }

/* Intro
 *****************************************************************************/
   #intro{
      float: left;
      background: url(../img/bg-intro.gif) no-repeat bottom left;
      width: 980px;
      margin-bottom: 20px;
      padding-bottom: 20px;
      padding-left: 20px;
   }
      #intro .introblok {
         float:left;
         width:326px;
      }
      
      #intro .icoon{
          background: url(../img/icoontjes.png) no-repeat;
          width: 60px;
          height: 150px;
          position:absolute;
      }
      
      #intro .werkwijze .icoon{ background-position: 10px 30px; }
      #intro .support .icoon{ background-position: -60px 30px; }
      #intro .vacature .icoon{ background-position: -120px 30px; }
      #intro .portfolio .icoon{ background-position: -190px 25px; }

         #intro .introblok h2{
            font-size: 1.8em;
            color: #252525;
            padding-bottom: 20px;
         }
         #intro .introblok p{
            font-size: 1.2em;
            line-height: 1.8em;
            padding: 0 45px 10px 70px;
         }
         #intro .introblok a{
            background: url(../img/button-grijs.png) no-repeat left;
            font-weight: bold;
            display: block;
            color: #FFF;
            text-decoration: none;
            text-shadow: 0em -0.08em #3b3b3b;
            width: 95px;
            float: left;
            padding: 8px 20px 20px 25px;
            margin-left: -23px;
         }
              #intro .introblok a:hover{ background: url(../img/button-grijs-on.png) no-repeat left; }

/* Contact nieuwsblok, social marketing + contact
 *****************************************************************************/
   #nieuws{
      float: left;
      width: 650px;
      min-height: 194px;
      padding-left: 20px;
   }
      #nieuws h2,
      #adres h2 {
         color: #FFF;
         font-size: 1.8em;
         padding: 30px 0 10px 0;
      }
      #nieuws ol{
         padding: 0;
         margin: 0;
      }
      #nieuws li{
         float: left;
         width: 280px;
         padding: 0 40px 0 0;
      }  
         #nieuws li strong{
            display: block;
            font-size: 1.1em;
            color: #b6b6b6;
            font-weight: bold;
            margin-bottom: 5px;
         }
         #nieuws li a{
            color: #fbfafa;
            font-size: 1.4em;
            font-weight: bold;
            display: block;
            margin: 0 0 8px 0;
         }
         #nieuws li p{
            line-height: 1.6em;
            font-size: 1.2em;
            color: #FFF;
         }
         
/* Adres blok
 *****************************************************************************/
   #adres{
      float: right;
      width: 275px;
      margin-right: 10px;
   }
      #adres address{
         font-size: 1.2em;
         line-height: 1.8em;
         font-style: normal;
         color: #FFF;
      }
      #adres address a{ color: #FFF; }
      #adres h3{ display: none; }
      #adres li a{
         float: left;
         background: url(../img/logo/social-comms.png) no-repeat;
         text-indent: -5000px;
         width: 90px;
         height: 25px;
         margin-top: 20px;
      }

      #adres li.flickr a{ background-position: -5px -24px; margin-left: -15px; }
      #adres li.linkedin a{ background-position: -90px -25px}
      #adres li.twitter1 a{ background-position: -185px -23px}
      #adres li.flickr a:hover{ background-position: -5px 1px}
      #adres li.linkedin a:hover{ background-position: -90px 1px}
      #adres li.twitter1 a:hover{ background-position: -185px 1px}

/* Routebeschrijving
 *****************************************************************************/
	#googlemapRoute{
		border: 4px solid #e1e1e1;
		width: 590px;
		height: 280px;
		overflow: hidden;
		margin-left: 0px;
      margin-bottom: 20px;
	}
      #googlemapRoute a{
         background: none;
      }
      .routebeschrijvingPagina .formulier{ width: 600px;float: left; position: relative; margin-bottom: 10px; padding-bottom: 10px; }
         .routebeschrijvingPagina .formulier fieldset{ }
         .routebeschrijvingPagina .formulier label{ margin-bottom: 10px; }
         .routebeschrijvingPagina .formulier label em{ color:#343434 !important; }
         .routebeschrijvingPagina .formulier input#address {
            width: 400px;
            float: left;
         }
         .routebeschrijvingPagina .formulier p button{ position: absolute; right: -10px; bottom: 8px; }

/* Algemene voorwaarden
 *****************************************************************************/
   dl#algemene-voorwaarden{
      padding:10px;
      margin:0;
   }
      dl#algemene-voorwaarden dt{
         cursor:default;
         background:#eaeaea;
         color:#1e1b1b;
         padding:0.5em;
      }
      dl#algemene-voorwaarden dd{
         margin:0;
         padding:0;
      }
      dl#algemene-voorwaarden dt a,
      .voorwaardenPagina #top{
         cursor:default;
         text-decoration:none;
         color:#1e1b1b;
         background:none;
         display:block;
      }
      dl#algemene-voorwaarden dt a{
         font-size:1.3em;
      }      
      body.algemene-voorwaarden #page-content ul li{
         width:90%;
      }
      #algemene-voorwaarden-inhoud li,
      #algemene-voorwaarden p,
      #algemene-voorwaarden li{
         color:#666;
         line-height:1.5em;
         font-size:1.3em;
         
      }
      #algemene-voorwaarden li{
         list-style:decimal;
         padding:1em;
      }      
      #algemene-voorwaarden-inhoud li{
         padding:1px 1em;
      }      


/* Voet
 *****************************************************************************/
   .voet{ background: url(../img/bg-voet.png) no-repeat center top; }
      #voet p{
         float: left;
         min-height: 10px;
         font-size: 1.2em;
         color: #bcbbbb;
         padding-top: 32px;
         padding-left: 20px;
         margin: 0;
      }
         #voet p a{ color: #fcfcfc; }
         #voet p.slogan{
            float: right;
            background: url(../img/slogan.png) no-repeat;
            text-indent: -5000px;
            width: 300px;
            height: 20px;
            margin-top: 33px;
         }
         
/* Navigatie
 *****************************************************************************/
   #navigatie{
      background: #efefef url(../img/bg-navi.jpg) repeat-x top;
      position: absolute;
      top: 18px;
      width: 100%;
   }
      #navigatie div{
         width: 630px;
         position: relative;
         z-index:50;
         overflow: hidden;
         margin:auto;
         padding: 0 0 0 250px;
      }
      #navigatie h2{ display:none; }
      #navigatie ul{
         background: url(../img/bg-navigatie.jpg) no-repeat center left;
         padding-left: 2px;
         min-height: 50px;
      }
      #navigatie li{
         background: url(../img/bg-navigatie.jpg) no-repeat center right;
         float: left;
      }
         #navigatie li a{ 
            font-size: 1.4em;
            font-family: arial;
            color: #252525;
            display: block;
            text-decoration: none;
            padding: 17px 20px; 
         }

      .overonsPagina #navigatie li.overons a,
      .teamPagina #navigatie li.overons a,
      .vacaturePagina #navigatie li.overons a,
      .werkwijzePagina #navigatie li.werkwijze a,
      .totaalconceptPagina #navigatie li.werkwijze a,
      .technologiePagina #navigatie li.werkwijze a,
      .pakkettenPagina #navigatie li.werkwijze a,
      .redenenPagina #navigatie li.werkwijze a,
      .onswerkPagina #navigatie li.onswerk a,
      .portfolioPagina #navigatie li.onswerk a,
      .klantenPagina #navigatie li.onswerk a,
      .nieuwsPagina #navigatie li.nieuws a,
      .archiefPagina #navigatie li.nieuws a ,
      .contactPagina #navigatie li.contact a,
      .routebeschrijvingPagina #navigatie li.contact a{
         background: #0f8a32 url(../img/bg-navigatie-actief.jpg) repeat-x top left;
         border-left: 1px solid #FFF;
         border-right: 1px solid #FFF;
         color: #FFF;
         margin-left: -2px;
      }

      #navigatie li a:hover{ background: #e4e4e4 url(../img/bg-navigatie-hover.jpg) repeat-x top right; }
      #navigatie li.actief{ background: #0f8a32 url(../img/bg-navigatie-actief.jpg) repeat-x top left; }

/* Subnavigatie
 *****************************************************************************/
   #subnavigatie{
      background: #f4f4f4 url(../img/bg-subnavi.jpg) repeat-x bottom;
      position: absolute;
      top: 68px;
      width: 100%;
   }
      #subnavigatie div{
         width: 630px;
         position: relative;
         z-index:20;
         overflow: hidden;
         margin:auto;
         min-height: 69px;
         padding: 0 0 0 250px;
      }
   #subnavigatie h2{
      display: none;
      background: url(../img/bg-klikpad.gif) no-repeat right 5px;
      float: left;
      font-size: 1.2em;
      margin-top: 43px;
      margin-left: -95px;
      padding-right: 10px;
   }
      #subnavigatie h2 strong{ color: #00a12c; letter-spacing:-1px; }
      #subnavigatie h2 a{ text-decoration: none; }

   #subnavigatie ul{
      padding-left: 2px;
      min-height: 50px;
   }
   #subnavigatie li{ float: left; }
      #subnavigatie li a{ 
         font-size: 1.3em;
         background: #DDD url(../img/bg-subnavigatie.jpg) repeat-x top left;
         font-family: arial;
         color: #0d0d0d;
         border-top: 1px solid #d5d5d5;
         border-left: 1px solid #d5d5d5;
         border-right: 1px solid #d5d5d5;
         border-bottom: 0;
         display: block;
         text-decoration: none;
         padding: 8px 18px;
         margin: 36px 5px 0 0;
         margin-left: -2px;
      }

      .overonsPagina #subnavigatie li.overons a,
      .teamPagina #subnavigatie li.hetTeam a,
      .vacaturePagina #subnavigatie li.vacatures a,
      .werkwijzePagina #subnavigatie li.werkwijze a,
      .totaalconceptPagina #subnavigatie li.totaalconcept a,
      .technologiePagina #subnavigatie li.technologie a,
      .pakkettenPagina #subnavigatie li.pakketten a,
      .redenenPagina #subnavigatie li.redenen a,
      .onswerkPagina #subnavigatie li.onswerk a,
      .portfolioPagina #subnavigatie li.cases a,  
      .klantenPagina #subnavigatie li.klanten a,
      .nieuwsPagina #subnavigatie li.nieuws a,
      .archiefPagina #subnavigatie li.archief a ,
      .contactPagina #subnavigatie li.contact a,
      .supportPagina #subnavigatie li.support a,
      .historiePagina #subnavigatie li.historie a,
      .routebeschrijvingPagina #subnavigatie li.routebeschrijving a{
         background: #e2e2e2 url(../img/bg-subnavigatie-actief.jpg) repeat-x bottom left;
         border: 1px solid #d5d5d5;
         border-bottom: 1px solid #FFF;
      }
         #subnavigatie li a:hover{ text-decoration: underline; }

/* Navigatie pad
 *****************************************************************************/
	#pad{
		font-size: 1.2em;
		padding: 5px 0;
		margin: 30px 0 10px 20px;
	}
		#pad p{
			display:inline;
			color: #2e2e2e;
         font-weight: bold;
			padding-right:5px;
			font-family: Arial, Helvetica, sans-serif;
			font-style: normal;
		}
		#pad ol,
		#pad li{
			display:inline;
			list-style:none;
			color: #19a840;
			margin:0;
			padding:0;
		}
	
		 #pad a{ color: #8e8d8d; }
       
       
/* Navigatie pad
 *****************************************************************************/       

.jcarousel-skin-tango .jcarousel-container {
   width:980px;
   position:relative;
   z-index:1;
   margin-top:-47px;
   margin-left:20px;
}

.jcarousel-skin-tango .jcarousel-container-horizontal {
    width: 980px;
}

.jcarousel-skin-tango .jcarousel-clip-horizontal {
    width:  980px;
    height: 372px;
}

.jcarousel-skin-tango .jcarousel-item {
    width: 980px;
    height: 372px;
}

.jcarousel-skin-tango .jcarousel-item-horizontal {
    margin-right: 10px;
}

.jcarousel-skin-tango .jcarousel-item-placeholder {
    background: #fff;
    color: #000;
}

/**
 *  Horizontal Buttons
 */
.jcarousel-skin-tango .jcarousel-next-horizontal {
    position: absolute;
    top: 43px;
    right: 5px;
    width: 32px;
    height: 32px;
    cursor: pointer;
    background: transparent url(next-horizontal.png) no-repeat 0 0;
}

.jcarousel-skin-tango .jcarousel-next-horizontal:hover {
    background-position: -32px 0;
}

.jcarousel-skin-tango .jcarousel-next-horizontal:active {
    background-position: -64px 0;
}

.jcarousel-skin-tango .jcarousel-next-disabled-horizontal,
.jcarousel-skin-tango .jcarousel-next-disabled-horizontal:hover,
.jcarousel-skin-tango .jcarousel-next-disabled-horizontal:active {
    cursor: default;
    background-position: -96px 0;
}

.jcarousel-skin-tango .jcarousel-prev-horizontal {
    position: absolute;
    top: 43px;
    left: 5px;
    width: 32px;
    height: 32px;
    cursor: pointer;
    background: transparent url(prev-horizontal.png) no-repeat 0 0;
}

.jcarousel-skin-tango .jcarousel-prev-horizontal:hover {
    background-position: -32px 0;
}

.jcarousel-skin-tango .jcarousel-prev-horizontal:active {
    background-position: -64px 0;
}

.jcarousel-skin-tango .jcarousel-prev-disabled-horizontal,
.jcarousel-skin-tango .jcarousel-prev-disabled-horizontal:hover,
.jcarousel-skin-tango .jcarousel-prev-disabled-horizontal:active {
    cursor: default;
    background-position: -96px 0;
}