/* CSS Mobile Reset */
table { width:auto; border-collapse: collapse;border-spacing: 0; }
.open_nav {
	display: none;
}


@media all and (max-width: 1200px) {
	.gridrow.box50 > .col .gridrow.box50 .col {
		width: 100%;
	}

	.gridrow.box50 > .col .gridrow.box50 .col + .col {
		margin: 10px 0 0;
	}

	/*Maßanzug, Nadelstreifenanzug und Portrait Bilder zentrieren, Wunsch vom Kunden*/
	#uid31 .allcont .DunkelGrauBildText DIV.csc-textpic .csc-textpic-imagewrap .csc-textpic-image,
	#uid31 .BildText.c127 DIV.csc-textpic .csc-textpic-imagewrap .csc-textpic-image {
		position: relative;
	}

	#uid31 .DunkelGrauBildText.c132 > .gridrow > .col1 IMG,
	#uid31 .BildText.c127 > .gridrow > .col2 IMG {
		position: absolute;
		top: 50%;
		right: 50%;
		transform: translate(55%,-50%);
	}

	/*Nav*/
	.nav {
		width: 100%;
		text-align: center;
	}

	.nav > UL {
		display: inline-block;
	}

	.nav > UL > LI > A {
		margin: 0 15px;
	}

	.nav > UL > LI:nth-child(4) {
	    margin-left: 305px;
	}

	/*Hover aufheben*/
	.teaser_wrap .teaser div.csc-textpic .csc-textpic-imagewrap IMG
	{
		opacity: 0.5;
	}

	.teaser_wrap .teaser .csc-textpic-text P.bodytext{
		visibility: visible;
		opacity: 1;
		height: auto;
		max-height: 1000px;
	}

}

@media all and (max-width: 1200px) and (min-width: 980px) and (orientation: landscape) and (max-height: 600px) {
	.staedtelinks UL LI {
		font-size: 14px;
		width: 120px;
		height: 20px;
		line-height: 20px;
	}
}

/*Ab hier springt er auf 760px breite Elemente*/
@media all and (max-width: 980px) {
	.cont > .item,
	.gridwrapper > .item,
	.inner {
		width: 100%;
		-webkit-box-sizing: border-box;
		   -moz-box-sizing: border-box;
		        box-sizing: border-box;
		padding: 0 20px;
	}

	.item.b101 > .gridrow,
	.gridwrapper > .item.b100 {
		width: 100%;
		padding: 0;
	}

	H3 {font-size:26px;}

	/*Head*/
	#logo {
		position: static;
		-webkit-transform: none;
		   -moz-transform: none;
		    -ms-transform: none;
		     -o-transform: none;
		        transform: none;
		margin: 15px auto;
	}

	.nav {
		position: static;
		text-align: center;
	}

	.nav > UL > LI:nth-child(4) {
		margin-left: 0;
	}

	.nav > UL > LI {
		float: none;
		display: inline-block;
	}

	.subNav {
		padding-top: 0;
	}

	/*Subhead*/
	.zehnJahre {
		top: 180px;
	}

	/*Städtelinks*/
	.staedtelinks_wrapper {
		width: 100%;
		top: auto;
		bottom: 15px;
	}

	.staedtelinks {
		text-align: center;
	}

	.staedtelinks UL LI {
		display: inline-block;
		margin: 5px;
		width: -webkit-calc(100% / 5);
		width: -moz-calc(100% / 5);
		width: calc(100% / 5);
	}

	.staedtelinks UL:hover LI,
	.staedtelinks UL:hover LI.act {
		left: auto;
	}

	/*Subhead*/
	#subhead .item IMG{
		right: auto;
		min-width: 0;
		min-height: 0;
		transform: none;
	}
	
	#subhead2 .csc-textpic-text {
		font-size: 24px;
		line-height: 36px;
	}

	#subhead2 .csc-textpic-text .GrosserText {
		font-size: 36px;
	}

	/*Teaser*/
	.teaser_wrap .teaser .csc-textpic-text H3 {
		font-size: 26px;
	}

	.teaser_wrap .teaser .csc-textpic-text {
		box-sizing: border-box;
		padding: 10px;
	}

	/*Dunkelgraue Box auf Startseite*/
	#uid2 .DunkelGrauBildText > .gridrow > .col {
		width: 100%;
		float: none;
	}

	#uid2 .DunkelGrauBildText > .gridrow.box50 > .col1 {
		position: static;
		padding-top: 60px;
	}

	#uid2 .DunkelGrauBildText DIV.csc-textpic .csc-textpic-imagewrap .csc-textpic-image IMG {
		position: static;
		top: auto;
		right: auto;
		-webkit-transform: none;
		   -moz-transform: none;
		    -ms-transform: none;
		     -o-transform: none;
		        transform: none;
		margin: 0 auto;
	}

	/*Dunkelgraue Box allgemein*/
	.DunkelGrauBildText > .gridrow > .col > .gridwrapper > .item {
		padding: 0;
	}

	.allcont .DunkelGrauBildText DIV.csc-textpic .csc-textpic-imagewrap .csc-textpic-image {
		position: relative;
	}

	.allcont .DunkelGrauBildText DIV.csc-textpic .csc-textpic-imagewrap .csc-textpic-image IMG {
		position: absolute;
		top: 50%;
		right: 50%;
		-webkit-transform: translate(50%, -50%);
		   -moz-transform: translate(50%, -50%);
		    -ms-transform: translate(50%, -50%);
		     -o-transform: translate(50%, -50%);
		        transform: translate(50%, -50%);
	}

	/*Teaser Hover aufheben*/
	.teaser_wrap .teaser div.csc-textpic .csc-textpic-imagewrap IMG
	{
		opacity: 0.5;
	}
	
	.teaser_wrap .teaser .csc-textpic-text P.bodytext{
		visibility: visible;
		opacity: 1;
		height: auto;
		max-height: 1000px;
	}

}

