/* CSS Mobile Reset */
table { width:auto; border-collapse: collapse;border-spacing: 0; }
.open_nav {
	display: none;
}
img, embed, object, video {
	max-width: 100%;
	height: auto;
	width: auto;
}

/*Alle Bilder passen sich der Figure an*/
.csc-textpic-imagewrap .csc-textpic-imagerow .csc-textpic-imagecolumn .csc-textpic-image img {
	max-width: 100%;
	width: auto;
	height: auto;
}
/*Alle erhalten einen margin-right von 2%*/
.csc-textpic-imagewrap .csc-textpic-imagerow .csc-textpic-imagecolumn {
	margin-right: 2%;
}
/*Einzelne Breiten je nach Spalte*/
.csc-textpic-imagewrap[data-csc-cols="8"] .csc-textpic-imagerow .csc-textpic-imagecolumn {
	width: 10.75%;
}
.csc-textpic-imagewrap[data-csc-cols="7"] .csc-textpic-imagerow .csc-textpic-imagecolumn {
	width: 12.57%;
}
.csc-textpic-imagewrap[data-csc-cols="6"] .csc-textpic-imagerow .csc-textpic-imagecolumn {
	width: 15%;
}
.csc-textpic-imagewrap[data-csc-cols="5"] .csc-textpic-imagerow .csc-textpic-imagecolumn {
	width: 18.4%;
}
.csc-textpic-imagewrap[data-csc-cols="4"] .csc-textpic-imagerow .csc-textpic-imagecolumn {
	width: 23.5%;
}
.csc-textpic-imagewrap[data-csc-cols="3"] .csc-textpic-imagerow .csc-textpic-imagecolumn {
	width: 32%;
}
.csc-textpic-imagewrap[data-csc-cols="2"] .csc-textpic-imagerow .csc-textpic-imagecolumn {
	width: 49%;
}
.csc-textpic-imagewrap[data-csc-cols="1"] .csc-textpic-imagerow .csc-textpic-imagecolumn {
	width: 100%;
}
/*Alle letzten erhalten keinen letzten margin*/
.csc-textpic-imagewrap .csc-textpic-imagerow .csc-textpic-imagecolumn.csc-textpic-lastcol {
	margin-right: 0;
}
/*Ab hier springt er auf 1225px breite Elemente*/
@media all and (max-width: 1312px) {
	.produktuebersicht .csc-textpic .csc-textpic-text{
		width: 40%;
		padding: 50px;
		margin-left: -90px;
	}
	.tx-indexedsearch FORM#tx_indexedsearch {
		width: 80%;
	}
	.allcont .tx-indexedsearch FORM#tx_indexedsearch TABLE TR TD{
		display: block;
	}
	.allcont .tx-indexedsearch FORM#tx_indexedsearch TABLE TR TD:first-of-type {
		max-width: 30%;
	}
	.tx-indexedsearch FORM#tx_indexedsearch TABLE INPUT.submit {
		text-indent: -2000px;
	}
	.tx-indexedsearch FORM#tx_indexedsearch TABLE INPUT {
		margin-top: 20px;
	}

}
/*Ab hier springt er auf 1128px breite Elemente*/
@media all and (max-width: 1225px) {
	.produktuebersicht .slick-dots{
		bottom: 0;
		left: 50%;
		top: unset;
		right: unset;
		transform: translateX(-50%);
		display: flex !important;
		margin: 0;
	}

	.produktuebersicht .slick-dots LI.slick-active P.activedot{
		opacity: 1;
	}

	.produktuebersicht .slick-dots LI P{
		right: unset;
		bottom: -40px;
		text-align: center;
	}
	.produktuebersicht .slick-dots LI:hover P{
		display: none;
	}
	.produktuebersicht .slick-dots LI.slick-active:hover P{
		display: block;
	}
}

/*Ab hier springt er auf 974px breite Elemente*/
@media all and (max-width: 1128px) {
	.nav > UL > LI > A {
		font-size: 14px;
	}
	#logo {
	    width: 210px;
    	height: 60px;
	}
	.subsite .right{
	    width: 30%;
	}
	.subsite .cont.left > *{
	    max-width: 65%;
	}
	.produktuebersicht .csc-textpic::after{
		bottom: 0;
	}
	.produktuebersicht .csc-textpic .csc-textpic-text{
		width: 50%;
	}
}

