/* ######################################################################################
########################### KARRIERESCOUT MAIN CSS ######################################
/* ################################################################################### */

/* ##### FONTS #####*/

@font-face {
    font-family: 'BowlbyOneSC';
    src: url('../Fonts/BowlbyOneSC-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'open_sanslight';
    src: url('../Fonts/OpenSans-Light-webfont.eot');
    src: url('../Fonts/OpenSans-Light-webfont.eot?#iefix') format('embedded-opentype'),
         url('../Fonts/OpenSans-Light-webfont.woff') format('woff'),
         url('../Fonts/OpenSans-Light-webfont.ttf') format('truetype'),
         url('../Fonts/OpenSans-Light-webfont.svg#open_sanslight') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'open_sanslight_italic';
    src: url('../Fonts/OpenSans-LightItalic-webfont.eot');
    src: url('../Fonts/OpenSans-LightItalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('../Fonts/OpenSans-LightItalic-webfont.woff') format('woff'),
         url('../Fonts/OpenSans-LightItalic-webfont.ttf') format('truetype'),
         url('../Fonts/OpenSans-LightItalic-webfont.svg#open_sanslight_italic') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'open_sansregular';
    src: url('../Fonts/OpenSans-Regular-webfont.eot');
    src: url('../Fonts/OpenSans-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../Fonts/OpenSans-Regular-webfont.woff') format('woff'),
         url('../Fonts/OpenSans-Regular-webfont.ttf') format('truetype'),
         url('../Fonts/OpenSans-Regular-webfont.svg#open_sansregular') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'open_sansitalic';
    src: url('../Fonts/OpenSans-Italic-webfont.eot');
    src: url('../Fonts/OpenSans-Italic-webfont.eot?#iefix') format('embedded-opentype'),
         url('../Fonts/OpenSans-Italic-webfont.woff') format('woff'),
         url('../Fonts/OpenSans-Italic-webfont.ttf') format('truetype'),
         url('../Fonts/OpenSans-Italic-webfont.svg#open_sansitalic') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'open_sansbold';
    src: url('../Fonts/OpenSans-Bold-webfont.eot');
    src: url('../Fonts/OpenSans-Bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../Fonts/OpenSans-Bold-webfont.woff') format('woff'),
         url('../Fonts/OpenSans-Bold-webfont.ttf') format('truetype'),
         url('../Fonts/OpenSans-Bold-webfont.svg#open_sansbold') format('svg');
    font-weight: normal;
    font-style: normal;
}


/* ##### MAINCOLOR #####*/


:root {
	--background:#fff;
	--fontcolor:rgba(0,0,0,0.8);
	--linkcolor:rgba(226,25,91);
	--linkhovercolor:#ab486e;
	--maincolor01:#b9ab60;
	--white:#fff;
	--whitetransparent:rgba(255, 255, 255, 0.6);
	--grey:rgba(0,0,0,0.5);
	--black:#000;
	/*--blue: rgba(115,196,238);*/
	--blue: rgba(59, 162, 204);
	--red:rgb(170,0,60);
	--brightred:rgb(236,150,157);
	--maxwidth:1520px;
	--padding:50px;
	--paddingmiddle:40px;
	--paddingsmall:30px;
	--paddingmini:20px;
}




/* ##### MAIN #####*/

[hidden], template {
  display: none !important;
}

*{
	margin:0;
	padding:0;
}
body {
	background: rgb(0,73,103); /* Old browsers */
	color:var(--fontcolor);
	font-family:'open_sansregular';
	font-size:22px;
	font-weight: bold;
	line-height:1.4;
	padding:0;
	margin: 180px 0 0 0;
	font-weight: 900;
	letter-spacing:-.025em;
}
p{
	margin-bottom: 30px;
}
p:last-child,
#content ul:last-child{
	margin-bottom: 0;
}
p strong,
p b{
	color: var(--blue);
	font-family: 'open_sansbold';
}
h1, h2, h3, h4{
	text-align: left;
	line-height: 110%;
	font-weight: normal;
	font-family: 'BowlbyOneSC';
}
h1 {
	text-transform:uppercase;
	font-size:42px;
	color:var(--black);
	margin-bottom: 40px;
}
h2 {
	text-transform:uppercase;
	font-size:30px;
	margin:50px 0 30px;
	color:var(--black);
	hyphens: auto;
}
h3 {	
	font-family:'open_sansbold';
	text-transform:none;
	font-size: 28px;
	margin: 45px 0 20px 0;
	font-weight: bold;
	line-height: 120%;
}
h4 {	
	font-family:'open_sansbold';
	text-transform:none;
	font-size: 24px;
	font-weight: bold;
	margin: 25px 0 20px 0;
}
.frame-default h3,
.frame-white_separate_boxes h3{
	color: var(--blue);
}


div[class*='separate_boxes'] .frame-colimage_full{
	margin-bottom: 0 !Important;
}
div[class*='separate_boxes'] .frame-colimage_bottom{	
    margin-top: 30px !important;
}
	div[class*='separate_boxes'] .frame-colimage_full .ce-gallery,
	div[class*='separate_boxes'] .frame-colimage_bottom .ce-gallery{
		margin-bottom: 0 !important;
	}
	div[class*='separate_boxes'] .frame-colimage_full{
		background: none !important;
		margin-left: 0 !important;
	}
	


.row > div:first-child > div:first-child h2:first-child,
.row > div:first-child > div:first-child h3:first-child,
.row > div > div:first-child h2:first-child,
.row > div > div:first-child h3:first-child,
.frame-layout-0 > header:first-child h2:first-child,
.frame-layout-0 > div:first-child > div:first-child > h2:first-child,
.frame-layout-0 > header:first-child h3:first-child,
.frame-layout-0 > div:first-child > div:first-child > h3:first-child,
.frame-0 > header:first-child h2:first-child,
.frame-0 > header:first-child h3:first-child{
	margin-top: 0;
}
.col, .col-1, .col-10, .col-11, .col-12, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-auto, .col-lg, .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-auto, .col-md, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-auto, .col-sm, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-auto, .col-xl, .col-xl-1, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-auto{
	padding-right: 40px;
}

header {
	text-transform:uppercase;
}
hr {
	background:rgba(255,255,255,0.1);
	height:1px;
	width:100%;
	border:none;
	margin:40px 0;
	display:block;
}
#content ul {
	padding:0 0 0 22px;
	margin-bottom: 30px;
}
#content li {
	list-style-type:square;
	border-bottom:1px solid rgba(87,133,231,0.3);
	padding:5px 0;
}
#content li:first-child {
	padding:0 0 5px;
}
#content li:last-child {
	border-bottom:none;
}
a:link, a:visited, a:active  { 
	color: var(--linkcolor);
	text-decoration:none;
	-webkit-transition: all .25s ease;
	-moz-transition: all .25s ease;
	-ms-transition: all .25s ease;
	-o-transition: all .25s ease;
	transition: all .25s ease;
	-webkit-appearance: none;
	-moz-appearance: none;
	text-decoration: underline;
}
a:hover  { 
	color: var(--linkhovercolor);
	text-decoration:none;
}
*[id^="c"],
iframe#apprenticeship_iframe{
	scroll-margin-top: 150px;
	scroll-snap-margin-top: 150px;
}
blockquote {
	margin:0;
}
blockquote p {
	font-family:'open_sanslight_italic';
}
#content .ce-textpic .ce-gallery {
	margin: 0;
}
#content .ce-intext.ce-left .ce-gallery {
	margin-right:20px;
}
#content .ce-intext.ce-right .ce-gallery {
	margin-left:20px;
}
.ce-gallery figure{
	position: relative;
}
figure.image img{
	width: 100%;
	height: auto;
}
.clear {
	clear: both;
}

/* ##### TABLES #####*/


table {
	width:100%;
	border-collapse: collapse;
}
table thead th {
    vertical-align: bottom;
    border-bottom: 2px solid rgba(87,133,231,0.3);
	color:var(--white);
	background: var(--black);
}
table th, table td {
	border-top: 1px solid rgba(87,133,231,0.3);
	padding: 0.75rem;
	text-align:inherit;
}
table tbody tr:nth-of-type(2n+1) {
	background: rgba(87,133,231,0.1)
}
table tbody tr:hover {
	background: rgba(87,133,231,0.15)
}
table tbody tr:hover td {
	color:var(--black);
}


/* ##### FORMULARE #####*/

form{
	margin: 60px 0;
	background: var(--blue);
	padding: var(--padding);
}

input, select, option, textarea {
    padding: 5px 10px;
	width: 100%;
	border: none;
	font-size:22px;
	line-height: 100%;
}
option{
    padding: 1px 10px;
}
select{
	overflow: hidden;
}

.form-group {
	display: flex;
	margin-bottom: 15px;
}

.form-group label {
	width: 35%;
	padding-top: 3px;
	font-family: 'open_sansbold';
	color: #000;
	margin-right: 30px;
}

.btn {
	background: var(--black);
	color: var(--linkcolor);
	border: none;
	padding: 20px var(--paddingmini);
	font-size: 22px;
	text-transform: uppercase;
	border-radius: 3px;
	font-family: 'BowlbyOneSC';
}
.btn:hover {
	color: var(--linkhovercolor);
}
.form-buttons{
	margin-top: 50px;
}
	.form-buttons span{
		width: 35%;
		margin-right: 30px;
		margin-top: 20px;
		cursor: pointer;
	}
	.form-buttons .btn{
		width: 100%;
		cursor: pointer;
	}
	
.buttons_bottom_mobile{
	margin-top: 50px;
}
#lehrstellensuche [class*='col'] {
	padding: 0;
}

.search-map {
	width: 100%;
}


/* contact-form */
.contact{
}
	.contact .form-group {
		display: block;
		margin-bottom: 11px;
	}

	.contact .form-group label {
		width: 100%;
		padding-top: 0;
		padding-bottom: 2px;
		display: block;
		margin-right: 0;
	}
	.contact .btn {
		padding: 15px var(--paddingmini);
	}
	.contact .form-buttons{
		margin-top: 15px;
	}
		.contact .form-buttons span{
			width: 100%;
			margin: 0 0 30px 0;
			display: block;
		}

	.contact .form-group label.form-check-label {
		display: inline;
		margin-right: 20px;
	}
	.contact .form-group .form-check-input {
		width: auto;
		margin-bottom: 20px;
	}

/* ##### GRID / FRAMES #####*/

.default #content > .frame {
	background: var(--background);
	padding: 50px var(--padding);
	margin: 0 0 50px 0;
}
.index #content > .frame {
	background: var(--background);
	padding: 20px 0;
	margin: 0 0 50px 0;
	background-size: cover;
	min-height: 400px;
}
.row .frame-type-image {
	background: var(--background);
	padding: inherit;
	margin: inherit;
	background-size: cover;
	min-height: inherit!important;
	width:100%;
	display: inherit!important;
	align-items: inherit!important;
	justify-content: inherit!important;
}
.default #content > .frame.frame-space-after-extra-small,
.default #content > .frame.frame-space-after-extra-small p:last-child{
	margin-bottom: 0 !important;
	padding-bottom: 5px !important;
}


