@charset "utf-8";
/* CSS Document */



html
{font: normal 11px Verdana, Arial, Helvetica, Sans-Serif;
margin: 0px auto;
	padding: 0px auto;

}

body
{
	margin: 0px auto;
	padding: 0;
	font: 12px Arial, Helvetica, sans-serif;
	color: #333333;
	line-height:17px;
	background-color:#fafafa;
	overflow-x: hidden;
}

#wrap {
	width: 1004px;
	margin:0px auto;
	padding:0px auto;
	height: 100%;
}

#container {
	width: 100%;
	min-height:300px;
	background:#ccc;
	background:url(../images/flt_bg_container.png) repeat-y;
}

#container_contact {
	width: 100%;
	min-height:900px;
	background:#ccc;
	background:url(../images/bg_container.png) repeat-y;
}

#container_xxl {
	width: 100%;
	background:#ccc;
	background:url(../images/bg_container_xxl.jpg) repeat-y;
	height: auto;
	min-height: 1000px;
}

#container h1 {
	font-size: 2.5em;
	color: #243e90;
}

#container_contact h1 {
	font-size: 2.5em;
	color: #243e90;
}

#container h2 {
	font-size: 1em;
	color: #243e90;
}

#container_contact h2 {
	font-size: 1em;
	color: #243e90;
}

#container a {
	color: #F60;
	text-decoration: none;
}

#container_contact a {
	color: #F60;
	text-decoration: none;
}

#container img {
	border:0px;
	text-decoration: none;
}

#container li {
	margin: 0px 0px 0px 0px;
	list-style-image: url(../images/arrow.gif);
}

#container_xxl h1 {
	font-size: 2.5em;
	color: #243e90;
}

#container_xxl h2 {
	font-size: 1em;
	color: #243e90;
}
#container_xxl a {
	color: #fe4010;
	text-decoration: none;
}

#container_xxl img {
	border:0px;
	text-decoration: none;
}

#container_xxl li {
	margin: 0px 0px 0px 0px;
	list-style-image: url(../images/arrow.gif);
}

#container li.front {
	margin: 0px 0px 0px 20px;
	list-style-image: url(../images/arrow.gif);
}

#maincontainer {
	width: 1004px;
	min-height:500px;
	margin: 0px auto;
	padding: 0px;
	background: url(../images/flt_bg_maincontent_2.png) no-repeat;
	
}

#maincontainer-rest {
	width: 980px;
	min-height:500px;
	margin: 0px auto;
	background: url(../images/bg_maincontent_rest_2.png) no-repeat;
	padding: 12px;
	
}

#maincontainer_xxl {
	width: 980px;
	margin: 0px auto;
	padding: 12px;
	background: url(../images/bg_maincontent_xxl.png) repeat-x;
	height: 100%;
	min-height: 1200px;
	
}

#maincontainer_portfolio {
	width: 980px;
	margin: 0px auto;
	padding: 12px;
	/*background: url(../images/bg_portfolio_xxl2.jpg) repeat-x;*/
	min-height: 2000px;
	
}

#maincontainer_xl {
	width: 980px;
	min-height:900px;
	margin: 0px auto;
	padding: 12px;
	background: url(../images/bg_maincontent.png) repeat-x;
	
}

#maincontainer_contact {
	width: 980px;
	min-height:800px;
	margin: 0px auto;
	padding: 12px;
	background: url(../images/bg_maincontent_contact.png) no-repeat;
	
}

#mainright {
	width:350px;
	float: right;
	height: 400px;
	margin-right: 5px;
}

#mainright_img {
	width:218px;
	float: right;
	height: 400px;
	margin-right: 5px;
}

#mainright li {
	margin: 0px 0px 0px 20px;
}

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

#mainright_contact {
	width:350px;
	float: right;
	height: 400px;
	margin-right: 5px;
}

#mainright_contact li {
	margin: 0px 0px 0px 20px;
	list-style-image: url(../images/arrow.gif);
}

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

#mainleft {
	width: 600px;
	float: left;
	padding-left: 13px;
}

