/* @override http://www.systeme-d.com/css/_styles_wit.css */

@import url(http://fonts.googleapis.com/css?family=Lato:300,400,700);

@font-face {
	font-family: 'icomoon';
	src:url('../fonts/icomoon.eot');
	src:url('../fonts/icomoon.eot?#iefix') format('embedded-opentype'),
		url('../fonts/icomoon.woff') format('woff'),
		url('../fonts/icomoon.ttf') format('truetype'),
		url('../fonts/icomoon.svg#icomoon') format('svg');
	font-weight: normal;
	font-style: normal;map
}

body, html { font-size: 100%; padding: 0; margin: 0; height: 100%;}

*,
*:after,
*:before {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}


body {
    font-family: 'Lato', Calibri, Arial, sans-serif;
    color: #f2ede3;
    background: #333;
    font-size: 0.9em;
    font-weight: 300;
}

a {
	color: #f0f0f0;
	text-decoration: none;
	font-weight: 700;
	padding: 0 5px;
	font-size: 80%;
}

a:hover {
	color: #000;
}

.container { height: 100%; }

.bl-main {
	position: absolute;
	width: 100%;
	height: 100%;
	overflow: hidden;
}

.bl-main > section {
	position: absolute;
	width: 50%;
	height: 50%;
}

.bl-main > section:first-child {
	top: 0;
	left: 0;
	background: #00fcff;
	border-right: 0px solid #00fcff;
	border-bottom:0px solid lime;
}

.bl-main > section:nth-child(2) {
	top: 0;
	left: 50%;
	background: lime;
	border-bottom: 0px solid #fef400;
}

.bl-main > section:nth-child(3) {
	top: 50%;
	left: 0;
	background: yellow;
	border-right: 0px solid #00fcff;
}

.bl-main > section:nth-child(4) {
	top: 50%;
	left: 50%;
	background: #feebff;
}




.bl-box {
	position: relative;
	width: 100%;
	height: 100%;
	cursor: pointer;
	opacity: 1;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
     -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: center;
    -moz-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -moz-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

.bl-box h2 {
	text-align: center;
	padding: 20px;
	font-size: 1.3em;
	letter-spacing: 1px;
	font-weight: normal;
	text-transform: uppercase;
	margin-top:-1.3em;
	line-height:1.3em;
	width: 100%;
}


.lt-ie10 .bl-box h2 {
	position:absolute;
	text-align:center;
	display: block;
	top:50%;
}


.bl-box h2.wie {	
	color: #000;
	margin-top: 5%;
}
.bl-box h2.portfolio {	
	color: #000;
}
.bl-box h2.diensten {	
	color: #000;
	margin-top: 5%;
}
.bl-box h2.contact {	
	color: #000;
}

.chromeframe {
	text-align:center;
	background-color: #fff;
	padding-top: 30px;
	padding-bottom: 20px;
	color: #ff3be3;
}
.chromeframe a {
	color: #ff3be3;
}


.lazy {
  display: none;
}


.bl-icon-close img {
 cursor: pointer;
}

.bl-icon:before {
	display: block;
	font-size: 2em;
	margin-bottom: 10px;
}

.bl-main > section .bl-icon-close {
	position: absolute;
	top: 70px;
	right: 70px;
	cursor: pointer;
	z-index: 100;
	opacity: 0;
	pointer-events: none;
}



.bl-content, 
div.bl-panel-items > div > div {
	opacity: 0;
	pointer-events: none;
	position: absolute;
	top: 60px;
	left: 30px;
	right: 30px;
	bottom: 30px;
	padding:40px 20px 0;
	overflow: hidden;
	overflow-y: auto;
	-webkit-overflow-scrolling_: touch;
}


.googlemap {
	overflow: visible!important;
}
.mailto {
	font-family: 'Lato', Calibri, Arial, sans-serif;
    color: #000;
	text-decoration: none;
	font-weight: 300;
	padding: 0px;
	font-size: 100%;
}

.lf {
	float:left;
	width:40%; 
	max-width:500px;
	min-width:200px;
	margin-right:70px;
}

.lf.rf {
	float:left;
	width:40%; 
	margin-right:0px;
}



.lf iframe {
	width:100%!important;
	height:370px!important;
	margin-bottom:40px;
}




p.wiki {
	padding:26px 20px!important;
	font-size:1em!important;
	line-height:1.4em!important;
	background-color: #00ecee;
	margin-top:30px!important;
	margin-bottom:30px!important;
}




.bl-content p {
	margin: 0 auto;
	padding-bottom: 15px;
	font-size: 1.2em;
	line-height: 1.5;
}

.bl-content h2 {
	font-size: 2.3em;
	font-weight: 300;
	margin: 0 0 20px 0;
}

.bl-content .lf h2 {
	font-size: 1.9em;
	font-weight: 300;
	margin: 20px 0 20px 0;
	
}

.bl-content h3 {
	font-size: 1.3em;
	font-weight: 300;
	margin: 20px 0 20px 0;
	color:#000;
}


.bl-content h3.worksover {
	color:yellow;
}

.bl-content a.twitterlink {
	color: #000;
	font-weight: 300;
	font-size: .9em;
	line-height: 1.5;
}


.bl-content .lf h3 {
	font-size: 1.4em;
	font-weight: 300;
	margin: 20px 0 10px 0;
	display: inline-block;
	border-bottom: 1px solid #000;
}

.bl-content > ul {
	list-style: none;
	padding: 0;
	margin: 0;
} 

.bl-content > ul li {
	display: inline-block;
	width: 20%;
	max-width: 400px;
	margin: 1%;
}

.bl-content ul#bl-work-items.newsletters > li {
	display: inline-block;
	width: 9%;
	margin: 1%;
}


.bl-content > ul li a {
	display: block;
	padding: 0;
	border:8px solid rgba(255,255,255,0.1);
	position:relative;
}

.bl-content > ul li a:hover {
	display: block;
	padding: 0;
	border: 8px solid rgba(0,0,0,0.1);
}


.bl-content > ul li a img {
	display: block;
	max-width: 100%;
}


.bl-content > ul li a span {
	width: 100%;
	position:absolute;
	z-index:500000;
	height:100%;
	color: #000;
	left:0;
	top:0;
	text-align:center;
	padding-top:30%;
	font-size:1.2em;
	font-weight:normal!important;
	display:none;
	letter-spacing:1px!important;
	background-color: rgba(0,252,255,0.85);
}

.bl-content p.lp {
	float:left; margin-right:40px;
	margin-bottom:30px;
	margin-top:10px;
}
.bl-content p.rp {
	margin-bottom:30px;
	margin-top:10px;
}
.bl-content ul {
	font-size:1.1em;
	line-height:1.4em;
}


/* Panel Items */


div.bl-panel-items,
div.bl-panel-items > div {
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	position: absolute;
}



div.bl-panel-items > div > div {
	width: 90%;
	margin: 0 auto;
	opacity: 1;
	bottom: 90px;
	top: 60px;
	pointer-events: auto;
	color:#1f2227;
}

div.bl-panel-items > div > div h3 {
	font-size: 2.4em;
	font-weight: 300;
	margin: 0 0 20px 0;
}

div.bl-panel-items > div > div p {
	font-size: 1.2em;
	line-height:1.5em;
	
}

div.bl-panel-items > div > div img {
	float: left;
	margin: 0 0px 20px 0;
	max-width: 100%;
}



div.bl-panel-items .newsletterpanel > div > div img {
	float: left;
	margin: 0 20px 20px 0;
	max-width: 30%;
}











div.bl-panel-items > div > div p a {
	color:#1f2227;
	font-weight:300;
	text-decoration:none;
	border-bottom:1px solid #1f2227;
	font-size: 1em;
}

div.bl-panel-items > div > div p a:hover {
	color:#000;
	border-bottom:1px solid #000;
}

div.bl-panel-items > div > div .worksbeelden {
	float:left;
	max-width:50%;
	margin-right:40px;
}


div.bl-panel-items > div > div .newslettertxt {
	float:left;
	max-width:40%;
	margin-right:40px;
}

div.bl-panel-items > div > div .worksbeelden.newsletterbeelden {
	max-width:50%;
}


ul#bl-work-items.newsletters {
	background-color:#33363b;
}


