*html body{overflow:auto}
*html img{behavior: url(js/iepngfix.htc);} /* IE6 */
body {-webkit-text-size-adjust: 100%;}

html, body {
    padding: 0;
    margin: 0;
}

html, body  {
	width: 100%;
    height: 100%;
	/*image-rendering: -webkit-optimize-contrast;*/
}

#pageinhalt {
    height: 100%;
}

.pageinhaltdisplay {
	position:relative; 
	top: 0px; 
	width:100%; 
	height:100%;
}

@font-face {
    font-family: 'Barlow';
    src: url('fonts/barlow/Barlow-Thin-webfont.woff') format('woff');
    font-weight: 100;
    font-style: normal;
}

@font-face {
    font-family: 'Barlow';
    src: url('fonts/barlow/Barlow-ExtraLight-webfont.woff') format('woff');
    font-weight: 200;
    font-style: normal;
}

@font-face {
    font-family: 'Barlow';
    src: url('fonts/barlow/Barlow-Light-webfont.woff') format('woff');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'Barlow';
    src: url('fonts/barlow/Barlow-Regular-webfont.woff') format('woff');
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'Barlow';
    src: url('fonts/barlow/Barlow-Medium-webfont.woff') format('woff');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'Barlow';
    src: url('fonts/barlow/Barlow-SemiBold-webfont.woff') format('woff');
    font-weight: 600;
    font-style: normal;
}

@font-face {
    font-family: 'Barlow';
    src: url('fonts/barlow/Barlow-Bold-webfont.woff') format('woff');
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: 'Barlow';
    src: url('fonts/barlow/Barlow-ExtraBold-webfont.woff') format('woff');
    font-weight: 800;
    font-style: normal;
}

@font-face {
    font-family: 'Barlow';
    src: url('fonts/barlow/Barlow-Black-webfont.woff') format('woff');
    font-weight: 900;
    font-style: normal;
}






@font-face {
    font-family: 'Barlow Condensed';
    src: url('fonts/barlow/BarlowCondensed-Thin-webfont.woff') format('woff');
    font-weight: 100;
    font-style: normal;
}

@font-face {
    font-family: 'Barlow Condensed';
    src: url('fonts/barlow/BarlowCondensed-ExtraLight-webfont.woff') format('woff');
    font-weight: 200;
    font-style: normal;
}

@font-face {
    font-family: 'Barlow Condensed';
    src: url('fonts/barlow/BarlowCondensed-Light-webfont.woff') format('woff');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'Barlow Condensed';
    src: url('fonts/barlow/BarlowCondensed-Regular-webfont.woff') format('woff');
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'Barlow Condensed';
    src: url('fonts/barlow/BarlowCondensed-Medium-webfont.woff') format('woff');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'Barlow Condensed';
    src: url('fonts/barlow/BarlowCondensed-SemiBold-webfont.woff') format('woff');
    font-weight: 600;
    font-style: normal;
}

@font-face {
    font-family: 'Barlow Condensed';
    src: url('fonts/barlow/BarlowCondensed-Bold-webfont.woff') format('woff');
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: 'Barlow';
    src: url('fonts/barlow/BarlowCondensed-ExtraBold-webfont.woff') format('woff');
    font-weight: 800;
    font-style: normal;
}

@font-face {
    font-family: 'Barlow';
    src: url('fonts/barlow/BarlowCondensed-Black-webfont.woff') format('woff');
    font-weight: 900;
    font-style: normal;
}




html:-ms-fullscreen {
    width: 100%; /* needed to center contents in IE */
}

body {
    background: #051624;
    background: linear-gradient(180deg, #062c4a 10%, #031120 100%) fixed;
}


p, h1, h2, h3, h4 {
    opacity: .9999999;
}

body, textarea, input, button {font-family:'Barlow', arial, helvetica, sans-serif;}
.clear {clear:both; height: 0px}

.center {width:1100px; position:relative; left: calc(50% - 447px)}
		
p, li {font-weight: 100;
    font-size: 18px;
    line-height: 24px;
    color: #bbc4cd;}
h1 {
	font-weight: 100;
    font-size: 28px;
    line-height: 34px;
    color: #ffffff;
    text-transform: none;
    margin-bottom: 36px;
    margin-top: 0px;
    margin: 64px 0 24px 0;
}

h2 {font-weight: 100; font-size:18px;  line-height:24px;  color:#bbc4cd; text-transform:none; margin-bottom: 12px; padding-top: 64px;}
h3 {width: 100%; padding: 0; font-size:18px; color: #bbc4cd; line-height: 17px; font-weight: 400; margin-bottom: 0px; margin-top: 0px;}
h4 {font-size:13px; color: rgba(66,69,68,1);   font-weight: 600; margin: 18px 0 10px 0}
b {font-weight:600;}
strong {font-weight: 500;}
.big {font-size:14px; font-weight: 400; color:#1489BB}
h1 .sup{font-size:50%; position:relative; top:-14px; left:1px; letter-spacing: -6px; font-weight: 400}

.point {
	font-family: arial;
}

.footer h2 {
	margin: 0;
    padding: 2px 0 2px 0;
    font-weight: 100;
    font-size: 18px;
    line-height: 20px;
}

.footer .block {
	display: inline-block;
	margin: 0 84px 12px 0;
	vertical-align: top;
}

.footer .block:last-child {
	margin-right: 0;
}

.footer .block .btn-whatsapp {
    transition: all 0.3s ease;
    background: url(images/btn_whatsapp2.png) center -32px no-repeat;
    background-size: cover;
    height: 32px;
    width: 32px;
    margin: 2px 0 0 -4px;
    display: inline-block;
    opacity: 0.8;
    cursor: pointer;
}

.banner-full img {
	display: none;
}

.banner-full {
	background-repeat: no-repeat;
    height: 380px;
    position: relative;
    background-position: 50%;
    background-size: cover;
	margin: 0 0 42px 0;
    padding: 0;
	overflow: hidden;
}


.row {
	margin: 28px 0 0 0;
}

.row .col {
	display: inline-block;
	width: 65%;
	vertical-align: top;
}
.row .col:first-child {
	width: 35%;
	padding: 0 30px 0 0;
}

.float {
	display: flex;
	margin: 0 0 54px 0;
}

.float .img {
	width: 40%;
}

.float .text {
	flex: 1;
	padding: 12px 48px;
	align-self: center;
}

.float .text p {
	margin: 1px 0 12px 0
}



.float.right .img {
	order: 1;	
}
.float.left .text {
	order: 2;	
}



#inhalt .ext-content h2, 
#inhalt .ext-content h3 {
	font-weight: 400;
    line-height: 24px;
    color: #e9eff7;
    text-transform: none;
    margin: 38px 0 0px 0;
    padding: 0px;
}

#inhalt .ext-content h3 {
    padding: 0px 0 0 0;
}

#inhalt .ext-content h4 {
	font-size: 18px;
    line-height: 24px;
    color: #bbc4cd;
	font-weight: 500;
}


#inhalt .ext-content .col h2, 
#inhalt .ext-content .col h3 {
    margin: 8px 0 0px 0;
}

#inhalt h3 {
    width: 100%;
    padding: 18px 0 0px 0;
    font-weight: 500;
}

.ext-content p {margin: 8px  0 0 0}

a {color: #ca031d;font-weight: 400; text-decoration:none}



.angebotsbox a[href$=".pdf"] {
    animation: none;
    background: url(images/symbol_download.png) 4px 4px no-repeat;
    background-size: 11px 10px;
    padding: 0 0 0 20px;
    font-weight: 400;
}

#logo {
    width: 300px;
}

div#logo img {
    width: 100%;
}

.textblock {
	/*width: 82%;*/ 
}	
	
.textblockcenter #inhalt {
	width: 68%;
	margin: auto }

.newscenter {
	width: 270px; 
	float:right; 
	display:inline-block;
	margin: 0 0 38px 64px;
}

.newscenter .newsmeldung {
	background:#EAF2F0;
	margin: 2px 0 0 0;
	padding: 6px 16px;
	clear:both;
	transition: all 1.6s ease;
}

.newscenter .newsmeldung:hover {
	background:#D0E3E0;
	cursor:pointer;
	transition: all 0.6s ease; 
}

.newscenter .newsmeldung .date p {
	font-weight: 700;
	color: rgba(66,69,68,1);
	font-size: 11px;
	line-height: 14px
}

.newscenter .newsmeldung p {
	font-weight: 400;
	color:#016756;
	font-size: 13px;
	line-height: 17px;
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
}

.newscenter .newsheader div {
	float:left;
	margin: 4px 12px 4px 1px;
	text-transform: uppercase;
}

.newscenter .newsheader p {
	font-weight: 400;
	color: rgba(66,69,68,0.5);
	font-size: 11.25px;
	line-height: 14px;
	
}



.submenue {
	text-align: right;
	display: none;
}

.btn-home {
    transition: all 0.2s ease; 
    background: url(images/btn_home.png) 0px 0px no-repeat;
	background-size: 15px 15px;
    font-size: 12px;
    line-height: 16px;
    font-weight: 300;
    margin: 11px 18px 0px 0;
    display: inline-block;
}

.btn-tel {
    transition: all 0.2s ease; 
    background: url(images/btn_tel.png) 0px 1px no-repeat;
	background-size: 15px 15px;
    font-size: 12px;
    line-height: 16px;
    font-weight: 300;
    margin: 11px 0 0px 0;
    display: inline-block;
}

.btn-tel a,
.btn-home a {
    display: block;
	color: #63818f; text-decoration:none;
    padding: 1px 0px 0px 18px;
}

.btn-tel:hover a,
.btn-home:hover a {
	transition: all 0.4s ease;
	color: #4c6875; text-decoration:none
}


#inhalt a {animation: indicatelink 0.15s linear forwards; background: url(images/symbol_link.png) -4px 2px no-repeat; background-size: 16px 17px; padding: 0 0 0 12px}
#inhalt a:hover {animation: indicatelinkhover 0.25s linear forwards}


#inhalt a {
	padding: 0 4px 0 28px;
    position: relative;
    background: none;
    display: inline-block;
    font-weight: 600;
	word-break: break-word;
}

#inhalt a::before,
#inhalt a::after {
	transition: all 0.3s ease;
	content: "";
	background: url(images/symbol_link.png) 0 0 no-repeat; 
	height: 24px;
	width: 24px;
	display: block;
	position: absolute;
	opacity: 1.0;
	background-size: cover;
	top: 0px;
	left: 1px;
	margin: 0;
}

#inhalt a::after {
	background-position-y: -24px;
	opacity: 0.0;
}

#inhalt a[href*="history.back"]::after,
#inhalt a[href*="history.back"]::before {
	transform: scaleX(-1);
	top: 1px;
}

#inhalt a[href^="mailto"]::after,
#inhalt a[href^="mailto"]::before {
	background-image: url(images/symbol_mail.png)
}

#inhalt a[target*="blank"]::after,
#inhalt a[target*="blank"]::before {
	background-image: url(images/symbol_extern.png)
}

#inhalt a:hover::before {
	transition: all 0.3s ease;
	opacity: 0.0;
}

#inhalt a:hover::after {
	transition: all 0.3s ease;
	opacity: 1.0;
}


#inhalt a[href^="tel"] {animation: indicateextern 0.4s linear forwards; background: url(images/symbol_tel.png) 26px center no-repeat #5AA72D; background-size: 47px 47px; padding: 24px 36px 24px 82px; color:#ffffff; font-size: 19px; font-weight: 600; border-radius: 50px; margin: 48px 0; display: inline-block; white-space: nowrap;}
#inhalt a[href^="tel"]:hover {animation: indicateexternhover 0.25s linear forwards}



#inhalt ul{padding:0 0 0 20px; margin: 12px 0 24px 0}
#inhalt ul li{padding:0 0 0 4px; margin:0 0 8px 0}

#inhalt .antwort ul,
#inhalt ul.pfeile {
	list-style:none; 	
	padding: 0;
    margin: 12px 0 12px 0;
    display: block;
}

#inhalt .antwort ul li,
#inhalt ul.pfeile li {
	display:block; 
	animation: indicateli 0.3s linear forwards;	
    background: url(images/li.png) no-repeat -4px -1px;
    padding: 0 0 2px 26px;
    margin: 0 0 0px 0;
    text-align: left;
	cursor: default;
}

#inhalt .antwort ul li {
    margin: 0 18px 0px 56px;
}

#inhalt .antwort ul li:hover,
#inhalt ul.pfeile li:hover {
	animation: indicatelihover 0.20s linear forwards;
}



a:focus {outline: none;}

.formkont{width:250px; font-family: 'Barlow', sans-serif, arial, tahoma, sans-serif, helvetica; border-left:#809EC8 1px solid; border-top:#809EC8 1px solid; border-bottom:#809EC8 1px solid; border-right:#809EC8 1px solid; background-color: #ffffff; font-size:12px; padding-left:3px;  color:#545450;}
.formanzahl{text-align:center; width:25px; margin-bottom:0px; font-family: 'Barlow', sans-serif, arial, tahoma, sans-serif, helvetica; border-left:#1A91C3 1px solid; border-top:#1A91C3 1px solid; border-bottom:#1A91C3 1px solid; border-right:#1A91C3 1px solid; background-color: #ffffff; font-size:12px;  color:#397388;}
form{margin:0px}

form {padding:0; margin: 0; width: 100%; position:relative}
#inhalt .formtext {border: 1px solid #F1EEE2; background:#F1EEE2; width: 100%; margin:4px 0 5px 0; height:36px; color:#7D7A78; font-weight: 300; font-size:15px; padding:4px 6px 4px 12px}
#inhalt .formtext2 {border: 1px solid #F1EEE2; background:#F1EEE2; width: 100%; margin:4px 0 5px 0; height:36px; color: rgba(66,69,68,1); font-weight: 600; font-size:15px; padding:4px 6px 4px 12px}
#inhalt .formtextaktiv {border: 1px solid #FFD000; background:#f9f9f8; width: 100%; margin:4px 0 5px 0; height:36px; color: rgba(66,69,68,1); font-weight: 600; font-size:15px; padding:4px 6px 4px 12px}
#inhalt .formbutton {cursor: pointer; background:url(images/pfeil_formular.png) no-repeat 0 0; background-size: contain; width: auto; height:26px; margin:12px 1px 0 1px; border: 0px; outline:none; font-weight: 800; font-size:13px; padding:3px 0px 0px 32px; color:#7D7A78; }
#inhalt .formbutton:hover, .formbutton:focus {background:url(images/pfeil_formular_aktiv.png) no-repeat 0 0; background-size: contain; color: rgba(66,69,68,1);}

#box .formtext 			{border-top: 1px solid #D9D6CD; border-left: 1px solid #D9D6CD; width: 106px; margin:22px 0 0 18px; height:22px;}
#box .formtextaktiv 	{border-top: 1px solid #77756A; border-left: 1px solid #77756A; width: 106px; margin:22px 0 0 18px; height:22px;}
#box .formtext 			{border-top: 1px solid #E8E6DC; border-left: 1px solid #E8E6DC; width: 106px; background:#F0EDE3; height:22px; color:#B2AD9A; padding: 1px 0 0 5px; font-size: 12px; font-style: oblique; font-weight:300; letter-spacing: 0.05em}
#box .formtext2			{border-top: 1px solid #E8E6DC; border-left: 1px solid #E8E6DC; width: 106px; background:#F0EDE3; height:22px; color:#B2AD9A; padding: 1px 0 0 5px; font-size: 12px; font-style: normal; font-weight:600; letter-spacing: 0.05em}
#box .formtextaktiv 	{border-top: 1px solid #E1E2E9; border-left: 1px solid #E1E2E9; width: 106px; background:#F0EDE3; height:22px; color:#4B493E; padding: 0px 0 0 5px; font-size: 12px; font-style: normal; font-weight:600; letter-spacing: 0.05em; border-bottom: 1px solid #77756A; border-right: 1px solid #77756A;}


.kontaktformular {
	padding: 0; 
	margin: 0 25px 0px 0; 
	display: inline-block; 
	width: 48%; 
	width: calc((100% - 50px) / 2); 
	position:relative
}

.kontaktformular:last-child {
	margin: 0 0px 0 25px;
}

.faqform .float {
    margin: 0 0 0px 0;
}

.faqform .input textarea {
    min-height: 102px;
}

.faqform .einleitung h1 {
	margin-bottom: 4px;
}

.faqform .einleitung p {
	margin-bottom: 24px;
}

#inhalt input[type="reset"].formbutton {
    display: none;
}

#inhalt input.formbutton {
	transition: all 0.5s ease;
    font-weight: 300;
    font-size: 28px;
    line-height: 28px;
    text-transform: uppercase;
    font-family: 'Barlow Condensed';
    letter-spacing: 1.5px;
    color: #ffffff;
    text-align: center;
    margin: 24px 0 0 0;
    background: #056297;
    padding: 16px 18px 11px 18px;
    display: block;
    width: 100%;
    height: auto;
}