/*Ab hier springt er auf 420px breite Elemente*/
@media all and (max-width: 760px) {

	H1 	{font-size: 32px;}
	H2 	{font-size: 28px;}
	H3 	{font-size: 22px;}
	H4 	{
		font-size: 18px;
	    line-height: 28px;
	}

	/*Head*/
	.head .inner {
		padding: 0;
	}

	/*	Hamburger Menu*/
	.hamburger{width:auto;padding:15px;display:inline-block;cursor:pointer;transition-property:opacity,-webkit-filter;-webkit-transition-property:opacity,-webkit-filter;-o-transition-property:opacity,filter;-moz-transition-property:opacity,filter;transition-property:opacity,filter;transition-property:opacity,filter,-webkit-filter;-webkit-transition-duration:.15s;-moz-transition-duration:.15s;-o-transition-duration:.15s;transition-duration:.15s;-webkit-transition-timing-function:linear;-moz-transition-timing-function:linear;-o-transition-timing-function:linear;transition-timing-function:linear;font:inherit;line-height:0;color:inherit;text-transform:none;background-color:transparent;border:0;margin:0;overflow:visible}.hamburger:hover{opacity:.7}.hamburger-box{width:35px;height:22px;display:inline-block;position:relative}.hamburger-inner{display:block;top:50%;margin-top:-2px}.hamburger-inner,.hamburger-inner::after,.hamburger-inner::before{width:35px;height:2px;background-color:#fff;position:absolute;transition-property:-webkit-transform;-webkit-transition-property:-webkit-transform;-o-transition-property:-o-transform;-moz-transition-property:transform, -moz-transform;transition-property:transform;transition-property:transform, -webkit-transform, -moz-transform, -o-transform;transition-property:transform,-webkit-transform;-webkit-transition-duration:.15s;-moz-transition-duration:.15s;-o-transition-duration:.15s;transition-duration:.15s;-webkit-transition-timing-function:ease;-moz-transition-timing-function:ease;-o-transition-timing-function:ease;transition-timing-function:ease}.hamburger-inner::after,.hamburger-inner::before{content:"";display:block}.hamburger-inner::before{top:-10px}.hamburger-inner::after{bottom:-10px}.hamburger--squeeze .hamburger-inner{-webkit-transition-duration:.1s;-moz-transition-duration:.1s;-o-transition-duration:.1s;transition-duration:.1s;-webkit-transition-timing-function:cubic-bezier(.55,.055,.675,.19);-moz-transition-timing-function:cubic-bezier(.55,.055,.675,.19);-o-transition-timing-function:cubic-bezier(.55,.055,.675,.19);transition-timing-function:cubic-bezier(.55,.055,.675,.19)}.hamburger--squeeze .hamburger-inner::before{-webkit-transition:top .1s .14s ease,opacity .1s ease;-o-transition:top .1s .14s ease,opacity .1s ease;-moz-transition:top .1s .14s ease,opacity .1s ease;transition:top .1s .14s ease,opacity .1s ease}.hamburger--squeeze .hamburger-inner::after{transition:bottom .1s .14s ease,-webkit-transform .1s cubic-bezier(.55,.055,.675,.19);-webkit-transition:bottom .1s .14s ease,-webkit-transform .1s cubic-bezier(.55,.055,.675,.19);-o-transition:bottom .1s .14s ease,-o-transform .1s cubic-bezier(.55,.055,.675,.19);-moz-transition:bottom .1s .14s ease,transform .1s cubic-bezier(.55,.055,.675,.19),-moz-transform .1s cubic-bezier(.55,.055,.675,.19);transition:bottom .1s .14s ease,transform .1s cubic-bezier(.55,.055,.675,.19);transition:bottom .1s .14s ease,transform .1s cubic-bezier(.55,.055,.675,.19),-webkit-transform .1s cubic-bezier(.55,.055,.675,.19),-moz-transform .1s cubic-bezier(.55,.055,.675,.19),-o-transform .1s cubic-bezier(.55,.055,.675,.19);transition:bottom .1s .14s ease,transform .1s cubic-bezier(.55,.055,.675,.19),-webkit-transform .1s cubic-bezier(.55,.055,.675,.19)}.hamburger--squeeze.is-active .hamburger-inner{-webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);-ms-transform:rotate(45deg);-o-transform:rotate(45deg);transform:rotate(45deg);-webkit-transition-delay:.14s;-moz-transition-delay:.14s;-o-transition-delay:.14s;transition-delay:.14s;-webkit-transition-timing-function:cubic-bezier(.215,.61,.355,1);-moz-transition-timing-function:cubic-bezier(.215,.61,.355,1);-o-transition-timing-function:cubic-bezier(.215,.61,.355,1);transition-timing-function:cubic-bezier(.215,.61,.355,1)}.hamburger--squeeze.is-active .hamburger-inner::before{top:0;opacity:0;-webkit-transition:top .1s ease,opacity .1s .14s ease;-o-transition:top .1s ease,opacity .1s .14s ease;-moz-transition:top .1s ease,opacity .1s .14s ease;transition:top .1s ease,opacity .1s .14s ease}.hamburger--squeeze.is-active .hamburger-inner::after{bottom:0;-webkit-transform:rotate(-90deg);-moz-transform:rotate(-90deg);-ms-transform:rotate(-90deg);-o-transform:rotate(-90deg);transform:rotate(-90deg);transition:bottom .1s ease,-webkit-transform .1s .14s cubic-bezier(.215,.61,.355,1);-webkit-transition:bottom .1s ease,-webkit-transform .1s .14s cubic-bezier(.215,.61,.355,1);-o-transition:bottom .1s ease,-o-transform .1s .14s cubic-bezier(.215,.61,.355,1);-moz-transition:bottom .1s ease,transform .1s .14s cubic-bezier(.215,.61,.355,1),-moz-transform .1s .14s cubic-bezier(.215,.61,.355,1);transition:bottom .1s ease,transform .1s .14s cubic-bezier(.215,.61,.355,1);transition:bottom .1s ease,transform .1s .14s cubic-bezier(.215,.61,.355,1),-webkit-transform .1s .14s cubic-bezier(.215,.61,.355,1),-moz-transform .1s .14s cubic-bezier(.215,.61,.355,1),-o-transform .1s .14s cubic-bezier(.215,.61,.355,1);transition:bottom .1s ease,transform .1s .14s cubic-bezier(.215,.61,.355,1),-webkit-transform .1s .14s cubic-bezier(.215,.61,.355,1)}

/*Nav*/
	.open_nav 
	{
		display: inline-block;
		position: absolute;
		top: 25px;
		right: 20px;
		z-index: 999;
	}
	.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: #5E4C58;
	}
	.nav 
	{
		display: none;
		position: absolute;
		/*top: 125px;*/
		top: -15px;
		left: 0;
		/*width: 100%;*/
		width: 100vw;
		height: 100vh;
		background: rgba(53,52,45,0.9);
		box-sizing: border-box;
		padding: 50px 0;
	}

	.nav > UL {
		display: block;
	}

	.nav > UL > LI:nth-child(4) {
		margin-left: 0;
	}

	.nav > UL > LI {
		float: none;
		display: inline-block;
	}
	.nav > UL > LI,
	.nav > UL > LI:nth-child(4) 
	{
		float: none;
		display: block;
		width: 60%;
		margin: 0 auto;
	}

	.nav > UL > LI > A
	{
		color: #fff;
		display: block;
		width: 100%;
		margin: 0;
		padding: 15px 0;
		font-size: 18px;
	}

	.nav > UL > LI.act > A,
	.nav > UL > LI.act:hover > A,
	.nav > UL > LI.act.over > A {
		border: none;
		font-weight: bold;
	}

	.nav > UL > LI:hover > A,
	.nav > UL > LI.over > A {
		opacity: 1;
	}

	li.has-sub:after {
		content: none;
	}

	.subNav {
		opacity: 1;
	}

	.subNav A {
		margin: 0;
		width: 100%;
		background: #201f1c;
		padding: 8px 0 5px;
		font-size: 18px;
	}

	.subNav LI:hover > A,
	.subNav LI.over > A,
	.subNav > LI.act > A,
	.subNav > LI.act:hover > A,
	.subNav > LI.act.over > A {
		background: #6d654d;
	}

	.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: 55px;
			height: 52px;
			line-height: 52px;
			text-align: center;
		}
		.subNav .showSub
		{
			background: #201f1c;
			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 #aaa;
			border-top: 6px solid\9;
			border-right: 5px solid transparent;
			border-left: 5px solid transparent;
		}
		.showSub.open:after
		{
			border-top-color: #fff;
			-webkit-transform: rotate(180deg);
			   -moz-transform: rotate(180deg);
			    -ms-transform: rotate(180deg);
			     -o-transform: rotate(180deg);
			        transform: rotate(180deg);
		}


	/*Subhead*/
	#subhead2 .csc-textpic-text {
	    width: 100%;
	    -webkit-box-sizing: border-box;
	       -moz-box-sizing: border-box;
	            box-sizing: border-box;
	    padding: 0 3%;
	}

	#subhead2 .csc-textpic-text .GrosserText {
		font-size: 32px;
	}