.bl-content > ul li a img {
	display: block;
	max-width: 100%;
}


div.bl-panel-items {
	top: 100%;
	z-index: 9999;
}

div.bl-panel-items > div {
	background:#e7e7e7;
	z-index: 0;
	opacity: 0;
	-webkit-transform: translateY(0);
	-webkit-transition: -webkit-transform 0.5s ease-in-out, opacity 0s linear 0.5s;
	-moz-transform: translateY(0);
	-moz-transition: -moz-transform 0.5s ease-in-out, opacity 0s linear 0.5s;
	transform: translateY(0);
	transition: transform 0.5s ease-in-out, opacity 0s linear 0.5s;
	-ms-transform: translateY(0);
}

div.bl-panel-items > div.newsletterpanel  {
	background:#cdcdcd;
}


div.bl-panel-items nav {
	position: absolute;
	z-index: 9999;
	width: 100%;
	left: 0%;
	top: 0px;
	opacity: 0;
	margin:0 auto;
	-webkit-transition: opacity 0.2s ease-in-out 0.5s;
	-moz-transition: opacity 0.2s ease-in-out 0.5s;
	transition: opacity 0.2s ease-in-out 0.5s;
	border-top:1px solid #b2bed2;
	background-color:#e7e7e7;
}

div.bl-panel-items.bl-panel-items-show nav span {
	float: left;
	margin:10px 40px 10px 100px;
}