#inhalt input.formbutton:hover,
#inhalt input.formbutton:focus {
    transition: all 0.3s ease;
    color: #ffffff;
    background: #0c7ab9;
}

.input {
    margin: 0 0 16px 0;
	position: relative;
	padding: 0 2px 2px 0;
}

.input.textarea.aktiv {
	padding: 0 4px 2px 0;
}

.input::after {
	content: "";
	transition: all 0.2s ease; 
    border: 2px solid #198fd2;
    width: 100%;
	height: 100%;
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	pointer-events: none;
	box-sizing: border-box;
}

.input p {
	transition: all 0.2s ease; 
	position: absolute;
	top: 20px;
	left: 20px;
	color: #198fd2;
	font-size: 18px;
	line-height: 18px;
	font-weight: 500;
	pointer-events: none;
}

.input.aktiv  p,
.input.notempty  p {
	transition: all 0.2s ease; 
	top: 12px;
	font-size: 10px;
	line-height: 10px;
}

.input input,
.input textarea {
	transition: all 0.2s ease; 
    border: none;
	background: transparent;
    padding: 24px 16px 8px 20px;
	width: 100%;
	color: #ffffff;
	font-size: 18px;
	line-height: 22px;
	resize: vertical;
}

.input textarea {
	transition: all 0.2s ease;
    margin: 24px 0 0 0;
    padding-top: 0;
	min-height: 160px;
	overflow: auto;
}

.datenschutzhinweis {
	display: flex
}

.datenschutzhinweis div:last-child {
	flex: 1;
}

.datenschutzhinweis p,
#inhalt .datenschutzhinweis a {
	font-size: 14px;
	line-height: 18px;
	color: #bbc4cd;
	padding:0;
	background: none;
}

#inhalt .datenschutzhinweis a {
	font-weight: 400;
}

#inhalt .datenschutzhinweis a::after,
#inhalt .datenschutzhinweis a::before {
	background: none;
}

input[type="checkbox"] {
	position: relative;
	margin: 2px 14px 0 0;
    border: 2px solid #198fd2;
    width: 24px;
	height: 24px;
}

.input.checkbox input { /*Klasse wird per JavaScript vergeben*/
	opacity: 0;
}

.input.aktiv::after {
	transition: all 0.2s ease; 
    border-width: 4px;
}

.input.checkbox::after {
	content: "";
	transition: all 0.2s ease;
    width: 24px;
	height: 24px;
	display: block;
	position: absolute;
	top: 2px;
	left: 0;
	pointer-events: none;
}

.input.checked::after {
	transition: none; 
	background: url(images/icon_checkbox_checked.png) no-repeat center;
}

.input.warning::after {
	transition: all 0.2s ease; 
    border-color: #ca031d;
    border-width: 4px;
}

.input.pflichtfeld p {
}

.input.pflichtfeld p::after {
	content: "*";
	font-weight: 700;
}

.input.warning p {
	transition: all 0.2s ease; 
    color: #ca031d;
	font-weight:700;
}


.kontaktblock {
	text-align: center;
	margin: 0 0 48px 0;
}

.kontaktblock .teloptions .hotline {
	font-size: 30px;
	line-height: 48px;
}

#inhalt .socialmedia a,
#inhalt .kontaktblock  a {
	transition: all 0.2s ease; 
    padding: 0;
	color: #ffffff
}

#inhalt .kontaktblock  a:hover {
	transition: all 0.2s ease;
	color: #198fd2;
}

#inhalt .socialmedia a::after,
#inhalt .socialmedia a::before,
#inhalt .kontaktblock a::after,
#inhalt .kontaktblock a::before {
    background: none;
}

.kontaktblock .teloptions .btn-whatsapp {
    height: 48px;
    width: 48px;
    margin: -3px 12px 0 0px;
}

.kontaktblock .teloptions .btn-whatsapp::before, 
.kontaktblock .teloptions .btn-whatsapp::after {
    height: 100%;
    width: 100%;
}

.kontaktblock .teloptions .btn-whatsapp::after {
    background-position-y: 100%;
}

.altershinweis {
    margin: 72px 0 -24px 0;
    padding: 24px 34px;
    position: relative;
    border: 1px solid rgba(135, 204, 255, 0.3);
    /* background: rgba(255,255,255,0.1); */
    /* background: rgba(13, 128, 210, 0.13); */
    /* box-shadow: 1px 1px 5px rgba(0,0,0,.2); */
}

.altershinweis::before,
.altershinweis::after {
	/*content: "";*/
    border: 3px solid #ffffff;
	position: absolute;
	width: 28px;
	height: 100%;
	top: 0;
	left: 0;
    box-sizing: border-box;
}

.altershinweis::before {
	border-right: 0;
}

.altershinweis::after {
	border-left: 0;
	left: auto;
	right: 0;
}

.altershinweis p {
    font-weight: 300;
    color: #ffffff;
	position: relative;
	display: inline-block;
    padding: 0 0 0 72px;
}

.altershinweis p span {
	position: relative;
	top: 6px;
}

.altershinweis p::before {
	content: "i";
    font-weight: 600;
    color: #198fd2;
    font-size: 34px;
    padding: 14px 0 0 0;
    height: 58px;
    width: 58px;
    text-align: center;
    display: block;
    border-radius: 50px;
    border: 5px solid #198fd2;
    position: absolute;
    top: 0px;
    left: -2px;
    box-sizing: border-box;
}

.coronahinweis {
    position: absolute;
    top: 0;
    right: 0%;
    padding: 4px 18px 0px 38px;
    background: #198fd2;
    overflow: hidden;
    box-sizing: border-box;
	pointer-events: all;
	cursor: pointer;
}

.coronahinweis p,
.coronahinweis a {
    color: #ffffff;
    font-weight: 500;
    font-size: 14px;
}

.coronahinweis p::before {
    content: "i";
    font-weight: 600;
    color: #ffffff;
    font-size: 14px;
    line-height: 20px;
    padding: 0px 0 0 0;
    height: 20px;
    width: 20px;
    text-align: center;
    display: block;
    border-radius: 50px;
    border: 2px solid #ffffff;
    position: absolute;
    top: 4px;
    left: 12px;
    box-sizing: border-box;
	opacity: 0.9;
}

.newshinweis {
    position: absolute;
    top: 20%;
    right: 0;
    padding: 24px 36px 22px 28px;
    z-index: 10000;
    /* width: 100%; */
    background: #ca031d;
}

.newshinweis p {
    font-weight: 300;
    color: #ffffff;
	position: relative;
	display: inline-block;
    padding: 0 0 0 56px;
}

.newshinweis span:not(.zusatz) {
    text-transform: uppercase
}

.newshinweis a {
	color: #ffffff;
}

.newshinweis p::before {
	content: "!";
    font-weight: 400;
    color: #ffffff;
    font-size: 28px;
    padding: 12px 0 0 0;
    height: 48px;
    width: 48px;
    text-align: center;
    display: block;
    border-radius: 50px;
    border: 2px solid #ffffff;
    position: absolute;
    top: -2px;
    left: -6px;
    box-sizing: border-box;
}

.mobilebuchen {
    position: fixed;
	z-index: 9999;
    bottom: 0;
	width: 100%;
	height: 52px;
	overflow: hidden;
	display: none;
    box-shadow: 0px -2px 4px rgba(8, 29, 46,.2);
}

.mobilebuchen a {
    transition: all 0.5s ease;
    font-weight: 300;
    font-size: 28px;
    line-height: 28px;
    text-transform: uppercase;
    font-family: 'Barlow Condensed';
    letter-spacing: 1.5px;
    color: #ffffff;
    text-align: center;
    margin: 0;
    background: #056297;
    padding: 13px 72px 11px 72px;
    display: block;
    /* border-top: 2px solid rgba(8, 29, 46, 0.1); */
}

.mobilebuchen a:hover {
    transition: all 0.3s ease;
    background: #0c7ab9;
}

.table {
	margin: 8px 0 16px 0;
}

.text-right {
	text-align: right;
}
.text-left {
	text-align: left;
}

.table .tr .td {
	display: inline-block;
	vertical-align: top;
	width: 55%;
}

.table .tr .td p {
	margin: 0 0 2px 0;
}

.table .tr .td.fixed {
	width: 45%;	
	padding: 0 12px 0 0;
}

.kontaktblock h1,
.anfahrtsbeschreibung h1 {
    text-align: center;
    font-weight: 400;
    margin: 72px 0 0px 0;
    font-size: 24px;
}

.anfahrtsbeschreibung h1 {
    text-align: left;
    margin: 24px 0 6px 0;
}


.anfahrt {
    background: rgba(151,218,255,0.02);
	margin: -4px 0 24px 0;
}


.accordion .item {
	transition: all 0.5s ease;
    margin: 0px 0 4px 0;
    background: #056297;
	border: 2px solid #056297;
    padding: 0px 0px 0px 0px;
    display: block;
}

.accordion .item:hover {
	transition: all 0.3s ease;
    background: #0c7ab9;
	border: 2px solid #0c7ab9;
}


.accordion .item.open {
	transition: all 0.5s ease;
    margin: 0px 0 4px 0;
    background: none;
	border: 2px solid #198fd2;
    padding: 0px 0px 36px 0px;
    display: block;
	cursor: default;
}

.accordion .item h1 {
	transition: all 0.5s ease;
    margin: 0;
    padding: 16px 18px 12px 56px;
    font-weight: 300;
    font-size: 24px;
    line-height: 28px;
    color: #ffffff;
    position: relative;
	cursor: pointer;
}

.accordion .item.open h1 {
    color: #198fd2;
}

.accordion .item.open h1:hover {
    color: #2aa3e8;
}

.accordion .item h1::before,
.accordion .item h1::after {
    transition: all 0.3s ease;
	content: "";
    background: url(images/icon_accordion_open.png) center 0px no-repeat;
    background-size: cover;
    height: 24px;
    width: 24px;
    position: absolute;
	top: 16px;
	left: 18px;
    cursor: pointer;
    opacity: 1;
}

.accordion .item.open h1::before,
.accordion .item.open h1::after {
    background-image: url(images/icon_accordion_close.png);
}

.accordion .item h1::after {
    transition: all 0.3s ease;
	content: "";
    background-position-y: -24px;
    opacity: 0;
}

.accordion .item h1:hover::before {
    transition: all 0.3s ease;
    opacity: 0;
}

.accordion .item h1:hover::after {
    transition: all 0.3s ease;
    opacity: 1;
}

.accordion .item .antwort {
	transition: all 0.5s ease;
    height: 0;
	overflow: hidden;
}

.accordion .item.open .antwort {
	transition: all 0.5s ease;
    height: auto;
	overflow: visible;
}

.accordion .item p {
	transition: all 0.5s ease;
    margin: 0;
    padding: 8px 18px 0px 56px;
    color: #ffffff;
}


table{empty-cells:show}

div {border:0px; padding:0px; margin:0px; font-size:0px; line-height:0px;}
img {border:0px; padding:0px; margin:0px}


video {
	width: 100%;
}

/*
div.table {
	display: table;
	border-collapse: collapse;
}

div.tr {
	display: table-row;
}

div.td {
	display: table-cell;
	border: none;
	padding: 0px;
}
*/

* {margin: 0; padding: 0; border: none; outline: none; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}

.arrow1, .arrow2, .arrow3{
	position: absolute;
    width: 16px;
	height: 16px;
	background: url('images/scroll.png');
	margin-left: -8px; 
	opacity: 0.0; 
	filter: alpha(opacity=0);	
	-webkit-animation: indicate 3s linear infinite;
	-moz-animation:    indicate 3s linear infinite;
	-o-animation:      indicate 3s linear infinite;
	animation:         indicate 3s linear infinite;
}
.arrow2 {
    -webkit-animation-delay: 1s;
    -moz-animation-delay: 1s;
    -o-animation-delay: 1s;
    animation-delay: 1s;
}
.arrow3 {
    -webkit-animation-delay: 2s;
    -moz-animation-delay: 2s;
    -o-animation-delay: 2s;
    animation-delay: 2s;
}

