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

* {
	margin:0;
	padding:0;
}

/* Sticky Footer Solution by Steve Hatcher 
http://stever.ca
http://www.cssstickyfooter.com
*/

/* must declare 0 margins on everything, also for main layout components use padding, not 
vertical margins (top and bottom) to add spacing, else those margins get added to total height 
and your footer gets pushed down a bit more, creating vertical scroll bars in the browser */

html, body, .wrap {
	height: 100%;
}

body > .wrap {
	height: auto;
	min-height: 100%;
}

.canvas {
	padding-bottom: 350px;
}  /* must be same height as the footer */

body.thuis .canvas2 {
	padding-bottom: 350px;
}

.footerWrapper {
	position: relative;
	margin-top: -350px; /* negative value of footer height */
	height: 350px;
	clear:both;
}

/* CLEAR FIX*/
.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

.clearfix {
	display: inline-block;
}

/* Hides from IE-mac \*/
* html .clearfix {
	height: 1%;
}

.clearfix {
	display: block;
}
/* End hide from IE-mac */


/* End of sticky footer ---------------------------------------------------------------------------------------- */

body {
	background:#8a0101;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	background:transparent url(http://www.bubblefish.nl/template/images/bg-wit.gif) top left repeat;
}

body.formpage {
	background:none;
}

form {
	z-index:19;
}

select {
	z-index:20;
}

option {
	z-index:21;
}

a:hover {
	cursor:pointer;
}

.red  {
	color:#D90000; 
}

.devider {
	clear:both;
	float:none;
	display:block;
	position:relative;
	border:1px #000000 solid;
	background:#000000;
	height:35px;
}

/* layout ---------------------------------------------------------------------------------------- */

/* relative */