/*Ab hier springt er auf 974px breite Elemente*/
@media all and (max-width: 1050px) {
	.layout1 .cont.left .gridrow .col{
		float: none;
	}
	.layout1 .cont.left .gridrow .col + .col{
		margin-left: 0;
		margin-top: 20px;
	}
	.layout1 .cont.left .box50 .col,
	.layout1 .cont.left .box33 .col,
	.layout1 .cont.left .box25 .col,
	.layout1 .cont.left .box33-66 .col.col1,
	.layout1 .cont.left .box33-66 .col.col2,
	.layout1 .cont.left .box66-33 .col.col1,
	.layout1 .cont.left .box66-33 .col.col2{
		width: 100%;
	}

	.cont.left .box100 .contenttable TD {
		display: block;
	}

	/*!
	 * Hamburgers
	 * @description Tasty CSS-animated hamburgers
	 * @author Jonathan Suh @jonsuh
	 * @site https://jonsuh.com/hamburgers
	 * @link https://github.com/jonsuh/hamburgers
	 */

	.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-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:2px;background-color:#f3912d;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}

	.hamburger{
		display: flex;
	    justify-content: center;
	    align-items: center;
	}

	.hamburger--spin .hamburger-inner {
	  transition-duration: 0.3s;
	  transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
	  .hamburger--spin .hamburger-inner::before {
	    transition: top 0.1s 0.34s ease-in, opacity 0.1s ease-in; }
	  .hamburger--spin .hamburger-inner::after {
	    transition: bottom 0.1s 0.34s ease-in, transform 0.3s cubic-bezier(0.55, 0.055, 0.675, 0.19); }

	.hamburger--spin.is-active .hamburger-inner {
	  transform: rotate(225deg);
	  transition-delay: 0.14s;
	  transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
	  .hamburger--spin.is-active .hamburger-inner::before {
	    top: 0;
	    opacity: 0;
	    transition: top 0.1s ease-out, opacity 0.1s 0.14s ease-out; }
	  .hamburger--spin.is-active .hamburger-inner::after {
	    bottom: 0;
	    transform: rotate(-90deg);
	    transition: bottom 0.1s ease-out, transform 0.3s 0.14s cubic-bezier(0.215, 0.61, 0.355, 1); }

	.head .stickwrap .inner{
		padding: 2%;
	}

	/*Nav*/
	.open_nav
	{
		display: inherit;
	}
	.nav
	{
		display: none;
		position: absolute;
		top: 100%;
		left: 0;
		width: 100%;
	}
	.nav > UL{
		background: #f7f7f7;
	}
	.nav .search{
	    text-indent: -10000px;
	    background: #525252 url(../img/search.svg) no-repeat center center;
	    background-size: 20px 20px;
	    opacity: 0.7;
	}
	.nav .search:hover{
		text-indent: -10000px;
	    background: #525252 url(../img/search.svg) no-repeat center center;
	    background-size: 20px 20px;
	    opacity: 0.7;
	}
	.nav > UL > LI{
		float: none;
	}
	.nav > UL > LI > A
	{
		background-color: #f7f7f7;
		padding: 30px 15px;
	}
	.subNav,
	.subNav .subNav,
	.nav > UL > LI:last-child > .subNav,
	.nav > UL > LI:last-child > .subNav .subNav
	{
		position: inherit;
		left: inherit;
		top: inherit;
	}

	/* remove hover/touch effect */
	.nav LI:hover > .subNav,
	.nav LI.over > .subNav
	{
		display: none;
	}

	/* showsub dropdown trigger */
	.showSub
	{
	    position: absolute;
	    right: 0;
	    top: 0;
	    z-index: 10;
	    cursor: pointer;
	    width: 86px;
	    height: 86px;
	    line-height: 86px;
	    text-align: center;
	    background: #f7f7f7;
	}
	.showSub:focus
	{
	    outline: none;
	    background: transparent;
	}
	.subNav{
		box-shadow: none;
	}
	.subNav li + li{
		border: none;
	}
	.subNav li a{
		background: #f7f7f7;
	}
	.subNav > LI.act > A, .subNav > LI.act:hover > A, .subNav > LI.act.over > A, .subNav > LI.over > A{
		background: #f7f7f7;
		color: #f3912d;
	}
	.subNav .showSub
	{
		background: #888888;
		height: 48px;
		line-height: 48px;
	}
	.showSub.open{
		background: #f7f7f7;
	}
	.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 #888888;
		border-top: 6px solid\9;
		border-right: 5px solid transparent;
		border-left: 5px solid transparent;
	}
	.showSub.open:after
	{
		-webkit-transform: rotate(180deg);
		   -moz-transform: rotate(180deg);
		    -ms-transform: rotate(180deg);
		     -o-transform: rotate(180deg);
		        transform: rotate(180deg);
	}

}

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

	H1 {
		font-size: 30px;
		margin: 5px 0 10px;
	}
	
	.gridrow.box33 .col{
		float: none;
	}
	.gridrow.box33 .col + .col,
	.gridrow.box25 .col + .col,
	.addresses .gridwrapper > .item .gridrow .col + .col{
		margin-left: 0;
	}
	.gridrow.box33 .col + .col{
		margin-top: 50px;
	}
	.box33 .col{
		width: 100%;
	}
	.box25 .col{
		width: 50%;
	}
	.box25 .col3, .box25 .col4{
		margin-top: 20px;
	}

	.zeitstrahl .csc-textpic-center-outer, .zeitstrahl .csc-textpic-center-inner,
	.abgerundet .csc-textpic-center-outer, .abgerundet .csc-textpic-center-inner,{
		position: static;
	}

	.zeitstrahl .csc-textpic-center-outer, .zeitstrahl .csc-textpic-center-inner,
	.abgerundet .csc-textpic-center-outer, .abgerundet .csc-textpic-center-inner,
	.zeitstrahl .csc-textpic-image, .abgerundet .csc-textpic-image{
		width: 100%;
	}

}