/* ##### FRAME WITH BACKGROUND IMAGE #####*/


.frame-type-image {
	background: var(--background);
	background-position:top center !important;
	padding: 0!important;
	margin: 50px 0;
	background-size: cover!important;
	min-height: 500px!important;
	width:100%;
	display: flex;
	align-items: center;
	justify-content: center;
}
.frame-type-image h1, .frame-type-image h2, .frame-type-image h3 {
	text-align:left;
	text-shadow: 0 0 10px #000;
	line-height:1.1em;
}
.frame-type-image h2 {
	font-size:50px;
	margin-bottom:10px;
}
.frame-type-image h3 {
	margin: 0 0 50px;
}


/* ##### WRAPPER #####*/


#wrapper {
	width:100%;
	height:100%;
	max-width:var(--maxwidth);
	margin:0 auto;
	padding:0 80px;
	box-sizing:border-box;
}


/* ##### HEADER #####*/

#header {
	position:fixed;
	width:100%;
	left:0;
	top:0;
	z-index:2;
	background: black;
	height: 140px;
}
#header #logo {
	width:250px;
	top:0;
	margin-top: -25px;
	position: absolute;
	z-index: 1;
}
#header #logo img {
	width:100%;
}




/* ##### NAVIGATION #####*/
#header #top_nav{
	display: block;
	width: 100%;
	height: 55px;
	background: white;
	position: absolute;
	top: 0;
	z-index: -1;
}
	#top_menu_wrapper  {
		width: 100%;
		max-width: var(--maxwidth);
		margin: 0 auto;
		padding: 0 60px 0 250px;
	}
		#top_menu {
			float: right;
		}
			#header nav#top_nav li a {
				line-height: 56px;
				font-weight: 500;
				font-size: 18px;
				padding: 0 20px;
			}
			#header nav#top_nav li a:hover {
				color: var(--red);
			}
			#top_menu img{
				width: 150px;
				padding-top: 19px;
			}
#header #main_nav {
	display: block;
	width: calc(100% - 470px);	/* -470px needed so the layer is not above the logo and the social-buttons */
	height: 87px;
	position: absolute;
	top: 55px;
	z-index: 1;
	left: 240px;
}
		#header #menuToggle input{
			display:none;
		}
			#header #menu {
				margin:0;
			}
#header .black_layer {
	display:none;
}
#header nav li {
	float:left;
	list-style-type:none;
	margin:0;
}
#header nav li a {
	display:block;
	line-height:87px;
	padding:0 27px;
	text-transform:uppercase;
	color: var(--blue);
	font-family:'open_sansbold';
	font-size:22px;
	text-decoration: none;
}
#header nav li a:hover {
	color: var(--white);
}
#header nav li:hover ul {
	display:block;
}
#header nav li ul li {
	float:none;
	width:100%;
	margin:0;
	padding:0;
	border-bottom:1px solid rgba(0,0,0,0.5);
	height:auto;
}
#header nav li ul li:last-child{
	border:none;
}
#header nav li ul a {
	color:#fff;
	display:block;
	padding: 5px 10px;
	height:30px!important;
	line-height:30px!important;
	font-size:15px;
}
#header nav li ul a:hover {
	background:rgba(0,0,0,0.2);
	color:#fff;
}
#header nav li ul li:hover {
	position:relative;
}
#header nav li ul li ul {
	display:none;
	position:absolute;	
	top:0;
	left:200px;
}
#header nav li ul li ul a {
	font-size:12px;
	background:rgba(0,0,0,0.05);
}
#header nav li:hover ul ul {
	display:none!important;
}
#header nav li:hover ul li:hover ul {
	display:block!important;
}



/* ##### SHARIFF #####*/

#header #social{
	position: absolute;
	top: 80px;
	width: 100%;
}
	#header .social_links_follow{
		max-width: var(--maxwidth);
		margin: 0 auto;
		padding: 0 75px;
	}
		#header .social_links_follow ul{
			width: 94px;
			float: right;
		}
		.social_links_follow  li{
			float: left;
			list-style: none;
			margin: 3px 0 0 10px;
		}
		#header .social_links_follow a {
			color:var(--blue)!important;
			background:none!important;
		}
		.social_links_follow a:hover {
			color:var(--white)!important;
		}
		.social_links_follow  .facebook .fa-facebook-f {
			font-size: 19px;
		}
.social_links_follow .youtube .fa-youtube, .social_links_follow .instagram .fa-instagram {
  font-size: 23px;
}
footer .social_links_follow a{
	display: inline-block;
	height: 30px;
	margin: 5px 2px 0 0;
}
footer .social_links_follow  a span.fa-facebook-f {
	font-size: 20px;
	padding: 5px 7px 3px 9px;
	width: 30px;
	color: white;
}
footer .social_links_follow  a span.fa-youtube,
footer .social_links_follow a span.fa-instagram{
	font-size: 25px;
	padding: 1px 2px 2px 2px;
	width: 32px;
	color: white;
}
footer .social_links_follow  a span.fa-youtube{
	margin-right: 5px;
}
footer .social_links_follow a:hover{
	background: var(--white) !important;
}
footer .social_links_follow a:hover span{
	color: var(--red) !important;
}


/* ##### ANCHOR-NAV #####*/

.frame-anchor_nav{
	position: fixed;
	top: 180px;
	left: 0;
	z-index:2;
	background-color: var(--whitetransparent);
	-webkit-transition: all .5s ease;
	-moz-transition: all .5s ease;
	-ms-transition: all .5s ease;
	-o-transition: all .5s ease;
	transition: all .5s ease;
	padding: 15px !important;
	margin: 0 !important;
}
	.frame-anchor_nav ul{
		margin: 0 !important;
		padding: 0 !important;
	}

		.frame-anchor_nav li{
			list-style-type:none;
			padding: 0 20px;
			position: relative;
			width: 25px;
			overflow: hidden;
			-webkit-transition: all .5s ease;
			-moz-transition: all .5s ease;
			-ms-transition: all .5s ease;
			-o-transition: all .5s ease;
			transition: all .5s ease;
			white-space: nowrap;
			border:none !important;
			margin: 0 !important;
			padding: 0 !important;			
		}
		
.frame-anchor_nav:hover{
	left: 0;
	box-shadow: 0 0 10px rgba(0,0,0,0.6);
}
	.frame-anchor_nav:hover li{
		width: 280px;
		padding: 0 0 0 20px;
		-webkit-transition: all .2s ease;
		-moz-transition: all .2s ease;
		-ms-transition: all .2s ease;
		-o-transition: all .2s ease;
		transition: all .2s ease;
		border:none;
	}

		.frame-anchor_nav li::before {
			content: " ";
			position: absolute;
			right: calc(100% - 15px);
			top: 11px;
			height: 15px;
			width: 15px;
			border-radius: 15px;
			background: var(--fontcolor);
			transition: color .2s linear,width .2s linear;
		}
		.frame-anchor_nav li:hover::before{
			background: var(--red);
		}
		.frame-anchor_nav li a {
			display: block;
			padding: 5px 0 5px 30px;
			text-decoration: none;
			font-size: 18px;
			color:#444!important;
			position:relative;
			border:none;
		}
		.frame-anchor_nav li a:before {
			display: inline-block;
			position: absolute;
			right: 100%;
			bottom: 0;
			content: " ";
			width: 0;
			height: 0;
			border-bottom: 43px solid #444;
			border-left: 18px solid transparent;
			opacity: 0;
		}		
		.frame-anchor_nav li a:hover{
			color:var(--red)!important;
		}
		.frame-anchor_nav li a:hover:before {
			opacity: 1;
		}
		
		
		
/* ##### SLIDER #####*/

.slider{
	margin-bottom: 120px;
}
	.slider > div{
		background: white;
		position: relative;
	}
		.slider header {
			position: absolute;
			bottom: -50px;
			z-index: 1;
			width: 100%;
			box-sizing: border-box;
		}
			.slider header h1 {
				font-size:50px;
				margin:0;
				line-height:1;
				text-align: center;
				color: white;
				background: var(--red);
				padding: 20px 0 5px 0;
			}
			.slider header h2 {
				font-size:50px;
				color: var(--brightred);
				margin:0;
				line-height:1;
				text-align: center;
				background: var(--red);
				padding: 5px 0 20px 0;
			}
		.slider .row .col-md-4{
			padding: 0;
		}
		.slider .row > div:nth-child(1) figure{
			padding: 10px 0 0 80px;
		}
		.slider .row > div:nth-child(2) figure{
			padding: 10px 40px 0 40px;
		}
		.slider .row > div:nth-child(3) figure{
			padding: 10px 80px 0 0;
		}
		.slider img{
			-webkit-transition: all .2s ease;
			-moz-transition: all .2s ease;
			-ms-transition: all .2s ease;
			-o-transition: all .2s ease;
			transition: all .2s ease;
		}
		.slider a:hover img{
			scale: 1.1;
		}


/* ##### CONTENT #####*/


.index #content .entry .row {
	margin: 0 15% 100px !important;
}
.default #content {
	margin-top:150px;
}
.row{
	margin-left: 0;
	margin-right: 0;
}
div:not(.frame-blue_separate_boxes):not(.frame-white_separate_boxes):not(.auswahl) > .row > .col-12:first-child{
	padding-left: 0 !important;
}
div:not(.frame-blue_separate_boxes):not(.frame-white_separate_boxes):not(.auswahl) > .row > .col-12:last-child{
	padding-right: 0 !important;
}
.index #content > .frame.frame-type-simplevideo{
	padding: 0 !important;
	min-height: auto;
}



/* ##### AUSWAHL #####*/


.auswahl {
	background:var(--white)!important;
	color:#000;
	padding:0!important;
	height:280px;
	min-height:inherit!important;
}
.auswahl .row {
	margin:0;
}
.auswahl div:not(.stickyauswahl) .col-md-3 {
	text-align:center;
	border-right:1px solid #111;
	padding: 0 3%;
	height: 280px;
	-webkit-transition: background .5s ease;
	-moz-transition: background .5s ease;
	-ms-transition: background .5s ease;
	-o-transition: background .5s ease;
	transition: background .5s ease;
	cursor: pointer;
}
.auswahl .col-md-3:last-child {
	border-right:none!important;
}
.auswahl.hover_class  .col-md-3:hover {
	text-align:center;
	padding:0 3%;
	background:var(--red);
}
.auswahl h3 {
	text-align: center;
	margin: 0 0 20px 0 !important;
	text-transform: uppercase;
	font-weight: normal;
	font-family: 'BowlbyOneSC';
	line-height: 110%;
	font-size: 16px !important;
}
	.auswahl h3 a{
		color: var(--black);
		text-decoration: none;
		font-size: 23px;
		hyphens: auto;
		line-height: 120%;
	}	
	.auswahl.hover_class .col-md-3:hover h3 a,
	.auswahl.hover_class .col-md-3:hover p {
		color:var(--white);
	}