#main_portfolio{
	width: 950px;
	float: left;
	padding-left: 13px;
}

#mainfront{
	width: 930px;
	padding:30px 0px 0px 50px;
	margin:0px 0px 0px 0px;
	height: 400px;
	background: url(../images/flt_bg_mainfront_2.png) no-repeat;
}


#top
{
	width:1004px;
	height:150px;
	background:url(../images/bg_top.png) no-repeat;
	margin: 0px 0px 0px 0px;
}

#navi_hold
{	background: url(../images/bg_navigation.png) no-repeat;	
	height: 50px;
	width: 1005px;
	overflow: hidden;
	margin: 0px 0px 0px 8px;
	padding: 0px auto;
	
	
}

#navigation{
	
	list-style: none;
	height: 450px;
	position: inherit;
	margin: 0px;
	width: 1005px;
	padding: 0px;
	overflow: hidden;
}

#navigation li{
	float: left;
	list-style: none;
	
	
}
#navigation a{
	display: block;
	text-decoration: none;
	border-top: none;
	line-height: 400px;
	overflow: hidden;
	
}
#navigation a#home{
	background: url(../images/menu/home-off.png) no-repeat;
	width: 94px;
}

#navigation a#home:hover{
	background: url(../images/menu/home-hover.png) no-repeat;

}
#navigation a#home.active{
	background: url(../images/menu/home-active.png) no-repeat;

}
#navigation a#webdesign{
	background: url(../images/menu/webdesign-note.png) no-repeat;
	width: 145px;
}
#navigation a#webdesign:hover{
	background: url(../images/menu/webdesign-hover.png) no-repeat;
}

#navigation a#webdesign.active{
	background: url(../images/menu/webdesign-active.png) no-repeat;
}


#navigation a#zoekmachine-marketing{
	background: url(../images/menu/webdesign-note.png) no-repeat;
	width: 305px;
}
#navigation a#zoekmachine-marketing:hover{
	background: url(../images/menu/zoekmachine-marketing-hover.png) no-repeat;
}

#navigation a#zoekmachine-marketing.active{
	background: url(../images/menu/zoekmachine-marketing-active.png) no-repeat;
}

#navigation a#meer-diensten{
	background: url(../images/menu/webdesign-note.png) no-repeat;
	width: 195px;
}
#navigation a#meer-diensten:hover{
	background: url(../images/menu/meer-diensten-hover.png) no-repeat;
}

#navigation a#meer-diensten.active{
	background: url(../images/menu/meer-diensten-active.png) no-repeat;
}

#navigation a#portfolio{
	background: url(../images/menu/webdesign-note.png) no-repeat;
	width: 135px;
}
#navigation a#portfolio:hover{
	background: url(../images/menu/portfolio-hover.png) no-repeat;
}

#navigation a#portfolio.active{
	background: url(../images/menu/portfolio-active.png) no-repeat;
}

#navigation a#contact{
	background: url(../images/menu/webdesign-note.png) no-repeat;
	width: 116px;
}
#navigation a#contact:hover{
	background: url(../images/menu/contact-hover.png) no-repeat;
}

#navigation a#contact.active{
	background: url(../images/menu/contact-active.png) no-repeat;
}


#sub_navigation_webdesign_hold
{
	background: url(../images/bg_navigation_webdesign.png) no-repeat;
	height: 50px;
	margin: 0px auto;
	padding: 0px auto;
	clear: inherit;
	width: 990px;
}

#sub_navigation_webdesign{
	list-style: none;
	height: 50px;
	position: inherit;
	margin: 0px;
	width: 706px;
	padding: 0px;
	overflow: hidden;
}

#sub_navigation_webdesign li{
	float: left;
	list-style: none;
	
	
}
#sub_navigation_webdesign a{
	display: block;
	text-decoration: none;
	border-top: none;
	line-height: 400px;
	overflow: hidden;
	
}
#sub_navigation_webdesign a#sub_webdesign{
	background: url(../images/sub_webdesign/webdesign-off.png) no-repeat;
	width: 106px;
}