.canvas {
	z-index:1;
	position:relative;
}

	.redtop {
		position:relative;
		height:30px;
		background:transparent url(http://www.bubblefish.nl/template/images/bg-rood.gif) top left repeat;
	}
	
	.top {
		z-index:30;
		clear:both;
		position:relative;
		margin:0 0 0 0;
	}
		
		.top hr {
			clear:both;
			border:0px solid #FFFFFF;
			margin:0;
			color:#FFFFFF;
		}
	
		.topInner {
			width:941px;
			margin:0 auto;
		}
		
			.logo {
				float:left;
				margin:0;
				padding:0 0 7px 0;
			}
			
			.navigation {
				float:right;
				margin:34px 0 0 0;
				width:670px;
			}
			
			.navigation2 {
				float:right;
				margin:34px 0 0 0;
				width:700px;
			}

	.flash {
		z-index:14;
		clear:both;
		position:relative;
	}

	.content {
		z-index:15;
		clear:both;
		position:relative;
		width:941px;
		margin:15px auto 25px auto;
		font-size:13px;
		line-height:140%;
	}
	
	.contentPort {
		z-index:16;
		clear:both;
		position:relative;
		width:941px;
		margin:15px auto 25px auto;
		font-size:13px;
		line-height:140%;
	}
	
	.contentAlgemeen {
		z-index:17;
		clear:both;
		position:relative;
		width:941px;
		margin:15px auto 25px auto;
		font-size:13px;
		line-height:140%;
	}
	
	.contentTeam {
		z-index:18;
		clear:both;
		position:relative;
		width:941px;
		margin:15px auto 25px auto;
		font-size:13px;
		line-height:140%;
		padding:8px 0;
	}
	
	.contentClients {
		z-index:15;
		clear:both;
		position:relative;
		width:941px;
		margin:15px auto 0 auto;
		padding:0 14px 25px 14px;
		font-size:13px;
		line-height:140%;	
	}
	
	.contentContact {
		z-index:13;
		clear:both;
		position:relative;
		background:#FFFFFF;
		width:941px;
		margin:15px auto 25px auto;
		font-size:13px;
		line-height:140%;
	}
	
		.content a, .contentPort a, .contentAlgemeen a, .contentMensen a, .contentContact a, .contentTeam a, .contentContact a, .contentClients a, .formpage a {
			color:#666666;
		}
		
			.content a:hover, .contentPort a:hover, .contentAlgemeen a:hover, .contentMensen a:hover, .contentContact a:hover, .contentTeam a:hover, .contentContact a:hover, .contentClients a:hover, .formpage a:hover {
				background:#d90000;
				color:#FFFFFF;
				text-decoration:none;
				padding:2px 0;
			}
	
/* absolute */

.bg {
	position:fixed; top:0; left:0;
	_position:absolute; /* ie6 fix om de flash movie op de achtergrond te houden */
	_display:none;
	width:100%;
	height:100%;
	text-align:center;
}

.bgGrid {
	position:fixed; top:0; left:0;
	_position:absolute; /* ie6 fix om de flash movie op de achtergrond te houden */
	_display:none;
	background:transparent url(../images/grid.png) top left repeat;
	width:100%;
	height:100%;
}

.bgFlash {
	position:absolute; top:115px; left:0;
	width:100%;
	height:600px;
	text-align:center;
}

/* navigatie ---------------------------------------------------------------------------------------- */

.menuTop {
	width:941px;
	margin:0 auto;	
}

	.menuTop img.pijlMenu {
		margin:0 3px;
		padding:3px;
	}

	.menuTop ul {
		float:right;
		margin:7px 0 0 0;
		color:#FFFFFF;
	}

		.menuTop li {
			float:left;
			list-style:none;
		}
				
		.menuTop a {
			display:block;
			margin:0 3px;
			color:#FFFFFF;
			text-decoration:none;
			text-align:center;
		}
		
			.menuTop a:hover {
				color:#000000;
			}
		
		.menuTop a.blog {
			background:url(http://www.bubblefish.nl/template/images/ic-blog.png) top left no-repeat;
			padding:2px 10px 3px 20px;
		}
		
		.menuTop a.nieuwsbrief {
			background:url(http://www.bubblefish.nl/template/images/ic-nieuwsbrief.gif) top left no-repeat;
			padding:2px 10px 3px 20px;
		}
		
		.menuTop a.clients {
			background:url(http://www.bubblefish.nl/template/images/ic-client.png) top left no-repeat;
			padding:2px 12px 3px 16px;
			margin:0 0 0 12px;
		}
		
		.menuTop a.mobi {
			background:url(http://www.bubblefish.nl/template/images/ic-mob.png) top left no-repeat;
			padding:2px 12px 3px 16px;
			margin:0 0 0 12px;
		}
		
		.menuTop a.twitter {
			background:url(http://www.bubblefish.nl/template/images/ic-twitter.png) top left no-repeat;
			padding:2px 4px 3px 20px;
			margin:0 0 0 12px;
		}
		
			.menuTop a.twitter:hover {
			}				
					
.menu {
	clear:both;
}

	.menu ul {
		float:right;
	}

	.menu li {
		float:left;
		list-style:none;
		margin:14px 0 0 22px;
	}
	
	.menu li.knEnd {
		margin:14px 0 0 22px;
	}

	.menu a {
		color:#000000;	
		font-size:13px;
		font-weight:bold;
		text-decoration:none;
		padding:11px 9px 9px 9px;
		background:#FFFFFF;
	}
	
		.menu a:hover, .menu li:hover {
			background:#FFFFFF url(../images/mu-driehoek-rollover.gif) bottom center no-repeat;
			color:#D90000;
		}
	
		.menu li ul {
			width:195px;
			background:#D60000;
			padding:5px 0 0 0;
			margin:0 0 0 0;
		}
		
			.menu li ul li {
				margin:8px 0 0 4px;
			}
				
				.menu li ul a {
					width:179px;
					padding:0 0 6px 8px;
					color:#FFFFFF;
					font-weight:normal;
					text-decoration:none;
					text-transform:uppercase;
					background:#D60000 url(http://www.bubblefish.nl/template/images/streep-uitklap.gif) bottom left repeat-x;
				}
				
					.menu li ul a:hover {
						background:#D60000 url(http://www.bubblefish.nl/template/images/streep-uitklap.gif) bottom left repeat-x;
						color:#000000;
						cursor:pointer;
					}
					
/* actives */
body.thuis .menu .thuis,
body.overbf .menu .overbf,
body.portfolio .menu .portfolio,
body.spec .menu .spec,
body.contact .menu .contact {
	background:#D60000 url(../images/mu-driehoek-active.gif) center bottom no-repeat;
	color:#FFFFFF;
}

/* Nieuw Hoofdmenu */

.hoofdMenu {
	clear:both;
}

	.hoofdMenu ul {
		float:right;
	}

	.hoofdMenu li {
		float:left;
		list-style:none;
		margin:5px 0 0 17px;
	}
	
	.hoofdMenu li.knEnd {
		margin:5px 0 0 17px;
	}

	.hoofdMenu a {
		color:#000000;	
		font-size:12px;
		font-weight:bold;
		text-decoration:none;
		padding:11px 9px 9px 9px;
		background:#FFFFFF;
	}
	
		.hoofdMenu a:hover, .hoofdMenu li:hover {
			background:#FFFFFF url(../images/mu-driehoek-rollover.gif) bottom center no-repeat;
			color:#D90000;
		}
	
		.hoofdMenu li ul {
			width:195px;
			background:#D60000;
			padding:5px 0 0 0;
			margin:0 0 0 0;
		}
		
			.hoofdMenu li ul li {
				margin:8px 0 0 4px;
			}
				
				.hoofdMenu li ul a {
					width:179px;
					padding:0 0 6px 8px;
					color:#FFFFFF;
					font-weight:normal;
					text-decoration:none;
					text-transform:uppercase;
					background:#D60000 url(http://www.bubblefish.nl/template/images/streep-uitklap.gif) bottom left repeat-x;
				}
				
					.hoofdMenu li ul a:hover {
						background:#D60000 url(http://www.bubblefish.nl/template/images/streep-uitklap.gif) bottom left repeat-x;
						color:#000000;
						cursor:pointer;
					}
					
/* actives */
body.thuis .hoofdMenu .thuis,
body.overbf .hoofdMenu .overbf,
body.portfolio .hoofdMenu .portfolio,
body.spec .hoofdMenu .spec,
body.contact .hoofdMenu .contact {
	background:#D60000 url(../images/mu-driehoek-active.gif) center bottom no-repeat;
	color:#FFFFFF;
}

/* suckerfish werking */

#nav a {
	display: block;
}

#nav li {
	float: left;
}

#nav li ul {
	position: absolute;
	left: -999em;
}

#nav li:hover ul, #nav li.sfhover ul {
	z-index:200;
	left: auto;
	/**margin:26px 0 0 -181px;  ie fix */
}
	#nav li:hover ul.contactUitklap, #nav li.sfhover ul.contactUitklap {
		margin-left:-115px;
		/**margin:26px 0 0 -181px;  ie fix */ 
	}
		
/* content pagina's ---------------------------------------------------------------------------------------- */

.contentInner {
	float:left;
	background:#FFFFFF;
	padding:20px 30px 20px 30px;
}

	.links {
		width:526px;
		margin:5px 0 0 0;
	}
	
		.links ul {
			list-style:inside;
		}

.rechts {
	width:177px;
	float:left;
	background:#FFFFFF;
	margin:0 0 0 137px;
	padding:20px 20px 20px 20px;
	_padding:15px 15px 15px 0px; /* ie6 fix */
}
	
	.rechts li, .contentTeamRechts li {
		list-style:none;
		margin:0 0 3px 0;
	}
	
		.rechts li a, .contentTeamRechts li a {
			display:block;
			color:#000000;
			padding:0 0 0 20px;
			font-size:12px;
			text-decoration:none;
			text-transform:uppercase;
		}
		
			.rechts li a:hover, .contentTeamRechts li a:hover {
				color:#D60000;
				text-decoration:underline;
				background:transparent url(http://www.bubblefish.nl/template/images/rechts-pijl.gif) top left no-repeat;
				padding:0 0 0 20px;
			}

/* actives zij menu's */

/* over bf cat */
body.onzevisie .rechts li a.onzevisie,
body.zowerkenwij .rechts li a.zowerkenwij,
body.clients .rechts li a.clients,
body.demensen .rechts li a.demensen,
body.vacatures .rechts li a.vacatures,
/* hoofd cat */
body.corporatewebsites .rechts li a.corporatewebsites,
body.actiewebsites .rechts li a.actiewebsites,
body.webshops .rechts li a.webshops,
body.mobielewebsites .rechts li a.mobielewebsites,
body.iphoneapplicaties .rechts li a.iphoneapplicaties,
body.onlinemarketing .rechts li a.onlinemarketing,
/* relevant corparate */
body.adviesstrategie .rechts li a.adviesstrategie,
body.conceptdesign .rechts li a.conceptdesign,
body.mobielconceptdesign .rechts li a.conceptdesign,
body.webdevelopment .rechts li a.webdevelopment,
body.mobielwebdevelopment .rechts li a.mobielwebdevelopment,
body.flashdesigndevelopment .rechts li a.flashdesigndevelopment,
body.cms .rechts li a.cms,
body.hostingdomeinregistratie .rechts li a.hostingdomeinregistratie,
body.googleadwords .rechts li a.googleadwords,
body.googleanalytics .rechts li a.googleanalytics,
body.zoekmachineoptimalisatie .rechts li a.zoekmachineoptimalisatie,
body.onlinebetalen .rechts li a.onlinebetalen,
body.leadgeneration .rechts li a.leadgeneration,
body.socialcommunities .rechts li a.socialcommunities,
body.emailmarketing .rechts li a.emailmarketing,
body.smsmarketing .rechts li a.smsmarketing,
body.viralcampagnes .rechts li a.viralcampagnes,
body.website_analyse .rechts li a.websiteanalyse,
/* team */
body.leon .contentTeamRechts li a.leon,
body.deborah .contentTeamRechts li a.deborah,
body.isa .contentTeamRechts li a.isa,
body.mariola .contentTeamRechts li a.mariola,
body.thomas .contentTeamRechts li a.thomas,
body.vincent .contentTeamRechts li a.vincent,
body.marielle .contentTeamRechts li a.marielle,
body.robbert .contentTeamRechts li a.robbert, 
body.paul .contentTeamRechts li a.paul, 
body.geert .contentTeamRechts li a.geert,
body.sven .contentTeamRechts li a.sven,
body.kim .contentTeamRechts li a.kim,
body.antoine .contentTeamRechts li a.antoine,
body.vincentv .contentTeamRechts li a.vincentv {
	background:transparent url(http://www.bubblefish.nl/template/images/rechts-pijl.gif) top left no-repeat;
	color:#D60000;
}


/* */

h1.contentTitel {
	line-height:32px;
}

h1.projectTitel {
	line-height:32px;
}

h1.algTitel {
	line-height:32px;
}

h3.projectTitel, h2.projectTitel, h2.teamTitel {
	clear:both;
	font-size:16px;
	font-weight:normal;
	color:#D90000;
	line-height:auto;
}

h3.relevantTitel, h2.relevantTitel {
	clear:both;
	height:20px;
	line-height:auto;
	border-bottom:1px solid #000000;
	margin:10px 0 0 0;
}

h3.adresTitel, h2.adresTitel {
	clear:both;
	width:339px;
	height:41px;
	text-indent:-3999em;
	margin:0 0 15px 0;
	background:#FFFFFF url(http://www.bubblefish.nl/template/images/adres-titelbalk.gif) top right no-repeat;	
}

h3.routeTitel, h2.routeTitel {
	clear:both;
	height:25px;
	line-height:auto;
	border-bottom:1px solid #000000;
	margin:10px 0 15px 0;
}

h2.overbubblefish {
	background:transparent url(http://www.bubblefish.nl/template/images/h2-overbubblefish.gif) top left no-repeat;
	display:block;
	text-indent:-3999em;
	width:178px;
	height:42px;
	margin:0 0 5px 0;
}

h2.specialismes {
	background:transparent url(http://www.bubblefish.nl/template/images/h2-specialisme.gif) top left no-repeat;
	display:block;
	text-indent:-3999em;
	width:156px;
	height:42px;
	margin:0 0 5px 0;
}

h2.relevant {
	background:transparent url(http://www.bubblefish.nl/template/images/h2-relevant.gif) top left no-repeat;
	display:block;
	text-indent:-3999em;
	width:133px;
	height:34px;
	margin:25px 0 5px 0;
}

	.content h2 {
	}
	
	.content h4 {
		font-size:14px;
		color:#D90000;
		margin:0 0 6px 0;
	}

.content p {
	margin:0 0 18px 0;
}

.content p.red, .content b.red  {
	color:#D90000;
	line-height:155%;
}

.content i {
	font-size:12px;
}

.content hr, .contentAlgemeen hr, .contentContact hr, .contentContact hr  {
	border:0;
	color:#FFFFFF;
	clear:both;
}

.imgLeft {
	float:left;
	margin:5px 8px 8px 0;
}

.imgRight {
	float:right;
	margin:5px 0 8px 8px;
}

/* clients ---------------------------------------------------------------------------------------- */

.contentInnerClients {
	float:left;
	background:#FFFFFF;
	width:542px;
	padding:20px 30px 20px 12px;
}

	.contentInnerClients h1 {
		margin:0 0 0 18px;
	}
	
	.contentInnerClients p {
		margin:0 0 10px 18px;
	}

.clientLogo {
	background:#CCCCCC;
	padding:6px;
	margin:0 0 18px 18px;
}
	
/* specialisme ---------------------------------------------------------------------------------------- */

.contentOnder {
	clear:both;
	width:455px;
	margin:35px 0 0 0;
}

.contentOnder img {
	clear:both;
	float:none;
	margin:0;
	padding:0;
}

.contentOnderLinks {
	clear:left;
	float:left;
	padding:0;
	margin:0 19px 0 0;
}

.contentOnderRechts {
	float:left;
	padding:0;
	margin:0;
}

form.relevant {
	background:transparent url(../images/uitklap-bg.png) top left no-repeat;
	padding:9px 25px 11px 25px;
	width:180px;
}

a.contactKn {
	display:block;
	width:140px;
	height:32px;
	margin:0 0 0 -2px;
	padding:0;
	background:url(http://www.bubblefish.nl/template/images/contactKn.png) top left no-repeat;
	text-indent:-3999em;
	outline:none;
}

	a.contactKn:hover {
		background:url(http://www.bubblefish.nl/template/images/contactKn.png) bottom left no-repeat;
		cursor:pointer;
		margin:0 0 0 -2px;
		padding:0 3px 0 0;
	}

	
/* portfolio ---------------------------------------------------------------------------------------- */

.titelbalk {
	position:relative;
	margin:0 0 25px 0;
}
	
	.titelbalk h1 {
		position:absolute;
		color:#FFFFFF;
		font-size:17px;
		font-weight:normal;
		margin:11px 5px 12px 16px;
		width:400px;
	}
	
	.uitklap select {
		padding:1px;
		_display:none;
	}
	
		.uitklap select option {
			padding:0 3px;
		}

.addthis_toolbox {
	margin:10px 0;
}

.content .addthis_toolbox a, .content .addthis_toolbox a:hover {
	background-color:transparent;
	padding:0!important;
	margin:0 16px 0 0!important;
}

.uitklap form.specialisme {
	position:absolute;
	margin:9px 0 0 493px;
}

.uitklap form.branche {
	position:absolute;
	margin:9px 0 0 690px;
}

.project {
	float:left;
	height:220px;
	margin:0 6px 0 4px;
}

	.project:hover {
		cursor:pointer;
	}

	.project h2 {
		clear:left;
		float:left;
		width:268px;
		font-size:13px;
		font-family:Arial, Helvetica, sans-serif;
		font-weight:normal;
		margin:7px 0 0 8px;
		text-transform:uppercase;
	}
	
		.project:hover h2 {
			color:#D60000;
		}
		
	.project h3 {
		clear:left;
		float:left;
		font-size:13px;
		font-family:Arial, Helvetica, sans-serif;
		font-weight:normal;
		color:#666666;
		margin:0 0 0 8px;
		text-transform:uppercase;
	}
	
		.project:hover h3 {
			color:#D60000;
		}		

.projectImg {
	background-position:top left;
	background-repeat:no-repeat;
	width:300px;
	height:151px;
}

	.project:hover .projectImg {
		background-position:bottom left;
		filter:alpha(opacity=80);
		-moz-opacity:0.8;
		-khtml-opacity: 0.8;
		opacity: 0.8;
	}

.pijltjePort {
	float:left;
	margin:12px 0 0 8px;
}

.navBalk {
	position:relative;
	clear:both;
}

	.navBalk .vorige {
		float:right;
	}

		.navBalk .vorige a {
			display:block;
			width:140px;
			height:32px;
			margin:0 1px 0 0;
			background:url(http://www.bubblefish.nl/template/images/vorigeKn.jpg) top left no-repeat;
			text-indent:-3999em;
			outline:none;	
		}
		
			.navBalk .vorige a:hover  {
				padding:0;
				background:url(http://www.bubblefish.nl/template/images/vorigeKn.jpg) bottom left no-repeat;
			}

	.navBalk .volgende {
		float:left;
	}

		.navBalk .volgende a {
			display:block;
			width:140px;
			height:32px;
			margin:0 0 0 2px;
			background:url(http://www.bubblefish.nl/template/images/volgendeKn.jpg) top left no-repeat;
			text-indent:-3999em;
			outline:none;
		}
		
			.navBalk .volgende a:hover  {
				padding:0;
				background:url(http://www.bubblefish.nl/template/images/volgendeKn.jpg) bottom left no-repeat;
			}
	
	/* clients */
	.navBalk .vorigeC {
		float:left;
		margin:0 0 0 2px;
	}

		.navBalk .vorigeC a {
			display:block;
			width:90px;
			height:31px;
			padding:0;
			*margin:0 0 0 2px; /* ie hack */
			background:url(http://www.bubblefish.nl/template/images/vorigeKnC.jpg) top left no-repeat;
			text-indent:-3999em;
			outline:none;
		}
		
			.navBalk .vorigeC a:hover  {
				background:url(http://www.bubblefish.nl/template/images/vorigeKnC.jpg) bottom left no-repeat;
				cursor:pointer;
			}

	.navBalk .volgendeC {
		float:right;
	}

		.navBalk .volgendeC a {
			display:block;
			width:90px;
			height:31px;
			padding:0 0 0 1px;
			background:url(http://www.bubblefish.nl/template/images/volgendeKnC.jpg) top left no-repeat;
			text-indent:-3999em;
			outline:none;
		}
		
			.navBalk .volgendeC a:hover  {
				background:url(http://www.bubblefish.nl/template/images/volgendeKnC.jpg) bottom left no-repeat;
				cursor:pointer;
			}

.streepNav {
	margin:0 3px 0 4px;
	border-top:1px solid #000000;
}

/* detail */

.projectLinks {
	float:left;
	width:370px;
	margin:0 30px 0 12px;
	_margin:0 30px 0 6px; /* ie6 hack */
}

.specLinks {
	clear:left;
	float:left;
	width:110px;
	font-size:12px;
	font-weight:bold;
	margin:0 0 8px 0;
}

.specRechts {
	float:left;
	width:240px;
	font-size:12px;
	margin:0 0 8px 0;
}
	
.projectTekst {
	font-size:12px;
	line-height:140%;
	padding:2px 0 10px 0;
}

.emptyspaces {
	clear:both;
	height:15px;
}

.projectRechts {
	float:left; max-width:525px;
}

.opdracht, .oplossing {
	float:left;
	width:45%;
	padding:25px 0 0 0;
}

.opdracht {
	margin:0 10% 0 0;
}

/* portfolio images */

.imgBig {
	padding:5px 6px;
	background:#CCCCCC;
}

	/*.imgBig:hover {
		padding:5px 6px;
		background:#555555;
		filter:alpha(opacity=70);
		-moz-opacity:0.7;
		-khtml-opacity: 0.7;
		opacity: 0.7;
	}*/

a.imgBigLink:hover {
	background:#d90000;
	color:#FFFFFF;
	text-decoration:none;
	padding:0;
}

.imgSmall {
	float:left;
	width:109px;
	margin:9px 9px 9px 0;
	padding:5px 5px;
	background:#CCCCCC;
	cursor:pointer;
}

	.imgSmall:hover {
		background:#555555;
		cursor:pointer;
		filter:alpha(opacity=70);
		-moz-opacity:0.7;
		-khtml-opacity: 0.7;
		opacity: 0.7;

	}

/*nav balk */

.navBalk .ouProject {
	float:right;
}

	.navBalk .ouProject a {
		display:block;
		width:140px;
		height:32px;
		margin:0 1px 0 0;
		background:url(http://www.bubblefish.nl/template/images/kn-ou-project.png) top left no-repeat;
		text-indent:-3999em;
		outline:none;	
	}
	
		.navBalk .ouProject a:hover  {
			padding:0;
			background:url(http://www.bubblefish.nl/template/images/kn-ou-project.png) bottom left no-repeat;
		}

.navBalk .nwProject {
	float:left;
}

	.navBalk .nwProject a {
		display:block;
		width:140px;
		height:32px;
		margin:0 0 0 2px;
		background:url(http://www.bubblefish.nl/template/images/kn-nw-project.png) top left no-repeat;
		text-indent:-3999em;
		outline:none;	
	}
	
		.navBalk .nwProject a:hover  {
			padding:0;
			background:url(http://www.bubblefish.nl/template/images/kn-nw-project.png) bottom left no-repeat;
		}

.navBalk .terugOverzicht {
	float:left;
	margin:0 0 0 257px;
}

	.navBalk .terugOverzicht a {
		display:block;
		width:140px;
		height:32px;
		margin:0 0 0 2px;
		background:url(http://www.bubblefish.nl/template/images/terugOverzichtKn.png) top left no-repeat;
		text-indent:-3999em;
		outline:none;	
	}
	
		.navBalk .terugOverzicht a:hover  {
			padding:0;
			background:url(http://www.bubblefish.nl/template/images/terugOverzichtKn.png) bottom left no-repeat;
		}

.portfolioOnderRechts {
	float:right;
	padding:0;
	margin:0;
}

	.navBalk .portfolioOnderRechts a {
		display:block;
		width:140px;
		height:32px;
		padding:0 1px 0 0;
		background:url(http://www.bubblefish.nl/template/images/contactKn.png) top left no-repeat;
		text-indent:-3999em;
		outline:none;	
	}
	
		.navBalk .portfolioOnderRechts a:hover {
			padding:0 1px 0 0;
			background:url(http://www.bubblefish.nl/template/images/contactKn.png) bottom left no-repeat;
		}

/* Algemeen */

.contentInnerAlg {
	float:left;
	width:350px;
	padding:15px 30px 15px 30px;
	background:#FFFFFF;
}

/* Team */

.contentTeamInfo {
	float:left;
	background:#FFFFFF;
	padding:15px 30px 15px 30px;
	width:640px;
	height:385px;
	line-height:140%;
}

	.contentTeamInfo p {
		width:350px;
	}

.contentTeamRechts {
	float:right;
	width:177px;
	margin:0 0px 0 0;
	padding:20px 20px 20px 20px;
	_padding:15px 15px 15px 0px; /* ie6 fix */ 
	background:#FFFFFF;
}

	.contentTeamRechts ul {
		margin:4px 0 0 3px;
	}

h1.teamMenu {
	display:block;
	background:url(../images/titel-team.png) top left no-repeat;
	width:186px;
	height:37px;
	text-indent:-3999em;
}

/* contact */

.contactLinks2 {
	float:left;
	width:350px;
	font-size:12px;
	margin:15px 40px 15px 30px;
	_margin:15px 20px 15px 20px;
}

.blokLinks2 {
	float:left;
	width:180px;
	margin:0 0 30px 0;
}

.blokRechts2 {
	float:left;
	width:169px;
	margin:0 0 30px 0;
}

.contactLinks {
	clear:left;
	float:left;
	font-size:12px;
	margin:0 0 15px 0;
}

	.contactLinks ul {
		margin:4px 0 15px 0;
		list-style:none;
	}
	
	.contactLinks li {
		margin:0 0 4px 0;
	}
	
	.contentInnerForm .contactLinks h1 {
		margin:0;
	}
	
	.contactLinks iframe {
		padding:5px 6px;
		background:#CCCCCC;
		margin:8px 0 0 0;
	}
	
.blokLinks {
	clear:left;
	float:left;
	width:220px;
	margin:0 10px 0 0;
}

.blokLinksRoute {
	clear: left;
	float:left;	
	width:440px;
	margin:0 10px 0 0;
}

.blokRechts {
	float:left;
	width:220px;
	margin:0 0 0 0;
}

.adresLinks {
	clear:left;
	float:left;
	font-weight:bold;
	width:55px;
}

.adresRechts {
	float:left;
	width:125px;
}

.route {
	clear:both;
	margin:25px 0 0 0;
}

.route li {
	font-size: 12px;
}

.routeLinks {
	clear:left;
	float:left;
	width:100px;
	margin:0 0 8px 0;
	font-weight:bold;
}

.routeRechts {
	float:left;
	margin:0 0 8px 0;
}

.inputfield {
	width:150px;
}

.contactRechts {
	float:left;
	padding:13px 5px 10px 0;
}

a.planroute {
	background:transparent url(../images/planroute.gif) top left no-repeat;
	display:block;
	width:132px;
	height:37px;
	margin:0 0 0 127px;
	text-indent:-3999em;
	outline:none;
}
	
	a.planroute:hover {
		background:transparent url(../images/planroute.gif) bottom left no-repeat;
		padding:0;
		margin:0 0 0 127px;
		cursor:pointer;
	}


/* formulier */

.contactText {
	font-size:13px;
	line-height:160%;
	padding:0 30px 0 0;
}

.contentInnerForm {
	float:left;
	width:526px;
	padding:15px 30px 15px 30px;
	background:#FFFFFF;
}

.formBreed {
	clear:left;
	margin:0 0 8px 0;
}

.formLinks {
	clear:left;
	float:left;
	width:220px;
	font-size:13px;
	margin:0 0 8px 0;
	font-weight:bold;
}

.formRechts {
	float:left;
	margin:0 0 8px 0;
}

	.formRechts input, .formRechts option, .formRechts textarea {
		font-family:Arial, Helvetica, sans-serif;
		font-size:13px;
	}

.verzendknop {
	float:right;
	border:0;
	background:url(../images/knop.gif) top left no-repeat;
	width:90px;
	height:31px;
	font-size:14px;
	font-weight:normal;
	color:#FFFFFF;
	padding:0 0 8px 0;
	margin:0 16px 0 0;
}

	.verzendknop:hover {
		color:#BBBBBB;
		cursor:pointer;
	}

/* nieuwsbrief ---------------------------------------------------------------------------------------- */

.nieuwsbriefLinks {
	clear:left;
	float:left;
	width:100px;
	margin:9px 0 4px 0;
}

.nieuwsbriefRechts {
	float:left;
	margin:13px 0 4px 0;
}

	.nieuwsbriefRechts input {
		width:290px;
	}

.nieuwsbriefDubbel {
	clear:both;
	width:414px;
	*width:412px; /* ie hack */
	margin:0 0 0 0;
}

	.aanmeldknop {
		float:right;
		border:0;
		background:url(../images/knop.gif) top left no-repeat;
		width:90px;
		height:31px;
		font-size:14px;
		font-weight:normal;
		color:#FFFFFF;
		padding:0 0 8px 0;
		*padding:2px 0 8px 0; /* ie hack */
		margin:0 16px 0 0;
	}
	
		.aanmeldknop:hover {
			color:#BBBBBB;
			cursor:pointer;
		}

.nieuwsbriefVerplicht {
	clear:both;
	margin:10px 0 0 0;
	font-size:11px;
}

.nieuwsbriefVoorwaarden {
	font-size:11px;
	margin:25px 0 0 0;
	padding:10px 0 0 0;
	border-top:1px solid #000000;
}

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

ul.sitemap {
	list-style:none none;
	line-height:160%;
}

	ul.sitemap li {
		font-weight:bold;
	}

		ul.sitemap ul {
			list-style:none none;
			margin:0 0 5px 15px;
		}
	
			ul.sitemap li li {
				font-weight:normal;
			}

/* footer ---------------------------------------------------------------------------------------- */

.footer {
	z-index:4;
	position:absolute; bottom:0px;
	width:100%;
	background:transparent url(http://www.bubblefish.nl/template/images/footer3.png) top left repeat-x;
	padding:0 0 0 0;	
}

.footerInner {
	width:940px;
	margin:0 auto;
	padding:18px 0;
}

.footerBlok, .footerEnd {
	float:left;
	width:224px;
	margin:0 18px 0 0;
}

.footerEnd {
	margin:0 0 30px 0;
}

.footerBlok {
	margin:0 14px 30px 0;
	*margin:0 10px 30px 0;
}

	.footerBlok h1.case {
		display:block;
		background:transparent url(../images/footer-titel-portfolio.png) top left no-repeat;
		text-indent:-3999em;
		font-size:12px;
		margin:0 0 5px 0;
	}

	.footerBlok h1.opdrachtgevers {
		display:block;
		background:transparent url(../images/footer-titel-opdracht.gif) top left no-repeat;
		text-indent:-3999em;
		font-size:12px;
		margin:0 0 5px 0;
	}

	.footerBlok h1.campagne {
		display:block;
		background:transparent url(../images/footer-titel-campagne.gif) top left no-repeat;
		text-indent:-3999em;
		font-size:12px;
		margin:0 0 5px 0;
	}
	
	.footerBlok h1.mobiele {
		display:block;
		background:transparent url(../images/iphoneapp.png) top left no-repeat;
		text-indent:-3999em;
		font-size:12px;
		margin:0 0 5px 0;
	}
	
	.footerBlok h1.vacaturePhp {
		display:block;
		background:transparent url(../images/footer-titel-vacature-php.gif) top left no-repeat;
		text-indent:-3999em;
		font-size:12px;
		margin:0 0 5px 0;
	}
	
	.footerBlok h1.werkenBij {
		display:block;
		background:transparent url(../images/footer-titel-magento.png) top left no-repeat;
		text-indent:-3999em;
		font-size:12px;
		margin:0 0 5px 0;
	}
	
	.footerEnd h1.nieuws {
		display:block;
		background:transparent url(../images/bftweet.png) top left no-repeat;
		text-indent:-3999em;
		font-size:12px;
		margin:0 0 5px 0;
	}

	.footerBlok img, .footerEnd img {
		background:transparent url(http://www.bubblefish.nl/template/images/bg-footer-item.jpg) top left no-repeat;
		padding:7px 8px;
	}
	
		.footerBlok:hover {
			cursor:pointer;
		}
	
		.footerBlok:hover img {
			background:transparent url(http://www.bubblefish.nl/template/images/bg-footer-item.jpg) bottom left no-repeat;
			padding:8px 8px 7px 8px;
		}
		
		.footerBlok:hover a u, .footerEnd a:hover u  {
			color:#000000;
		}
		
	.footerCase1 {
		display:block;
		background:transparent url(http://www.bubblefish.nl/images/footer/hny.jpg) top left no-repeat;
		width:224px;
		height:126px;
	}
	.footerCase2 {
		display:block;
		background:transparent url(http://www.bubblefish.nl/images/footer/promade.jpg) top left no-repeat;
		width:224px;
		height:126px;
	}
	.footerCase3 {
		display:block;
		background:transparent url(http://www.bubblefish.nl/images/footer/nl-igf.jpg) top left no-repeat;
		width:224px;
		height:126px;
	}
	.footerCase4 {
		display:block;
		background:transparent url(http://www.bubblefish.nl/images/footer/rotterdampas-mobiel.jpg) top left no-repeat;
		width:224px;
		height:126px;
	}
	.footerCase5 {
		display:block;
		background:transparent url(http://www.bubblefish.nl/images/footer/ecp-epn-motiondesign.jpg) top left no-repeat;
		width:224px;
		height:126px;
	}
	.footerCase6 {
		display:block;
		background:transparent url(http://www.bubblefish.nl/images/footer/selecta.jpg) top left no-repeat;
		width:224px;
		height:126px;
	}
	
	.footerClients {
		display:block;
		background:transparent url(http://www.bubblefish.nl/images/footer/opdrachtgevers.jpg) top left no-repeat;
		width:224px;
		height:126px;
	}
	
	.footerMobiel {
		display:block;
		background:transparent url(http://www.bubblefish.nl/images/footer/mobiele.jpg) top left no-repeat;
		width:224px;
		height:126px;
	}
	
	.footerTwitter {
		display:block;
		background:transparent url(http://www.bubblefish.nl/images/footer/twitter.jpg) top left no-repeat;
		width:224px;
		height:126px;
	}
	
	.footerVacaturePhp {
		display:block;
		background:transparent url(http://www.bubblefish.nl/images/footer/vacature.jpg) top left no-repeat;
		width:224px;
		height:126px;
	}
	
	.footerWerkenBij {
		display:block;
		background:transparent url(http://www.bubblefish.nl/images/footer/magento.png) top left no-repeat;
		width:224px;
		height:126px;
	}
	
	.footerCase1:hover,
	.footerCase2:hover,
	.footerCase3:hover,
	.footerCase4:hover,
	.footerCase5:hover,
	.footerCase6:hover,
	.footerClients:hover, 
	.footerMobiel:hover, 
	.footerVacaturePhp:hover, 
	.footerWerkenBij:hover {
		background-position:bottom left;
	}
	
	.footerCase1 a,
	.footerCase2 a,
	.footerCase3 a,
	.footerCase4 a,
	.footerCase5 a,
	.footerCase6 a, 
	.footerClients a, 
	.footerMobiel a, 
	.footerTwitter a, 
	.footerVacaturePhp a, 
	.footerWerkenBij a {
		display:block;
		width:224px;
		height:126px;
	}
		
	
	.footerBlok p, .footerEnd p {
		color:#FFFFFF;
		padding:3px 0 3px 8px;
		line-height:18zpx;
	}
	
		.footerBlok p a, .footerEnd p a {
			color:#FFFFFF;
			text-decoration:none;
			line-height:140%;
		}
		
		
	.twitteraar { /*twitter in footer*/
		background:url(http://www.bubblefish.nl/images/footer/twittervlak.jpg) top left no-repeat;
		height:102px;
		width:204px;
		font-size:13px;
		color:#000000;
		padding:12px 20px 12px 12px;
		font-family:Arial, Helvetica, sans-serif;
		outline:none;
	}
	
		.twitteraar a {
			color:#666666;
			text-decoration:underline;
		}
		
		.twitteraar a:hover {
			background:#d90000;
			color:#FFFFFF;
			text-decoration:none;
			padding:2px 0;
		}
		
		.timestamp {
			font-size:10px;
		}
		
		.twitteraar ul {
			list-style:none;
		}
		
		.twitteraar li {
			list-style:none;
			*margin:0px 0px 0px 0px;
		}
		
		#twitter_update_list {
			width:190px;
		}
		
	.twitterblauw {
		background:url(http://www.bubblefish.nl/images/footer/twitterblauw.png) top left no-repeat;
		width:75px;
		height:20px;
		text-indent:-399em;
		outline:none;
		margin:0px 0px 0px -1px;
		*margin:-5px 0px 0px 0px;
	}
	
.footerStreep {
	clear:both;
	position:relative;
	/*background:#68150D;*/
	margin:0;
	line-height:180%;
}

	.footerStreepInner {
		width:1000px;
		margin:0 auto;
		font-size:11px;
		color:#FFFFFF;
	}

	.footerStreepInner a {
		display:inline-block;
		margin:0 5px;
		color:#FFFFFF;
		text-decoration:none;
	}
		
		.footerStreepInner a:hover {
			text-decoration:underline;
		}

	.footerStreepInner a.copy {
		margin:0;
		text-decoration:none;
	}
	
		.footerStreepInner a.copy {
			text-decoration:none;
		}

	.footerStreepInner a.email {
		margin:0;
	}
	
	.footerStreepInner a.stmp {
		margin:0 0 0 342px;
	}
	
		.footerStreepInner p {
			padding:7px 0 7px 35px;
		}

.footer hr {
	clear:both;
	border:0;
	color:#8a0101;
	margin:0;
}

.footerStreepLogos {
	width:940px;
	margin:0 auto;
}

.footerStraapLogosLinks {
	float:left;
}

.footerStraapLogosRechts {
	float:right;
	/*margin-bottom:-5px;*/
 	/*margin-top:-23px;*/
}

.twitterlogo {
margin-left:10px;
margin-right:2px;
}
.facebooklogo {
margin-right:2px;
}
.linkedinlogo {
margin-right:2px;
}

.footerStraapLogosRechts img { padding: 0!important; }

	.footerStreepLogos img.titel {
		padding:11px 0 0 0;	
	}
	
	.footerStreepLogos img {
		padding:5px 0 8px 0;	
	}
	
	.footerStreepLogos a img:hover {
		filter:alpha(opacity=80);
		-moz-opacity:0.8;
		-khtml-opacity: 0.8;
		opacity: 0.8;	
	}

.contentAlgemeen li {
	*width:400px;
}

/*****************************************************************************
scalable Inman Flash Replacement (sIFR) version 3.

Copyright 2006 – 2008 Mark Wubben, <http://novemberborn.net/>

Older versions:
* IFR by Shaun Inman
* sIFR 1.0 by Mike Davidson, Shaun Inman and Tomas Jogin
* sIFR 2.0 by Mike Davidson, Shaun Inman, Tomas Jogin and Mark Wubben

See also <http://novemberborn.net/sifr3> and <http://wiki.novemberborn.net/sifr3>.

This software is licensed and provided under the CC-GNU LGPL.
See <http://creativecommons.org/licenses/LGPL/2.1/>
*****************************************************************************/

@media screen {
  .sIFR-flash {
    visibility: visible !important;
    margin: 0;
    padding: 0;
  }
  
  .sIFR-replaced, .sIFR-ignore {
    visibility: visible !important;
  }
  
  .sIFR-alternate {
    position: absolute;
    left: 0;
    top: 0;
    width: 0;
    height: 0;
    display: block;
    overflow: hidden;
  }
  
  .sIFR-replaced div.sIFR-fixfocus {
    margin: 0pt; 
    padding: 0pt; 
    overflow: auto; 
    letter-spacing: 0px; 
    float: none;
  }
}

@media print {
  .sIFR-flash {
    display    : none !important;
    height     : 0;
    width      : 0;
    position   : absolute;
    overflow   : hidden;
  }
  
  .sIFR-alternate {
    visibility : visible !important;
    display    : block   !important;
    position   : static  !important;
    left       : auto    !important;
    top        : auto    !important;
    width      : auto    !important;
    height     : auto    !important;
  }
}

/*
Place CSS rules for to-be-replaced elements here. Prefix by .sIFR-active
so they only apply if sIFR is active. Make sure to limit the CSS to the screen
media type, in order not to have the printed text come out weird.
*/
@media screen {
  /* Example:
  .sIFR-active h1 {
    font-family: Verdana;
    visibility: hidden;
  }
  */
}

.eelogo {
	margin-left:5px;
}
.steveflash
{
	width:939px;
	margin:0 auto;
}
.steve
{
	width:939px;
	margin:0 auto;
	margin-top:20px;
}