.auswahl p {
	font-size:16px;
	font-family:'open_sansregular';
}
.auswahl .col-md-3:first-child:before,
.auswahl .col-md-3:nth-child(2):before,
.auswahl .col-md-3:nth-child(3):before,
.auswahl .col-md-3:nth-child(4):before {
	content:'';
	display:block;
	width:80px;
	height:80px;
	margin:-25px auto 20px;
	background-size:80px!important;
}
.auswahl .col-md-3:first-child:before {
	background: url('/fileadmin/user_upload/icon-berufsorientierung.svg') no-repeat;
}
.auswahl .col-md-3:nth-child(2):before {
	background: url('/fileadmin/user_upload/icon-karriere.svg') no-repeat;
}
.auswahl .col-md-3:nth-child(3):before {
	background: url('/fileadmin/user_upload/icon-lehrstellenboerse.svg') no-repeat;
}
.auswahl .col-md-3:nth-child(4):before {
	background: url('/fileadmin/user_upload/icon-start.svg') no-repeat;
}
.stickyauswahl {
	position: fixed;
	width: 50px;
	left: 10px;
	top: 220px;
	display: inline-block;
	z-index: 100;
	background: none!important;
	margin:0;
}
.stickyauswahl .col-md-3 {
	float:none!important;
	border:none;
	margin:0 0 10px 25px!important;
	max-width:inherit;
	height:50px!important;
	width:50px;
	flex:inherit;
	border-radius:0 50px 50px 0;
	background:transparent!important;
	-webkit-transition: height .5s ease, width .5s ease;
	-moz-transition: height .5s ease, width .5s ease;
	-ms-transition: height .5s ease, width .5s ease;
	-o-transition: height .5s ease, width .5s ease;
	transition: height .5s ease, width .5s ease;
	padding:0!important;
}
.stickyauswahl .col-md-3 div {
	margin-top:-50px;
}
.stickyauswahl p {
	display:none;	
}
.stickyauswahl h3 {
	opacity:0;
}
.stickyauswahl h3 ,
.stickyauswahl h3 a{
	color: #fff !important;
	width: 0% !important;
	display: block;
	overflow: hidden;
	white-space: nowrap;
}
.hover_class .stickyauswahl .col-md-3:hover h3,
.hover_class .stickyauswahl .col-md-3:hover h3 a{
	width: 100% !important;
	overflow: visible;
}
.stickyauswahl .col-md-3:first-child:before,
.stickyauswahl .col-md-3:nth-child(2):before,
.stickyauswahl .col-md-3:nth-child(3):before,
.stickyauswahl .col-md-3:nth-child(4):before {
	width:50px!important;
	height:50px!important;
	background-size:50px!important;
	background-position: center;
	margin:0 0 0 -25px;
	border:2px solid #fff;
	border-radius:50px;
	background-color:var(--red);
	cursor: pointer;
}
.hover_class .stickyauswahl .col-md-3:hover h3 {
	display:block;
	width:280px;
	margin:15px 0 0 40px !important;
	text-align:left;
	opacity:1;
	-webkit-transition: all .25s ease;
	-moz-transition: all .25s ease;
	-ms-transition: all .25s ease;
	-o-transition: all .25s ease;
	transition: all .25s ease;
}
	.hover_class .stickyauswahl .col-md-3:hover h3 a{
		font-size:18px;
	}

.hover_class .stickyauswahl .col-md-3:hover {
	text-align:center;
	padding:10px;
	background:var(--red)!important;
	width:280px;
	max-width:280px !important;
}



/* ##### TESTIMONIALS #####*/

.testimonial {
	padding: 20px 0 !important;
}
.testimonial:nth-child(even) {
	background: var(--blue) !important;
}
	.testimonial:nth-child(even) p {
		color: var(--white) ;
	}
.testimonial .col-12:not(.col-md-3){
	margin: 0 !important;
}
.testimonial h2 {
	text-align:left;
	margin: 50px 0 30px 0 !important;
	line-height: 110%;
	font-weight: normal;
	font-family: 'BowlbyOneSC';
	text-transform:uppercase;
	font-size:30px;
	color:var(--black);
	hyphens: auto;
}

.testimonial .row {
	margin:0;
}
blockquote p {
	font-size:22px;
}
.testimonial .col {
	padding-left:0;
	padding-right:0;
}
.testimonial .ce-image {
	margin: -20px 0;
}
.testimonial .ce-intext.ce-right .ce-gallery, 
.testimonial .ce-intext.ce-left .ce-gallery, 
.testimonial .ce-above .ce-gallery {
	margin-bottom:0;
}
.testimonial .ce-gallery img {
	width:100%;
	height:auto;
}
.testimonial .ce-gallery figure {
    display: inherit;
    margin: 0;
    max-height: 600px;
}
.testimonial .ce-column, 
.testimonial .ce-left .ce-gallery,
.testimonial .ce-right .ce-gallery {
	float:none;
}
.testimonial .frame-type-text:not(.frame-grungy_button) {
	padding:0 var(--padding);
}
.testimonial .frame-default p a{
	  padding-left: 50px;
}
	.testimonial .frame-default p a::before{
		content: url('../../../../../../fileadmin/user_upload/youtube-brand.svg');
		width: 40px;
		position: absolute;
		display: inline-block;
		margin-left: -50px;
	}
	.testimonial .frame-default p a:hover::before{
		opacity: 0.8;
	}
.testimonial.animate{
	-webkit-transition: all .5s ease;
	-moz-transition: all .5s ease;
	-ms-transition: all .5s ease;
	-o-transition: all .5s ease;
	transition: all .5s ease;
	transform:matrix(1.00,0.00,0.00,1.00,0,200);
	-ms-transform:matrix(1.00,0.00,0.00,1.00,0,200);
	-webkit-transform:matrix(1.00,0.00,0.00,1.00,0,200);
}
.testimonial.start_animation {
	transform:matrix(1.00,0.00,0.00,1.00,0,0);
	-ms-transform:matrix(1.00,0.00,0.00,1.00,0,0);
	-webkit-transform:matrix(1.00,0.00,0.00,1.00,0,0);
}
.testimonial.animate:nth-child(even) img {
	-webkit-transition: all .5s ease;
	-moz-transition: all .5s ease;
	-ms-transition: all .5s ease;
	-o-transition: all .5s ease;
	transition: all .5s ease;
	opacity:0;
	scale: 0;
}
.testimonial.start_animation:nth-child(even) img {
	opacity:1;
	scale: 1;
}
.testimonial.animate:nth-child(odd) img {
	-webkit-transition: all 1s ease;
	-moz-transition: all 1s ease;
	-ms-transition: all 1s ease;
	-o-transition: all 1s ease;
	transition: all 1s ease;
	transform:matrix(1.00,0.00,0.00,1.00,0,200);
	-ms-transform:matrix(1.00,0.00,0.00,1.00,0,200);
	-webkit-transform:matrix(1.00,0.00,0.00,1.00,0,200);
	opacity:0;
	scale: 1.5;
}
.testimonial.start_animation:nth-child(odd) img {
	transform:matrix(1.00,0.00,0.00,1.00,0,0);
	-ms-transform:matrix(1.00,0.00,0.00,1.00,0,0);
	-webkit-transform:matrix(1.00,0.00,0.00,1.00,0,0);
	opacity:1;
	scale: 1;
}
.testimonial.animate h2 {
	-webkit-transition: all 1.5s ease;
	-moz-transition: all 1.5s ease;
	-ms-transition: all 1.5s ease;
	-o-transition: all 1.5s ease;
	transition: all 1.5s ease;
	opacity:0;
}
.testimonial.start_animation h2 {
	opacity:1;
}
.testimonial.animate:nth-child(odd) div:not(.frame-grungy_button) > p {
	-webkit-transition: all 1s ease;
	-moz-transition: all 1s ease;
	-ms-transition: all 1s ease;
	-o-transition: all 1s ease;
	transition: all 1s ease;
	transform:matrix(1.00,0.00,0.00,1.00,0,100);
	-ms-transform:matrix(1.00,0.00,0.00,1.00,0,100);
	-webkit-transform:matrix(1.00,0.00,0.00,1.00,0,100);
	opacity:0;
}
.testimonial.start_animation:nth-child(odd) div:not(.frame-grungy_button) > p {
	transform:matrix(1.00,0.00,0.00,1.00,0,0);
	-ms-transform:matrix(1.00,0.00,0.00,1.00,0,0);
	-webkit-transform:matrix(1.00,0.00,0.00,1.00,0,0);
	opacity:1;
}
.testimonial.animate:nth-child(even) div:not(.frame-grungy_button) > p {
	-webkit-transition: all 1s ease;
	-moz-transition: all 1s ease;
	-ms-transition: all 1s ease;
	-o-transition: all 1s ease;
	transition: all 1s ease;
	scale:0;
	opacity:0;
}
.testimonial.start_animation:nth-child(even) div:not(.frame-grungy_button) > p {
	scale:1;
	opacity:1;
}
.testimonial .frame-grungy_button{
	margin-bottom: -30px;
	position: absolute;
	right: 20px;
	bottom: -30px;
	float: none;
}




/* ##### LINK BOX HOME #####*/

#c675{
	background: var(--red) !important;
	text-align: center;
	height: auto !important;
	min-height: auto !important;
	padding: 0 !important;
}
	#c675 a{
		display: block;
		padding: 40px;
		color: white;
		text-decoration: none;
		font-size: 40px;
		font-weight: normal;
		font-family: 'BowlbyOneSC';
		text-transform: uppercase;
	}



/* ##### SEPARATE BOXES #####*/

#content > .frame-blue_separate_boxes,
#content > .frame-white_separate_boxes{
	background: transparent !important;
	padding: 0 !important;
}
	#content > .frame-blue_separate_boxes > .row,
	#content > .frame-white_separate_boxes > .row{
		margin: 0;
	}
		#content > .frame-blue_separate_boxes > .row > div{
			background: var(--blue) !important;
			color: var(--white);
			padding: var(--padding);
		}
		#content > .frame-white_separate_boxes > .row > div{
			background: var(--white) !important;
			padding: var(--padding);
		}
		
		#content > .frame-blue_separate_boxes > .row > div.col-md-6,
		#content > .frame-white_separate_boxes > .row > div.col-md-6{
			flex: 0 0 calc(50% - 20px);
			margin-right: 20px;
			margin-left: 20px;
		}
			#content > .frame-blue_separate_boxes > .row > div.col-md-6 .row,
			#content > .frame-white_separate_boxes > .row > div.col-md-6 .row{
				margin: 0;
			}
				#content > .frame-blue_separate_boxes > .row > div.col-md-6 .col-md-6,
				#content > .frame-white_separate_boxes > .row > div.col-md-6 .col-md-6{
					padding: 0;
				}

		#content > .frame-blue_separate_boxes > .row > div.col-md-4,
		#content > .frame-white_separate_boxes > .row > div.col-md-4{
			flex: 0 0 calc(33.333333333333% - 20px);
			margin-right: 20px;
			margin-left: 20px;
		}
		#content > .frame-blue_separate_boxes > .row > div.col-md-8,
		#content > .frame-white_separate_boxes > .row > div.col-md-8{
			flex: 0 0 calc(66.666666666666% - 20px);
			margin-right: 20px;
			margin-left: 20px;
		}
		
		#content > .frame-blue_separate_boxes > .row > div.col-md-6:first-child,
		#content > .frame-white_separate_boxes > .row > div.col-md-6:first-child,
		#content > .frame-blue_separate_boxes > .row > div.col-md-4:first-child,
		#content > .frame-white_separate_boxes > .row > div.col-md-4:first-child,
		#content > .frame-blue_separate_boxes > .row > div.col-md-8:first-child,
		#content > .frame-white_separate_boxes > .row > div.col-md-8:first-child{
			margin-left: 0px;
		}
		#content > .frame-blue_separate_boxes > .row > div.col-md-6:last-child,
		#content > .frame-white_separate_boxes > .row > div.col-md-6:last-child,
		#content > .frame-blue_separate_boxes > .row > div.col-md-4:last-child,
		#content > .frame-white_separate_boxes > .row > div.col-md-4:last-child,
		#content > .frame-blue_separate_boxes > .row > div.col-md-8:last-child,
		#content > .frame-white_separate_boxes > .row > div.col-md-8:last-child{
			margin-right: 0px;
		}