@-webkit-keyframes indicate {
    0% { bottom: 24px; opacity: 0.0; filter: alpha(opacity=0)}
    40% { opacity: 0.5; filter: alpha(opacity=70)}
    60% { opacity: 0.5; filter: alpha(opacity=70)}
    100% { bottom: 9px; opacity: 0.0; filter: alpha(opacity=0)} 
}
@-moz-keyframes indicate {
    0% { bottom: 24px; opacity: 0.0; filter: alpha(opacity=0)}
    40% { opacity: 0.5; filter: alpha(opacity=70)}
    60% { opacity: 0.5; filter: alpha(opacity=70)}
    100% { bottom: 9px; opacity: 0.0; filter: alpha(opacity=0)} 
}
@-o-keyframes indicate {
    0% { bottom: 24px; opacity: 0.0; filter: alpha(opacity=0)}
    40% { opacity: 0.5; filter: alpha(opacity=70)}
    60% { opacity: 0.5; filter: alpha(opacity=70)}
    100% { bottom: 9px; opacity: 0.0; filter: alpha(opacity=0)} 
}
@keyframes indicate {
    0% { bottom: 24px; opacity: 0.0; filter: alpha(opacity=0)}
    40% { opacity: 0.5; filter: alpha(opacity=70)}
    60% { opacity: 0.5; filter: alpha(opacity=70)}
    100% { bottom: 9px; opacity: 0.0; filter: alpha(opacity=0)} 
}

	
#scrollbtn, #scrollbtnhover {
	position: absolute;
	z-index:10000; 
	display:inline-block;
	width: 48px; 
	height: 48px; 
    left: 50%;
    bottom: 12px;}
	
#scrollbtn .bg {
	position: absolute;
	display:inline-block;
	background: url('images/scroll_bg.png'); 
	width: 48px; 
	height: 48px;   
	margin-left: -24px;  
	opacity: 0.01; 
	filter: alpha(opacity=1);
	transition: all 1.5s ease;}

#scrollbtnhover .bg {
	position: absolute;
	display:inline-block;
	background: url('images/scroll_bg.png'); 
	width: 48px; 
	height: 48px; 
	margin-left: -24px; 
	opacity: 1.0; 
	filter: alpha(opacity=100);
	transition: all 0.5s ease; }


#logo {
    float: left;
    margin: 40px 0 0 -2px;
    position: relative;
	pointer-events: all;
}


.topmenue,
#btnmenue {
    pointer-events: all;
}

nav::after {
	content: "";
	height: 1px; 
	width: 3000px;
	background: rgba(135, 204, 255, 0.3);
	position: absolute; 
	bottom: 2px;
	left: 24px;
}


nav {
    position: relative;
    z-index: 999;
    top: 47px;
	font-family: 'Barlow Condensed';
	letter-spacing: 1px;
	display: inline-block;
	vertical-align: top;
}

.socialmedia {
    position: relative;
    z-index: 999;
    top: 45px;
    display: inline-block;
    margin: 0 0 0 36px;
}

.socialmedia [class*="btn-"] {
	transition: all 0.3s ease;
    background-size: cover;
    background-position: center 0px;
    background-repeat: no-repeat;	
	height: 32px;
	width: 32px;
    display: inline-block;
	opacity: 0.8;
	cursor: pointer;
    margin: 0 0 0 5px;
}

.socialmedia .btn-facebook {
	background-image: url(images/btn_facebook.png);
}

.socialmedia .btn-instagram {
    background-image: url(images/btn_instagram.png);
}

.socialmedia .btn-whatsapp {
    background-image: url(images/btn_whatsapp.png);
}

.socialmedia .btn-tiktok {
    background-image: url(images/btn_tiktok.png);
}

.socialmedia .btn-youtube {
    background-image: url(images/btn_youtube.png);
}

.socialmedia [class*="btn-"]:hover {
	opacity: 1;
}


nav > ul{padding:0; margin:0; box-sizing: border-box; display: inline-block;}
nav > ul > li{transition: all 0.5s ease; list-style:none; position:relative; display: inline-block; background:none; padding:0px; margin: 2px 0px 2px 26px;}
nav > ul > li:hover{transition: all 0.3s ease;}
nav > ul > li > a {transition: all 0.5s ease;
    width: 100%;
    padding: 5px 0px 13px 0px;
    display: inline-block;
    color: #e5f7f4;
    font-weight: 400;
    font-size: 16px;
    line-height: 17px;
    text-transform: uppercase;
    text-decoration: none;
    opacity: 0.9;
    position: relative;}
	
nav > ul > li:hover > a {
	transition: all 0.5s ease;
    text-decoration: none;
    color: #ffffff;
    opacity: 1;}
	
nav > ul > li::before {
    transition: all 0.5s cubic-bezier(0.6, -0.14, 0.74, 0.05);
    content: "";
    display: block;
    height: 0px;
    width: 100%;
    width: calc(100% + 8px);
    position: absolute;
    left: -4px;
    top: -51px;
    background: rgba(185, 224, 255, 0.2);
    border-radius: 2px;
    /* margin: 0 auto; */
}

nav > ul > li > a.bga {
	color: #061b2c;
    font-weight: 500;
    background: rgb(207, 208, 214);
    padding: 3px 4px 0 4px;
}

nav > ul > li > a.bgb {
    border: 1px solid rgba(255, 255, 255, 0.7);
    padding: 3px 5px 0 5px;
}

nav > ul > li:hover::before, 
nav > ul > li.aktiv::before {
	transition: all 0.3s ease;
    transition: all 0.3s cubic-bezier(0.6, -0.14, 0.44, 1.29);
	height: 76px; 
	/*width: calc(100% - 1px);*/
	}


nav > ul > li.pfeil > a {background:url(images/nav_pfeil.png) no-repeat right -2px top 9px; background-size: 15px 10px; padding-right:16px; display: inline-block}
nav > ul > li.pfeil:hover::after, 
nav > ul > li.pfeil.aktiv::after {
	transition: all 0.3s ease;
	width: 100%; 
	box-sizing: border-box;
	/*width: calc(100% - 17px);*/
	/*left: -8px; */
	}

nav > ul > li > a.aktiv {}
nav > ul > li.pfeil > a.aktiv {}



nav > ul > li > ul {transition: all 0.5s ease; background: rgba( 0, 64, 94, 0.9); position:fixed; width: 100%; top: 120px; left:0px; z-index:998; opacity: 0; visibility:hidden}
nav > ul > li:hover > ul {transition: all 0.2s ease; height:auto; opacity: 1; visibility:visible; z-index:999;}

nav > ul > li > ul  li{list-style:none; margin: 0px 0px 0px 0px;  width:100%; padding: 0;}
/*nav > ul > li > ul  li:first-child{margin: 12px 0px 0px 0px}
nav > ul > li > ul  li:last-child{margin: 0px 0px 12px 0px}*/
nav > ul > li > ul > span {
display: inline-block;
    padding: 52px 0 24px 0;
    width: 275px;
    margin: 0 48px 0 0;
    vertical-align: top;
}

nav > ul > li > ul::after{
	content: "";
	display: inline-block;
	height: 136px;
	vertical-align: bottom;
	width: 1px;
	background: transparent;
}


nav > ul > li > ul  li  a {
    transition: all 0.2s ease;
    width: 100%;
    /*white-space: nowrap;*/
    background: url(images/pfeil_unternavi.png) no-repeat -2px 8px;
    background-size: 10px 15px;
    font-weight: 300;
    font-size: 14px;
    line-height: 17px;
    color: rgba( 255, 255, 255, 0.9);
    text-transform: uppercase;
    text-decoration: none;
    padding: 6px 0px 6px 12px;
    display: block;
}

nav > ul > li > ul  li  a::after {
	transition: all 0.8s ease;
	content: ""; 
	display:block; 
	height: 1px; 
	width: 100%; 
	position:relative; 
	left: 0px;
	top: 6px;
	background:#3f7086;
}
	
nav > ul > li > ul  li  a:hover,
nav > ul > li > ul  li.aktiv  a {
	color:rgba( 255, 255, 255, 0.9); 
}

	
nav > ul > li > ul  li  a:hover::after,
nav > ul > li > ul  li.aktiv a::after  {
	transition: all 0.5s ease; 
	background:#8ba8b5;
}


.bg-untermenue {position: absolute; width: 100%; background: none; height: 170px; top: 120px}
.bg-untermenue .center {position: absolute; width: 100%;}

#smarthomebanner a {color: rgba(66,69,68,1);}

.footer {
    background: #031b30;
    position: relative;
}

.banner-fullblock::after,
.galerie .contenthome > div::after,
.footer::before {
	content: "";
	width: 100%;
	height: 20px;
	background: rgba(1, 28, 51, 0.4);
	position: absolute;
	top: -20px;
	left: 0;
	z-index: 1;
}

.galerie .contenthome > div::after,
.banner-fullblock::after {
	top: auto;
    bottom: 0;
}

#footer {clear:both}
#footer  p , #footer2  p {font-weight: 300;
    font-size: 18px;
    line-height: 22px;
    color: #3a5c75;
    padding: 0px 0 0 0;}
#footer  a , #footer2  a {transition: all 0.4s ease; color:#3a5c75; font-weight: 600; text-decoration:none}
#footer  a:hover , #footer2  a:hover {transition: all 0.4s ease; color:#64839a; text-decoration:none}
#copy {margin: 0;
    text-align: right;}
#copy  p , #copy2  p {font-weight: 400; font-size:12px; line-height:20px; color:#3a5c75}
#copy  a , #copy2  a {transition: all 0.4s ease; font-weight: 600; color:#3a5c75}
#copy  a:hover  , #copy2  a:hover {transition: all 0.4s ease; color:#64839a; text-decoration:none}

.white-space::after {
	content: "·";	
    display: inline-block;
    padding: 0 0 0 3px;
}

.white-space:last-child::after {
	content: "";	
    display: inline-block;
    padding: 0 0 0 4px;
}

#copy .white-space::after {
	content: "I";	
    display: inline-block;
    padding: 0 0 0 3px;
}

#copy .white-space:last-child::after {
	content: "";	
    display: inline-block;
    padding: 0 0 0 4px;
}

#header {
	height:200px; 
	width:100%;
	background: linear-gradient(to bottom, rgba(6,44,75,0.6) 0%, rgba(6,44,75,0.5) 30%, rgba(6,44,75,0) 95%);
	position:fixed; 
	top:0px; 
	z-index:10001;
	pointer-events: none;
}

#headerblende {
    height: 260px;
    width: 100%;
    background: linear-gradient(to bottom, rgba(6, 39, 66, 0.8) 0%, rgba(6, 38, 63, 0.6) 50%, rgba(10, 40, 65, 0) 90%);
	background: linear-gradient(to bottom, rgba(0, 23, 41, 0.75) 0%, rgba(1, 41, 72, 0.55) 48%, rgba(0, 64, 118, 0) 95%);
    position: fixed;
    top: 0px;
    z-index: 10000;
    pointer-events: none;
}

#contenthome { 
	position:fixed;
	height:100%; 
	width:100%; 
	overflow:hidden; 
	z-index:1
}

#contenthome > div,
#contenthome > div img {
	position: absolute;
	width: 100%;
	height: 100%;
}

.galerie #struktur {
	position: fixed;
    top: 0;
    left: 0px;
    width: 100%;
    overflow: hidden;
    z-index: 2;
}



.galerie {z-index: 10000;}
.banner-fullblock {
	position:relative;
	z-index: 10000; }

.galerie .galerie-next, .galerie .galerie-last {transition: opacity 1s ease; opacity: 0;}
.galerie:hover .galerie-next, .galerie:hover .galerie-last {transition: opacity 0.2s ease; opacity: 1;}

.galerie-next, .galerie-last {position:absolute; height:100%; width:100px; bottom:0px; right: 0px; z-index:2}
.galerie-last {left: 0px}


.galerie-next span, 
.galerie-last span,
.touchslider-prev,
.touchslider-next {
	transition: opacity 0.5s ease; 
	position:absolute; 
	background: url(images/galerie_next.png)50% 50% no-repeat rgba(6,27,44,0.9); 
	opacity: 0.4; 
	border-radius: 50%; 
	height:48px; 
	width:48px; 
	cursor: pointer; 
	bottom:45%; 
	bottom: calc(50% - 24px); 
	right: 35px; 
	z-index:3;
}

.galerie-last span,
.touchslider-prev {
	background-image:url(images/galerie_last.png); 
	left: 35px;
}

.galerie-next:hover span, 
.galerie-last:hover span,
.touchslider-prev:hover,
.touchslider-next:hover {
	transition: all 0.2s ease; 
	opacity: 0.7;
}

