/* CSS Mobile Reset */
table { width:auto; border-collapse: collapse;border-spacing: 0; }
.open_nav {
	display: none;
}
.hamburger{padding:15px;display:inline-block;cursor:pointer;transition-property:opacity,filter;transition-duration:.15s;transition-timing-function:linear;font:inherit;color:inherit;text-transform:none;background-color:transparent;border:0;margin:0;overflow:visible}.hamburger:hover{opacity:.7}.hamburger-box{width:40px;height:24px;display:inline-block;position:relative}.hamburger-inner{display:block;top:50%;margin-top:-2px}.hamburger-inner,.hamburger-inner::after,.hamburger-inner::before{width:40px;height:4px;background-color:#000;border-radius:4px;position:absolute;transition-property:transform;transition-duration:.15s;transition-timing-function:ease}.hamburger-inner::after,.hamburger-inner::before{content:"";display:block}.hamburger-inner::before{top:-10px}.hamburger-inner::after{bottom:-10px}

@media all and (max-width: 1000px) {
	#site{
		width: 96%;
		margin: 0 auto
	}
	#cont {
		width: 100%;
		padding: 0;
		float: none;
		-webkit-box-sizing: border-box;
 		 -moz-box-sizing: border-box;
  		box-sizing: border-box;
	}
	.head {
		padding: 20px 0
	}
	.head:after
	{
		clear: both;
		content: " ";
		display: block;
	}
	#left {
		width: 100%;
		margin: 0;
	}
	#logo {
		width: 500px;
		float: right;
		background-position: center;
		background-size: 100% auto;
	}
	/*Nav*/
	.open_nav 
	{
		float: left;
		display: inherit;
		margin-top: 10px;
	}
	.open_nav P 
	{
		padding: 0;
	}
	.open_nav A 
	{
		display: block;
		height: 45px;
		line-height: 45px;
		color: #FFF;
		font-size: 18px;
		text-decoration: none;
		background-color: #CCC;
	}
	.nav 
	{
		display: none;
		position: absolute;
		top: 80px;
		left: 0;
		width: 100%;
		z-index: 99;
	}
	.nav > UL > LI,
	.nav UL LI 
	{
		float: none;
		padding: 0;
		position: relative;
	}
	.nav > UL > LI > A
	{
		background-color: #CCC;
	    background-image: none;
	    padding: 15px 40px;
	    border-top: 1px solid #fff;
	    font-size: 14px;
	}
	.nav LI UL LI A,
	.nav LI.act UL LI A, 
	.nav LI.act UL LI.act UL LI A {
		background-color: #bcbcbc;
		background-image: none;
	    padding: 15px 40px;
	    border-top: 1px solid #fff;
	    font-size: 13px;
	}
	.subNav UL.subNav LI A {
    background-color: #a6a5a5;
	}
	.subNav,
	.subNav .subNav,
	.nav > UL > LI:last-child > .subNav,
	.nav > UL > LI:last-child > .subNav .subNav
	{
		position: inherit;
		left: inherit;
		top: inherit;
	}
	UL.subNav {
		margin-left: 0;
	}
	/* remove hover/touch effect */
	.nav LI:hover > .subNav,
	.nav LI.over > .subNav,
	.nav LI.act > ul
	{
		display: none;
	}

	/* showsub dropdown trigger */
	.showSub
	{
		position: absolute;
		right: 0;
		top: 0;
		z-index: 10;
		cursor: pointer;

		width: 55px;
		height: 47px;
		line-height: 47px;
		text-align: center;
	}
	.subNav .showSub
	{
		height: 48px;
		line-height: 48px;
	}

	.showSub,
	.showSub:after
	{
		-webkit-transition:0.25s ease;
		-o-transition:0.25s ease;
		-moz-transition:0.25s ease;
		transition: 0.25s ease;
	}
	.showSub:after
	{
		content: "";
		display: inline-block;
		width: 0;
		height: 0;
		vertical-align: middle;
		border-top: 5px dashed #000;
		border-top: 6px solid\9;
		border-right: 5px solid transparent;
		border-left: 5px solid transparent;
	}
	.showSub.open:after
	{
		border-top-color: #000;
		-webkit-transform: rotate(180deg);
		   -moz-transform: rotate(180deg);
		    -ms-transform: rotate(180deg);
		     -o-transform: rotate(180deg);
		        transform: rotate(180deg);
	}
	.foot {
		text-align: center;
	}
	.iframewrap{
		width: 100%;
		overflow-x: scroll;
		-webkit-overflow-scrolling: touch;
	}
	.iframewrap iframe
	{
		width: 910px;
	}
	body {
		font-size: 16px;
	}
}

/*Ab hier springt er auf 420px breite Elemente*/
@media all and (max-width: 760px) {
	

	DIV.csc-textpic-intext-right .csc-textpic-imagewrap, DIV.csc-textpic-intext-right-nowrap .csc-textpic-imagewrap {margin-left: 0;}
	DIV.csc-textpic-intext-left-nowrap .csc-textpic-imagewrap, DIV.csc-textpic-intext-right-nowrap .csc-textpic-imagewrap {float: inherit;}
	.csc-textpic-intext-right-nowrap .csc-textpic-text {margin-right: 0;}
	.csc-textpic-intext-left-nowrap .csc-textpic-text {margin-left: 0;}
}


@media all and (max-width: 600px) {
	#logo
	{
		width: 380px;
	}
	.GrauesFeld
	{
		display: block;
	}
	.rbox {
		width: 100%;
	}
	.lbox {
		width: 100%;
	}
}

/*Ab hier springt er auf 100% breite Elemente (320px)*/
@media all and (max-width: 470px) {
	img, embed, object, video {
		max-width: 100%;
		height: auto;
		width: auto;
	}
	#logo
	{
		width: 130px;
    	background-size: 700px;
   	 	background-position: right;
	}
	.nav > ul > li > a {
		padding: 15px 20px;
	}
	DIV.csc-textpic .csc-textpic-imagewrap FIGURE, DIV.csc-textpic FIGURE.csc-textpic-imagewrap, FIGCAPTION.csc-textpic-caption {display: block;}
	DIV.csc-textpic-left .csc-textpic-imagewrap, DIV.csc-textpic-right .csc-textpic-imagewrap {float: none;}
	DIV.csc-textpic DIV.csc-textpic-imagecolumn {display: inline-block;float: none;vertical-align: top;}
	.csc-default {clear: both;}
	DIV.csc-textpic-intext-right-nowrap DIV.csc-textpic-imagewrap, DIV.csc-textpic-intext-left-nowrap DIV.csc-textpic-imagewrap, DIV.csc-textpic-intext-right DIV.csc-textpic-imagewrap, DIV.csc-textpic-intext-left DIV.csc-textpic-imagewrap {width: 38%;}
	DIV.csc-textpic-intext-right-nowrap .csc-textpic-text, DIV.csc-textpic-intext-left-nowrap .csc-textpic-text {margin: 0;}
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (-o-min-device-pixel-ratio: 1.5), only screen and (min--moz-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 1.5), only screen and (min-resolution: 192dpi) {
	#logo
	{
		/*background-image: url(../img/logo2x.png);*/
		/*background-size: 100% auto;*/
	}

}