/*Ab hier springt er auf 420px breite Elemente*/
@media all and (max-width: 770px) {
	.foot-cont .inner{
		flex-direction: column;
	}
	.foot-cont .info{
		width: 100%;
	}
	.foot-cont .info .addresses > .item .grossbuchstaben{
		display: none;
	}
	.foot-cont .info .addresses .item .csc-text{
		text-align: center;
	}
	.addresses .gridwrapper > .item .gridrow .col.last{
		width: 50%;
	}
	.foot-cont .foot-nav{
		margin-top: 50px;
	    align-items: center;
	}
	.contact-foot .button-weiß{
	    padding: 15px 20px
	}
	.contact-foot .csc-text{
	    text-align: center;
	}
	.allcont{
		padding: 50px 0;
	}
	H2 {
		font-size: 26px;
	}
	H3 {
		font-size: 20px;
	}
	H4 {
		font-size: 18px;
	}

	.item.grey.c81.b101{
		border-radius: 0;
	}

	#subhead::after{
		background-size: 200px 200px;
	}
	#subhead2 .grossbuchstaben{
		font-size: 18px;
	}
	/*Gridelemente*/
	.allcont .gridrow .col
	{
		float: none;
	}
	.allcont .gridrow .col + .col,
	.item.abgerundet .box50 .col + .col
	{
		margin-left: 0;
		margin-top: 50px;
	}
	.allcont .box50 .col,
	.allcont .box33 .col,
	.allcont .box25 .col,
	.allcont .box33-66 .col.col1,
	.allcont .box33-66 .col.col2,
	.allcont .box66-33 .col.col1,
	.allcont .box66-33 .col.col2,
	.item.abgerundet .box50 .col
	{
		width: 100%;
	}

	/* SlideSlide */
	.produktuebersicht .slick-list, .produktuebersicht .slick-track{
		height: auto;
	}
	.produktuebersicht .csc-textpic{
		flex-direction: column;
	}
	.produktuebersicht .csc-textpic .csc-textpic-imagewrap{
		margin: 0;
	}
	.produktuebersicht .csc-textpic .csc-textpic-text{
		width: 100%;
	    box-sizing: border-box;
	    position: relative;
	    margin-left: 0;
	}
	.produktuebersicht .csc-textpic .csc-textpic-text .mehr{
		padding: 15px 50px;
	}
	.produktuebersicht .slick-dots{
		top: 0;
		bottom: unset;
		right: 0;
		left: unset;
		transform: translateX(0);
	}
	.produktuebersicht .slick-slide{
		margin-top: 80px !important;
	}


	.allcont.subsite{
		display: flex;
		flex-direction: column;
	}

	.subsite .right{
	    position: relative;
	    order: 1;
	    min-height: auto;
	    width: 100%;
	    background: transparent;
	    z-index: 10;
	    padding-top: 0;
	}
	.subsite .right UL.sub{
	    display: flex;
	    justify-content: center;
	    align-items: center;
	    flex-wrap: wrap;
	    padding: 20px 0;
	}
	.subsite .right UL.sub > LI{
		margin-top: 5px;
	}
	.subsite .right UL.sub > LI a{
		background: #f4f4f4;
	}
	.subsite .right UL.sub > LI + LI{
		border: none;
		margin-left: 5px;
	}
	.subsite .cont.left{
		order: 2;
		padding: 0;
	}
	.subsite .cont.left > *{
		max-width: 100%;
	}
	.breadcrumbs{
		position: relative;
	}
	.subsite .right UL.sub > LI.act > A, .subsite .right UL.sub > LI.act:hover > A, .subsite .right UL.sub > LI.act.over > A{
		color: #f3912d;
		background: #f4f4f4;
	}
	.allcont.subsite{
		padding-bottom: 50px;
	}
	.subsite .cont.left .breadcrumbs{
		margin: 0 auto;
	}

	.produktuebersicht .slick-dots LI P,
	.produktuebersicht .slick-dots LI.slick-active P {
		display: none;
	}