.galerie-nav {position: absolute; bottom: -24px; z-index: 2; width: 100%; text-align: center;}
.galerie-nav div, .galeriebox .touchslider .touchslider-nav-item {height:14px; width:14px; position:relative; display: inline-block; margin: 0 1px}
.galerie-nav div span, .galeriebox .touchslider .touchslider-nav-item span {position:absolute; border: 1px solid #3a5c75; opacity: 1; border-radius: 50%; height:10px; width:10px; cursor: pointer; bottom:1px; left:1px;}
.galerie-nav div.aktiv span, .galerie-nav div:hover span, .galeriebox .touchslider .touchslider-nav-item:hover span, .galeriebox .touchslider .touchslider-nav-item-current span {background:none; border: 2px solid #c72035; height:12px; width:12px; bottom:0px; left:0px;}

.contentblock .galerie .slogan, .slogan {position:absolute; bottom:15%; width: 100%;}
.slogan p {font-weight: 400; font-size:13px; line-height:15px; color:#FFFFFF}


.contentblock .slogan {
    position: absolute;
    left: 0;
    bottom: 0px;
    margin: 80px 0 20px 0;
	opacity: 1 !important;
}

.contentblock .slogan-display {
    position: relative;
    top: 0;
    left: 0;
    width: 100%;
}

.contentblock .slogan-display .slogan-text {
    position: relative;
    top: -16px;
    left: 50px;
    padding: 0;
	display: inline-block;
}


.banner-fullblock .slogan h1 {
	cursor: default;
}

a.neon,
.slogan h1  {
	display: inline-block;
    font-weight: 200;
	font-family: 'Barlow Condensed';
	letter-spacing: 3.5px;
    font-size: 36px;
    line-height: 29px;
    text-transform: uppercase;
    color: rgba(255,255,255,0.4);
    white-space: nowrap;
	margin: 0 18px 0px 0;
    padding: 16px 28px 15px 32px;
	cursor: pointer;
	
  color: #fdf5f6;
  text-shadow: 
  .05vw 0vw .00vw rgba(201,6,30,0.8), 
  0vw .05vw .00vw rgba(201,6,30,0.8), 
  -.05vw 0vw .00vw rgba(201,6,30,1), 
  0vw -.05vw .00vw rgba(201,6,30,0.8),  
  .16vw .09vw  0.05vw rgba(241,37,104,0.75),
  0vw 0vw  0.5vw rgba(202,3,29,0.9),  
  0vw 0vw  0.5vw rgba(202,3,29,0.9),  
  0vw 0vw  1.0vw rgba(241,37,104,0.9),  
  0vw 0vw  1.5vw rgba(241,37,104,0.9),  
  0vw 0vw  1.0vw rgba(202,3,29,0.9),  
  0vw 0vw  2.5vw rgba(202,3,29,0.9)
  ;
}



.neonbutton {
	display: inline-block;
	text-align: center;
	height: 220px;
	width: 250px;
	overflow: hidden;
	cursor: pointer;
}

.neonbutton .neonlable a  {
	transition: all 0.3s cubic-bezier(0.6, -0.14, 0.74, 0.05);
	display: inline-block;
	font-family: 'Barlow Condensed';
	letter-spacing: 1.5px;
    font-weight: 200;
    font-size: 24px;
    line-height: 28px;
    text-transform: uppercase;
	margin: 0;
    padding: 0;
	position: relative;
	top: -36px;
	
  color: rgba(255,255,255,0.95);
  text-shadow: 
  .05vw 0vw .00vw rgba(31,192,226,0.6), 
  0vw .05vw .00vw rgba(31,192,226,0.6), 
  -.05vw 0vw .00vw rgba(31,192,226,0.8), 
  0vw -.05vw .00vw rgba(31,192,226,0.6),  
  .16vw .09vw  0.05vw rgba(23,125,202,0.75),
  0vw 0vw  0.5vw rgba(23,125,202,0.9),  
  0vw 0vw  0.5vw rgba(23,125,202,0.9),  
  0vw 0vw  1.0vw rgba(23,125,202,0.9),  
  0vw 0vw  1.5vw rgba(23,125,202,0.9),  
  0vw 0vw  1.0vw rgba(23,125,202,0.9),  
  0vw 0vw  2.5vw rgba(23,125,202,0.9)
  ;
}

.neonbutton:hover .neonlable a  {
	transition: all 0.3s cubic-bezier(0.6, -0.14, 0.74, 0.05);
  color: #fdf5f6;
  text-shadow: 
  .05vw 0vw .00vw rgba(201,6,30,0.8), 
  0vw .05vw .00vw rgba(201,6,30,0.8), 
  -.05vw 0vw .00vw rgba(201,6,30,1), 
  0vw -.05vw .00vw rgba(201,6,30,0.8),  
  .16vw .09vw  0.05vw rgba(241,37,104,0.75),
  0vw 0vw  0.5vw rgba(202,3,29,0.9),  
  0vw 0vw  0.5vw rgba(202,3,29,0.9),  
  0vw 0vw  1.0vw rgba(241,37,104,0.9),  
  0vw 0vw  1.5vw rgba(241,37,104,0.9),  
  0vw 0vw  1.0vw rgba(202,3,29,0.9),  
  0vw 0vw  2.5vw rgba(202,3,29,0.9)
  ;
}

a.neon {
	display: inline-block;
	letter-spacing: 1px;
    font-weight: 400;
    font-size: 16px;
    line-height: 17px;
    color: rgba(255,255,255,0.9);
    white-space: nowrap;
	margin: 0;
    padding: 0;
}

.slogan h1,
.drawline2,
.neonlable {
	animation: neonlight 4s linear forwards infinite;
}

@keyframes neonlight {
    0% { opacity: 1.0;}
    28% { opacity: 1.0;}
    29% {  opacity: 0.95;}
    30% { opacity: 1.0;} 
    46% { opacity: 1.0;}
    48% {  opacity: 0.95;}
    50% { opacity: 1.0;} 
    86% { opacity: 1.0;}
    88% {  opacity: 0.95;}
    90% { opacity: 1.0;} 
    96% { opacity: 1.0;}
    97% {  opacity: 0.9;}
    98% { opacity: 1.0;}
    99% {  opacity: 0.95;}
    100% { opacity: 1.0;} 
} 

.drawline {
	animation: neonlight2 3s linear forwards infinite;
}

@keyframes neonlight2 {
    0% { opacity: 1.0;}
    28% { opacity: 1.0;}
    29% {  opacity: 0.8;}
    30% { opacity: 1.0;} 
    46% { opacity: 1.0;}
    48% {  opacity: 0.95;}
    50% { opacity: 1.0;} 
    86% { opacity: 1.0;}
    88% {  opacity: 0.90;}
    90% { opacity: 1.0;} 
    96% { opacity: 1.0;}
    97% {  opacity: 0.85;}
    98% { opacity: 1.0;}
    99% {  opacity: 0.95;}
    100% { opacity: 1.0;} 
} 


/*.slogan:hover h1 {
	transition: all 0.2s ease; 
	color:rgba(255,255,255,0.6)
}*/


.slogan-display,
.galerie .slogan-display {
	position: absolute;
	top: -40px;
	left: 10px;
	width: 100%;
}

.slogan-display .slogan-text {
    position: absolute;
    top: -16px;
    left: 50px;
    padding: 0;
}

.slogan-display svg {
    position: absolute;
    top: -88px;
    width: 100%;
}


svg .blurred {
	-webkikt-filter: url('#blur'); 
    filter: url(#blur);
}
svg .blurred2 {
	-webkikt-filter: url('#blur2'); 
    filter: url(#blur2);
}
svg .blurred3 {
	-webkikt-filter: url('#blur3'); 
    filter: url(#blur3);
}
svg .blurred4 {
	-webkikt-filter: url('#blur4'); 
    filter: url(#blur4);
}

/*
.slogan h1 span {
    transition: all 0.4s ease;
    background: rgba(0,0,0,0.3);
	border: 2px solid #f4faff;
    border-radius: 50px;
    padding: 18px 28px 13px 28px;
    display: inline-block;
    text-align: right;
    cursor: pointer;
    white-space: nowrap;
	
	
	box-shadow: 
  .05vw 0vw .00vw rgba(31,192,226,0.8), 
  0vw .05vw .00vw rgba(31,192,226,0.8), 
  -.05vw 0vw .00vw rgba(23,125,202,1), 
  0vw -.05vw .00vw rgba(23,125,202,0.8),
  inset .05vw 0vw .00vw rgba(23,125,202,0.8), 
  inset 0vw .05vw .00vw rgba(23,125,202,0.8), 
  inset -.05vw 0vw .00vw rgba(31,192,226,1), 
  inset 0vw -.05vw .00vw rgba(31,192,226,0.8),  
  .18vw .1vw  1vw rgba(22,119,193,0.6),  
  inset .18vw .1vw  1vw rgba(22,119,193,0.6),  
  0vw 0vw  2vw rgba(22,119,193,0.4),  
  0vw 0vw  3vw rgba(22,119,193,0.4),  
  inset 0vw 0vw  0.5vw rgba(22,119,193,0.2),  
  inset 0vw 0vw  1vw rgba(22,119,193,0.2),  
  0vw 0vw  4vw rgba(22,119,193,0.1),  
  0vw 0vw  6vw rgba(22,119,193,0.1),  
  inset 0vw 0vw  4vw rgba(22,119,193,0.2),  
  inset 0vw 0vw  6vw rgba(22,119,193,0.4),
  0vw 0vw  10vw rgba(6,44,75,0.3),  
  0vw 0vw  10vw rgba(6,44,75,0.3),
  0vw 0vw  20vw rgba(6,44,75,0.3),  
  0vw 0vw  20vw rgba(6,44,75,0.3),
  0vw 0vw  40vw rgba(6,44,75,0.3),  
  0vw 0vw  60vw rgba(6,44,75,0.3),  
  0vw 0vw  60vw rgba(6,44,75,0.3);
}
*/
.slogan:hover h1 span {
	transition: all 0.2s ease; 
	/*background:rgba(6,27,44,0.8);*/
}
.slogan h2 {
	transition: all 0.4s ease;
    font-weight: 400;
    font-size: 14px;
    line-height: 18px;
    text-transform: none;
    color: rgba(36,32,33,0.9);
    text-align: right;
    padding: 0px;
    margin: 0;
	display: none;
}
.slogan:hover h2 {
	transition: all 0.2s ease; color:rgba(36,32,33,1)
}
.slogan h2 span {
	transition: all 0.4s ease;
    background: rgba(255,255,255,0.5);
    padding: 3px 12px 4px 12px;
	cursor:pointer; 
    white-space: nowrap;
}
.slogan:hover h2 span {
	transition: all 0.2s ease; background:rgba(255,255,255,0.7)
}

.booking {
    text-align: center;
}

.booking .headline {
    font-weight: 100;
    font-size: 42px;
    line-height: 48px;
    text-transform: none;
    color: #198fd2;
    text-align: center;
    padding: 0px;
    margin: 24px 0 12px 0;
}

.booking .btn {
	transition: all 0.5s ease;
    font-weight: 300;
    font-size: 28px;
    line-height: 28px;
    text-transform: uppercase;
	font-family: 'Barlow Condensed';
    letter-spacing: 1.5px;
    color: #ffffff;
    text-align: center;
    margin: 12px 0 52px 0;
	background: #056297;
    padding: 16px 72px 11px 72px;
	display: inline-block;
}

.booking .btn:hover {
	transition: all 0.3s ease;
	/*color: #061725;*/
	background: #0c7ab9;
}

.booking.btnliste .btn {
	width: 100%;
	margin: 4px 0 0 0;
}



#box .header div {float: right; margin: 32px 16px 6px 20px}
#box .header p {font-weight: 400; font-size:18px;  line-height:19px; text-transform:uppercase; color:#C9C6B8; padding:30px 0px 8px 16px; margin-top: 0px}
#box a {animation: indicateli 0.4s linear forwards; background:url(images/pfeil.png) no-repeat 0px 0px; font-weight: 700; color:  rgba(66,69,68,1); line-height: 28px; font-size: 13px; margin:0 0 0 18px;  padding: 5px 0 1px 31px; text-decoration:none}
#box a:hover {animation: indicatelihover 0.25s linear forwards;  color: #99947F;}

#box {
    box-shadow: 1px 1px 5px rgba(0,0,0,.3);
   -webkit-box-shadow: 1px 1px 5px rgba(0,0,0,.3);
   -moz-box-shadow:1px 1px 5px rgba(0,0,0,.3);
   filter: progid:DXImageTransform.Microsoft.Blur(PixelRadius=3,MakeShadow=true,ShadowOpacity=0.45);
   -ms-filter: "progid:DXImageTransform.Microsoft.Blur(PixelRadius=3,MakeShadow=true,ShadowOpacity=0.45)";
   zoom: 1;
}
	

#smarthomebanner ul {list-style:none; margin-left:0px; margin-bottom:40px; margin-top:10px; padding:0px; display:inline-block}
#smarthomebanner li{display:block; animation: indicateli 0.4s linear forwards; background:url(images/li_pfeil.png) no-repeat 0px 0px; font-weight: 700; color: #5D542D; line-height: 22px; font-size: 13px; margin:0 0 1px 0;  padding: 3px 0 0 32px}
#smarthomebanner li:hover{animation: indicatelihover 0.25s linear forwards;}

@-webkit-keyframes indicatelihover {
    0% { background-position:-2px -1px;}
    70% { background-position:5px -1px;}
    90% {  background-position:2px -1px;}
    100% {  background-position:3px -1px;} 
} 

@keyframes indicatelihover {
    0% { background-position:-2px -1px;}
    70% { background-position:5px -1px;}
    90% {  background-position:2px -1px;}
    100% {  background-position:3px -1px;} 
}
@-webkit-keyframes indicateli {
    0% { background-position:3px -1px;}
    70% { background-position:-4px -1px;}
    90% {  background-position:-1px -1px;}
    100% {  background-position:-2px -1px;} 
} 
@keyframes indicateli {
    0% { background-position:3px -1px;}
    70% { background-position:-4px -1px;}
    90% {  background-position:-1px -1px;}
    100% {  background-position:-2px -1px;} 
}


.justify {text-align:justify; font-size:1px}
.justify > li {display:inline-block; list-style:none; padding:0px; vertical-align:top; text-align: center;}
.justify:after {content: ""; display: inline-block; padding-left: 100%;}
.hiddenli {width: 33.3%;}

.technikblock,
.cols {
	display: flex;
	width: 100%;
}


.cols > div {
    border-left: 1px solid rgba(135, 204, 255, 0.3);
	padding: 0 36px;
	flex: 1 1 0%;
}

.cols > div:first-child {
	border: none;
	margin: 0 0 0 -36px;
}

.cols > div:last-child {
	margin: 0 -36px 0 0;
}


.cols.col3 > div {
	padding: 0 22px;
}

.cols.col3 > div:first-child {
	margin: 0 0 0 -22px;
}

.cols.col3 > div:last-child {
	margin: 0 -22px 0 0;
}

#inhalt .technikblock ul.pfeile {
    margin: 12px 0 0px 0;
}

.technikblock .beschreibung h2 {
    margin: 8px 0 0 0;
}


.beschreibung h2 {
    font-size: 24px;
    font-weight: 600;
    color: #198fd2;
    padding: 0;
    margin: 24px 0 0 0;
}

.angebotsblock .allgemein,
.angebotsblock .beschreibung {	
    margin: 0px 0 36px 0;
}

.angebotsblock .float .img {
    margin: 10px 0 0 0;
}

.angebotsblock .allgemein h1 {	
    margin: 0px 0 8px 0;
}


.angebotsblock {	
    border-bottom: 1px solid rgba(135, 204, 255, 0.3);
    margin: 24px 0 36px 0;
}

#inhalt .angebotsblock h3 {
    transition: all 0.5s ease;
    margin: 0px 0 4px 0;
    background: #198fd2;
    padding: 18px 10px 3px 10px;
    display: block;
    font-size: 20px;
    color: #ffffff;
}

.angebotsblock .float {
    margin: 0 0 48px 0;
}

.angebotsblock .float .text {
    padding: 0 0 0 48px;
}

.angebotsblock .float.right .text {
    padding: 0 48px 0 0;
}

.angebotsblock:last-child {	
    border-bottom: none;
}

#inhalt .btn-mail {
    transition: all 0.5s ease;
    font-weight: 300;
    font-size: 18px;
    line-height: 26px;
    text-transform: uppercase;
    font-family: 'Barlow Condensed';
    letter-spacing: 1.5px;
    color: #ffffff;
    text-align: center;
    margin: 4px 0 0px 0;
    background: #056297;
    padding: 12px 28px 7px 28px;
    display: inline-block;
}

#inhalt .btn-mail a {
    transition: all 0.5s ease;
    font-weight: 300;
    font-size: 18px;
    line-height: 26px;
    text-transform: uppercase;
    font-family: 'Barlow Condensed';
    letter-spacing: 1.5px;
    color: #ffffff;
}

#inhalt .btn-mail a[href^="mailto"]::after, 
#inhalt .btn-mail a[href^="mailto"]::before {
    background-image: url(images/symbol_mail_weiss.png);
}

.tarifbox .tarif {	
    width: 190px;
    height: 190px;
    background: #198fd2;
    border-radius: 100%;
    margin: 0 0 0px 28px;
	text-align: center;
	display: flex;
	float: right;
	color: #ffffff;
	text-align: center;
}

.tarifbox .tarif > div {
	align-self: center;
	width: 100%;
	position: relative;
}

.tarifbox .tarif > div::after {
    content: "inkl. MwSt";
    font-size: 12px;
    position: absolute;
    bottom: 32px;
    text-transform: none;
    font-family: 'Barlow';
    letter-spacing: normal;
    font-weight: 100;
    width: 100%;
    left: 0;
}

.tarifbox .tarif .preis {
	font-size: 72px;
	line-height: 72px;
	padding: 6px 0 14px 6px;
}

.tarifbox .tarif .preis span {
	font-size: 60px;
}

.tarifbox .tarif .dauer > div {
	font-size: 14px;
	line-height: 14px;
}

.tarifbox .tab {
	display: none;
}

.tarifbox .tab.tabcontent1 {
	display: block;
}

.tarifbox .lable {
	transition: all 0.3s ease;
	display: inline-block;
	margin: 0 8px;
	padding: 0;
	position: relative;
	opacity: 0.5;
	cursor: pointer;
}

.tarifbox .lable.aktiv,
.tarifbox .lable:hover {
	transition: all 0.3s ease;
	opacity: 1;
}

.tarifbox .lable.aktiv {
	cursor: default;;
}

.tarifbox .lable.aktiv::after{
	transition: all 0.3s ease;
	content: "";
	display: block;
	height: 3px;
	width: 100%;
	background: #ffffff;
	position: absolute;
	bottom: -5px;
}

.preiseblock .hinweis {
	margin: 48px 0 64px 0;
}

.teloptions {
	margin: 24px 0 48px
}

.teloptions > div {
	display: inline-block;
	vertical-align: top;
}

.teloptions .btn-whatsapp {
    height: 72px;
    width: 72px;
    margin: -8px 12px 0 0px;
    display: inline-block;
    position: relative;
}

.teloptions .btn-whatsapp::before,
.teloptions .btn-whatsapp::after {
    transition: all 0.3s ease;
	content: "";
    background: url(images/btn_whatsapp3.png) center 0px no-repeat;
    background-size: cover;
    height: 72px;
    width: 72px;
    position: absolute;
	top: 0;
	left: 0;
    cursor: pointer;
    opacity: 1;
}

.teloptions .btn-whatsapp::after {
    transition: all 0.3s ease;
	content: "";
    background-position-y: -72px;
    opacity: 0;
}

.teloptions .btn-whatsapp:hover::before {
    transition: all 0.3s ease;
    opacity: 0;
}

.teloptions .btn-whatsapp:hover::after {
    transition: all 0.3s ease;
    opacity: 1;
}



.btn.powered {
	position: relative;
	margin-bottom: 26px;
}

.btn.powered::after {
	content: "powered by springboardvr.com";
	font-size: 12px;
	position: absolute;
	bottom: -28px;
	text-transform: none;
	font-family: 'Barlow';
	letter-spacing: normal;
	font-weight: 100;
	width: 100%;
	left: 0;
}

.hotline {
	font-size: 64px;
    line-height: 64px;
    color: #ffffff;
    margin: 0;
	font-weight: 500;
}

.teloptions  .teloptionshinweis {
    font-size: 12px;
    line-height: 12px;
    font-weight: 100;
    padding: 0px 0 0 0;
	color: #ffffff;
	display: block;
}


.tabblock .tab {
	min-height: 200px;
	padding: 36px 0 12px 0;
	display: none;
}

.tabblock .tab.tabcontent3 {
	display: block;
}

.tabblock .tabnavi {
	text-align: center;
}

.tabblock .tabs {
	display: inline-flex;
	border: 2px solid #198fd2;
	flex-wrap: wrap;
}

.tabblock .tabs .lable {
	transition: all 0.3s ease;
	display: inline-block;
	font-size: 18px;
	line-height: 18px;
	color: #198fd2;
	font-weight: 400;
    text-transform: uppercase;
    font-family: 'Barlow Condensed';
    letter-spacing: 1.5px;
	padding: 10px 16px 8px 16px;
	cursor: pointer;
	user-select: none;
	flex: 1 1 auto;
    align-items: center;
}

.tabblock .tabs .lable.aktiv,
.tabblock .tabs .lable:hover {
	transition: all 0.3s ease;
	background: #198fd2;
	color: #ffffff;
}

.vorschaublock {
	margin: 0px;
}

#inhalt .vorschaublock ul {
    padding: 0;
}