#sub_navigation_webdesign a#sub_webdesign:hover{
	background: url(../images/sub_webdesign/webdesign-hover.png) no-repeat;

}
#sub_navigation_webdesign a#sub_webdesign.active{
	background: url(../images/sub_webdesign/webdesign-active.png) no-repeat;

}

#sub_navigation_webdesign a#sub_webdesign_pakketten{
	background: url(../images/sub_webdesign/webdesign-pakketten-off.png) no-repeat;
	width: 184px;
}

#sub_navigation_webdesign a#sub_webdesign_pakketten:hover{
	background: url(../images/sub_webdesign/webdesign-pakketten-hover.png) no-repeat;

}
#sub_navigation_webdesign a#sub_webdesign_pakketten.active{
	background: url(../images/sub_webdesign/webdesign-pakketten-active.png) no-repeat;

}


#sub_navigation_webdesign a#sub_webwinkel{
	background: url(../images/sub_webdesign/webwinkel-off.png) no-repeat;
	width: 130px;
}

#sub_navigation_webdesign a#sub_webwinkel:hover{
	background: url(../images/sub_webdesign/webwinkel-hover.png) no-repeat;

}
#sub_navigation_webdesign a#sub_webwinkel.active{
	background: url(../images/sub_webdesign/webwinkel-active.png) no-repeat;

}



#sub_navigation_webdesign a#sub_webwinkel_pakketten{
	background: url(../images/sub_webdesign/webwinkel-pakketten-off.png) no-repeat;
	width: 190px;
}

#sub_navigation_webdesign a#sub_webwinkel_pakketten:hover{
	background: url(../images/sub_webdesign/webwinkel-pakketten-hover.png) no-repeat;

}
#sub_navigation_webdesign a#sub_webwinkel_pakketten.active{
	background: url(../images/sub_webdesign/webwinkel-pakketten-active.png) no-repeat;

}

#sub_navigation_webdesign a#sub_portfolio{
	background: url(../images/sub_webdesign/portfolio-off.png) no-repeat;
	width: 95px;
}

#sub_navigation_webdesign a#sub_portfolio:hover{
	background: url(../images/sub_webdesign/portfolio-hover.png) no-repeat;

}
#sub_navigation_webdesign a#sub_portfolio.active{
	background: url(../images/sub_webdesign/portfolio-active.png) no-repeat;

}


/* sub navigation zoekmachine */

#sub_navigation_zoekmachine_hold
{
	background: url(../images/bg_navigation_zoekmachine.png) no-repeat;
	height: 50px;
	margin: 0px auto;
	padding: 0px auto;
	clear: inherit;
	width: 990px;
}

#sub_navigation_zoekmachine{
	list-style: none;
	height: 50px;
	position: inherit;
	margin: 0px;
	width: 900px;
	padding: 0px;
	overflow: hidden;
}

#sub_navigation_zoekmachine li{
	float: left;
	list-style: none;
	
	
}
#sub_navigation_zoekmachine a{
	display: block;
	text-decoration: none;
	border-top: none;
	line-height: 400px;
	overflow: hidden;
	
}
#sub_navigation_zoekmachine a#sub_zoekmachine_marketing{
	background: url(../images/sub_zoek/zoekmachine-marketing-off.png) no-repeat;
	width: 205px;
}

#sub_navigation_zoekmachine a#sub_zoekmachine_marketing:hover{
	background: url(../images/sub_zoek/zoekmachine-marketing-hover.png) no-repeat;

}
#sub_navigation_zoekmachine a#sub_zoekmachine_marketing.active{
	background: url(../images/sub_zoek/zoekmachine-marketing-active.png) no-repeat;

}

#sub_navigation_zoekmachine a#sub_zoekmachine_optimalisatie{
	background: url(../images/sub_zoek/zoekmachine-optimalisatie-off.png) no-repeat;
	width: 240px;
}