/* Falls Footer unten klebt */
	HTML, BODY, #site 
	{
		height: auto;
	}
	BODY > #site 
	{
		min-height: 0;
		overflow-y: visible;
	}
	.foot
	{
		height: auto;
		margin-top: 0;
	}

	.item.grey.c81.b101::after{
		display: none;
	}

/* Gekaufte Bilder .c1 ändern */
	.allcont .c1 UL {
		margin: 0 0 0 25px;
	}

	.allcont .c1 TABLE TR TD {
		display: inline-table;
	}

	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: 690px) {
	.subsite .right UL.sub LI A{
		padding: 10px;
		font-size: 14px;
	}
}
@media all and (max-width: 600px) {
	.contact-foot{
		display: none;
	}
	#subhead IMG{
		height: 400px;
	}
	.bel #subhead IMG, .bel0 #subhead IMG{
		height: 300px;
	}
	#subhead .item .csc-textpic .csc-textpic-text .grossertext{
		font-size: 30px;
	}
	.logo-schrift{
	    width: 130px;
	    height: 30px;
	    line-height: 115%;
	}
	#subhead::after{
		display: none;
	}
	.contact-nav{
		display: none;
	}
	#subhead2.slick-slider .slick-dots{
		bottom: 50px;
	}
	.produktuebersicht .slick-dots LI.slick-active P{
		display: none;
	}

	.tx-indexedsearch FORM#tx_indexedsearch {
		width: 100%;
		box-sizing: border-box;
	}
}

/*Ab hier springt er auf 100% breite Elemente (320px)*/
@media all and (max-width: 470px) {
	body{
	    word-wrap: break-word;
	}
	#subhead .item .csc-textpic .csc-textpic-text .grossertext{
		font-size: 26px;
	}
	h1, h2, h3{
		font-size: 20px;
	}
	.addresses .gridrow.box25 .col,
	.addresses .gridwrapper > .item .gridrow .col.last{
		width: 100%;
	}
	.addresses .gridrow.box25 .col2{
		margin-top: 20px;
	}
	.logo-schrift{
		width: 100%;
	    background: url(../img/logo-schrift.svg) no-repeat center center;
	    line-height: 180%;
	}
	.produktuebersicht .csc-textpic .csc-textpic-text{
	    padding: 20px 20px 60px 20px;
	}

	.produktuebersicht .csc-textpic .csc-textpic-text .mehr{
		font-size: 12px;
	}
	.mehr::after{
		padding: 2px;
	}


	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;}
}


