@font-face {
	font-family: 'Codystar';
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url(/assets/fonts/Codystar.woff2) format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
	font-family: 'Poppins';
	font-style: normal;
	font-weight: 200;
	font-display: swap;
	src: url(/assets/fonts/Poppins200.woff2) format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
	font-family: 'Poppins';
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url(/assets/fonts/Poppins400.woff2) format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
	font-family: 'Poppins';
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url(/assets/fonts/Poppins600.woff2) format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

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

html { background-color: #212b34; background: url('/data/site/toxic-texture.jpg'); color: #eeeeee; cursor: url('/assets/fonts/default.png'), auto; font-family: 'Poppins', sans-serif; font-size: 16px; font-weight: 200; line-height: 1.5; }

h1 { text-align: center; }
h1 img { height: 7rem; margin: 0 auto; }
h1 .topline { display: block; font-family: 'Codystar', sans-serif; font-size: 4.5rem; font-weight: 400; margin: 0 0 1rem; }
h1 .subline { color: #eeeeee; display: block; font-size: 1rem; font-weight: 200; text-transform: uppercase; }
h1 sup { color: #aaaaaa; font-family: 'Poppins', sans-serif; font-weight: 200; }
h2 { display: block; font-size: 2rem; font-weight: 400; margin: 0 0 2rem; text-align: center; }
h3 { font-family: 'Codystar', sans-serif; font-size: 2rem; margin: 0 0 2rem;}
h4 { font-size: 1.25rem; font-weight: 600;margin: 0 0 1.5rem; }
h5 { font-size: 1rem; margin: 0 0 1rem; text-transform: uppercase; }

a { cursor: url('/assets/fonts/click.png'), auto; text-decoration: none; }

hr { border: none; border-bottom: 2px dotted #eeeeee; display: block; margin: 2rem 1.5rem; width: 100%; }
img { display: block; max-width: 100%; }
p { break-inside: avoid; margin: 0 0 1.25rem; }
section {  }
ul { margin: 0 0 1.25rem; }
iframe { border: none; }

header { background: url('/data/site/toxic-back.jpg') no-repeat center center; background-size: cover; }

nav { }
nav ul { display: inline-block; list-style: none; width: auto; }
nav ul:hover li a { color: #999999; transition: all ease 0.5s; }
nav ul li a { color: #212b34; font-size: 0.875rem; font-weight: 600; display: block; letter-spacing: 2px; padding: 1rem 1.5rem 0.5rem; text-transform: uppercase; transition: all ease 0.5s;  }
nav ul li a:after { display: block; content: ""; border-bottom: 3px dotted transparent; margin: 0.125rem auto 0; width: 2rem;  }
nav ul li a:hover, nav ul li.current a { color: #212b34; }
nav ul li.current a:after { border-bottom: 3px dotted #212b34; }

main {}
main p a { border-bottom: 2px dotted #eeeeee; color: #eeeeee; padding: 0 0 0.0875rem; }
main ul { margin-bottom: 1rem; list-style: none; }
main ul li { margin: 0 0 0.5rem 1rem; }
main ul li:before	{ color: #eeeeee; content: "•"; margin: 0 0.5rem 0 -1rem; }

footer { color: #212b34; }
footer a { color: #212b34; font-size: 0.875rem; }
footer p { font-size: 0.875rem;  }
footer img { margin: 0 0 1.25rem; }
footer a:hover { font-weight: 600;}
footer ul { list-style: none;  }
footer ul ul { margin: 0 0 0.5rem; }
footer span { font-size: 0.75rem; font-weight: 600; font-style: italic; text-transform: uppercase; }

.logo { padding: 2.5rem 0; }

.slider img			{ height: 100%; object-fit: cover; width: 100%; }

.gradient { background: linear-gradient( 180deg, #dedede 0%, #eeeeee 56%, #dedede 84% ); }
.flex { width: 100%; display: -ms-flexbox; display: -webkit-box; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; justify-content: start; }
.flx-center { justify-content: center; }
.flx-between { justify-content: space-between; }

.content { margin: 0 auto; max-width: 1200px; width: 96%; }
.box100 { padding: 2rem 1.5rem; width: 100%; }
.box75 { padding: 2rem 1.5rem; width: 75%; }
.box66 { padding: 2rem 1.5rem; width: 66.666%; }
.box50 { padding: 2rem 1.5rem; width: 50%; }
.box33 { padding: 2rem 1.5rem; width: 33.333%; }
.box25 { padding: 2rem 1.5rem; width: 25%; }

.centered { text-align: center; }
.column { column-count: 2; column-gap: 4%; margin: 0 0 1rem; text-align: justify; }
.column img { margin: 0 0 1.5rem; }
.more { display: inline-block; font-size: 0.875rem; font-weight: 600; letter-spacing: 1px; margin: 0.5rem 0; padding: 1rem 1.5rem; text-transform: uppercase; width: auto; }
.note { border: 2px dotted #eeeeee; padding: 1.5rem 1.5rem 0; margin: 1rem 0 ; text-align: center; }

.seal					{ text-align: center; }
.seal a				{ margin: 0 auto; }
.seal img			{ margin: 0 auto; }
.cities				{ background: url('/data/site/toxic-back.jpg') no-repeat center center; background-size: cover; border-top: 5px solid; border-image: linear-gradient(90deg, #dedede 0%, #eeeeee 56%, #dedede 84% ); border-image-slice: 1; display: block; font-family: 'Codystar', sans-serif; font-size: 2rem; font-weight: 400; padding: 1.25rem 0 ; margin: 2rem 0 0 ; text-align: center; }

.start table { border-collapse: collapse; width: 100%; -webkit-column-break-inside: avoid; page-break-inside: avoid; break-inside: avoid; }
.start table tr:nth-child(even) { background: #212b34; }
.start table tr td { border: 1px solid #eeeeee; padding: 0.5rem; vertical-align: top; }
.start table tr td:first-child { width: 30%; }

.booking { padding: 1.5rem 0; }
.booking table { border-collapse: collapse; margin: 0 auto; width: 100%; }
.booking table tr:nth-child(odd) { background: #212b34; }
.booking table tr td { padding: 1rem; }
.booking table tr td:first-child { font-size: 2rem; width: 50%; }
.booking table tr td:last-child { text-align: right; }
.booking .more { background: #eeeeee; color: #212b34; }

.special .entry { color: #212b34; margin: 0 0 2rem; }
.special .more { background: #212b34; color: #eeeeee!important; }
.special > a { border-bottom: 2px dotted #eeeeee; color: #eeeeee; display: inline-block; font-size: 0.875rem; margin: 0 auto; padding: 0 0 0.25rem; text-align: center; }
.start .special .entry p a { border-bottom: 2px dotted #212b34; color: #212b34; display: inline-block; margin: 0 auto; padding: 0 0 0.125rem; text-align: center; }

.services .entry { color: #212b34; margin: 0 0 2rem; }
.services .more { background: #212b34; color: #eeeeee; }

.other .entry { color: #212b34; margin: 0 0 2rem; padding: 1rem; width: 48%; }
.other .entry img { margin: 0 0 1rem; }
.other .more { background: #212b34; color: #eeeeee; }

.news .entry { border-bottom: 2px dotted #eeeeee; margin: 0 0 2rem; }
.news .entry img { cursor: url('/assets/fonts/zoom.png'), auto; width: 100%; }
.news .more { background: #eeeeee; color: #212b34; }

.links .entry { padding: 1rem 0; width: 48%; }
.links .entry a { border-bottom: 2px dotted #eeeeee; color: #eeeeee; font-size: 0.875rem; padding: 0 0 0.25rem; }

.press .entry { border-bottom: 2px dotted #eeeeee; margin: 0 0 2rem; }
.press .entry img { width: 18rem; }
.press .more { background: #eeeeee; color: #212b34; }

.language { top: 2rem; position: fixed; right: 0; }
.language img { border: solid #eeeeee; border-width: 1px 0 1px 1px; width: 2rem; }

.imprint h3 { font-size: 1.5rem; text-align: left; }
.imprint h4 { text-align: left;}

/* KONTAKT */

form { margin: 3rem auto 1rem; width: 80%; }
form input[type='text'],
form input[type='email'],
form input[type='date'],
form input[type='tel'],
form textarea,
form select { background: #ffffff; border: 1px solid #cccccc; border-radius: 3px; color: #555555; font-family: 'Poppins', sans-serif; font-size: 1.125rem; font-weight: 300; margin: 0 0 1.25rem; padding: 1.25rem; width: 100%; }
form input[type='submit'] { border: none; color: #212b34; cursor: pointer; font-family: 'Poppins', sans-serif; font-size: 1.125rem; font-weight: 600; margin: 0 0 1.25rem; padding: 1.5rem; width: 100%; text-transform: uppercase; letter-spacing: 1px;  }
form input[type='submit']:disabled { background: #555555; color: #999999; cursor: default; }
form select { width: 100%; border-color: #cccccc!important; border-radius: 0; border-top-left-radius: 3px; border-bottom-left-radius: 3px; }
form a { font-size: 1rem; }

.block { margin: 0 auto; width: 31.333%; }
.blocklong { margin: 0 auto; width: 98%; }
.fieldapprove { border: 1px solid #eeeeee; border-radius: 3px; text-align: left; margin: 0 0 1.5rem; padding: 1rem; }
.fieldapprove input { margin: 0 0 0; }
.fieldapprove a { border-bottom: 2px dotted #eeeeee; color: #eeeeee; display: inline-block; padding: 0 0 0.0875rem; }
.fielddate table { margin: 0; width: 100%; }
.fielddate table tbody, .fielddate table tr, .fielddate table td { display: block; width: 100%; }
.fielddate select { display: inline-block; width: 32%; }
.captchapic img { background: #212b34; border: none; margin: 0 0 2rem; float: left; width: 100%; }
.captchafield input { height: 70px; float: left; width: 100%; margin: 0 0 2rem 3%; }
.required:after { content: '*'; color: #8c8c8c; float: right; font-size: 1.375rem; line-height: 1rem; padding: 0.375rem 0 0 0.375rem; }

/* Tabs */
label.tab { order: 1; padding: 0.75rem ; color: #999999; cursor: pointer; background: #212b34; transition: background ease 0.2s; text-align: center; width: 50% !important; max-width: 50% !important; text-transform: uppercase; }
.tabcontent { background: transparent; display: none; order: 99; padding: 1rem 1.5rem 1rem 1rem ; position: relative; width: 100%; }
input[type="radio"].tab { display: none; height: 0; width: 0; }
input[type="radio"]:checked.tab  + label { background: linear-gradient( 180deg, #dedede 0%, #eeeeee 56%, #dedede 84% ); color: #212b34; display: block; font-weight: 600; }
input[type="radio"]:checked.tab  + label + .tabcontent { display: block; border-top: 1px solid #dedede; }
input[type="radio"]:not:checked.tab  + label + .tabcontent { display: none; border: none; }

.videos .entry { background: #212b34; margin: 1rem auto; width: 100%; }
.videos video { display: block; margin: 0 auto; max-width: 100%; width: auto; }


.gallery { overflow: auto; padding: 1.5rem 0; }
.gallery a { cursor: url('/assets/fonts/zoom.png'), auto !important; display: block; margin: 0.75rem 1%; width: 18%; }

/* Shine */
.gallery a figure { position: relative; overflow: hidden; }
.gallery a figure::before { position: absolute; top: 0; left: -95%; z-index: 2; display: block; content: ''; width: 50%; height: 100%; background: -webkit-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,.3) 100%); background: linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,.3) 100%); -webkit-transform: skewX(-25deg); transform: skewX(-25deg); }
.gallery a figure:hover::before { -webkit-animation: shine 1s; animation: shine 1s; }

@-webkit-keyframes shine {
	100% {
		left: 125%;
	}
}
@keyframes shine {
	100% {
		left: 125%;
	}
}


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

	nav ul li a { font-size: 0.875rem; padding: 1rem 1rem 0.5rem; }

}


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

	nav ul li { width: 100%; }
	nav ul { border-top: 2px dotted #212b34; }

}


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


	.box33 { padding: 1rem; width: 100%; }
	.box50 { padding: 1rem; width: 100%; }
	.box66 { padding: 1rem; width: 100%; }
	.column { column-count: 1; column-gap: 4%; margin: 0 0 1rem; text-align: justify; }
	.gallery a { width: 31.333%; }
	.videos .entry { width: 100%; }
	.booking table { width: 100%; }
	.booking table tr td:first-child { font-size: 1.25rem; }
	.news .more { text-align: center; width: 100%; }
	.links .entry { width: 100%; }
	.services .more { text-align: center; width: 100%; }
	footer .box25 { width: 50%; }
}

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

	.booking table tr td { display: block; width: 100%; }
	.booking .more { text-align: center; width: 100%; }

	form { width: 100%; }
	.block {width: 100%; }
}

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

	h1 .topline {font-size: 2.5rem; }
	h1 .subline { font-size: 0.875rem; }

	.cities { font-size: 1.25rem; }

	footer .box25 { padding: 1rem; width: 100%; }

}







