html { box-sizing: border-box; }
  *, *::before, *::after { box-sizing: inherit; }

html, body {
	width: 100%;
	height: 100%;
	margin: 0;
	}

/*-------------------------------------------------------------Gestaltung--------------------------------------------------- */


body {
	font-size: 1.0em;
	background: white;
	margin: 0;
	font-family: 'Open Sans','Helvetica Neue',Helvetica,Arial,sans-serif;
    font-weight: 400;
	color: #333333;
	text-rendering: optimizeLegibility;
	/*text-rendering: geometricPrecision;*/
}

.container {
	max-width: 1280px;
	margin: 0 auto;
}
/*.clearfix:after {
	content: ".";
	clear: both;
	display: block;
	visibility: hidden;
	height: 0px;
	}*/

.container2 {
	max-width: 1900px;
	margin: 0 auto;
}

			
/* RASTER */
.columns {
	float:left;
	padding-left:.5em;
	padding-right:.5em;
	width: 100%;
}
		
.row {
	width:100%;
}
	
.row:before,
.row:after {
	content:'';
	display:table;
}
		
.row:after {
	clear:both;
}
		
.row .row {
	/*margin-left:-1em;*/
	margin-right:-1em;
}


.push {
  float:right;
}

.pull {
	float: left;	
	}



	
/*SMALL*/
@media screen and (max-width:31.25em) {
		/* RASTER ab 500px */		
		.small-1 {
		width:100%;
		}
}	
	
/*MEDIUM*/
@media screen and (min-width:31.25em) and (max-width:62.5em) {
		/* RASTER 31.25em = 500px bis 1000px*/
		.medium-1 {
		width:8.333335%;
		}
		.medium-2 {
		width:16.66667%;
		}
		.medium-3 {
		width:25.000005%;
		}
		.medium-4 {
		width:33.333333%;
			}
		.medium-5 {
		width:41.666668%;
		}
		.medium-6 {
		width:50%;
		}
		.medium-7 {
		width:58.333335%;
		}
		.medium-8 {
		width:66.66667%;
		}
		.medium-9 {
		width:75.000005;
		}
		.medium-10 {
		width:83.333333%;
		}
		.medium-11 {
		width:91.666675%;
		}
		.medium-12 {
		width:100%;
		}
		
		
		.medium-offset-1 {
			margin-left: 25.000005%;
			}
		
}


/*LARGE*/
@media screen and (min-width:62.5em) {
		/* RASTER  62.5em = 1000px (ab 1000px)*/
		.large-1 {
		width:8.333335%;
		}
		.large-2 {
		width:16.66667%;
		}
		.large-3 {
		width:25.000005%;
		}
		.large-4 {
		width:33.333333%;
			}
		.large-5 {
		width:41.666668%;
		}
		.large-6 {
		width:50%;
		}
		.large-7 {
		width:58.333335%;
		}
		.large-8 {
		width:66.66667%;
		}
		.large-9 {
		width:75.000005;
		}
		.large-10 {
		width:83.333333%;
		}
		.large-11 {
		width:91.666675%;
		}
		.large-12 {
		width:100%;
		}
		
}
@media screen and (min-width:800px) {
	.site-box div {
		width: 33.333333%;
		}
	}