#sub_navigation_zoekmachine a#sub_zoekmachine_optimalisatie:hover{
	background: url(../images/sub_zoek/zoekmachine-optimalisatie-hover.png) no-repeat;

}
#sub_navigation_zoekmachine a#sub_zoekmachine_optimalisatie.active{
	background: url(../images/sub_zoek/zoekmachine-optimalisatie-active.png) no-repeat;

}

#sub_navigation_zoekmachine a#sub_zoekmachine_adverteren{
	background: url(../images/sub_zoek/zoekmachine-adverteren-off.png) no-repeat;
	width: 232px;
}

#sub_navigation_zoekmachine a#sub_zoekmachine_adverteren:hover{
	background: url(../images/sub_zoek/zoekmachine-adverteren-hover.png) no-repeat;

}
#sub_navigation_zoekmachine a#sub_zoekmachine_adverteren.active{
	background: url(../images/sub_zoek/zoekmachine-adverteren-active.png) no-repeat;

}

#sub_navigation_zoekmachine a#sub_zoekmachine_pakketten{
	background: url(../images/sub_zoek/zoekmachine-pakketten-off.png) no-repeat;
	width: 222px;
}

#sub_navigation_zoekmachine a#sub_zoekmachine_pakketten:hover{
	background: url(../images/sub_zoek/zoekmachine-pakketten-hover.png) no-repeat;

}
#sub_navigation_zoekmachine a#sub_zoekmachine_pakketten.active{
	background: url(../images/sub_zoek/zoekmachine-pakketten-active.png) no-repeat;

}





/* sub navigation zoekmachine */






#logo
{
	margin:17px 17px 0px 17px;
	float:right;
	height:125px;
	width:400px;
	background:url(../images/op-je-klompen-webdesign-zoekmachine-optimalisatie-den-bosch-logo.png) no-repeat;
}

#adres
{ 
margin:17px 10px 0px 0px;
float:right;
height:100px;
width:200px;
}

#footer
{
	width:1004px;
	margin:0px auto;
	padding:0px auto;
	height:200px;
	background:url(../images/bg_footer.png) bottom no-repeat;
	clear: both;
}

#front_bottom
{
	width:1004px;
	margin:0px auto;
	padding:0px auto;
	height:250px;
	background:url(../images/bg_front_bottom.png) bottom no-repeat;
	clear: both;
}

#front_bottom_container {
	width: 990px;
	min-height:180px;
	padding: 10px 0px 0px 10px;
	background: url(../images/flt_bg_footer_content.png) no-repeat;
}




#footer_container {
	width: 1004px;
	min-height:160px;
	margin: 0px auto;
	background: url(../images/flt_bg_footer_content.png) no-repeat;
	text-align: center;
	padding: 10px 0px 0px 0px;
	
	
}

#footer_container p {
	font-size:11px;
	color:#999;
}

#footer_container p.adres {
	font-size:11px;
	color:#333;
}

#footer_container p.adres a {
	font-size:11px;
	color:#333;
}


#footer_container a {
	font-size:11px;
	color:#999;
	text-decoration:none;
}

#footer_container a:hover {
	font-size:11px;
	color:#000;
}

.column_small {
	width:					150px;
	margin:					0;
	margin-left:			20px;
	float:					left;
	min-height:				100px;
	height:					100%;
	padding: 3px 0px 0px 0px;
	}

.column_big {
	width:					200px;
	padding:				3px 0px 0px 0px;
	margin:					0;
	margin-left:			20px;
	float:					left;
	min-height:				100px;
	height:					100%;
	}

.column_bigger {
	width:					235px;
	padding:				3px 0px 0px 0px;
	margin:					0;
	margin-left:			10px;
	float:					left;
	min-height:				100px;
	height:					100%;
	overflow: hidden;
	}

.column_small h2{
	font-size: 1.3em;
	color: #243e90;
	margin: 0px auto;
	padding: 0px 0px 0px 0px;
	text-align: left;
}

.column_big h2{
	font-size: 1.3em;
	color: #243e90;
	clear:both;
	margin: 0px auto;
	padding:0px auto;
	text-align: left;
}

.column_bigger h2{
	font-size: 1.3em;
	color: #243e90;
	margin: 0px;
	padding: 0px 0px 0px 0px;
	text-align: left;
}