/* ##### EVENTS #####*/

.tx-events2 .list{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	grid-column-gap: var(--paddingmiddle);
	grid-row-gap: var(--paddingmiddle);
}
	.frame-blue_separate_boxes .tx-events2 .list > div{
		background: var(--blue);
		color: var(--white);
		padding: var(--padding);
	}
	.frame-blue_separate_boxes .tx-events2 .list > div.morelink{
		display: none;
	}
		/* .frame-blue_separate_boxes .tx-events2 .list h3:not(.media-heading), */
		.frame-blue_separate_boxes .tx-events2 .list strong.panel-title{
			font-family:'open_sansregular';
			font-weight: normal;
			margin: 0 0 10px 0;
			font-size: 21px;
			color: var(--whitetransparent) !important;
			display: block;
		}
		.frame-blue_separate_boxes .tx-events2 .list h3.media-heading{
			margin: 0 0 20px 0;
		}
			.frame-blue_separate_boxes .tx-events2 .list h3.media-heading a{
				color: var(--black);
				font-family: 'open_sansbold';
				font-size: 28px;
				font-weight: bold;
				text-decoration: none;
				hyphens: auto;
			}
		.frame-blue_separate_boxes .tx-events2 .list .list-group{
			display: none;
		}
		.tx-events2 .panel-default{
			position: relative;
		}
			.tx-events2 .list-arrow{
				position: relative;
				display: block;
				position: absolute;
				right: 0;
				bottom: 0;
			}
				.tx-events2 .list-arrow a{
					background: #fff;
					padding: 11px;
					display: block;
					width: 50px;
					height: 54px;
				}
.lead{
	font-family: 'open_sansbold';
}
.event-info h2{
	margin-top: 0px;
	margin-bottom: 28px;
}
.event-info dl{
	margin-bottom: 24px;
}	
	.event-info dl strong{
		font-family: 'open_sansbold';
	}
.grungy_button_eventdetails,
.grungy_button_relative{
	position: relative !important;
}
.frame-grungy_button.grungy_button_relative{
	right: 0 !important;
	bottom: 0 !important;
	margin-top: 20px !important;
	margin-bottom: 0;
}
.frame-grungy_button.grungy_button_eventdetails{
	float: none;
}

	
/* ##### EVENTS OVERVIEW-PAGE #####*/
	
#c17 .tx-events2 .list{
	display: block;
}
	#c17 .tx-events2 .panel-default{
		
	}
		#c17 .tx-events2 .panel-default .panel-heading{
			float: left;
			width: 230px;
		}
			#c17 .tx-events2 .panel-default .panel-heading *{
				margin: 0;
			}
			.tx-events2 .panel-default .events2-date-delimiter:after{
				content: ' '; 
				display: block;
			}
		#c17 .tx-events2 .panel-default .panel-body{
			margin-left: 250px;
			border-left: 1px solid var(--red);
			padding-left: 20px;
		}
		#c17 .tx-events2 .panel-default .list-group{
			display: none;
		}
		#c17 .tx-events2 .panel-default .list-arrow{
			margin-left: 250px;
			width: 100%;
			height: 100%;
		}
			#c17 .tx-events2 .panel-default .list-arrow a{
				background: none;
				padding: 0;
				width: 100%;
				height: 100%;
			}
				#c17 .tx-events2 .panel-default .list-arrow a svg{
					display: none;
				}
	#c17 .tx-events2 .f3-widget-paginator{
		display: none;
	}
	
	
	
	
	
	
	
	
	
	


/* ##### RED INFOBOX BOTTOM #####*/

#content > .frame-red_info_bottom{
	background: var(--red) !important;
	margin-top: calc(-1 * var(--padding)) !important;
	padding-top: var(--paddingsmall) !important;
	padding-bottom: var(--paddingsmall) !important;
	color: #fff;
}
	#content > .frame-red_info_bottom strong{
		color: #fff;
	}
	
	
	
/* ##### BLUE BOX #####*/

#content > .frame-blue_box{
	background: var(--blue) !important;
	color: #fff;
}
	#content > .frame-blue_box strong,
	#content > .frame-blue_separate_boxes strong,
	#content > .frame-blue_box .frame-default h3,
	#content > .frame-blue_separate_boxes .frame-default h3{
		color: #fff;
	}
	#content > .frame-blue_box a,
	#content > .frame-blue_separate_boxes a{
		color: var(--black);
	}
	#content > .frame-blue_box a:hover,
	#content > .frame-blue_separate_boxes a:hover{
		color: var(--fontcolor);
	}


	
	
/* ##### STANDALONE HEADLINE #####*/

#content > .frame-standalone_headline{
	background: transparent !important;
	padding: 0 !important;
}
	#content > .frame-standalone_headline *{
		text-align: center;
		color: #fff;
	}
	#content > .frame-standalone_headline h2{
		font-size: 60px;
		margin: 90px 0 10px 0;
	}
	#content > .frame-standalone_headline h3{
		font-size: 43px;
		margin: 0;
		text-transform: uppercase;
		font-family: 'BowlbyOneSC';
		font-weight: normal;
	}
	#content > .frame-standalone_headline p{
		margin: 20px 0 0 0;
	}


	
	
/* ##### CHECKLIST #####*/

#content ul.checklist {
  list-style: none;
  margin-left: -12px;
}
	#content ul.checklist li {
		list-style-type: none;
		position: relative;
		padding: 7px 0 7px 30px;
		border-bottom: 1px solid rgba(255, 255, 255, 0.2);
	}
	#content ul.checklist li:before {
		content: '✓';
		position: absolute;
		left: 0;
	}
	#content ul.checklist li:last-child{
		border-bottom: none;
	}
	
	
	
/* ##### IMAGE FULL #####*/

.frame-image_full{
	padding: 0 !important;
}
	.frame-image_full *{
		margin: 0 !important;
		padding: 0 !important;
		width: 100% !important;
		height: auto !important;
	}
	
	
	
/* ##### IMAGE COPYRIGHT #####*/

figure .image-caption {
    position: absolute;
    color: #fff;
    font-size: 11px;
    bottom: 5px;
    right: 10px;
    text-shadow: 2px 2px 4px #000;
    text-align: right;
}
.img-thumbnail {
    padding: 4px;
    line-height: 1.42857143;
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: 4px;
    -webkit-transition: all .2s ease-in-out;
    -o-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
    display: inline-block;
    max-width: 100%;
    height: auto;
}

	
	
	
/* ##### GRUNGY BUTTON #####*/

.frame-grungy_button{
	background: url('/fileadmin/user_upload/crunchy-button.svg') no-repeat;
	background-size: 100%;
	width: 270px;
	height: 210px;
	position: relative;
	bottom: -23px;
	float: right;
	margin-bottom: -72px;
}
.frame-grungy_button a{
	color: white !important;
}
.col-md-6 .col-md-6 .frame-grungy_button{
	position: normal;
	right: 0;
	margin-right: -30px;
}
	.frame-grungy_button a{
		display: block;
		padding: 69px 62px 0 45px;
		text-decoration: none;
		font-size: 25px;
		font-weight: normal;
		font-family: 'BowlbyOneSC';
		line-height: 120%;
		text-align: center;
		letter-spacing: 0.1px;
	}
.animate .frame-grungy_button,
.frame-grungy_button.animate {
	scale: 0;
}
.start_animation .frame-grungy_button,
.frame-grungy_button.start_animation {
	animation-name: popup;
	animation-duration: 0.5s;
	animation-delay: 0.2s;
	animation-fill-mode: forwards;
}


	
/* ##### GRUNGY HEADLINE #####*/

.frame-grungy_headline_box{
	background: url('/fileadmin/user_upload/crunchy-headline-1.svg') no-repeat;
	background-size: 100% 100%;
	min-height: 460px;
	padding: calc(-5px + var(--padding)) var(--paddingsmall) 0 calc(38px + var(--padding));
	margin-left: calc(-1 * var(--padding) - 38px);
	margin-top: calc(-1 * var(--padding) + 5px);
}
	.frame-grungy_headline_box h1,
	.frame-grungy_headline_box h2{
		text-shadow: 0 0 5px var(--black);
		line-height: 90%;
		position: relative;
		background: transparent;
		z-index: 0;
		letter-spacing: 2px;
		hyphens: auto;
	}
		.frame-grungy_headline_box h1:before ,
		.frame-grungy_headline_box h2:before {
		  content: attr(data-title);
		  position: absolute;
		  left: 0;
		  z-index: -1;
		}

	.frame-grungy_headline_box h1{
		color: var(--white);
		font-size: 66px;
		margin: 20px 0 25px 0;
		scale: 0;
		animation-name: popup;
		animation-duration: 0.5s;
		animation-delay: 0.5s;
		animation-fill-mode: forwards;
	}

		.frame-grungy_headline_box h1:before {
		  -moz-text-stroke: 18px var(--black);
		  -webkit-text-stroke: 18px var(--black);
		  text-stroke: 18px var(--black);
		}

	.frame-grungy_headline_box h2{
		color: var(--red);
		font-size: 34px;
		margin: 0;
		
		-webkit-transform: rotate(-3deg);
		-moz-transform: rotate(-3deg);
		-ms-transform: rotate(-3deg);
		-o-transform: rotate(-3deg);
		transform: rotate(-3deg);
		-webkit-transform-origin: 0 0;
		-moz-transform-origin: 0 0;
		-ms-transform-origin: 0 0;
		-o-transform-origin: 0 0;
		transform-origin: 0 0;
		
		margin-top: -1000px;
		animation-name: fall;
		animation-duration: 0.5s;
		animation-delay: 1.3s;
		animation-fill-mode: forwards;
	}
		.frame-grungy_headline_box h2:before {
		  text-stroke: 11px var(--black);
		  -moz-text-stroke: 11px var(--black);
		  -webkit-text-stroke: 11px var(--black);
		}
	
	


