/* 4er Set */
.col_4 {
	clear: both;
	padding: 0px;
	margin: 0px;
	zoom:1;
	position: relative;
}

.col_4:before,
.col_4:after {
	content:"";
	display:table;
	clear:both;
}

.col_12_12,
.col_11_12,
.col_10_12,
.col_9_12,
.col_8_12,
.col_7_12,
.col_6_12,
.col_5_12,
.col_4_12,
.col_3_12,
.col_2_12,
.col_1_12 {
	display: block;
	position: relative;
	float:left;
	margin: 1% 3% 2% 0%;
}
.col_1_4,
.col_2_4,
.col_3_4,
.col_4_4 {
	display: block;
	position: relative;
	float:left;
	margin: 1% 3% 1% 0%;
}

.col_4:first-child {
	margin-left: 0;
}

.col_4_4 {
	margin: 0 auto;
	float:none;
	max-width: 1000px;
	width: 90%;
}
.col_3_4 {
	width: 74%;
}
.col_2_4 {
	width: 47%;
}
.col_1_4 {
	width: 22%;
}


.col_1_4.black,
.col_2_4.black,
.col_3_4.black,
.col_4_4.black {
	background-color: #000;
	margin: 0;
	padding: 2%;
	width: 50%;
}

.col_1_4.white,
.col_2_4.white,
.col_3_4.white,
.col_4_4.white {
	background-color: #fff;
	margin: 0;
	padding: 2%;
	width: 50%;
}

.col_1_4.black > .col_2_4,
.col_2_4.black > .col_2_4,
.col_3_4.black > .col_2_4,
.col_4_4.black > .col_2_4,
.col_1_4.white > .col_2_4,
.col_2_4.white > .col_2_4,
.col_3_4.white > .col_2_4,
.col_4_4.white > .col_2_4 {
}

@media only screen and (max-width: 700px) {
	.img { max-width: 100%; }
	.col_4 {  margin: 1% 0 1% 0%; }
	.col_1_4, .col_2_4, .col_3_4, .col_4_4 { width: 100%; }
}

/* 12er Set */
.col_12_12 {
	width: 100%;
}

.col_11_12 {
  	width: 89.5%;
}
.col_10_12 {
  	width: 81%;
}

.col_9_12 {
  	width: 72.5%;
}

.col_8_12 {
  	width: 64%;
}

.col_7_12 {
  	width: 55.5%;
}

.col_6_12 {
  	width: 47%;
}

.col_5_12 {
  	width: 38.5%;
}

.col_4_12 {
  	width: 30%;
}

.col_3_12 {
  	width: 21.5%;
}

.col_2_12 {
  	width: 13%;
}

.col_1_12 {
  	width: 4.5%;
}

@media only screen and (max-width: 1260px) {
	.col_3_12 {
		width: 30%;
	}
}

@media only screen and (max-width: 900px) {
	.col_3_12 {
		width: 47%;
	}
}

@media only screen and (max-width: 700px) {
	.col {  margin: 1% 0 1% 0%; }
    
	.col_12_12,
	.col_11_12,
	.col_10_12,
	.col_9_12,
	.col_8_12,
	.col_7_12,
	.col_6_12,
	.col_5_12,
	.col_4_12,
	.col_3_12,
	.col_2_12,
	.col_1_12 {
		width: 100%; 
	}
}