#inhalt .vorschaublock li {
    width: 48%;    
    width: calc((100% - 60px) / 3); 
    padding: 0;
    margin: 0;
}

.vorschaublock .vorschau,
.vorschaublock .spielehinweis {
    padding-top: 56.25%;
    margin: 8px 0px 30px 0px;
	text-align: center;
	display: flex;
	position: relative;
	overflow: hidden;
    background: rgba(13, 128, 210, 0.3);
}

.vorschaublock .spielehinweis > div {
	position: absolute;
	top: 0;
    left: 0;
	width: 100%;
	height: 100%;
    padding: 6px 24px 6px 24px;
	flex: 1;
    align-self: center;	
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.vorschaublock .spielehinweis p {
	color: #ffffff;
}

.vorschaublock .spielehinweis .socialmedia {
	top: 0;
	margin: 0;
}

.vorschaublock .spielehinweis .socialmedia div {
	margin: 14px 4px 2px 4px;
	height: 48px;
	width: 48px;
	background-position-y: 0px;
}

.vorschaublock .hiddenli {width: 240px;}

.vorschaublock .vorschau::before,
.vorschaublock .vorschau .vorschaubild {
	transition: all 0.6s ease;
	content: "";
	position: absolute;
	width: 100%;
	height: 100%;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	top: 0;
    left: 0;
	transform: scale(1.001);
}

.vorschaublock .vorschau:hover::before,
.vorschaublock .vorschau:hover .vorschaubild {
	transition: all 0.3s ease;
	transform: scale(1.1);
}

.vorschaublock .vorschau.angry-birds::before {
	background-image: url(images/vr_games_angry_birds.jpg);
}

.vorschaublock .vorschau.arizona-sunshine::before {
	background-image: url(images/vr_games_arizona_sunshine.jpg);
}

.vorschaublock .vorschau.beatsaber::before {
	background-image: url(images/vr_games_beat_saber.jpg);
}

.vorschaublock .vorschau.creed::before {
	background-image: url(images/vr_games_creed.jpg);
}

.vorschaublock .vorschau.pistol-whip::before {
	background-image: url(images/vr_games_pistol_whip.jpg);
}

.vorschaublock .vorschau.project-cars::before {
	background-image: url(images/vr_games_project_cars.jpg);
}

.vorschaublock .vorschau.richies-plank-experience::before {
	background-image: url(images/vr_games_richies_plank_experience.jpg);
}

.vorschaublock .vorschau.shooty-fruity-arcade::before {
	background-image: url(images/vr_games_shooty_fruity.jpg);
}



.vorschaublock .vorschau .info {
	transition: all 0.3s ease;
	position: absolute;
	width: 100%;
	height: 100%;
	background: rgba(25, 143, 210,0.6);
	cursor: default;
	bottom: -222px;
	bottom: -70%;
}

.vorschaublock .vorschau:hover .info {
	transition: all 0.3s ease;
	background: rgba(25, 143, 210,0.9);
	bottom: 0%;
}

.vorschaublock .vorschau .lable {
	transition: all 0.3s ease;
	height: 30%;
	display: flex;
}


.vorschaublock .vorschau:hover .lable {
	transition: all 0.3s ease;
	height: 25%;
}

.vorschaublock .vorschau h2 {
	transition: all 0.3s ease;
    font-weight: 400;
	font-size: 18px;
	line-height: 22px;
    color: #ffffff;
    margin: 0;
    padding: 6px 24px 0px 24px;
	flex: 1;
    align-self: center;
}

.vorschaublock .vorschau:hover h2 {
	transition: all 0.3s ease;
    padding-top: 18px;
	font-size: 20px;
	line-height: 21px;
    font-weight: 500;
}

.vorschaublock .vorschau p {
    font-weight: 200;
    color: #ffffff;
    margin: 0;
    padding: 0px 24px 12px 24px;
}

.btn-play {
    transition: all 0.3s ease;
	border: 2px solid rgba(255,255,255,0.9);
	display: inline-block;
	cursor: pointer;
	position: relative;
}

.btn-play:hover {
    transition: all 0.3s ease;
	background: rgba(255,255,255,0.9);
	border-color: transparent;
}

.btn-play::before {
    transition: all 0.3s ease;
	content: "Play Trailer";
    font-weight: 400;
	font-size: 18px;
	line-height: 22px;
    color: #ffffff;
    margin: 0;
    padding: 10px 48px 9px 24px;
	display: inline-block;
}

.btn-play:hover::before {
    transition: all 0.3s ease;
    color: #198fd2;
}

.btn-play > div::before,
.btn-play > div::after {
    transition: all 0.3s ease;
	content: "";
    background: url(images/btn_play.png) center 0px no-repeat;
    background-size: cover;
    height: 24px;
    width: 24px;
    position: absolute;
	top: 9px;
    right: 16px;
    cursor: pointer;
    opacity: 1;
}

.btn-play > div::after {
    transition: all 0.3s ease;
    background-position-y: -24px;
    opacity: 0;
}

.btn-play:hover > div::before {
    transition: all 0.3s ease;
    opacity: 0;
}

.btn-play:hover > div::after {
    transition: all 0.3s ease;
    opacity: 1;
}

.vorschaublock .icons {
    position: absolute;
	width: 100%;
	left: 0;
	bottom: 0;
	text-align: center;
}

.vorschaublock .icons .alter,
.vorschaublock .icons .player,
.vorschaublock .icons .schwierigkeit {
	display: inline-block;
    position: relative;
	min-width: 36px;
	height: 36px;
	margin: 8px 6px 6px 6px;
	vertical-align: top;
}

.alter {
	font-weight: 400;
    font-size: 14px;
    line-height: 36px;
    color: #ffffff;
    padding: 0 1px 0 0;
}

.alter::before,
.alter::after {
    transition: all 0.3s ease;
	content: "";
    background: url(images/icons_altersempfehlung_na.png) center 0px no-repeat;
    background-size: cover;
    height: 36px;
    width: 36px;
    position: absolute;
	top: 0px;
    left: 0px;
    opacity: 1;
}

.alter::after {
    transition: all 0.3s ease;
    background-position-y: 0px;
    opacity: 0;
}

.alter:hover::before {
    transition: all 0.3s ease;
    opacity: 1;
}

.alter:hover::after {
    transition: all 0.3s ease;
    opacity: 0;
}


.alter:not(:empty)::before,
.alter:not(:empty)::after {
    background-image: url(images/icons_altersempfehlung.png);
}


.player::before,
.player::after {
    transition: all 0.3s ease;
	content: "";
    background: url(images/icons_singleplayer.png) center 0px no-repeat;
    background-size: cover;
    height: 36px;
    width: 36px;
    position: absolute;
	top: 0px;
    left: 0px;
    opacity: 1;
}

.player::after {
    transition: all 0.3s ease;
    background-position-y: 0px;
    opacity: 0;
}

.player:hover::before {
    transition: all 0.3s ease;
    opacity: 1;
}

.player:hover::after {
    transition: all 0.3s ease;
    opacity: 0;
}

.player.multiplayer::before,
.player.multiplayer::after {
    background-image: url(images/icons_multiplayer.png);
}

.player.singleplayer .von,
.player.singleplayer .bis {
	display: none;
}

.player.multiplayer {
    padding: 8px 0 0 36px;
}

.player .von,
.player .bis {
	display: inline-block;
    font-weight: 400;
	font-size: 14px;
	line-height: 22px;
    color: #ffffff;
}

.player .bis:not(:empty)::before {
	content: "-";
	display: inline-block;
	padding: 0 1px 0 1px;
}

.schwierigkeit::before,
.schwierigkeit::after {
    transition: all 0.3s ease;
	content: "";
    background: url(images/icons_schwierigkeitsgrad_leicht.png) center 0px no-repeat;
    background-size: cover;
    height: 36px;
    width: 36px;
    position: absolute;
	top: 0px;
    left: 0px;
    opacity: 1;
}

.schwierigkeit::after {
    transition: all 0.3s ease;
    background-position-y: 0px;
    opacity: 0;
}

.schwierigkeit:hover::before {
    transition: all 0.3s ease;
    opacity: 1;
}

.schwierigkeit:hover::after {
    transition: all 0.3s ease;
    opacity: 0;
}

.schwierigkeit.mittel::before,
.schwierigkeit.mittel::after {
    background-image: url(images/icons_schwierigkeitsgrad_mittel.png);
}

.schwierigkeit.hart::before,
.schwierigkeit.hart::after {
    background-image: url(images/icons_schwierigkeitsgrad_hart.png);
}


.statistik {
    width: 190px;
    height: 190px;
    border: 4px solid #0d4b79;
    border-radius: 100%;
    margin: 20px 28px;
	text-align: center;
	display: flex;
}

.statistikblock {
}

.statistikblock .statistik > div {
	flex: 1;
    padding: 18px 24px 12px 24px;
    align-self: center;
}
	
.statistik p {
	font-size: 14px;
    font-weight: 200;
}
	
.statistik .value {
	font-size: 48px;
    color: #198fd2;
    font-weight: 500;
    line-height: 48px;
}

.hinweis h1 {
	text-align: center;
	font-weight: 400;
	margin: 18px 0 24px 0;
	font-size: 24px;
}

.bannerblock {
    padding: 24px 0 24px 0;
}

.drittelbanner {
	transition: all 0.9s ease;
	display: inline-block;
    width: 100%;
    box-sizing: border-box;
	padding: 0px 0px 0px 0px;
    margin: 0px 0 0px 0;}
.drittelbanner:hover {
	transition: all 0.9s ease;cursor:pointer;}
.drittelbanner h1 {font-size:19px; font-weight:300; line-height: 120%; color:#ffffff; margin: 0px 14px; text-transform: none}

.drittelbanner .pikto_gundstuecke {
	background:url(images/pikto_grundstuecke.png) no-repeat 0px 0px;
	background-size:cover;
	width: 142px; 
	height: 100px;
	margin: 12px auto 18px auto;
}
.drittelbanner:hover .pikto_gundstuecke {
	transition: all 0.2s ease;
	background:url(images/pikto_grundstuecke.png) no-repeat 0px 0px;
	background-size:cover;
}
.drittelbanner .pikto_projekte {
	background:url(images/pikto_projekte.png) no-repeat 0px 0px;
	background-size:cover;
	width: 142px; 
	height: 100px;
	margin: 12px auto 18px auto;
}
.drittelbanner:hover .pikto_projekte {
	transition: all 0.2s ease;
	background:url(images/pikto_projekte.png) no-repeat 0px 0px;
	background-size:cover;
}
.drittelbanner .pikto_kontakt {
	background:url(images/pikto_kontakt.png) no-repeat 0px 0px;
	background-size:cover;
	width: 142px; 
	height: 100px;
	margin: 12px auto 18px auto;
}
.drittelbanner:hover .pikto_kontakt {
	transition: all 0.2s ease;
	background:url(images/pikto_kontakt.png) no-repeat 0px 0px;
	background-size:cover;
}


.partner .justify > li,
.sponsoring .justify > li {
    width: 432px;
}

.sponsoring .halbbanner {
    transition: all 0.2s ease;
    display: inline-block;
    width: 100%;
    box-sizing: border-box;
    padding: 0px 0px 0px 0px;
    margin: 24px 0 0px 0;
    background: #ffffff;
}

.sponsoring .halbbanner .logo {
	position: relative;
    background: #ffffff;
    margin: 0 8px 0 10px;
    padding: 0px 0px;
    float: right;
    width: 155px;
    height: 120px;
}


.sponsoring .halbbanner.lc .logo {
    width: 180px;
}

.sponsoring .halbbanner .logo img {
    width: 100%;
    height: auto;
    position: relative;
    top: 60%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

.sponsoring .halbbanner .bezeichnung {
    padding: 14px 18px;
    text-align: left;
}

.sponsoring .halbbanner h2 {
    font-size: 14px;
	line-height: 18px;
	margin: 0 0 3px 0;
	padding: 0;
}

.sponsoring .halbbanner p {
   /* font-size: 12px;*/
}

.partner .halbbanner {
    transition: all 0.2s ease;
    display: inline-block;
    width: 100%;
    box-sizing: border-box;
    padding: 0px 0px 0px 0px;
    margin: 24px 0 0px 0;
    background: #307290;
}

.partner .halbbanner .logo {
    position: relative;
    background: #ffffff;
    margin: 0 18px 0px 0;	
    padding: 14px 24px;
    float: left;
    width: 188px;
    height: 120px;
}

.partner .halbbanner .logo img {
    width: 100%;
	height: auto;
	position: relative;
	top: 50%;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
}

.partner .halbbanner .bezeichnung {
    padding: 14px 18px;
    text-align: left;
}

.partner .halbbanner h2 {
    color: rgba(255,255,255,0.9);
    font-size: 14px;
	line-height: 18px;
	margin: 0 0 3px 0;
	padding: 0;
}

.partner .halbbanner p {
    color: rgba(255,255,255,0.6);
    font-size: 12px;
}
	
.partner .halbbanner:hover {
	transition: all 0.5s ease; cursor:pointer; background: #00405e;}
	
	
	
	
.partnerlogos .justify > li {
    width: 152px;
}

.partnerlogos .fuenftelbanner {
    transition: all 0.2s ease;
    display: inline-block;
    width: 100%;
    box-sizing: border-box;
    padding: 0px 0px 0px 0px;
    margin: 24px 0 0px 0;
    background: #ffffff;
}

.partnerlogos .fuenftelbanner .logo {
    position: relative;
    background: #ffffff;
    margin: 0 18px 0px 0;	
    padding: 14px 11px;
    width: 100%;
    height: 100px;
}

.partnerlogos .fuenftelbanner .logo img {
    width: 100%;
	height: auto;
	position: relative;
	top: 50%;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
}
	
	
	
	
.half1 {width:49%; display:inline-block; vertical-align:top}
.half2 {width:49%; display:inline-block; vertical-align:top; border-left: 1px solid #DAD6C8; padding: 0 0 0 12px}

#smartphonemenue {
	display:none;
    position: absolute;
    z-index: 20000;}

#btnmenue {
	display:none;
	cursor: pointer;	
	background: url(images/btn_menue.gif) center center no-repeat;
    margin: 8px 0 0 6px;
    background-size: 30px 28px;
    float: right;
    transition: all 0.2s ease;
	height: 28px;
	width: 30px;
}


#smarthomebanner {
	clear: both;
	width: 100%;
	height: 244px;
	background: url(images/bg_banner.gif) center bottom repeat-x;
	position:relative
}

#smarthomebanner .smarthome {
	background: url(images/smarthome.png) right bottom repeat-x;
	width: 551px;
	height: 333px;
	background-size: cover;
	position:absolute;
	top:-5px;
	right:50%;
	margin: 0 -501px 0 0;
}

#smarthomebanner h2 {
	font-weight: 600;
	color:#ffffff;
	font-size: 24px;
	line-height: 28px;
	text-transform: uppercase;
	margin: 0px 0 0 0;
	padding: 116px 0 0 0;	
}