/* ##### ANIMATIONS #####*/

@keyframes popup{
  0%   {scale: 0;}
  60%  {scale: 1.2;}
  100% {scale: 1;}
}
@keyframes fall{
  0%   {margin-top: -500px;}
  60% {margin-top: 40px;}
  65% {margin-top: 40px;}
  100% {margin-top: 0px;}
}
@keyframes fade_in{
  0%   {opacity: 0}
  100% {opacity:1}
}

.start_animation.animation_fade_in{
	opacity: 0;
	animation-name: fade_in;
	animation-duration: 1s;
	animation-fill-mode: forwards;
}




/* ##### STECKBRIEF-HEADER #####*/

div[class*="frame-s_header_"] h1{
	hyphens: auto;
	margin: 0 0 20px 0;
}
div[class*="frame-s_header_"] .row > div:last-child h2{
	margin-top: 0;
	font-size: 22px;
	margin-bottom: 22px;
}
div[class*="frame-s_header_"] .ce-gallery figure{
	position: initial;
}	


@media only screen and (min-width: 961px){
	/* styles for "left" box which contaisn the image of the person */
	div[class*="frame-s_header_"] .frame-type-image div{
		display: block !important;
		position: absolute !important;
		width: 100% !important;
		height: 623px !important;
	}
	/* hide second image because it is only needed for responsive */
	div[class*="frame-s_header_"] .frame-type-image .ce-row:last-child{
		display: none !important;
	}
		div[class*="frame-s_header_"] figure img{
			position: absolute;
			width: auto !important;
			height: 623px !important;
			left: 0;
		}
		/* other style for image "smartphone without hand" */
		div.frame-s_header_o-h  figure img{	
			left: auto;
			right: 0;
		}
}
@media only screen and (min-width: 1301px){

	div[class*="frame-s_header_"]{
		padding: 0 !important;
		height: 623px !important;
		margin: 15px;
		position: relative;
	}
		div[class*="frame-s_header_"] .row{
			margin: 0;
		}
			div[class*="frame-s_header_"] .row > div{
				-ms-flex: 0 0 100%;
				flex: 0 0 100%;
				max-width: 100%;
				padding: 0;
			}
					
			/* styles for "right" box which contaisn the smartphone-image and the text */
			div[class*="frame-s_header_"] .row > div:last-child{
				position: absolute;
				right: 0;
				top: 0;
				height: 623px;
				width: 880px;
			}
			/* other style for image "smartphone without hand" */
			div.frame-s_header_o-h .row > div:last-child{
				left: 0;
				right: auto;
				width: 741px;
			}
			/* the diffetent images */
			.frame-s_header_o-h .row > div:last-child{	background: url('/fileadmin/user_upload/o-h.png') no-repeat;	}
			.frame-s_header_f-h-l-n-1 .row > div:last-child{	background: url('/fileadmin/user_upload/f-h-l-n-1.png') no-repeat;	}
			.frame-s_header_f-h-o-l-1 .row > div:last-child{	background: url('/fileadmin/user_upload/f-h-o-l-1.png') no-repeat;	}
			.frame-s_header_f-h-o-l-2 .row > div:last-child{	background: url('/fileadmin/user_upload/f-h-o-l-2.png') no-repeat;	}
			.frame-s_header_f-h-r-l-1 .row > div:last-child{	background: url('/fileadmin/user_upload/f-h-r-l-1.png') no-repeat;	}
			.frame-s_header_f-m-o-l-1 .row > div:last-child{	background: url('/fileadmin/user_upload/f-m-o-l-1.png') no-repeat;	}
			.frame-s_header_f-m-o-l-2 .row > div:last-child{	background: url('/fileadmin/user_upload/f-m-o-l-2.png') no-repeat;	}
			.frame-s_header_m-h-1 .row > div:last-child{	background: url('/fileadmin/user_upload/m-h-1.png') no-repeat;	}
			.frame-s_header_m-h-2 .row > div:last-child{	background: url('/fileadmin/user_upload/m-h-2.png') no-repeat;	}
			.frame-s_header_m-m-1 .row > div:last-child{	background: url('/fileadmin/user_upload/m-m-1.png') no-repeat;	}
			.frame-s_header_m-d-1 .row > div:last-child{	background: url('/fileadmin/user_upload/m-d-1.png') no-repeat;	}

				div[class*="frame-s_header_"] h1,
				div[class*="frame-s_header_"] .row > div:last-child > div{
					width: 350px;
					-webkit-transform: rotate(8deg);
					-moz-transform: rotate(8deg);
					-ms-transform: rotate(8deg);
					-o-transform: rotate(8deg);
					transform: rotate(8deg);
					-webkit-transform-origin: 0 0;
					-moz-transform-origin: 0 0;
					-ms-transform-origin: 0 0;
					-o-transform-origin: 0 0;
					transform-origin: 0 0;

					position: absolute;
					right: 208px;
					top: 24px;
					margin-top: 120px;
				}
				div[class*="frame-s_header_"] > header{
					height: 0;
					position: absolute;
					right: 0;
				}
				div.frame-s_header_o-h > header{
					left: 0;
					right: auto;
				}
				div[class*="frame-s_header_"] h1{
					text-shadow: 0 0 5px var(--black);
					line-height: 90%;
					position: relative;
					background: transparent;
					z-index: 1;
					letter-spacing: 2px;
					color: var(--blue);
					font-size: 34px;
					text-align: center;
					right: 193px;
					margin: 0;
				}				
				div.frame-s_header_o-h .row > div:last-child > div{
					left: 350px;
					right: auto;
				}
				div.frame-s_header_o-h h1{
					left: 335px;
					right: auto;
				}
				div[class*="frame-s_header_"] h1:before{
					content: attr(data-title);
					position: absolute;
					z-index: -1;
					text-stroke: 13px var(--black);
					-moz-text-stroke: 13px var(--black);
					-webkit-text-stroke: 13px var(--black);
					text-align: center;
					left: 0;
				}
				div.frame-s_header_o-h h1,
				div.frame-s_header_o-h .row > div:last-child > div{
					-webkit-transform: rotate(-8deg);
					-moz-transform: rotate(-8deg);
					-ms-transform: rotate(-8deg);
					-o-transform: rotate(-8deg);
					transform: rotate(-8deg);
					left: 160px;
					top: 66px;
				}
				div.frame-s_header_o-h h1{
					left: 145px;
				}
				div[class*="frame-s_header_"] .row > div:last-child p{
					margin-bottom: 15px;
				}
}


/* ##### TAB AKKORDEON #####*/

.ui-tabs{
	border: none;
	padding: none;
	background: transparent;
}
	.ui-tabs ul.ui-tabs-nav{
		list-style: none;
		float: left;
		width: calc(33% + var(--paddingmiddle));
		background: transparent !important;
		padding: 0 !important;
		border: none !important;
	}
		.ui-tabs ul.ui-tabs-nav li{
			list-style-type: none;
			display: block;
			background: transparent !important;
			border: none !important;
			margin: 0 !important;
			border-radius: 0 !important;
			white-space: normal !important;
			float: none;
		}
		.ui-tabs ul.ui-tabs-nav li.ui-tabs-active{
			background: var(--white) !important;
		}
			.ui-tabs ul.ui-tabs-nav li a{
				color: var(--white) !important;
				white-space: normal !important;
				display: block;
				width: 100%;
				float: none;
			}
			.ui-tabs ul.ui-tabs-nav li:hover a,
			.ui-tabs ul.ui-tabs-nav li.ui-tabs-active a{
				color: var(--black) !important;
			}
			.ui-widget-content header h3{
				color: #333333 !important;
			}
			
.ui-tabs-panel{
	background: var(--white) !important;
	margin-left: calc(33% + var(--paddingmiddle));
}
	#content > .frame-blue_box .ui-tabs-panel strong{
		color: var(--fontcolor);
	}

	
	

	
/* ##### BILDERGALERIE #####*/

.frame-image_gallery {
	padding: var(--paddingmiddle) !important;
}
.frame-image_gallery .ce-image .ce-row:not(:only-child) {	
    margin-bottom: 10px;
    float: left;
    width: 50%;
}
.frame-image_gallery .ce-image .ce-row:not(:only-child) .ce-column{
    margin: 0 1%;
    width: 48%;
    max-height: 180px;
    overflow: hidden;
}
	.frame-image_gallery .ce-image .ce-row:not(:only-child) .ce-column figure{
		height: 180px;
		display: block;
	}
	
	
	
	
	


/* ##### FOOTER #####*/


footer {
	background: black;
	box-sizing:border-box;
	color: var(--white);
	font-size:14px;
}
footer > .row{
	padding:var(--padding) calc(var(--padding) + 15px);
	max-width: var(--maxwidth);
	margin: 0 auto;
}
footer > .row > .left-content{
	padding-left: 0;
}
footer header {
	font-size:16px;
	font-weight: normal;
}
footer ul {
	margin: 20px 0;
	padding:0;
}
footer li {
	list-style-type:none;
	padding:2px 0;
	margin:0;
}
footer p{
	font-weight: normal;
}
footer a {
	color: var(--whitetransparent)!important;
	font-family:'open_sansregular';
	font-weight: normal;
	text-decoration: none !important;
}
footer a:hover {
	color: var(--white)!important;
	text-decoration:underline;
}
footer .shariff {
	margin-top:5px;
}
footer .shariff a {
	color:white!important;
	background:black!important;
}
footer .shariff a:hover {
	background:var(--white)!important;
	color:var(--red)!important;
}
footer .shariff .shariff-button {
	width:30px!important;
	height:30px!important;
}
.shariff .youtube .fa-youtube, .shariff .instagram .fa-instagram {
  font-size: 23px;
}
footer img {
	width:100%;
	height:auto;
	max-width:276px;
}


/* ##### COOKIE #####*/

.cookie-set{
	position: fixed;
	bottom: 0;
	left: 100px;
	background: #fff;
	padding: 10px 15px 10px 40px;
	border-radius: 10px 10px 0 0;
	box-shadow: 0 0 10px rgba(0,0,0,.4);
	color: var(--fontcolor);
	z-index: 2;
}
.cookie-set:before{
	content: ' ';
	background: url('/fileadmin/user_upload/cookie.jpg') no-repeat;
	background-size: 100%;
	width: 20px;
	height: 20px;
	display: inline-block;
	position: absolute;
	left: 12px;
}

footer .cookie-btn{
	background: var(--red);
	border-radius: 0;
	padding: 10px 20px;
}
footer .cookie-management,
footer .cookie-refuse,
footer .text-back-right a{
	border-radius: 0;
	padding: 10px 20px;
}
	footer .cookie-management a,
	footer .cookie-refuse a,
	footer .text-back-right a,
	footer .cookie-btn{
		color: white !important;
	}
	footer .cookie-management a:hover,
	footer .cookie-refuse a:hover,
	footer .text-back-right a:hover,
	footer .cookie-btn:hover{
		color: var(--whitetransparent) !important;
	}