div.bl-panel-items nav span.bl-next-work {
	font-weight: 700;
	letter-spacing: 2px;
	display: block;
	text-transform: uppercase;
	line-height: 2em;
	cursor: pointer;
	margin-right: 2em;
	color:#00c1ea;
}

div.bl-panel-items nav span.bl-next-work:hover {
	color:#23262b;
}

#bl-panel-work-items nav span.bl-icon.bl-icon-close  {
	color:#00c1ea;
	margin:10px 80px 0px 0px;
	float:right;
}

#bl-panel-work-items nav span.bl-icon.bl-icon-close:hover  {
	color:#23262b;
}





div.bl-panel-items.bl-panel-items-show nav {
	opacity: 1;
	top: -50px;
}

div.bl-panel-items > div.bl-show-work {
	z-index: 1000;
	opacity: 1;
	-webkit-transform: translateY(-100%);
	-webkit-transition: -webkit-transform 0.5s ease-in-out;
	-moz-transform: translateY(-100%);
	-moz-transition: -moz-transform 0.5s ease-in-out;
	transform: translateY(-100%);
	transition: transform 0.5s ease-in-out;
	-ms-transform: translateY(-100%);
}

div.bl-panel-items > div.bl-hide-current-work {
	opacity: 0;
	-webkit-transition: -webkit-transform 0.5s ease-in-out, opacity 0.5s ease-in-out;
	-webkit-transform: translateY(-100%) scale(0.5);
	-moz-transition: -moz-transform 0.5s ease-in-out, opacity 0.5s ease-in-out;
	-moz-transform: translateY(-100%) scale(0.5);
	transition: transform 0.5s ease-in-out, opacity 0.5s ease-in-out;
	transform: translateY(-100%) scale(0.5);
	-ms-transform: translateY(-100%) scale(0.5);
	z-index: 0;
}

/* Transition classes and properties */
/* Separated for a better overview and control */

.bl-main > section {
	-webkit-transition: all 0.5s ease-in-out;
	-moz-transition: all 0.5s ease-in-out;
	transition: all 0.5s ease-in-out;
}

.bl-main > section.bl-expand {
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
}

.bl-main > section.bl-expand-top {
	z-index: 100;
	
}





.bl-main > section:first-child.bl-expand {
	background: #00fcff;
	color: #000;
}
.bl-main > section:nth-child(2).bl-expand {
	background:lime;
	color:#000;
}
.bl-main > section:nth-child(3).bl-expand {
	background: #2b2d32;
	
}
.bl-main > section:nth-child(4).bl-expand {
	color: #000;
}


.dienstendiv a {
	color:#000;
	font-weight:300;
	font-size:1em;
	text-decoration:none;
	border-bottom:1px solid #000;
	display:inline;
	padding:0;
	margin:0;
}

.dienstendiv a:hover {
	color:#3c3f45;
	border-bottom:1px solid #3c3f45;
}