#smarthomebanner h3 {
	font-weight: 400;
	color:#005A4B;
	font-size: 13px;
	line-height: 17px;
	margin: 0 0 20px 0;	
}

#smarthomebanner a {
	font-weight: 800;
	color:#016756;
	font-size: 13px;
	line-height: 17px;
	margin: 0px 0 0 0;
	background: url(images/pfeil_banner.png) no-repeat right 20px top 11px #FACA00;
	padding: 8px 42px 8px 16px;	
		
}

#smarthomebanner a:hover {
	animation: indicatebanner 0.20s linear forwards; background-position: right 18px top 11px;
		
}


@keyframes indicatebanner {
    0% {background-position: right 20px top 11px;}
    40% {background-position: right 14px top 11px;}
    65% {background-position: right 19px top 11px;}
    85% {background-position: right 16px top 11px;}
    100% {background-position: right 17px top 11px;} 
}


@keyframes indicatetextlink {
    0% {background-position: right 4px top 6px;}
    40% {background-position: right 0px top 6px;}
    65% {background-position: right 3px top 6px;}
    85% {background-position: right 1px top 6px;}
    100% {background-position: right 2px top 6px;} 
}


.contentblock {
	position: relative;
    z-index: 2;
    padding: 0px 0 48px 0;
    min-height: calc(100% - 104px);
}
.contentblock2 {
	position:relative; 
	z-index:2; 
	padding: 0px 0 48px 0;
}

#touchslider {
    margin: 0px 0px 48px 0px;
}


.pagefootercontent {
	padding: 26px 0px 12px 0px;
}

#pagefooter {
	min-height:104px;
}

.pagefootercontent .socialmedia {
	display: none;
}
	
#footernavi  {margin: 0 0 22px 0; padding: 0px 0 0 0; border-bottom: 1px solid #235972;}
#footernavi::after  {content:""; display:block; clear:both}
#footernavi  ul{padding:0; margin: 0; float:left}
#footernavi  ul li{list-style:none; background:none; padding:0px; margin:0 4px 0 0; position:relative; float: left; font-size: 12px}
#footernavi  ul li:after {content:"|"; color:rgba(219,234,240,0.6); padding:0px; margin: 0 0 0 4px; position:relative; top: -1px}
#footernavi  ul li:last-child:after {content:""}
#footernavi  ul li.static:last-child:after {content:"|"}
/*#footernavi  ul li.navend:after {content:""}*/
#footernavi  ul li a {transition: all 0.5s ease; padding:0px 0px 5px 0px; display: inline-block; float: left; color:rgba(219,234,240,0.6) !important; font-weight: 400; text-transform:none; text-decoration:none}
#footernavi  ul li a:hover {transition: all 0.3s ease; color:rgba(255,255,255,0.9) !important; text-decoration:none}

#footernavi  ul li ul{margin:0px; display: none}


.angebotsbox, 
.suche {width: 100%;
    margin: 0px 0 24px 0;
    padding: 0;
    display: inline-block;
    position: relative;
    vertical-align: top;
	cursor: pointer;}
.angebotsbox .neu {background:#EE9D2D; position:relative; left:-16px; top: 0px; display: inline-block;}
.angebotsbox .neu p{color:#ffffff; font-weight: 600; padding:0px 4px}
.angebotsbox .sneu .status {background: #e77817;
    position: absolute;
    left: -6px;
    top: 16px;
    display: inline-block;
    color: #ffffff;
    font-weight: 600;
    font-size: 12px;
    line-height: 17px;
    padding: 0px 8px;
	z-index: 1;}
.angebotsbox .sneu .status:after {content:"NEU"}

.angebotsbox .sverkauft .status {background: #00405e;
    position: absolute;
    left: -6px;
    top: 16px;
    display: inline-block;
    color: #ffffff;
    font-weight: 600;
    font-size: 12px;
    line-height: 17px;
    padding: 0px 8px;
	z-index: 1;}
.angebotsbox .sverkauft .status:after {content:"VERKAUFT"}

.angebotsbox .sreserviert .status {background: #e77817;
    position: absolute;
    left: -6px;
    top: 16px;
    display: inline-block;
    color: #ffffff;
    font-weight: 600;
    font-size: 12px;
    line-height: 17px;
    padding: 0px 8px;
	z-index: 1;}
.angebotsbox .sreserviert .status:after {content:"RESERVIERT"}


.angebotsbox .slaufend .status {}
.angebotsbox .slaufend .status:after {content:""}
.angebotsbox .sabbildung .status {background:#FACA00; position:relative; left:-16px; top: 2px; display: inline-block;color:#016756; font-weight: 700; font-size:12px; line-height:17px; padding:0px 8px}
.angebotsbox .sabbildung .status:after {content:"Abbildung ähnlich"}
.angebotsbox .pfeil {display: none; position:absolute; bottom:16px; right:16px; width:29px;}
.angebotsbox .vorschau {
    position: absolute;
    bottom: 0px;
    background: rgba(0,64,94,0.90);
    display: block;
    width: 100%;
    text-align: center;
    padding: 14px 0 14px 0;
}

.suche {
	transition: all 0.3s ease;
	position: relative;
    border: 1px solid #ffffff;
    background-size: 105px;
    padding: 0px 0 0 0;
}

.suche .spacer img {
	width:100%;
    height: auto;
}
.suche .bezeichnung {
	position: absolute;
	bottom: 26px;
	width: 100%;
}

.suche h3 {
    color: #ffffff;
    font-size: 15px;
    font-weight: 500;
    padding: 6px 8px;
    margin: 0;
}

.suche p {
    color: #ffffff;
	line-height: 18px;
}

.suche:hover {
	transition: all 0.3s ease; 
    border: 1px solid #E77817;
}



.justify li .angebotsbox {text-align: left;}


.angebotsbox h3{color:#ffffff; font-size: 15px; font-weight: 500; padding:0px 8px; margin:0}
.angebotsbox p{color:#424544; padding:4px 0px 12px 0px; margin:0; line-height: 16px}


.hinweisbg .beschreibung {
padding: 80px 80px 0px 270px;
    background-size: 210px;
    min-height: 280px;
}




		
		.galeriebox .touchslider .touchslider-nav {
			text-align: center;
			margin-top: 8px;
			width: 560px;
		}
			
		
		.galeriebox .touchslider .touchslider-item img {
			background-repeat: no-repeat !important; 
			/*background-position: 50% 50% !important; */
			background-size: contain !important;
		}
		
		.galeriebox .beschreibung {padding: 0 25px 0px 0; width: 354px; float: right; overflow: auto; height: 420px;}
		.galeriebox .beschreibung p, .galeriebox .beschreibung li {font-weight: 400; font-size:13px; line-height:19px; color:#3e4548; padding:0px 8px 10px 10px; margin: 0 0 0px 0; text-align: left; display: block;}	
		.galeriebox .beschreibung ul {padding:0; margin: 0; display: inline-block; }
		.galeriebox .beschreibung ul li{list-style:none; background:url(images/li.png) no-repeat 9px 6px; padding:0 0 2px 22px; margin: 0 0 0px 0; text-align: left}
		
		.galeriebox .beschreibung p { padding-bottom: 16px;}	
		.galeriebox .beschreibung p:last-child { padding-bottom: 0px;}	
		.galeriebox .beschreibung ul { padding-bottom: 16px;}	
		.galeriebox .beschreibung ul:last-child { padding-bottom: 0px;}	
		
		.galeriebox .preis p{font-weight: 400; font-size:15px; line-height:19px; color:#e77817; margin: 0 0 0 0; padding: 4px 0px 0px 0px;}
		/*
		.galeriebox .touchslider .touchslider-prev {transition: opacity 0.3s ease; opacity: 0.4; position:absolute; top: 42%; left: 10px; z-index: 9998; background:url(images/bildmenue_bevor.png) no-repeat center center  rgba(255,255,255,0); width: 70px; height: 60px; cursor:pointer}
		.galeriebox .touchslider .touchslider-prev:hover {transition: opacity 0.5s ease; opacity: 1;}
		.galeriebox .touchslider .touchslider-next {transition: opacity 0.3s ease; opacity: 0.4; position:absolute; top: 42%; right: 10px; z-index: 9998; background:url(images/bildmenue_next.png) no-repeat center center  rgba(255,255,255,0); width: 70px; height: 60px; cursor:pointer}
		.galeriebox .touchslider .touchslider-next:hover {transition: opacity 0.5s ease; opacity: 1;}
		*/
		
.maske {
    position: fixed;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    z-index: 10002;
    overflow: hidden;
}
		.maskenavi {position:fixed; left:0px; top:0px; width:100%; height:100%; z-index:10000; overflow:hidden;}
.bgmaske {
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.9);
    display: flex;
    overflow: auto;
}


.angebotslink a {transition: all 0.5s ease; background:url(images/pfeil_link.png) no-repeat right 4px top 6px; background-size:10px 17px; float:right; margin:0px 0 36px 0; padding:4px 18px 4px 0px; display: inline-block; color:#424544; font-weight: 400; text-transform:none; text-decoration:none}
.angebotslink a:hover  {transition: all 0.4s ease;	animation: indicatetextlink 0.20s linear forwards; color:#016756}


#smartnavi  {margin: 0 0 0 0; padding: 0px 24px 28px 24px;  height: 100%; overflow: auto; }
#smartnavi  {height: calc(100% - 106px)}
#smartnavi  ul{padding:0; margin: 0; display: block; clear:both;}
#smartnavi  ul li{list-style:none; background:none; padding:0px; margin:0px; clear:both; display: block;position: relative;}
#smartnavi  ul li:after {content:""}

#smartnavicontent {
	padding: 26px 0 !important;
	width: 100% !important;
}


#smartnavi ul li a {
	transition: all 0.5s ease;
    padding: 5px 10px 5px 10px;
    display: inline-block;
    font-family: 'Barlow Condensed';
    letter-spacing: 1px;
    color: #e5f7f4;
    font-weight: 400;
    font-size: 24px;
    line-height: 28px;
    text-transform: uppercase;
    text-decoration: none;
    opacity: 0.9;
    position: relative;
}

#smartnavi li.aktiv::before {
    content: "";
    height: 26px;
    width: 6px;
    background: #c72035;
    display: block;
    position: absolute;
	top: 4px;
    left: -24px;
    z-index: 1;
}


#smartnavi ul > li > a.bgb::before {
	content: "";
    position: absolute;
    border: 2px solid rgba(255, 255, 255, 0.8);
    padding: 0px 10px 0 10px;
    width: 100%;
    height: 100%;
    box-sizing: border-box;
	top: -1px;
	left: 0px;
}

#smartnavi  ul li a:hover {transition: all 0.3s ease; color:#ffffff; text-decoration:none; opacity: 1;}

#smartnavi  ul li ul{padding:0; margin: 0; display: block; clear:both;}
#smartnavi  ul li ul li{margin:0px; display: block}
#smartnavi  ul li ul li a {
	background: url(images/pfeil_unternavi.png) no-repeat 2px 5px;
    background-size: 10px 15px;
    padding: 0px 0px 5px 16px !important;
    font-weight: 300 !important;
    text-transform: none;
    text-decoration: none;}
#smartnavi  ul li ul li a:hover {color:#ffffff !important;}

#smartnavi  ul li ul li.uumenue{margin: 0px}
#smartnavi  ul li ul li.uumenue a {background:url(images/menue_punkt.png) no-repeat 26px 8px; padding:0px 0px 5px 40px !important; font-weight: 300 !important;}
#smartnavi  ul li ul li.uumenue a:hover {color:#ffffff !important;}

.btn_close {width:40px; cursor:pointer; margin: 0 0 26px 24px}

.hinweisbg .btn_close {
    cursor: pointer;
    position: fixed;
    top: 26px;
    right: 24px;
}

.hinweisbg {
    background: none;
    width: 980px !important;
    margin: 0 auto 0 auto;
    position: relative;
    align-self: center;
}

.hinweisheader {
    position: relative;
    background: none;
    width: 100%;
    padding: 0px 0px 18px 0px;
    display: inline-block;
	z-index: 1;
}

.hinweisbg h1 {
    text-transform: none;
    color: rgba(255,255,255,0.95);
    margin: 0;
    line-height: 40px;
    text-align: left;
    font-weight: 100;
    font-size: 35px;
}

.hinweisbg h2 {
    display: none;
}

.hinweisbox {
    padding: 0px 0px 40px 0px;
    position: relative;
	text-align: center;
	height: auto !important;
}



#facebook .hinweisbg .beschreibung {
    padding: 0px;
}




#smartphonemenue .socialmedia {
	position: relative;
    z-index: 999;
    top: 0px;
    display: block;
    margin: 0 0 0 0px;
    text-align: center;
}

#smartphonemenue .socialmedia [class*="btn-"] {
    background-position-y: 0px;
    margin: 0 6px;
	height: 40px;
    width: 40px;
}