footer .waconcookiemanagement{
	font-size: 19px;
}
.cookiemanagement h2{
	font-weight: normal;
}











/* ##### RWD #####*/
@media only screen and (min-width: 1680px){
	#header #main_nav{
		width: calc(100% - 570px) !important;
	}
}

@media only screen and (max-width: 1500px){
	.testimonial {
		min-height:inherit!important;		
	}
	.testimonial .frame-type-text:not(.frame-grungy_button) {
		padding: 0 40px;
	}
	.testimonial h2 {
		font-size: 26px !important;
		margin: 20px 0 20px 0 !important;
	}	
}

@media only screen and (max-width: 1400px){

	/* ##### BILDERGALERIE #####*/
	
	.frame-image_gallery .ce-image .ce-row:not(:only-child) .ce-column{
		max-height: 140px;
	}
		.frame-image_gallery .ce-image .ce-row:not(:only-child) .ce-column figure{
			height: 140px;
		}
}

@media only screen and (max-width: 1300px){
	body {
		margin: 180px 0 0 0;
	}
	.row {
		margin:0;
	}
	#header nav li a {
		padding:0px 18px;
		font-size:17px;
	}	
	#header nav#top_nav li a {
		font-size: 16px;
		padding: 0 17px;
	}
	.slider header h1, .slider header h2 {
		font-size:40px;
	}
	.slider .row > div:nth-child(1) figure{
		padding: 10px 0 0 60px;
	}
	.slider .row > div:nth-child(2) figure{
		padding: 10px 30px 0 30px;
	}
	.slider .row > div:nth-child(3) figure{
		padding: 10px 60px 0 0;
	}
	.auswahl p {
		font-size:16px;
	}
	blockquote p {
		font-size:18px;
	}
	body, input, select, option, textarea{
		font-size: 18px;
	}
	footer .waconcookiemanagement{
		font-size: 17px;
	}
	p{
		margin-bottom: 20px;
	}
	.frame-grungy_headline_box{
		min-height: 350px;
		padding: calc(-5px + var(--padding)) var(--paddingmini) 0 calc(26px + var(--padding));
		margin-left: calc(-1 * var(--padding) - 26px);
	}
		.frame-grungy_headline_box h1{
			font-size: 51px;
		}
		.frame-grungy_headline_box h2{
			font-size: 27px
		}
	h2{
		font-size: 26px;
		margin-bottom: 25px;
	}
	h3,
	.frame-blue_separate_boxes .tx-events2 .list h3.media-heading a{
		font-size: 24px;
		margin: 27px 0 18px 0;
	}
	.frame-blue_separate_boxes .tx-events2 .list h3:not(.media-heading){
		font-size: 19px;
	}
	h4 {	
		font-size: 19px;
		margin: 20px 0 18px 0;
	}
	.default #content > .frame,
	#content > .frame-blue_separate_boxes > .row > div,
	#content > .frame-white_separate_boxes > .row > div,
	.frame-blue_separate_boxes .tx-events2 .list > div,
	form{
		padding: var(--paddingsmall);
	}
	.frame-grungy_button{
		width: 240px;
		height: 215px;
	}
		.frame-grungy_button a{
			padding: 66px 62px 0 49px;
			font-size: 21px;
		}
	.testimonial  .frame-grungy_button{
		height: 193px;
	}
	.testimonial .frame-default p a{
		  padding-left: 37px;
	}
		.testimonial .frame-default p a::before{
			width: 30px;
			margin-left: -37px;
		}

	div[class*="frame-s_header_"] .frame-type-image div {
		height: 100% !important;
	}

	
	/* hide first and display second image because this one is needed for responsive */
	div[class*="frame-s_header_"] .frame-type-image .ce-row:first-child{
		display: none !important;
	}
	div[class*="frame-s_header_"] .frame-type-image .ce-row:last-child{
		display: block !important;
	}
		div[class*="frame-s_header_"] figure img{
			height: 100% !important;
			margin-right: 15px;
			left: auto;
			right: 0;
		}
	div[class*="frame-s_header_"] .ce-gallery figure .image-caption{
		right: 25px;
	}

	.event-info h2{
		margin-bottom: 17px;
	}
	
	
	#c17 .tx-events2 .panel-default .panel-heading{
		width: 200px;
	}
	#c17 .tx-events2 .panel-default .panel-body, 
	#c17 .tx-events2 .panel-default .list-arrow{
		margin-left: 220px;
	}
	
	
	/* ##### BILDERGALERIE #####*/
	
	.frame-image_gallery {
		padding: var(--paddingsmall) !important;
	}
}

@media only screen and (max-width: 1200px){
	.testimonial .col-md-6{
		height: 300px;
	}
	.testimonial:nth-child(even) .col-md-6:first-child,
	.testimonial:nth-child(odd) .col-md-6:last-child{
		-ms-flex: 0 0 33%;
		flex: 0 0 33%;
		max-width: 33%;
	}
	.testimonial:nth-child(even) .col-md-6:last-child,
	.testimonial:nth-child(odd) .col-md-6:first-child{
		-ms-flex: 0 0 67%;
		flex: 0 0 67%;
		max-width: 67%;
	}
	.testimonial .ce-gallery img {
		width: auto;
		height: 340px;
		margin-left: -120px;
	}
	.testimonial .ce-gallery figure {
		height: calc(100% + 40px);
	}
	.testimonial .frame-grungy_button {
		position: absolute;
	}	
}

@media only screen and (max-width: 1100px){
	.slider {
		margin-bottom: 160px;
	}
		.slider header{
			bottom: -80px;
		}
		.slider .row > div:nth-child(1) figure{
			padding: 10px 0 0 40px;
		}
		.slider .row > div:nth-child(2) figure{
			padding: 10px 20px 0 20px;
		}
		.slider .row > div:nth-child(3) figure{
			padding: 10px 40px 0 0;
		}

	.auswahl {
		height:auto!important;
		display: inline-block;
		background:none!important;
	}
	.auswahl .row {
		flex:inherit!important;
		display:block!important;
		height:auto;
		background:none;
	}
	.auswahl .col-md-3 {
		width:50%;
		float:left;
		margin:0 0 40px 0;
		max-width:inherit;
		box-sizing:border-box;
		background:var(--white);
		padding:0 5%;
	}
	.auswahl.hover_class .col-md-3:hover {
		padding:0 5%;
		border-right:1px solid #000;
	}
	#social{
		display: none;
	}
	#header #main_nav {
		width: calc(100% - 240px);	/* only -240px needed so the layer is not above the logo (social-buttons aren't visible anymore */
	}
	.frame-grungy_button:not(.grungy_button_eventdetails):not(.grungy_button_relative){
		position: relative;
		margin-right: 0;
		float: right;
		right: 0;
	}
	.frame-grungy_button:not(.grungy_button_eventdetails):not(.grungy_button_relative):after{
		content: ' ';
		display: block;
		clear: both;		
	}
	.frame-grungy_button.grungy_button_eventdetails{
		right: 20px !important;
	}

	.testimonial .frame-grungy_button {
		position: absolute !important;
		float: none !important;
		margin-bottom: -45px;
	}		

	.ui-tabs .ui-tabs-panel .col-md-6,
	.col-md-6 .col-md-6 {
		-ms-flex: 0 0 100%;
		flex: 0 0 100%;
		max-width: 100%;
	}
	.ui-tabs .ui-tabs-panel .col-md-6:first-child,
	.col-md-6 .col-md-6:first-child{
		margin-bottom: 0 !important;
	}
	
	/* ##### BILDERGALERIE #####*/

	.frame-image_gallery .ce-image .ce-row:not(:only-child) {	
		float: none;
		width: 100%;
	}	
	.frame-image_gallery .ce-image .ce-row:not(:only-child) .ce-column{
		max-height: 200px;
	}
		.frame-image_gallery .ce-image .ce-row:not(:only-child) .ce-column figure{
			height: 200px;
		}

}