.bl-main.bl-expand-item > section:not(.bl-expand),
.bl-main.bl-expand-item > section.bl-scale-down {
	-webkit-transform: scale(0.5);
	-moz-transform: scale(0.5);
	-ms-transform: scale(0.5);
	transform: scale(0.5);
	opacity: 0;
}

.bl-box {
	-webkit-transition: opacity 0.2s linear 0.5s;
	-moz-transition: opacity 0.2s linear 0.5s;
	transition: opacity 0.2s linear 0.5s;
}

section.bl-expand .bl-box {
	opacity: 0;
	-webkit-transition: opacity 0s linear;
	-moz-transition: opacity 0s linear;
	transition: opacity 0s linear;
}

.bl-box h2 {
	-webkit-transition: all 0.2s ease-in-out;
	-moz-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
}

.no-touch section:not(.bl-expand) .bl-box:hover h2 {
	-webkit-transform: translateY(-15px);
	-moz-transform: translateY(-15px);
	-ms-transform: translateY(-15px);
	transform: translateY(-15px);
}

.bl-content,
.bl-icon-close {
	-webkit-transition: opacity 0.1s linear 0s;
	-moz-transition: opacity 0.1s linear 0s;
	transition: opacity 0.1s linear 0s;
}

section.bl-expand .bl-content,
section.bl-expand .bl-icon-close {
	pointer-events: auto;
	opacity: 1;
	-webkit-transition: opacity 0.3s linear 0.5s;
	-moz-transition: opacity 0.3s linear 0.5s;
	transition: opacity 0.3s linear 0.5s;
}


#heading {
	position:absolute; 
	top:0; 
	left:0; 
	width:100%; 
	height:50px; 
	z-index:100000; 
	background-color:#1a1c20;
	border-bottom:1px dashed #3e434b;
	line-height:50px; 
}
#heading #innerhead {padding:0px; margin:0; color:#000; font-size:11px; width:100%; }
#heading #innerhead a {color:lime; font-size:12px; text-decoration:none;margin-left:12px; text-transform:lowercase;  font-weight:300!important;}
#heading #innerhead a:hover {color:#fff; font-size:12px; text-decoration:none;}
#heading #innerhead .logosysd {float:left; margin-left:50px; margin-right:15px;margin-top:16px; border:none;}
#heading #innerhead a.logosysd {border:none;}
#heading #innerhead .shapingpixels { color:#6ea9b6; height:51px; margin-right:20px; display:block; float:left; font-size:11px;}
#heading #innerhead .gegevens {float:right; color:lime; margin-right:50px;}




@media screen and (max-width: 46.5em) {
	.bl-content,
	.bl-box {
		font-size: 75%;
	}

	.bl-expand .bl-box {
		height: 130px;
	}

	.bl-content > ul li {
		width: 40%;
	}
	
	.bl-content ul#bl-work-items.newsletters > li {
		display: inline-block;
		width: 19%;
		margin: 1%;
	}
	
	
	div.bl-panel-items > div > div .worksbeelden {
		float:left;
		max-width:100%;
		margin-right:0px;
	}
	
	
	div.bl-panel-items > div > div .newslettertxt {
		float:left;
		max-width:100%;
		margin-right:0px;
		margin-bottom:40px;
	}
	
	div.bl-panel-items > div > div .worksbeelden.newsletterbeelden {
		max-width:100%!important;
		margin-right:0px;
		float:left;
	}
	
	div.bl-panel-items > div > div .worksbeelden.newsletterbeelden img {
		max-width:100%!important;
		margin-right:0px;
	}
	
}






fieldset {
	border:none;
	padding:0;
	margin:0;
}