.topnavi .login {background:url(images/login_schloss.png) right 0px no-repeat; padding: 0px 12px 0 0}
.topnavi .login:hover {background:url(images/login_schloss.png) right -16px no-repeat; padding: 0px 12px 0 0}

form .hidden {display:none}



.imagemask {
	position: relative;
}

.imagemask::before {
    content: "";
    width: 100%;
    height: 100%;
    background: linear-gradient(180deg, rgb(72 115 199 / 30%) 0%, rgba(4,34,91,0.0) 100%);
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
}

.angebotsblock .float .vorschaublock.img {
    margin-top: 0;
}


.preiseblock + .preiseblock {
    margin-top: 48px;	
}

.headline {
    font-weight: 100;
    font-size: 42px;
    line-height: 48px;
    text-transform: none;
    color: #198fd2;
    text-align: center;
    padding: 0px;
    margin: 64px 0 12px 0;
}

.pakete {
    display: flex;
    justify-content: space-between;
    padding: 18px 0 24px 0;
}

.paket {
    background: #198fd2;
    flex: 0 0 calc((100% - 120px) / 3);
    padding: 18px 32px 12px 32px;
    color: #ffffff;
    position: relative;
	display: flex;
	flex-direction: column;
}

.paketheader {
    display: flex;
    position: relative;
}

.paketheaderdisplay {
    border-bottom: 1px solid #229fe7;
    padding: 4px 0 0 0;
    margin: 0 0 24px 0;
    display: flex;
    position: relative;
	flex: 1 1 auto;
}

.paketheaderdisplay::after {
	content: "inkl. MwSt";
	font-size: 12px;
	position: absolute;
	text-transform: none;
	font-family: 'Barlow';
	letter-spacing: normal;
	font-weight: 100;
	right: 0;
	bottom: -12px;
}

.paketheadline {
    font-size: 26px;
    line-height: 32px;
    font-weight: 600;
    color: #041c31;
    margin-left: -2px;
}

.paketinfodisplay {
    font-size: 14px;
    line-height: 20px;
    /* font-weight: 300; */
}

.paketpreis .preis {
    font-size: 58px;
    line-height: 58px;
    padding: 0px 0 0px 6px;
}

.paketpreis .preis span {
    font-size: 80%;
    line-height: 80%;
}

.paketpreis {
    flex: 1;
    text-align: right;
    margin-right: -2px;
}

#inhalt .paket ul li {
    color: #ffffff;
}


#inhalt .paket ul.pfeile li {
	background-image: url(images/li_w.png);
}

.paket::after {
    content: "";
    width: 72px;
    height: 72px;
    background: url(images/paket_bronze.png) 0 0 no-repeat;
    position: absolute;
    top: -17px;
    left: -17px;
}

.paket.silber::after {
	background-image: url(images/paket_silber.png);
}

.paket.gold::after {
	background-image: url(images/paket_gold.png);
}

.pakethinweis p {
	text-align: center;
    font-size: 14px;
    color: #ffffff;
    margin: 0 0 36px 0;
}



@media screen and (max-width:1200px)
{
	
	
.vorschaublock .vorschau p {
    font-size: 16px;
	line-height: 22px;
    padding: 0px 18px 12px 18px;
}


	nav > ul > li {
    	margin: 2px 0px 2px 22px;
	}
	
	nav::after {
    	left: 24px;
	}
	
	

	.socialmedia .btn-instagram,
	.socialmedia .btn-whatsapp {
		margin: 0 0 0 8px;
	}
	
	.socialmedia {
		margin: 0 0 0 28px;
	}
	

	.bildergalerie .bildhalter {
    	height: 210px;
	}
}



@media screen and (max-width:1200px)
{
	.technikblock, 
	.cols {
    	display: block;
    	width: 100%;
	}
	
	.hinweisbg {
		width: 95% !important;
	}
	
	#copy p:first-child {
		float: none !important;
		display: block;
		margin: 0 0 12px 0;
		text-align: center;
	}
	
	
	.preiseblock + .preiseblock {
    	margin-top: 0;
	}


	.cols > div,
	.preiseblock .cols > div:first-child,
	.cols.col3 > div {
   		border-left: 0;
   		border-top: 1px solid rgba(135, 204, 255, 0.3);
    	padding: 24px 0;
	}
	
	.cols > div:first-child,
	.cols > div:last-child,
	.cols.col3 > div:first-child,
	.cols.col3 > div:last-child {
    	margin: 0;
	}
	
	.preiseblock:first-child .cols > div:first-child,
	.cols > div:first-child {
    	border: none;
	}
	

	.preiseblock .tarifbox {
		min-height: 248px;
	}
	

	#inhalt .vorschaublock li {
		width: 48%;    
		width: calc((100% - 30px) / 2); 
	}


	.bildergalerie .bildhalter {
    	height: 190px;
	}
	
	.angebotsvorschau > .justify > li {width: 30%}

	.touchslider .touchslider-item img {
   		height: auto;
   		width: 100%;
	}
	
	.touchslider .touchslider-viewport {
	width:auto;overflow:hidden;position:relative;
		}
		.touchslider .touchslider-item {
			height: auto;
			width: auto;
			text-align: center;
			overflow: hidden;
		}
		
		
	
	.galeriebox .touchslider {
			width:100%; overflow:hidden; position:relative; box-sizing: border-box;
		}
	
	.galeriebox .touchslider .touchslider-viewport {
			width:100%; overflow:hidden; position:relative;
		}
		.galeriebox .touchslider .touchslider-item {
			height: auto;
			width: 560px;
			text-align: center;
			overflow: hidden;
		}
		.galeriebox .touchslider .touchslider-item img {
			height: auto;
			width: 100%;
		}
		.galeriebox .touchslider .touchslider-nav {
			width: 100%;
		}
		
	.suche {
    	background-size: 40%;
	}
	
	.footer .block {
		display: block;
		margin: 0 0 18px 0;
	}

	/*.pagefootercontent .socialmedia {
    	display: block;
    	text-align: center;
    	position: relative;
    	z-index: unset;
    	top: 0px;
    	margin: 20px 0 26px 0;
	}*/
	
	.socialmedia [class*="btn-"] {
    	background-position-y: -32px;
		margin: 0 4px;
	}


	
	#footer, #copy {
    	text-align: center;
	}
	
	#pagefooter {
		min-height: 190px;
	}
	
	#copy {
		float: none;
   		margin: 16px 0 0 0;
	}
	
	
	.hinweisbg .beschreibung {
   		padding: 0px 20px 20px 180px;
    	background-size: 160px;
    	min-height: 180px;
	}
	
	/* veranstaltungshimweis Start */
	.veranstaltungshinweis a {
		width: 100%;
		background-position: center;
		bottom: -220px;
		left: 0px;
	}
	
	.pagefootercontent {
    	/*padding: 246px 0px 12px 0px; */
	}	
	/* veranstaltungshimweis Ende */
	


	.drittelbanner {width: 100%}
	.partner .justify > li,
	.sponsoring .justify > li {
   		width:  48%;
	}
	
	.partner .halbbanner .logo {
		padding: 28px 64px;
		height: 160px;
	}
	
	.partner .halbbanner {
    	margin: 0px 0 24px 0;
	}
	
	.angebotsvorschau > .justify > li {width: 48%}
	
	h1 {font-size:34px;  line-height:40px; 
    margin: 36px 0 18px 0;}
	h4 {font-size:15px; color: rgba(66,69,68,1); margin: 28px 0 16px 0}
	
	.angebotsbox .vorschau h3{font-size: 15px; line-height: 20px; margin: 0 0 4px 0}
	
	.suche h3, .suche p {
    	font-size: 14px;
   		 padding: 2px 8px 0px 8px;
	}
	
	.textblock {
	width: auto; }
	
	.textblockcenter #inhalt {
	width: auto;
	margin: auto }
	
	#footernavi ul li {
    	font-size:15px;
		padding:4px 0px 8px 0px;
	}
	
	.socialicons a {
    	font-size: 0px;
    	padding: 0;
    	background: url(images/social_fb_32.png) no-repeat 0px 0px;
		top: 0px;
    	width: 32px;
    	height: 32px;
    	display: block;
    	opacity: 0.3;
	}

	/*
	#inhalt a {animation: indicatelink 0.15s linear forwards; background: url(images/symbol_link.png) -6px 0px no-repeat; background-size: 21px 22px; padding: 0 0 0 13px}
	#inhalt a:hover {animation: indicatelinkhover 0.25s linear forwards}

	#inhalt a[href^="mailto"] {animation:none; background: url(images/symbol_mail.png) -2px -3px no-repeat; background-size: 21px 22px; padding: 0 0 0 20px}
	#inhalt a[href^="mailto"]:hover {animation:none; background: url(images/symbol_mail2.png) -2px -3px no-repeat; background-size: 21px 22px; padding: 0 0 0 20px}

	#inhalt a[target*="blank"] {animation: indicateextern 0.4s linear forwards; background: url(images/symbol_extern.png) -6px -1px no-repeat; background-size: 22px 22px; padding: 0 0 0 14px}
	#inhalt a[target*="blank"]:hover {animation: indicateexternhover 0.25s linear forwards}
*/


	/*#footer  p , #footer2  p {font-weight: 400; font-size:13px; line-height:17px;}*/
	#copy  p , #copy2  p {font-weight: 400; font-size:13px; line-height:17px;}
	
	.bannerblock li {width: 100%}
	.drittelbanner {width: 100%; min-height: 155px; margin: 0 0 0px 0}
	
	
	
	nav, #box {display:none;}
	
	#header {
    	height: 100px;
	}



	#btnmenue {    
	display: inline-block;
    margin: 37px 0 0 8px;
    height: 30px;
    width: 45px;
    background-size: 100%;
	}
	
	#logo {
		margin: 24px 0 0 0px;
	}
	
	.topmenue {
		display: none;
	}
	
	.submenue {
		display: none;
	}
	
	.tel {
 		font-size: 24px;
 		line-height: 28px;
 		font-weight: 300;
 		padding: 11px 16px 10px 54px;
 		margin: 18px 0 0px 0;
 		background-size: 45px 45px;
		height: 50px;
	}
	
	#smarthomebanner .smarthome {
		background: url(images/smarthome.png)  left bottom no-repeat;
		width: 500px;
  		height: 333px;
		background-size: contain;
		position:absolute;
		top:0px;
		right:0px;
		margin: 0;
	}
	
	#smarthomebanner {
		clear: both;
		width: 100%;
		height: 263px;
		background: url(images/bg_banner.gif) center 40px no-repeat;
	}
	#smarthomebanner ul {
		position:relative; top:58px
	}
	
	#smarthomebanner li {line-height: 22px; font-size: 15px; font-weight: 600}
	
	.contentblock {
		padding: 0px 0 28px 0 
	}
	
	.banner-full {
		margin: 0 0 42px 0;
		height: 340px;
	}

	.half1 {width:100%; display:inline-block; vertical-align:top}
	.half2 {width:100%; display:inline-block; vertical-align:top; border:none; padding: 0 0 0 0px}
	
	
	.flex {
		display:-webkit-flex;
		display:flex;
		-webkit-flex-direction: column;
		flex-direction: column;
	}

	.flex .newscenter {
		-webkit-order:2;
		order:2;
		width: 100%;
		margin: 0px 0 0px 0;
		padding: 0px 0 40px 0 
	}

	.flex .textblock {
		-webkit-order:0;
		order:0;
		margin: 0px 0 0px 0;
		padding: 0px 0 26px 0 
	}
	
	.flex .textblockcenter {
		-webkit-order:0;
		order:0;
		margin: 0px 0 0px 0;
		padding: 0px 0 26px 0  }
	

	.footer {
		padding: 0 0 55px 0;
	}


	.booking:not(.all) {
		display: none;
	}
	
	.mobilebuchen {
		display: block;
	}


	.float.left .text {
		padding: 6px 0 6px 36px;
	}
	
	.float.right .text {
		padding: 6px 36px 6px 0;
	}

	.float .text p {
		margin: 1px 0 8px 0
	}
	
	.bildergalerie .bildhalter {
		width: 50%;
		width: calc(50% - 24px);
		height: 240px;
	}
		
	.bannerblock li {width: 100%;}
	.drittelbanner {width: 100%}
	.partner .justify > li,
	.sponsoring .justify > li {
   	    width: 100%;
	}
	.partnerlogos .justify > li {
   	    width: 100%;
	}

	.partner .halbbanner .logo,
	.sponsoring .halbbanner .logo,
	.sponsoring .halbbanner.lc .logo {
		float: none;
		width: 100%;
		padding: 14px 36px;
		margin: 0 18px 0px 0;
	}
	
	.sponsoring .halbbanner .logo {
		height: auto
	}
	
	.sponsoring .halbbanner .logo img {
			width: 100%;
    		height: auto;
   			position: relative;
    		top: 0%;
    		-webkit-transform: translateY(0%);
   			-ms-transform: translateY(0%);
   			 transform: translateY(0%);
	}
	


	.partner .halbbanner .bezeichnung,
	.sponsoring .halbbanner .bezeichnung {
		min-height: 100px;
	}
	
	.partner .halbbanner h2 {
    	font-size: 15px;
    	line-height: 20px;
    	margin: 0 0 2px 0;
	}
	
	
	#smarthomebanner .smarthome {
		position:absolute;
		top:0px;
		right:20px;
		margin: 0;
	}
	
	.angebotsbox {width: 100%;}
	.touchslider.small {width: 100%; float:left; margin: 0 26px 0 0}
	.angebotsbox .vorschau h3{font-size: 17px; line-height: 22px; margin: 0 0 4px 0}
	.angebotsbox .vorschau p{font-size: 16px; line-height: 22px}
	.angebotsbox .pfeil {position:absolute; bottom:16px; right:16px; width:60px;}
	
	.galeriebox .touchslider .touchslider-item img {
   		height: auto;
   		width: 100%;
	}
	
	
	
	.galeriebox .touchslider {
			width:100%; overflow:hidden; position:relative; box-sizing: border-box;
		}
	
	.galeriebox .touchslider .touchslider-viewport {
			width:100%; overflow:hidden; position:relative;
		}
		.galeriebox .touchslider .touchslider-item {
			height: auto;
			width: 560px;
			text-align: center;
			overflow: hidden;
		}
		.galeriebox .touchslider .touchslider-item img {
			height: auto;
			width: 100%;
		}
		.galeriebox .touchslider .touchslider-nav {
			width: 100%;
		}
		
	
	
	form {clear:both; padding:0 0 36px 0; margin: 0 0 52px 0; display: inline-block; width: 100%; position:relative}
	.formbutton {cursor: pointer; float:right; background:url(images/pfeil_formular.png) no-repeat 0 0; background-size: contain; width: auto; height:32px; margin:9px 1px 0 1px; border: 0px; outline:none; font-weight: 800; font-size:15px; padding:4px 0px 0px 38px; color:#7D7A78; }
	
.slogan-display {

	top: -20px;
	left: -40px;
}

.slogan-display .slogan-text {
	top: -17px;
    padding: 0;
}

.slogan h1 {
    font-size: 32px;
    line-height: 16px;
    letter-spacing: 1px;
	margin: 0 19px 0px 0;
    padding: 16px 32px 15px 32px;
}
	
	
	.pakete {
    	flex-direction: column;
    	margin-bottom: -24px;
	}
	
	.paket {
    	margin-bottom: 24px;
		flex-direction: row;
	}
	
	.paket > div {
		flex: 1 1 50%;
		display: block;
	}
	
	.paket .paketcontent {
    	padding-left: 10%;
	}
	
	.paketheader > div {
    	display: flex;
    	flex: none;
    	width: 100%;
		position: relative;
	}

}

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

	.vorschau .angebotsblock .float {
		display: flex;
		margin: 0 0 36px 0;
		flex-direction: column;
	}

	.vorschau .float .vorschaublock.img {
		width: 100%;
		margin: 0 0 4px 0;
		flex: 0 0 auto;
		max-width: 420px;
    	align-self: center;
	}
	
	.vorschau .float.left .text, 
	.vorschau .float.right .text {
    	padding: 12px 0 0 0;
		width: 100%;
		flex: 0 0 auto;
	}
}



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

	.paket {
		flex-direction: column;
	}
	
	.paket > div {
		display: flex;
	}
	
	.paket .paketcontent {
    	padding-left: 0;
	}
	
	
	.statistikblock .justify > li {
    	display: block;
	}
	
	.statistikblock .statistik {
    	margin: 28px auto;
	}
	
	.altershinweis {
		margin: 56px 0 12px 0;
		padding: 12px 12px 12px 18px;
	}


	#inhalt .vorschaublock li {
		width: 100%;
	}
	
	
	.footer .block {
		display: block;
		margin: 0 0 18px 0;
		vertical-align: top;
	}

	.float {
		display: flex;
		margin: 0 0 36px 0;
		flex-direction: column;
	}