@media only screen and (max-width: 960px) {
	#header{
		height: 130px;
	}	
	#header #logo {
		width: 230px;
	}	
	#header .col-md-9 {
		position:inherit;
	}
	#header #top_menu_wrapper  {
		padding: 0 20px 0 0;
	}
	#header nav#main_nav {
		height: inherit;
		right: 0;
	}
		#header #menuToggle {
			display: block;
			position: absolute;
			z-index: 1;
			-webkit-user-select: none;
			user-select: none;
			right:40px;
			top:27px;
		}
			#header #menuToggle input {
				display: block;
				width: 40px;
				height: 32px;
				position: absolute;
				top: -7px;
				left: -5px; 
				cursor: pointer;
				opacity: 0;
				z-index: 2; 
				-webkit-touch-callout: none;
			}
			#header .black_layer {
				background: rgba(0,0,0,0.8);
				display:none;
				position: absolute;
				width: 100vw;
				height: 100vh;
				padding: 0;
				margin: -95px -40px 0;
				right:0;
				top:0;
			}
			#header #menuToggle input:checked ~ .black_layer {
				display:block;
			}
			#header #menuToggle span {
				display: block;
				width: 33px;
				height: 4px;
				margin-bottom: 5px;
				position: relative;
				background: #fff;
				border-radius: 3px;
				z-index: 1;
				transform-origin: 4px 0px;
				transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
						  background 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
						  opacity 0.55s ease;
			}
			#header #menuToggle span:first-child {
				transform-origin: 0% 0%;
			}
			#header #menuToggle span:nth-last-child(2) {
				transform-origin: 0% 100%;
			}
			#header #menuToggle input:checked ~ span {
				opacity: 1;
				transform: rotate(45deg) translate(-2px, -1px);
				background: var(--fontcolor);
			}
			#header #menuToggle input:checked ~ span:nth-last-child(3) {
				opacity: 0;
				transform: rotate(0deg) scale(0.2, 0.2);
			}
			#header #menuToggle input:checked ~ span:nth-last-child(2) {
				transform: rotate(-45deg) translate(0, -1px);
			}
			#header #menu {
				position: absolute;
				width: auto;
				margin: -54px 0 0 -247px;
				padding: 20px;
				padding-top: 53px;
				background: var(--white);
				-webkit-font-smoothing: antialiased;
				transform-origin: 0% 0%;
				transform: translate(100%, 0);
				transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0);
				min-width: 320px;
				box-sizing: border-box;
			}
				#header #menuToggle input:checked ~ ul {
					transform: none;
				}
				#header nav#main_nav ul {
					float:none;
				}
					#header nav#main_nav li {
						font-size: 20px;
						width:100%;
						float:none;
						border-bottom: 1px solid rgba(0,0,0,0.2);
						height:auto;
					}
					#header nav#main_nav li:last-child {
						border-bottom: none;
					}
					#header nav#main_nav li:hover {
						height:auto;
					}
						#header nav#main_nav li ul {
							position:inherit;
							padding:0!important;
							background:none;
							top:0;
						}
							#header nav#main_nav li ul li {
								border:none!important;
								margin-left:10px!important;
							}
								#header nav#main_nav li ul li:hover, nav li ul li a:hover {
									background:none;
								}
								#header nav#main_nav li ul a {
									padding: 5px 5px 5px 0 !important;
								}
									#header nav#main_nav li:hover ul li:hover ul {
										display:none!important;
									}
						#header nav#main_nav li a {
							font-size: 18px;
							padding: 10px 5px 10px 10px;
							display: block;
							line-height:40px;
						}
						#header nav#main_nav li a:hover {
							background:rgba(0,0,0,0.05);
							color: var(--red);
						}
				
	#header .shariff {
		display:none;
	}

	#header nav li {
		margin-left: 0px;
	}
	#wrapper.default {
		padding: 0 40px;
	}
	
	.slider header h1, .slider header h2 {
		font-size:35px;
	}
	.slider .row > div:nth-child(1) figure{
		padding: 10px 0 0 20px;
	}
	.slider .row > div:nth-child(2) figure{
		padding: 10px 10px 0 10px;
	}
	.slider .row > div:nth-child(3) figure{
		padding: 10px 20px 0 0;
	}
	.slider .row .col-md-4{
		-ms-flex: 0 0 33.333333% !important;
		flex: 0 0 33.333333% !important;
		max-width: 33.333333% !important;
	}

	.frame-anchor_nav{
		display: none;
	}
	body, input, select, option, textarea{
		font-size: 16px;
	}
	p{
		margin-bottom: 16px;
	}
	.frame-grungy_headline_box{
		min-height: 350px;
		padding: calc(-5px + var(--padding)) 0 0 calc(5px + var(--padding));
		margin-left: calc(-1 * var(--padding) - 5px);
	}
		.frame-grungy_headline_box h1{
			font-size: 40px;
		}
		.frame-grungy_headline_box h2{
			font-size: 23px
		}
	h1{
		font-size: 37px;
		margin-bottom: 30px;
	}
	h2{
		font-size: 22px;
		margin-bottom: 22px;
	}
	h3,
	.frame-blue_separate_boxes .tx-events2 .list h3.media-heading a{
		font-size: 21px;
		margin: 24px 0 15px 0;
	}
	.frame-blue_separate_boxes .tx-events2 .list h3:not(.media-heading){
		font-size: 18px;
	}
	h4 {	
		font-size: 17px;
		margin: 17px 0 14px 0;
	}
	.default #content > .frame,
	#content > .frame-blue_separate_boxes > .row > div,
	#content > .frame-white_separate_boxes > .row > div,
	.frame-blue_separate_boxes .tx-events2 .list > div,
	form{
		padding: var(--paddingmini);
	}
	
	#content > .frame-standalone_headline h2{
		font-size: 40px;
		margin: 70px 0 3px 0;
	}
	#content > .frame-standalone_headline h3{
		font-size: 30px;
	}
	.col-md-4,
	.col-md-8{
		-ms-flex: 0 0 100% !important;
		flex: 0 0 100% !important;
		max-width: 100% !important;
		margin: 0 !important;
	}
	div:not(.frame-blue_separate_boxes):not(.frame-white_separate_boxes):not(.auswahl) > .row > .col-md-4,
	div:not(.frame-blue_separate_boxes):not(.frame-white_separate_boxes):not(.auswahl) > .row > .col-md-8{
		padding:0 !important;
	}
	.col-md-3{
		-ms-flex: 0 0 50% !important;
		flex: 0 0 50% !important;
		max-width: 50% !important;
		margin-bottom: 30px;
	}
	footer .col-12 {
		margin: 0 0 30px 0 !important;
	}
	footer ul{
		margin-bottom: 0;
	}

	.tx-events2 .list{
		grid-template-columns: repeat(2, 1fr);
	}
		.tx-events2 .list > div:nth-last-child(2){
			display: none;
		}
	.tx-events2 .col-md-9,
	.tx-events2 .col-md-3.event-info{
		-ms-flex: 0 0 100%;
		flex: 0 0 100%;
		max-width: 100%;
		padding: 0;
		margin-bottom: 40px;
	}
	.tx-events2 .col-md-3.event-info{
		margin-bottom: 0;
	}
		.tx-events2 .col-md-3.event-info h2{
			margin-top: 20px;
		}
		.tx-events2 .col-md-3.event-info dl:last-child{
			margin-bottom: 0;
		}
		.grungy_button_eventdetails{
			right: 0;
			bottom: 0;
		}

	#c17 .tx-events2 .panel-default .panel-heading{
		width: 180px;
	}
	#c17 .tx-events2 .panel-default .panel-body, 
	#c17 .tx-events2 .panel-default .list-arrow{
		margin-left: 200px;
	}

		
		
	.ui-tabs ul.ui-tabs-nav{
		display: none;
	}
	.ui-tabs .ui-tabs-panel{
		display: block !important;
		margin: 0 0 5px 0;
		border-radius: 0;
		overflow: hidden;
		height: auto !important;
	}
		.ui-tabs .ui-tabs-panel header{
			cursor: pointer;
		}
		
		
	div[class*="frame-s_header_"] .row{
		display: block;
	}
	div[class*="frame-s_header_"] .col-12{
		margin: 0 !important;
	}
	div[class*="frame-s_header_"] .col-12:first-child,
	div[class*="frame-s_header_"] .col-12:first-child *{
		height: auto !important;
		width: 100% !important;
		margin: 0 !important;
	}
	div[class*="frame-s_header_"] h2{
		margin-top: 20px !important;
	}
	div[class*="frame-s_header_"] .ce-gallery figure .image-caption{
		right: 10px;
	}

	.testimonial {
		margin-top: 0 !important;
	}
	.testimonial h2 {
		font-size: 23px !important;
	}
	.testimonial .frame-default p a{
		  padding-left: 30px;
	}
		.testimonial .frame-default p a::before{
			width: 25px;
			margin-left: -30px;
		}

		
	/* ##### BILDERGALERIE #####*/

	.frame-image_gallery {
		padding: 25px 20px 20px 20px !important;
	}
	
	/* CHANGING NAVI-STYLES SEE TOP */
}


@media only screen and (max-width: 850px){
	.slider header h1, .slider header h2 {
		font-size:30px;
	}
	.slider .row > div:nth-child(1) figure{
		padding: 10px 0 0 0;
	}
	.slider .row > div:nth-child(2) figure{
		padding: 10px 0 0 0;
	}
	.slider .row > div:nth-child(3) figure{
		padding: 10px 0 0 0;
	}

	.testimonial .col-md-6{
		height: auto;
	}
	.testimonial .col-md-6{
		-ms-flex: 0 0 100% !important;
		flex: 0 0 100% !important;
		max-width: 100% !important;
	}
	.index #content > .frame.testimonial > .row{
		display: grid;
		grid-template-columns: 1fr;
		grid-template-rows: 2fr;
	}
	.index #content > .frame.testimonial:nth-child(even) > .row .col-12:first-child{
		grid-row-start: 2;
		grid-row-end: 3;
		
	}
	.index #content > .frame.testimonial:nth-child(even) > .row .col-12:last-child{
		grid-row-start: 1;
		grid-row-end: 2;
		padding: 0 0 20px 0 !important;
	}
	.index #content > .frame.testimonial:nth-child(odd) > .row .col-12:first-child{
		padding: 0 0 20px 0 !important;
	}

	.testimonial .ce-gallery img {
		width: 100%;
		height: auto;
		margin-left: 0;
	}
	.testimonial .ce-gallery figure {
		height: auto;
	}
	.testimonial .frame-grungy_button {
		position: absolute !important;
		z-index: 1;
		margin-bottom: 10px;
	}	
	.testimonial .frame-type-text h2{
		margin: 10px 0 20px 0 !important;
	}
	.testimonial .frame-type-text:not(.frame-grungy_button) {
		padding: 0 20px 20px 20px;
		width: calc(100% - 230px);
	}
	.testimonial .frame-type-text:not(.frame-grungy_button)  p:last-child {
		margin-bottom: 0px !important;
	}
}

@media only screen and (max-width: 800px){
	#header nav#top_nav li:last-child a{
		overflow: hidden;
		width: 34px;
		margin-right: 17px;
	}
}


@media only screen and (max-width: 767px){
	.slider {
		margin-bottom: 120px;
	}
		.slider header {
			bottom: -50px;
		}
			.slider header h1, .slider header h2 {
				font-size:30px;
			}
			.slider header h1 {
				padding: 13px 0 3px 0;
			}
			.slider header h2 {
				padding: 3px 0 13px 0;
			}
		.slider .row .col-md-4
		{
			-ms-flex: 0 0 33.333333% !important;
			flex: 0 0 33.333333% !important;
			max-width: 33.333333% !important;
		}

	#content div:not(.frame-blue_separate_boxes):not(.frame-white_separate_boxes) > .row > div.col-md-6{
		padding: 0;
	}
	p:last-child {
		margin-bottom: 16px;
	}

	#content > .frame-blue_separate_boxes > .row > div.col-md-6, 
	#content > .frame-white_separate_boxes > .row > div.col-md-6{
		flex: 0 0 calc(50% - 20px);
		margin-right: 10px !important;
		margin-left: 10px !important;
	}
	.row > .col-md-6 > div:first-child > h2:first-child,
	.row > .col-md-6 > div:first-child > h3:first-child,
	.row > .col-md-6 > div:first-child > div:first-child > div:first-child > h2:first-child,
	.row > .col-md-6 > div:first-child > div:first-child > div:first-child > h3:first-child{
		margin-top: 0;
	}
	.row > .col-md-6 > div:last-child > p:last-child,
	.row > .col-md-6 > div:last-child > div:last-child > div:last-child > p:last-child{
		margin-bottom: 0;
	}
	.tx-events2 .list{
		grid-column-gap: var(--paddingmini);
	}
	.tx-events2 .col-md-3.event-info{
		padding-left: 0;
		margin: 30px 0 20px 0;
	}
	.grungy_button_eventdetails,
	.grungy_button_relative{
		bottom: 0;
	}
	footer .row{
		padding: 30px 10px;
	}
	#wrapper, #wrapper.default {
		padding:0 10px 10px;
	}
	#header #top_menu_wrapper  {
		padding: 0;
	}
		#header nav#top_nav li a{
			font-size: 16px;
			padding: 0 15px;
		}
	#header #menuToggle {
		right:15px;
	}
	#header .black_layer {
		margin: -82px -32px 0;
	}
	.index h3 {
		font-size:30px;
	}
	.default #content > .frame {
		padding:20px;
	}
	.frame-type-image {
		min-height: 300px!important;
	}
	.row .frame-type-image {
		min-height: auto !important;
	}
	.frame-type-image h2 {
		font-size:30px;
	}
	/*.index #content > .frame.auswahl{
		margin-bottom: 0;
	}*/
	.auswahl .col-md-3 {
		width:100%;
		padding:0 10% 20px;
		border:none;
		height:auto;
	}
	.auswahl.hover_class .col-md-3:hover {
		padding:0 10% 20px;
		border:none;
	}
	.stickyauswahl {
		position: fixed;
		height: 120px !important;
		padding-top: 10px;
		width: 100%;
		top: auto;
		left: 0;
		bottom: 0;
		display: inline-block;
		background: var(--red)!important;
		margin:0;
		text-align: center;
		box-shadow: 0 0 5px 0 rgba(0,0,0,0.4);
	}
		.stickyauswahl .col-md-3::before{
			display: inline-block !important;
		}
		.stickyauswahl .col-md-3{
			display: inline-block;
			width: 50px !important;
			margin: 0 0 10px 10px !important;
			-webkit-transition: height .5s ease;
			-moz-transition: height .5s ease;
			-ms-transition: height .5s ease;
			-o-transition: height .5s ease;
			transition: height .5s ease;
		}
		.hover_class .stickyauswahl .col-md-3:hover h3,
		.stickyauswahl .col-md-3 h3{
			position: fixed;
			bottom: 5px;
			left: 0;
			width: 100%;
			text-align: center;
			margin: 0 auto !important;
			right: 0;
		}	
	

	#content .ce-textpic .ce-column:last-child {
		width:100%;
	}
	#content .ce-textpic figure {
		display:block;
		width:100%;
	}
	#content .ce-textpic figure img {
		width:100%;
		height:auto;
	}
	.frame-grungy_headline_box {
		min-height: 250px;
		padding: calc(15px + var(--padding)) 0 0 calc(25px + var(--padding));
		margin-left: calc(-1 * var(--padding) - 25px);
		margin-top: -66px;
		background-size: 100% 142%;
		/*margin-bottom: 30px;*/
	}
		.frame-grungy_headline_box h1{
			font-size: 50px;
			text-align: center;
		}
		.frame-grungy_headline_box h2::before{
			left: auto;
		}
		.frame-grungy_headline_box h2{
			font-size: 25px;
			text-align: center;
		}
	.contact{
		margin-bottom: 30px;
	}
	
	.frame-grungy_button{
		bottom: 0;
		margin-bottom: 0;
		height: 190px;
	}	
	.col-md-6 .col-md-6 .frame-grungy_button{
		bottom: -23px;
		margin-bottom: -72px;
		height: 215px;
	}	
	.col-12:not(.col-md-3){
		margin: 0 0 30px 0 !important;
	}
	.slider .col-12:not(.col-md-3){
		margin: 0 !important;
	}
	
	
	/* ##### BILDERGALERIE #####*/
		
	.frame-image_gallery .ce-image .ce-row:not(:only-child) .ce-column{
		max-height: 170px;
	}
		.frame-image_gallery .ce-image .ce-row:not(:only-child) .ce-column figure{
			height: 170px;
		}
}