/*Gridelemente*/
	.gridrow .col
	{
		float: none;
	}
	.gridrow .col + .col
	{
		margin: 20px 0 0;
	}
	.box50 .col,
	.box33 .col,
	.box25 .col,
	.box33-66 .col.col1,
	.box33-66 .col.col2,
	.box66-33 .col.col1,
	.box66-33 .col.col2
	{
		width: 100%;
	}

	.DunkelGrauBildText > .gridrow .col + .col,
	.BildText > .gridrow .col + .col {
		margin: 0;
	}

	/*Braune Boxen*/
	.DunkelGrauBildText > .gridrow *,
	.BildText > .gridrow * {
		height: auto;
	}

	.DunkelGrauBildText > .gridrow.box50,
	.BildText > .gridrow.box50 {
		position: relative;
		display: flex;
		flex-direction: column;
	}

	.DunkelGrauBildText > .gridrow.box50 > .col1,
	.BildText > .gridrow.box50 > .col2 {
		position: static;
		order: 1;
		width: 100%;
	}
		.DunkelGrauBildText > .gridrow.box50 > .col2,
		.BildText > .gridrow.box50 > .col1 {
			order: 2;
			width: 100%;
		}

	.DunkelGrauBildText > .gridrow.box50 > .col,
	.BildText > .gridrow.box50 > .col {
		width: 100%;
		float: none;
	}

	body:not(#uid2) .DunkelGrauBildText > .gridrow > .col1 IMG,
	.BildText > .gridrow > .col2 IMG {
		position: static;
		-webkit-transform: none;
		   -moz-transform: none;
		    -ms-transform: none;
		     -o-transform: none;
		        transform: none;
		width: 100%;
		height: auto;
	}

	/*Maßanzug, Stile von mq 1200 aufheben*/
	#uid31 .DunkelGrauBildText.c132 > .gridrow > .col1 IMG,
	#uid31 .BildText.c127 > .gridrow > .col2 IMG {
		position: static;
		transform: none;
	}

	/*Teaser*/
	.teaser_wrap .teaser {
		width: 100%;
		max-height: 400px;
		float: none;
		box-sizing: border-box;
	}

	.teaser_wrap .teaser + .teaser {
		margin-left: 0;
	}

	.teaser_wrap .teaser div.csc-textpic .csc-textpic-imagewrap IMG
	{
		min-width: 0;
		width: 100%;
		height: auto;
	}

	.teaser_wrap .teaser .csc-textpic-text P.bodytext{
		visibility: visible;
		opacity: 1;
		height: auto;
		max-height: 1000px;
	}

		

	/*Exlusivbilder */
	.allcont .exklusivbilder DIV.csc-textpic.csc-textpic-center .csc-textpic-imagewrap .csc-textpic-image {
		margin: 0 auto;
	}
	.exklusivbilder .gridrow .col + .col {
		margin: 3% 0 0;
	}

	/*Termine*/
	#uid28 .allcont DIV.csc-textpic.csc-textpic-center .csc-textpic-imagewrap .csc-textpic-image {
		margin: 0 auto 15px;
	}

	/*Footer*/
	.foot-3col .col,
	.foot-2col .col {
		width: 100%;
		float: none;
		text-align: center;
	}

	.foot-3col .col2 IMG {
		margin: 20px auto;
	}

	.foot-3col .col P.align-right {
		text-align: center;
	}

	.foot-2col .col1 LI {
	    margin-right: 0;
	    display: block;
	    padding: 5px 0;
	}

	.tablewrap
		{
			position: relative;
		}

	.tablewrap:after
		{
			content: '';
			width: 10px;
			position: absolute;
			top: 0;
			right: -1px;
			height: 100%;
			-webkit-box-shadow: inset -5px 0px 5px -2px rgba(0,0,0,0.2);
			   -moz-box-shadow: inset -5px 0px 5px -2px rgba(0,0,0,0.2);
			        box-shadow: inset -5px 0px 5px -2px rgba(0,0,0,0.2);
			z-index: 1;
		}

	.tableinner
		{
			overflow-x: scroll;
			position: relative;
		}

	.allcont TABLE {
			margin: 0;
		}

	/*Jubilaeum*/
	.zehnJahre {
	    top: 140px;
	} 

