@media screen and (min-width: 900px) {
	.sbbandcol1 {
	width: 100%;
	height: 400px;
	display: block;
	float: left;
	overflow:hidden;	
	}
	
	.sbbandcol2 {
	width: 50%;
	display: block;
	float: left;
	height: 500px;
	}
	
	.sbvierkant {
		width: 12.5%;
	height: 50%;
	background-size: cover;
	display: block;
	float: left;
	overflow:hidden;	
	background-position: 50% 50%;
	border: 2px solid white;
	-webkit-filter: grayscale(100%);
-moz-filter: grayscale(100%);
filter: grayscale(100%);
	}
	.sbrechthoek {
		width: 25%;
	height: 50%;
	background-size: cover;
	display: block;
	float: left;
	overflow:hidden;
	background-position: 50% 50%;	
	border: 2px solid white;
	-webkit-filter: grayscale(100%);
-moz-filter: grayscale(100%);
filter: grayscale(100%);
	}
}
@media screen and (max-width: 900px) {
	.sbbandcol1 {
	width: 100%;
	height: 500px;
	display: block;
	float: left;
	overflow:hidden;	
	}
	
	.sbbandcol2 {
	width: 100%;
	display: block;
	float: left;
	height: 500px;
	}
	
	.sbvierkant {
		width: 25%;
	height: 200px;
	background-size: cover;
	display: block;
	float: left;
	overflow:hidden;	
	background-position: 50% 50%;
	border: 2px solid white;
	-webkit-filter: grayscale(100%);
-moz-filter: grayscale(100%);
filter: grayscale(100%);
	}
	.sbrechthoek {
		width: 50%;
	height: 200px;
	background-size: cover;
	display: block;
	float: left;
	overflow:hidden;
	background-position: 50% 50%;	
	border: 2px solid white;
	-webkit-filter: grayscale(100%);
-moz-filter: grayscale(100%);
filter: grayscale(100%);
	}
}

.sbbandcol11 {
width: 50%;
display: block;
float: left;
overflow:hidden; background-position: center;  background-repeat: no-repeat; background-size:cover;
	
}
.sbcolboven {
width: 100%;
height: 250px;
display: block;
float: left;	
overflow:hidden; background-position: center;  background-repeat: no-repeat; background-size:cover;

}
.sbcolonder {
width: 100%;
height: 50%;
display: block;
float: left;	
overflow:hidden; background-position: center;  background-repeat: no-repeat; background-size:cover;

}
.sbbandcol12 {
width: 50%;
height: 500px;
display: block;
float: left;
overflow:hidden; background-position: center;  background-repeat: no-repeat; background-size:cover;

}
.tweekwart {
	width: 50%;
height: 150px;
display: block;
float: left;
overflow:hidden; background-position: center;  background-repeat: no-repeat; background-size:cover;
}
.sbbandcollinks {
width: 50%;
height: 250px;
display: block;
float: left;
overflow:hidden; background-position: center;  background-repeat: no-repeat; background-size:cover;

}
.sbbandcolrechts {
	overflow:hidden; background-position: center;  background-repeat: no-repeat; background-size:cover;

}
.sbcolbovenderde {
width: 100%;
height: 300px;
display: block;
float: left;	
overflow:hidden; background-position: center;  background-repeat: no-repeat; background-size:cover;

}
.sbcolonderderde {
width: 100%;
height: 200px;
display: block;
float: left;	
overflow:hidden; background-position: center;  background-repeat: no-repeat; background-size:cover;


.kwarthelf {
	width: 100%;
height: 300px;
display: block;
float: left;	
}


}
.sbcolboven .redO{ 
	position:relative; 
	top:0px; width: 100%;
height: 100%; 
background:rgba(244, 122, 33, 0.7); 
opacity:0; 
-webkit-transition: opacity .25s ease;
-moz-transition: opacity .25s ease;
color: white;
padding: 10px; 
font-size: 14px;
} 
.sbcolboven:hover .redO { opacity:1.0; } 

.sbcolonderderde .redO{ 
	position:relative; 
	top:0px; width: 100%;
height: 100%; 
background:rgba(244, 122, 33, 0.7); 
 opacity:0; 
-webkit-transition: opacity .25s ease;
-moz-transition: opacity .25s ease;
color: white;
padding: 10px; 
font-size: 14px;

} 
.sbcolonderderde:hover .redO { opacity:1.0; } 
.sbvierkant .graysb{ 
	position:relative; 
	top:0px; width: 100%;
height: 100%; 
background: rgba(229, 229, 229, 0.70);
opacity:1; 
-webkit-transition: opacity .25s ease;
-moz-transition: opacity .25s ease;
color: white;
padding: 10px; 
font-size: 14px;
} 
.sbvierkant:hover .graysb { opacity:0.0; } 

.sbvierkant:hover {
	 filter: none;
  -webkit-filter: grayscale(0%);
}
.sbrechthoek:hover {
	 filter: none;
  -webkit-filter: grayscale(0%);
}


.sbrechthoek .graysb{ 
	position:relative; 
	top:0px; width: 100%;
height: 100%; 
background: rgba(229, 229, 229, 0.70);
opacity:1; 
-webkit-transition: opacity .25s ease;
-moz-transition: opacity .25s ease;
color: white;
padding: 10px; 
font-size: 14px;
} 
.sbrechthoek:hover .graysb { opacity:0.0; } 