@media only screen and (max-width: 650px){
	#header nav#top_nav li a {
		font-size: 15px;
		padding: 0 11px;
	}
	#top_menu img{
		width: 130px;
		padding-top: 21px;
	}
	#header nav#top_nav li:last-child a{
		width: 28px;
	}

	.slider header h1, .slider header h2 {
		font-size:30px;
	}
	.slider .row *{
		margin-bottom: 0;
	}

	.form-group {
		display: block;
		margin-bottom: 11px;
	}

	.form-group label {
		width: 100%;
		padding-top: 0;
		padding-bottom: 2px;
		display: block;
		margin-right: 0;
	}
	.btn {
		padding: 15px var(--paddingmini);
	}
	.form-buttons{
		margin-top: 15px;
	}
		.form-buttons span{
			width: 100%;
			margin: 0 0 30px 0;
			display: block;
		}	
}


@media only screen and (max-width: 620px){
	
	.testimonial .frame-type-text:not(.frame-grungy_button) {
		width: 100%;
	}
	.testimonial .frame-grungy_button {
		margin-bottom: -72%;
		bottom: 0;
		width: 210px;
		height: 163px;
		background-position: 25px 0;
	}
		.testimonial .frame-grungy_button a {
			padding: 56px 35px 0 72px;
			font-size: 19px;
		}
		.testimonial figure .image-caption{
			left: 10px;
			right: inherit;
		}
	.col-md-6 .col-md-6 .frame-grungy_button {
		bottom: -4px;
		margin-bottom: -60px;
	}
	.col-12:not(.col-md-3){
		-ms-flex: 0 0 100% !important;
		flex: 0 0 100% !important;
		max-width: 100% !important;
		margin: 0 0 30px 0 !important;
	}
	.frame-grungy_headline_box {
		margin-bottom: 0;
	}
	.frame:not(.frame-blue_separate_boxes):not(.frame-white_separate_boxes):not(.auswahl) .col-12{
		padding: 0 !important;
	}
	.col-md-3{
		-ms-flex: 0 0 100% !important;
		flex: 0 0 100% !important;
		max-width: 100% !important;
		margin: 0 !important;
	}
	.frame.auswahl:not(.frame-blue_separate_boxes):not(.frame-white_separate_boxes):not(.auswahl) .col-12{
		padding: 0 40px !important;
		height: 250px;
	}
	.index #content .entry .row {
		margin:10px!important;
	}
	.index h3 {
		margin:50px 0;
	}
	#content .ce-intext.ce-left .ce-gallery,
	#content .ce-intext.ce-right .ce-gallery {
		float:none!important;
		margin-right:0!important;
		margin-left:0!important;
	}
	.default #content > .frame {
		padding:20px;
	}
	.frame-type-image h2 {
		font-size:25px;
	}
	.tx-events2 .list{
		display: block;
	}
	.tx-events2 .list > div{
		margin-bottom: var(--paddingmini);
	}
	.frame-blue_separate_boxes > div > div.col-12:not(.col-md-3),
	.frame-white_separate_boxes > div > div.col-12:not(.col-md-3){
		margin-bottom: var(--paddingmini) !important;
	}
	#content > .frame-blue_separate_boxes > .row > div.col-md-6, 
	#content > .frame-white_separate_boxes > .row > div.col-md-6{
		margin-right: 0 !important;
		margin-left: 0 !important;
	}
	h1{
		hyphens: auto;
	}
	
	
	#c17 .tx-events2 .panel-default .panel-heading {
		float: none;
	}
		
	#c17 .tx-events2 .panel-default .panel-body, 
	#c17 .tx-events2 .panel-default .list-arrow {
		margin-left: 0;
	}
	#c17 .tx-events2 .panel-default .panel-body {
		border-left: none;
		padding-left: 0;
	}
	#c17 .tx-events2 .panel-default .panel-body h3 {
		margin-top: 10px;
	}
	.tx-events2 .list > div {
		margin-bottom: var(--paddingmiddle);
	}
	.contact{
		margin-bottom: 0;
	}
	
	
	/* ##### BILDERGALERIE #####*/
		
	.frame-image_gallery .ce-image .ce-row:not(:only-child) .ce-column{
		max-height: 140px;
	}
		.frame-image_gallery .ce-image .ce-row:not(:only-child) .ce-column figure{
			height: 140px;
		}

}


@media only screen and (max-width: 570px){
	
	#header {
		height: 80px;
	}
		#header #logo {
			width: 130px;
			margin-top: -12px;
		}		
		#header #top_nav{
			height: 30px;
		}
			#top_menu {
				margin-right: 5px;
			}
				#header nav#top_nav li a {
					line-height: 30px;
					font-weight: 600;
					font-size: 13px;
					padding: 0 6px;
					font-family: 'open_sansregular';
				}
				#top_menu img{
					width: 110px;
					padding-top: 9px;
				}
				#header nav#top_nav li:last-child a{
					width: 19px;
					margin-right: 13px;
				}

		#header #main_nav {
			top: 24px;
		}
			#header #menuToggle {
				top: 19px;
			}
				#header .black_layer {
					margin: -43px -15px 0;
				}
				#header #menu {
					margin: -50px 0 0 -272px;
					padding-top: 47px;
				}
		
	body {
		margin: 110px 0 0 0;
	}

	.default #content {
		margin-top: 90px;
	}
	

	
	
	.slider {
		margin-bottom: 100px;
	}
		.slider header {
			bottom: -30px;
		}
			.slider header h1, .slider header h2 {
				font-size:25px;
			}
			.slider header h1 {
				padding: 10px 0 3px 0;
			}
			.slider header h2 {
				padding: 3px 0 10px 0;
			}			
			.slider figure.image img{
				width: 160%;
				margin-left: -30%;
			}

}

@media only screen and (max-width: 530px){

	.frame-grungy_headline_box {
		min-height: 230px;
		padding: calc(15px + var(--padding)) var(--paddingsmall) 0 calc(15px + var(--padding));
		margin-left: calc(-1 * var(--padding) - 13px);
		margin-top: -66px;
		background-size: 100% 142%;
		width: calc(100% + 90px);
	}
		.frame-grungy_headline_box h1{
			font-size: 40px;
		}
		.frame-grungy_headline_box h2{
			font-size: 20px;
		}
		
	/* ##### BILDERGALERIE #####*/
	
	.frame-image_gallery .ce-image .ce-row:not(:only-child) {	
		margin: 0;
	}
	.frame-image_gallery .ce-image .ce-row:not(:only-child) .ce-column{
		margin: 1% 0;
		width: 100%;
	}
	.frame-image_gallery .ce-image .ce-row:not(:only-child) .ce-column{
		max-height: 230px;
	}
	.frame-image_gallery .ce-image .ce-row:not(:only-child) .ce-column figure{
		height: 230px;
	}
}

@media only screen and (max-width: 450px){
	#top_menu li:first-child{
		display: none;
	}
	.slider {
	}
		.slider header {
			bottom: -30px;
		}
			.slider header h1, .slider header h2 {
				font-size:21px;
				line-height: 1.1;
			}
			.slider header h1 {
				padding: 10px 20px 3px 20px;
			}
			.slider header h2 {
				padding: 3px 20px 10px 20px;
			}
			
	#c17 .tx-events2 .panel-default .panel-body .media-heading a{
		hyphens: auto;
	}
	
	
	/* ##### BILDERGALERIE #####*/
	
	.frame-image_gallery .ce-image .ce-row:not(:only-child) .ce-column{
		max-height: 200px;
	}
	.frame-image_gallery .ce-image .ce-row:not(:only-child) .ce-column figure{
		height: 200px;
	}
}

@media only screen and (max-width: 380px){
	
	/* ##### BILDERGALERIE #####*/
	
	.frame-image_gallery .ce-image .ce-row:not(:only-child) .ce-column{
		max-height: 170px;
	}
	.frame-image_gallery .ce-image .ce-row:not(:only-child) .ce-column figure{
		height: 170px;
	}
}

@media only screen and (max-width: 330px){
	
	/* ##### BILDERGALERIE #####*/
	
	.frame-image_gallery .ce-image .ce-row:not(:only-child) .ce-column{
		max-height: 140px;
	}
	.frame-image_gallery .ce-image .ce-row:not(:only-child) .ce-column figure{
		height: 140px;
	}
}