.form input[type="hidden"]{display:none;}
.form .radio,.checkbox{padding-left:18px;}
.form .radio input[type="radio"],.checkbox input[type="checkbox"]{float:left;margin-left:-18px;}
.form .controls>.radio:first-child,.controls>.checkbox:first-child{padding-top:5px;}
.form .radio.inline,.checkbox.inline{display:inline-block;padding-top:5px;margin-bottom:0;vertical-align:middle;}
.form .radio.inline+.radio.inline,.checkbox.inline+.checkbox.inline{margin-left:10px;}
.form input,textarea{-webkit-box-shadow:inset 0 1px 1px rgba(0, 0, 0, 0.075);-moz-box-shadow:inset 0 1px 1px rgba(0, 0, 0, 0.075);box-shadow:inset 0 1px 1px rgba(0, 0, 0, 0.075);-webkit-transition:border linear 0.2s,box-shadow linear 0.2s;-moz-transition:border linear 0.2s,box-shadow linear 0.2s;-ms-transition:border linear 0.2s,box-shadow linear 0.2s;-o-transition:border linear 0.2s,box-shadow linear 0.2s;transition:border linear 0.2s,box-shadow linear 0.2s;}
.forminput:focus,textarea:focus{border-color:rgba(82, 168, 236, 0.8);-webkit-box-shadow:inset 0 1px 1px rgba(0, 0, 0, 0.075),0 0 8px rgba(82, 168, 236, 0.6);-moz-box-shadow:inset 0 1px 1px rgba(0, 0, 0, 0.075),0 0 8px rgba(82, 168, 236, 0.6);box-shadow:inset 0 1px 1px rgba(0, 0, 0, 0.075),0 0 8px rgba(82, 168, 236, 0.6);outline:0;outline:thin dotted \9;}
.form input[type="file"]:focus,input[type="radio"]:focus,input[type="checkbox"]:focus,select:focus{-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;outline:thin dotted #333;outline:5px auto -webkit-focus-ring-color;outline-offset:-2px;}
.form .input-mini{width:60px;}
.form .input-small{width:90px;}
.form .input-medium{width:150px;}
.form .input-large{width:210px;}
.form .input-xlarge{width:90%;}
.form .input-xxlarge{width:530px;}
.form .control-group{margin-bottom:4px;}
.form legend+.control-group{margin-top:18px;-webkit-margin-top-collapse:separate;}
.form.form-horizontal .control-group{margin-bottom:4px;*zoom:1;}
.form.form-horizontal .control-group:before,.form-horizontal .control-group:after{display:table;content:"";}
.form.form-horizontal .control-group:after{clear:both;}
.form.form-horizontal .control-label{float:left; padding-top:5px;text-align:left;}
.form.form-horizontal .controls{margin-left:130px;*display:inline-block;*margin-left:0;*padding-left:10px;}


.form.form .control-group{margin-bottom:4px;*zoom:1; }
.form.form .control-group:before,.form-horizontal .control-group:after{display:table;content:"";}
.form.form .control-group:after{clear:both;}
.form.form .control-label{float:left; padding-top:5px;text-align:left; font-weight:bold;}
.form.form .controls{margin-left:125px;*display:inline-block;*margin-left:0;*padding-left:10px;}



.form.form-horizontal .help-block{margin-top:9px;margin-bottom:0;}
.form.form-horizontal .form-actions{padding-left:130px; margin-top:20px; margin-bottom:40px;}
.form .control-group.success .input-prepend .add-on,.control-group.success .input-append .add-on{color:#468847;background-color:#dff0d8;border-color:#468847;}
.form input:focus:required:invalid,textarea:focus:required:invalid,select:focus:required:invalid{color:#b94a48;border-color:#ee5f5b;}
.form input:focus:required:invalid:focus,textarea:focus:required:invalid:focus,select:focus:required:invalid:focus{border-color:#e9322d;-webkit-box-shadow:0 0 6px #f8b9b7;-moz-box-shadow:0 0 6px #f8b9b7;box-shadow:0 0 6px #f8b9b7;}
.form .control-group.error input,.control-group.error select,.control-group.error textarea{color:#bc5c00;border-color:#a1441e;}
.form .control-group.success input,.control-group.success select,.control-group.success textarea{color:#468847;border-color:#447c08;}

.form .control-group.success input:focus,.control-group.success select:focus,.control-group.success textarea:focus{border-color:#dff0d8;-webkit-box-shadow:0 0 6px #7aba7b;-moz-box-shadow:0 0 6px #7aba7b;box-shadow:0 0 6px #7aba7b;}
.form .control-group.success .input-prepend .add-on,.control-group.success .input-append .add-on{color:#468847;background-color:#dff0d8;border-color:#dff0d8;}



.domeinformcontrols {margin-top:4px;}
.domeinformcontrols input#toplevel_domein_be,
.domeinformcontrols input#toplevel_domein_com,
.domeinformcontrols input#toplevel_domein_org,
.domeinformcontrols input#toplevel_domein_net,
.domeinformcontrols input#toplevel_domein_other {vertical-align:middle; margin-right:10px; margin-left:5px; margin-top:0;}

#serverrespons {color:#468847; background-color:#cbe7bc; display:none; padding:20px; -webkit-border-radius: 4px; 
    border-radius: 4px;
    background-clip: padding-box;}

#serverrespons.offerterespons {color:#468847; background-color:#cbe7bc; }

.form label b {
	color:#db3e2f; margin-left:2px;
	}
		
.form .forminput {
	color:#000;
	font-size:14px;
	height:24px;
	background:#faf4ff; 
	margin:3px 0 2px 4px;
	padding:17px;
	border: 1px solid #cebecf;
	-webkit-border-radius: 4px; 
    border-radius: 4px;
    background-clip: padding-box;
}

.form textarea {
	color:#000;
	font-size:14px;
	height:160px;
	background: #faf4ff; 
	margin:3px 0 2px 4px;
	padding:17px;
	border:1px solid #cebecf;
	-webkit-border-radius: 4px; 
    border-radius: 4px;
    background-clip: padding-box;
}

.form-actions .submit {
	color:#fff;
	font-size:13px;
	width:100px;
	height:36px;
	padding:2px 4px;
	margin:3px 0 2px 4px;
	border:none;
	background: #75bd00;
	-webkit-border-radius: 4px; 
    border-radius: 4px;
    background-clip: padding-box;
    cursor:pointer;
}

.form-actions .submit:hover {
	color:#3d636b;
	background:#55be56;
}



.form.domain .domeininput {
	color:#477179;
	font-size:14px;
	height:24px;
	background:#dce9ef; 
	margin:3px 0 2px 4px;
	padding:17px;
	border:1px solid #b4bfc4;
	-webkit-border-radius: 4px; 
    border-radius: 4px;
    background-clip: padding-box;
}

.form.domain textarea {
	color:#477179;
	font-size:14px;
	height:120px;
	background:#dce9ef; 
	margin:3px 0 2px 4px;
	padding:17px;
	border:1px solid #b4bfc4;
	-webkit-border-radius: 4px; 
    border-radius: 4px;
    background-clip: padding-box;
}

.domain .form-actions .submit {
	color:#fff;
	font-size:13px;
	width:100px;
	height:36px;
	padding:2px 4px;
	margin:3px 0 2px 4px;
	border:none;
	background: #00ce02;
	-webkit-border-radius: 4px; 
    border-radius: 4px;
    background-clip: padding-box;
    cursor:pointer;
}

.domain .form-actions .submit:hover {
	color:#fff;
	background: #3c8a3c;
}

label.error {
	padding-left:8px;
	margin-bottom:5px;
	display:inline-block;
}


#offerte-form label.error {
	color:#ff7565;
}

#domein-form label.error {
	color:#c31a00;
}


label.valid {
	width: 24px;
	height:28px;
	background:url(/images/valid.png) no-repeat left 7px;
	display: inline-block;
	text-indent: -9999px;
	float:right;
	}


#domeinformdiv {
	color:#000;
	font-size:15px;
	padding:10px;
	border:none;
	background: #00e200;
	-webkit-border-radius: 4px; 
    border-radius: 4px;
    background-clip: padding-box;
    cursor:pointer;
    text-align:center;
}

#domeinformdiv:hover {
	color:#fff;
	background:#55be56;
}


#domein-form {
	display:none;
}

#domein-form fieldset div.control-group.error div.controls.domeinformcontrols label.error {
	float:right;
	padding-right:40%;
}


.workurl {
	padding-bottom:40px;
}


/* ==|== media queries =====================================================
   Media queries.
   ========================================================================== */


/* #### Mobile Phones Portrait #### */
@media screen and (max-device-width: 480px) and (orientation: portrait){
	#heading {
		height:50px; 
		line-height:50px; 
	}
	#heading #innerhead {font-size:12px;}
	#heading #innerhead a {font-size:12px; }
	#heading #innerhead .logosysd {margin-left:15px; margin-right:10px;}
	#heading #innerhead .shapingpixels {height:auto; margin-right:0px; display:none; float:none; font-size:12px; }
	#heading #innerhead .gegevens {float:none;  margin-right:0px; }
	#heading #innerhead .gegevens .telefoonnr {font-size: 16px!important;}
	#heading #innerhead .headermail {display:none;}

	
	.bl-content, 
	div.bl-panel-items > div > div {
		top: 50px;
		left: 20px;
		right: 30px;
		bottom: 30px;
		padding:10px 10px 0 0;
	}
	
	.bl-content p {
		font-size:15px;
		line-height:18px!important;
	}
	
	.lf {
		float:left;
		width:80%; 
		max-width:640px;
		margin-right:70px;
	}
	
	.lf.rf {
		float:left;
		width:80%; 
		margin-right:0px;
	}
	
	.bl-main > section .bl-icon-close {
		top: 65px;
		right: 20px;
	}
	
	div.bl-panel-items.bl-panel-items-show nav span {
		margin:10px 30px 10px 10px;
	}
	#bl-panel-work-items nav span.bl-icon.bl-icon-close  {
		margin:10px 20px 0px 0px;
	}
	
	.bl-box h2.wie {	
		margin-top: 25%;
	}
	.bl-box h2.diensten {	
		margin-top: 25%;
	}
	
	.bl-content p.lp {
		float:none; margin-right:0px;
		margin-bottom:0px;
		margin-top:0px;
	}
	
	.bl-content p.rp {
		margin-bottom:30px;
		margin-top:0px;
	}

}