/* Falls Footer unten klebt */
	HTML, BODY, #site 
	{
		height: auto;
	}
	BODY > #site 
	{
		min-height: 0;
	}
	#allcont, .allcont 
	{
		padding-bottom: 0;
	}
	.foot
	{
		height: auto;
		margin-top: 0;
	}

/* Gekaufte Bilder .c1 ändern */
	/*Fotolialiste*/
	.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: 760px) and (orientation: landscape) {
	#subhead {
		min-height: 500px;
	}

	.nav {
		min-height: 500px;
	}

	/*Teaser*/
	.teaser_wrap .teaser {
		height: calc((100vw / 3) * 1.5);
		max-height: none;

		width: -webkit-calc((100% / 3));
		width: -moz-calc((100% / 3));
		width: calc((100% / 3));

		float: left;
	}

	.teaser_wrap .teaser div.csc-textpic .csc-textpic-imagewrap IMG {
	    width: auto;
	    height: 100%;
	    max-width: none;
	}

		/*Text*/
		.teaser_wrap .teaser .csc-textpic-text H3 {
			font-size: 17px;
		}
		.teaser_wrap .teaser .csc-textpic-text P.bodytext {
			display: none;
		}
}

/*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;
		margin: 0 auto 15px;
	}

	H1 	{font-size: 24px;}
	H2 	{font-size: 20px;}
	H3 	{font-size: 18px;}
	H4 	{
		font-size: 16px;
	    line-height: 28px;
	}
	
	.bx-controls.bx-has-pager {
		bottom: 20px;
	}

	/*Head*/
	.open_nav {
		right: 0;
		top: -15px;
	}

	.nav {
		top: -15px;
	}

	/*Subhead*/
	#subhead {
		margin-bottom: 50px;
	}

	#subhead2 .csc-textpic-text {
	    font-size: 16px;
	    line-height: 28px;
	}

	#subhead2 .csc-textpic-text .GrosserText {
	    font-size: 23px;
	}

	#subhead .item IMG {
		max-width: none;
	}

	/*Bildtext*/
	.DunkelGrauBildText > .gridrow > .col2,
	.BildText > .gridrow > .col1 {
		padding: 25px;
	}

	/*Städtelinks*/
	.staedtelinks UL LI A {
		font-size: 13px;
	}

	/*Teaser*/
	.teaser_wrap .teaser {
		height: calc(100vw * 1.5);
		max-height: none;
	}

	.teaser_wrap .teaser div.csc-textpic .csc-textpic-imagewrap IMG {
	    width: auto;
	    height: 100%;
	    max-width: none;
	}

	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 (min--moz-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 1.5), only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi) {
	
	.scrolldown A {
		background-image: url(../img/arrow-down2x.png);
	}

}