.column_small ul{
	margin: 0px ;
	list-style: none;
}
.column_small li{
	line-height:20px;
	margin: 0px 0px 0px 20px;
	list-style-image: url(../images/arrow.gif);
	padding-left: 0px;
}
.column_small p{
	padding: 0px;
	line-height: 20px;
}

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

.column_small a:hover{
	text-decoration: none;
	color:#000
	
}

.column_big ul{
	margin: 0px ;
	padding: 0px;
	list-style: none;
}
.column_big li{
	margin: 0px 0px 0px 20px;
	padding: 0px;
	list-style: none;
	line-height:20px;
	list-style-image: url(../images/arrow.gif);
}
.column_big p{
	padding: 0px;
	
}

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

.column_big a:hover{
	text-decoration: none;
	color:#000
	
}

.column_big img{
	padding: 0px auto;
	margin: 0px auto;
	
}

.column_bigger ul{
	margin: 0px ;
	list-style: none;
}
.column_bigger li{
	margin: 0px 0px 0px 0px;
	list-style: none;
	line-height:20px;
	padding: 0px;
}
.column_bigger p{
	padding: 0px;
	
	
}

#tweets {
				
				margin:			0;
				padding:		0;
				
			}

			#tweets li {
				margin:			0;
				padding:		0;
				list-style:		none;
				clear:			left;
			}
			
			#tweets img {
				float:			left;
				margin:			0px 10px 10px 0px;
			}
			
			#tweets li p {
				margin-left:	0px;
			}
			
			#tweets li a {
				font-weight:	bold;
				text-decoration:none;
			}

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

.home_content_rechts
{
	width:420px;
	height:380px;
	right:128px;
	top:0px;
	float: right;
	margin-right: 10px;
	
}

.home_content_box
{
	position:relative;
	float:right;
	width:210px;
	height:33px;
	padding:140px 0px 15px 0px;
	text-decoration:none;
	color:#4e4d4d;
	font-size:15px;
	text-align:center;
}

.home_content_box2
{
	position:relative;
	float:right;
	width:210px;
	height:40px;
	padding:145px 0px 15px 0px;
	text-decoration:none;
	color:#4e4d4d;
	font-size:15px;
	text-align:center;
}

.home_content_box:hover
{
	color:#d60008;
}

.home_content_box2:hover
{
	color:#d60008;
}

.clear {
	clear:both
}


#headerHome {
	position: absolute;
}
   #headerHome li {
	display: none;
	list-style: none;
	position: absolute;
	top: 46px;
	left: -7px;
	z-index: 8;
	width: 483px;
   }
      #headerHome li.active  {
         display: block;
         z-index: 10;
      }
      #headerHome li.last-active  {
         display: block;
         z-index: 9;
      }

#portfolio_holder
{
	height:150px;
	width:930px;
	overflow:hidden;
	border: 1px solid #ccc;
	margin-bottom: 25px;
}

#portfolio_holder .website
{
	position:relative;
	float:left;
	margin-right: 6px;
	padding-top: 10px;
	margin-left: 3px;
}

#portfolio_holder p.tekst
{
	position:relative;
	float:left;
	width:275px;
	height:56px;
	padding-left:30px;
	margin-left:40px;
}

#portfolio_holder img{border:0;}

#portfolio_holder h3{
	width:390px;
	height:20px;
}
	
#portfolio_tekst {
	float:right;
	width: 400px;
	margin-left: 0px;
}

#portfolio_tekst li {
	margin: 0px 0px 0px 20px;
	list-style-image: url(../images/arrow.gif);
}


#wiki-holder
{
	height:100%;
	width:930px;
	margin-bottom: 25px;
}

#wiki-holder .website
{
	position:relative;
	float:left;
	margin-right: 6px;
	padding-top: 10px;
	margin-left: 3px;
}

#wiki-holder p.tekst
{
	position:relative;
	float:left;
	width:275px;
	height:56px;
	padding-left:30px;
	margin-left:40px;
}