/* #### iPhones Landscape #### */
@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 480px) 
and (orientation : landscape) { 
	#heading #innerhead .gegevens .emailadres {display:none;}
	#heading #innerhead .gegevens .telefoonnr {}
}




/* #### Mobile Phones Landscape #### */
@media screen and (max-device-width: 640px) and (orientation: landscape){
	#heading {
		height:50px; 
		line-height:50px; 
		
	}
	#heading #innerhead {font-size:11px; }
	#heading #innerhead a {font-size:12px; }
	#heading #innerhead .logosysd {margin-left:15px; margin-right:15px;}
	#heading #innerhead .shapingpixels {height:auto; margin-left:0; margin-right:0px; display:inline; float:none; font-size:11px; }
	#heading #innerhead .gegevens {float:none; margin-right:0px; }
  	#heading #innerhead .gegevens .emailadres {display:none;}
	#heading #innerhead .gegevens .telefoonnr {font-size: 13px;}
  	
  	.bl-content, 
	div.bl-panel-items > div > div {
		top: 50px;
		left: 20px;
		right: 30px;
		bottom: 30px;
		padding:20px 10px 0;
	}
	
	.lf {
		float:left;
		width:80%; 
		max-width:640px;
		margin-right:70px;
	}
	
	.lf.rf {
		float:left;
		width:80%; 
		margin-right:0px;
	}
	
	.bl-main > section .bl-icon-close {
		top: 65px;
		right: 20px;
	}
	
	.bl-box h2.wie {	
		margin-top: 25%;
	}
	.bl-box h2.diensten {	
		margin-top: 25%;
	}
	
	div.bl-panel-items.bl-panel-items-show nav span {
		margin:10px 30px 10px 10px;
	}
	#bl-panel-work-items nav span.bl-icon.bl-icon-close  {
		margin:10px 20px 0px 0px;
	}

  	
}

/* #### Mobile Phones Portrait or Landscape #### */
@media screen and (max-device-width: 640px){
  .bl-main > section:nth-child(2).bl-expand {
	color:#454a52;
	}	
  div.bl-panel-items nav span.bl-next-work {
	display: none;
	}
}

/* #### iPhone 4+ Portrait or Landscape #### */
@media screen and (max-device-width: 480px) and (-webkit-min-device-pixel-ratio: 2){
  /* some CSS here */
}

/* #### Tablets Portrait or Landscape #### */
@media screen and (min-device-width: 768px) and (max-device-width: 1024px){
  div.bl-panel-items nav span.bl-next-work {
	display: none;
	}
}

/* #### Desktops #### */
@media screen and (min-width: 1024px){
  /* some CSS here */
}