.float .kontaktformular {
    width: 100%;
    margin: 0 0 4px 0;
    flex: 0 0 auto;
}

.float .img {
	width: 100%;
	margin: 0 0 4px 0;
	flex: 0 0 auto;
}

.float.left .text,
.float.right .text {
	padding: 12px 0 0 0;
	width: 100%;
	flex: 0 0 auto;
}

.float .text p {
	margin: 1px 0 12px 0
}


.float .img {
	order: 1;	
}
.float .text {
	order: 2;	
}

	.contentblock .bildergalerie {
    	margin: 24px 0px 48px 0px;
	}

	.bildergalerie .bildhalter {
		height: 200px;
	}
	
	
	.galerie-next span, 
	.galerie-last span, 
	.touchslider-prev, 
	.touchslider-next {
		display: none;
	}
	
	.slogan {bottom:23%;}
	
	.partner .halbbanner .logo {
		padding: 28px 36px;
		height: 160px;
	}
	
	
	.partnerlogos .justify > li {
   		 width: 32%;
	}
	
	#smartnavi ul li a {
		font-size: 20px;
    	line-height: 26px;
	}


	.row {
		margin: 28px 0 0 0;
	}

	.row .col {
		display: block;
		width: 100%;
		vertical-align: top;
	}
	.row .col:first-child {
		width: 100%;
		padding: 0;
	}
	
	.contentblock {
		padding: 0px 0 18px 0 
	}
	
	.banner-full {
		margin: 0 0 36px 0;
		height: 280px;
	}
}


@media screen and (max-width:550px)
{
	
	.coronahinweis {
		position: fixed;
		top: 82px;
	}
	body {
		background: linear-gradient(180deg, #0e2a40 10%, #04121f 150%) fixed;
	}
	
	.booking .btn {
		width: 100%;
    	padding: 16px 18px 11px 18px;
	}
	
	#inhalt .btn-mail {
		width: 100%;
    	padding: 12px 18px 7px 18px;
	}
	
	.hotline {
    	font-size: 52px;
	}
	
	.newshinweis {
    	width: 100%;
		padding: 12px 16px 10px 28px;
		top: 0;
		height: 70px;
		overflow: hidden;
		position: fixed;
	}
/*
banner - newshinweis 
*/
/*	#header,
	#headerblende,
	.galerie #struktur,
	.pageinhaltdisplay  {
    	top: 70px;
	}
		
	.coronahinweis {
		position: fixed;
		top: 152px;
	}*/
/*
Ende banner - newshinweis 
*/
	.newshinweis span:not(.zusatz) {
		display: block;
	}

	.newshinweis span.zusatz {
		display: none;
	}
	
	
	.vorschaublock .vorschau .info {
    	bottom: -72%;
	}
	
	.vorschaublock .vorschau .lable {
    	height: 28%;
	}
	
	.vorschaublock .vorschau:hover .lable {
    	height: 20%;
	}
	.vorschaublock .vorschau:hover h2 {
    	padding-top: 12px;
	}
	
	.vorschaublock .spielehinweis .socialmedia div {
		margin: 10px 4px 2px 4px;
		height: 36px;
		width: 36px;
	}
	
	.vorschaublock .spielehinweis p {
		line-height: 22px;
	}
	
	.altershinweis p {
    	padding: 72px 0 0 0;
	}

	.preiseblock .tarifbox {
    	display: flex;
    	flex-direction: column;
	}
	
	.tarifbox .tarif {
		margin: 24px auto 12px auto;
		order: 2;
	}
	
	.beschreibung h2 {
    	margin: 0;
	}



	.drittelbanner {width: 100%}
	.partner .justify > li {
   		width:  48%;
	}
	
	.partner .halbbanner .logo {
		float: none;
		width: 100%;
		padding: 14px 24px;
	}

	.partner .halbbanner .bezeichnung {
		min-height: 100px;
	}
	
	.partner .halbbanner h2 {
    	font-size: 14px;
    	line-height: 18px;
    	margin: 0 0 2px 0;
	}
	
	.partner .halbbanner p {
    	line-height: 18px;
	}
	
	
	.galeriebg h1, .hinweisbg h1 {
		font-size: 24px;
    	line-height: 28px;
	}
	
	.galerieheader, .hinweisheader {
    	padding: 12px 18px 12px 18px;
	}
	
	.galeriebox .beschreibung p, .galeriebox .beschreibung li {
    	padding: 0px 0px 10px 0px;
	}
	
	.hinweisbg .beschreibung {
   		padding: 120px 0px 0px 0px;
    	background-size: 105px;
    	min-height: 1px;
	}


	#smartnavicontent{
		width: 100% !important
	}

	h1 {font-size:24px;  line-height:32px;
    margin: 24px 0 12px 0;}
	
	.angebotsbox .vorschau h3{font-size: 14px; line-height: 19px; margin: 0 0 0px 0}

	#footer, #copy {text-align: center}
	.white-space {/*white-space: nowrap;*/ display: block}
	.white-space::after {content: "";}
	#copy .white-space::after {content: "";}
	
	
	.galerie-last, 
	.galerie-next {
		display: none;
	}

#inhalt a[href^="tel"] {animation: indicateextern 0.4s linear forwards; background: url(images/symbol_tel.png) 20px center no-repeat #5AA72D; background-size: 36px 36px; padding: 20px 26px 20px 58px; color:#ffffff; font-size: 17px; font-weight: 600; border-radius: 50px; margin: 48px 0; display: inline-block; white-space: nowrap;}
#inhalt a[href^="tel"]:hover {animation: indicateexternhover 0.25s linear forwards}


#footernavi  {margin: 0 0 24px 0; padding: 0px 0 16px 0; position: relative}
#footernavi  ul{padding:0; margin: 0; display: block; clear:both;}
#footernavi  ul li{list-style:none; background:none; padding:0px; margin:0px; clear:both; display: block;}
#footernavi  ul li:after {content:""}
#footernavi  ul li a {transition: all 0.5s ease; color: rgba(255,255,255,0.8) !important; padding:0px 0px 5px 0px !important; display: block; font-weight: 600 !important; text-transform:none; text-decoration:none}
#footernavi  ul li a:hover {transition: all 0.3s ease; color:#ffffff !important; text-decoration:none}

#footernavi  ul li ul{padding:0; margin: 0; display: block; clear:both;}
#footernavi  ul li ul li{margin:0px; display: block}
#footernavi  ul li ul li a {
	background: url(images/pfeil_unternavi.png) no-repeat 2px 5px;
    background-size: 10px 15px;
    padding: 0px 0px 5px 16px !important;
    font-weight: 300 !important;
    text-transform: none;
    text-decoration: none;}
#footernavi  ul li ul li a:hover {color:#ffffff !important;}

#footernavi  ul li ul li.uumenue{margin: 0px}
#footernavi  ul li ul li.uumenue a {background:url(images/menue_punkt.png) no-repeat 26px 8px; padding:0px 0px 5px 40px !important; font-weight: 300 !important;}
#footernavi  ul li ul li.uumenue a:hover {color:#ffffff !important;}

#footernavi ul li.static:last-child:after {
    content: "";
}

.socialicons {
    position: absolute;
    right: -1px;
    bottom: 16px;
}

.drittelbanner .pikto_gundstuecke {
	background-size:cover;
	width: 160px; 
	height: 110px;
	margin: 30px auto 10px auto;
}
.drittelbanner:hover .pikto_gundstuecke {
	transition: all 0.2s ease;
	background-size:cover;
}
.drittelbanner .pikto_projekte {
	background-size:cover;
	width: 160px; 
	height: 110px;
	margin: 30px auto 10px auto;
}
.drittelbanner:hover .pikto_projekte {
	transition: all 0.2s ease;
	background-size:cover;
}
.drittelbanner .pikto_kontakt {
	background-size:cover;
	width: 160px; 
	height: 110px;
	margin: 30px auto 10px auto;
}
.drittelbanner:hover .pikto_kontakt {
	transition: all 0.2s ease;
	background-size:cover;
}

.slogan-display,
.contentblock .slogan-display  {
	top: 0px;
	left: -40px;
}

.slogan-display .slogan-text {
	top: -17px;
    padding: 0;
}

.slogan h1 {
    font-size: 24px;
    line-height: 24px;
    letter-spacing: 1px;
    margin: 0 19px 0px 0;
    padding: 10px 30px 10px 30px;
}

.slogan h2 {
    font-size: 13px;
    line-height: 17px;
}


}


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

	.bildergalerie .bildhalter {
		display: block;
		width: 100%;
		width: calc(100% - 10px);
		height: 200px;
		margin-bottom: 12px;
	}
	
	#logo {
    	width: 75%;
	}
	
	#btnmenue {
    	margin: 35px 0 0 8px;
    	height: 28px;
    	width: 42px;
	}
	
	.drittelbanner {width: 100%}
	.partner .justify > li,
	.sponsoring .justify > li {
   		width:  100%;
	}
	
	.partner .halbbanner .logo,
	.sponsoring .halbbanner .logo {
		float: none;
		width: 100%;
		padding: 14px 54px;
	}

	.partner .halbbanner .bezeichnung {
		min-height: 100px;
	}
	
	.partner .halbbanner h2 {
    	font-size: 14px;
    	line-height: 18px;
    	margin: 0 0 2px 0;
	}
	
	.partner .halbbanner p {
    	line-height: 18px;
	}
	
	
	.partnerlogos .justify > li {
   		 width: 48%;
	}
	
	.suche {
    	background-position: center 20%;
	}
	
	.suche .bezeichnung {
    	bottom: 12px;
	}
}


@media screen and (max-width:400px)
{
	#btnmenue {
    	margin: 33px 0 0 8px;
	}
	
	
	.contentblock {
		padding: 0px 0 18px 0 
	}
}


@media screen and (max-width:370px)
{
	
	.tabblock .tabs .lable {
    	padding: 10px 12px 8px 12px;
	}


	.banner-fullblock::after, 
	.galerie .contenthome > div::after, 
	.footer::before {
    	height: 14px;
	}

	#btnmenue {
    	margin: 33px 0 0 8px;
    	height: 22px;
    	width: 33px;
	}
	
	.suche {
    	background-position: center 44px;
	}
	
	.suche .bezeichnung {
    	bottom: 38px;
	}
	
	.galerieheader {
    	padding: 12px 14px 12px 14px;
	}
	
	.galeriebox .beschreibung p, .galeriebox .beschreibung li {
    	padding: 0px 0px 10px 0px;
	}

	.angebotsvorschau > .justify > li {width: 100%}
	#smartnavicontent{
		width: 100% !important
	}
	
	.tel {
 		display: none;
	}
	
	

.slogan-display .slogan-text {
	top: -17px;
    padding: 0;
}

.slogan h1 {
    font-size: 20px;
    line-height: 16px;
    letter-spacing: 1px;
	margin: 0 19px 0px 0;
    padding: 12px 30px 11px 30px;
}

.slogan h2 {
    font-size: 11px;
    line-height: 14px;
}
	
	.banner-full {
		margin: 0 0 28px 0;
    	height: 240px;
	}
}