#wiki-holder img{border:0;}

#wiki-holder h3{
	width:390px;
	height:20px;
}
	
#wiki-tekst {
	float:right;
	width: 400px;
	margin-left: 0px;
}

#wiki-holder li {
	margin: 0px 0px 0px 20px;
	list-style-image: url(../images/arrow.gif);
}


#contact_form {
	margin-right:0px;
	font-size:8pt;
	text-align:left;
	margin-bottom:4px;
	line-height:9pt;
}
#contact_form input {
	border:0px;
	color:#333;
	padding:5px 5px 5px 0px;
	margin:5px 0px 5px 5px;
	width:260px;
	font-size:10pt;
	background: #CCC;
}
#contact_form input.smaller {
	background:#CCC;
	border:0;
	color:#000;
	padding:4px 5px;
	margin:0 0 3px 7px;
	width:120px;
	font-size:8pt;
}

#contact_form input.small {
	background:#CCC;
	border:0;
	color:#000;
	padding:4px 5px;
	margin:0 0 3px 0px;
	width:255px;
	font-size:8pt;
}

#contact_form select {
	background:#CCC;
	border:0;
	color:#000;
	padding:5px 5px 5px 0px;
	margin:5px 0px 5px 5px;
	width:265px;
	font-size:12px;
}

#contact_form input.steengoed_of_b_en_b {
	background:#CCC;
	border:0;
	color:#000;
	padding:4px 5px 0px 0px;
	margin:0 0 3px 0px;
	width:10px;
	font-size:8pt;

}
#contact_form label {
	vertical-align:middle;
	font-size: 12px;
	padding: 0px 0px 0px 6px;
}
#contact_form textarea {
	background:#CCC;
	color:#000;
	border:0px solid #464646;
	width:260px;
	height:40px;
	overflow:hidden;
	padding:5px 5px 5px 0px;
	margin:5px 0px 5px 5px;
	font-size:8pt;
}
#contact_form input.submitgeneral {
	border:1px solid #000;
	background:#999;
	color:#000;
	width:265px;
	letter-spacing:2px;
	font-size:10pt;
	text-align:center;
	padding:5px 5px 5px 0px;
	margin: 5px 0px 5px 5px;
} 

#contact_form textarea.bericht {
	background:#CCC;
	color:#000;
	border:0px solid #464646;
	width:580px;
	height:80px;
	padding:5px 5px 5px 0px;
	margin:5px 0px 5px 5px;
	font-size:10pt;
	overflow: auto;
	
}

#form_left {
	margin: 0px auto;
	padding: 0px;
	text-align: left;
	width: 270px;
	float: left;
	}

#form_right {
	margin: 0px auto;
	padding: 0px 10px 0px 0px;
	text-align: right;
	}


#pic_rotator {
	width:350px;
	float: right;
}

#pic_rotator_xl {
	float:left;
	width:1020px;
}

.pan_wrap {
	margin:0;
	width: 350px;
	height: 500px;
	position: relative;
}

.pan_wrap_xl {
	background: repeat;
	margin:0;
	position: relative;
	width: 1020px;
	height: 500px;
}

.pan_frame_home {
	/*background: url(../images/overlay_home_flt.png) no-repeat;*/
	overflow: hidden;
	position: absolute;
	top: 0px;
	left: -5px;
	width: 1020px;
	height: 350px;
	z-index:101;
	text-align:right;
}

#gallery {
	position: relative;
	height:500px;
	margin:0px;
	overflow: hidden;
	width: 350px;
	padding: 0;
}
#gallery img {
	padding:0;
	margin:0;
	border: 0;
}
#gallery li {
	display: block;
	list-style: none;
}

.small
{
font-size: 0.8em;

}

#bump
{
clear:both;
height:75px;
width:1004px;
background:url(../images/bg_container.png) repeat-y;
margin:0px auto;

}

#container strong {
 color:	#243e90;
}

#ojk {
	color:#243e90;
	font-size:12px;
	font-weight: bold;	
	
}

#main_portfolio li {list-style:none;}

