/* CSS Dokumant */


@import url('/css/styleswitcher.css');
@import url('/css/navigation.css');
@import url('/css/font-awesome.min.css');
@import url('/css/slick.css');
@import url('/css/slick-theme.css');
@import url('/css/lightcase.css');
@import url('/css/overlay.css');

@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  src: url(/fonts/Roboto400.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: 'Roboto Condensed';
  font-style: normal;
  font-weight: 400;
  src: url(/fonts/RobotoCondensed400.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: 'Rouge Script';
  font-style: normal;
  font-weight: 400;
  src: url(/fonts/RougeScript.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; box-sizing: border-box!important; -webkit-box-sizing: border-box!important; outline: none; }
::selection { background: #68318c; color: #ddd; /* WebKit/Blink Browsers */ }
::-moz-selection { background: #68318c; color: #ddd; /* Gecko Browsers */ }

html { background: #212024; color: #ddd; font-family: 'Roboto', sans-serif; font-size: 16px; line-height: 1.5; }
body { position: relative; }

h1 { color: #ffffff; font-family: 'Rouge Script'; font-size: 7rem; font-weight: normal; line-height: 1.5; margin-bottom: 2rem; text-shadow: 1px 1px 3px #000; }
h1:after { border-top: 3px solid; content:" "; display: block; margin: 0 auto; max-width: 400px; box-shadow: 0px 0px 3px #000; width: 50%; }
h2 { color: #ddd; font-family: 'Rouge Script'; font-size: 4rem; font-weight: normal; letter-spacing: 1px; margin-bottom: 3rem; text-align: center; }
h2:after { border-top: 2px solid; content:" "; display: block; margin: 0 auto; width: 30%; }
h3 { font-size: 1.25rem; margin-bottom: 1.5rem; }
h4 { font-family: 'Roboto Condensed', sans-serif; font-size: 1.25rem; font-weight: normal; margin-bottom: 0.75rem; text-transform: uppercase; }
a, a:link, a:visited { color: #eee; display: block; text-decoration: none; }
p { margin-bottom: 1rem; page-break-inside: avoid; }
i { line-height: 0.5!important; display: block; }
ul { margin-bottom: 1.5rem; }
img { display: block; max-width: 100%; }

.content { margin: 0 auto; max-width: 1200px; width: 96%; }
.flex { 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; }
.c15 { padding: 1.5rem 2%; width: 15%; }
.c25 { padding: 1.5rem 2%; width: 25%; }
.c33 { padding: 1.5rem 2%; width: 33.333%; }
.c33 img { display: block; width: 100%; }
.c66 { padding: 1.5rem 2%; width: 66.666%; }
.c75 { padding: 1.5rem 2%; width: 75%; }
.c100 { padding: 1.5rem 2%; width: 100%; }
.col:nth-child(1) { padding: 0 1rem; width: 45%; }
.col:nth-child(2) { padding: 0 1rem; width: 55%; }

#header { height: 100vh; position: relative; text-align: center; }
#header .enter { bottom: 3rem; position: absolute; right: 3rem;  text-align: center; }
#header .enter p { color: #ffffff; text-shadow: 1px 1px 3px #000; text-transform: uppercase; }
#header .language a { border: 1px solid #fff; position: absolute; bottom: 1rem; left: 1rem; width: 3rem; }

#nav { background: #552873; font-family: 'Roboto Condensed', sans-serif; position: relative; width: 100%; z-index: 999; left: 0; right: 0; }
#nav .desktop { margin: 0; list-style: none; text-align: center; display: -ms-flexbox; display: -webkit-box; display: -webkit-flex; display: flex; justify-content: center; -webkit-justify-content: center; }
#nav .desktop li a { padding: 1.75rem 2rem; text-transform: uppercase; transition: .5s ease all; }
#nav .desktop li a:hover { background: #552873; transition: .5s ease all; }
#nav .mobile { display: none; }

#footer { background: #552873; padding: 2rem 0; text-align: center; }
#footer a { display: block; padding: 0.25rem; }
#footer a:hover { color: #6c6273; }

.intro { height: 100%; overflow: hidden; width: 100%; }
.intro img { height: 100%; }

.news { background: #6c6273; padding: 1rem 0; }
.news .entry { margin: 0 auto; padding: 1rem; text-align: center; width: 70%; }


.about { background: #212024; padding: 6rem 0; }
.about ul { 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; }
.about ul li { font-size: 1.1rem; list-style: none; margin: 0.5rem 1%; text-align: left; width: 48%; }
.about ul li:before { color: #6c6273; content: "\f0da"; font-family: FontAwesome; margin-right: 0.5rem; } 

.domizil { background: #6c6273; padding: 6rem 0; }
.domizil .thumb { display: block; width: 31.333%; margin: 1rem 1%; overflow: hidden; position: relative; }
.domizil .thumb .details { background: rgba(85,40,115,0.8); bottom: -7rem ; padding: 0.5rem;  position: absolute; text-align: center; transition: 0.5s all ease; width: 100%; }
.domizil .thumb:hover .details { bottom: -1rem ; transition: 0.5s all ease; }
.domizil .thumb:hover .first img { transform: scale(1.5) rotate(5deg); transition: 0.5s all ease; }
.domizil .first img { display: block; transition: 0.5s all ease; width: 100%; }

.wrapper  {  background: #212024; padding: 1rem 0 3rem; }
.room { padding: 1rem ; }
.domizil ul { list-style: none; }
.domizil ul li { margin-bottom: 0.5rem; }
.slider { display: block; margin: 0 auto; width: 90%; }
.slick-dots li button:before { color: #552873; }

.gallery { background: #212024; padding: 6rem 0; }
.gallery .thumb { display: block; width: 31.333%; margin: 1rem 1%; overflow: hidden; position: relative; }
.gallery .thumb .details { background: rgba(85,40,115,0.8); bottom: -7rem ; padding: 0.5rem;  position: absolute; text-align: center; transition: 0.5s all ease; width: 100%; }
.gallery .thumb:hover .details { bottom: -1rem ; transition: 0.5s all ease; }
.gallery .thumb:hover .first img { transform: scale(1.5) rotate(5deg); transition: 0.5s all ease; }
.gallery .first img { display: block; transition: 0.5s all ease; width: 100%; }
.gallery .fifth				{ display: block; width: 18%; margin: 1rem 1%; overflow: hidden; position: relative; }

.video { display: block; margin: 4rem auto 0; width: 50%; }
video { width: 98%; margin: 0 1% ; }

.stories { background: #212024; padding: 6rem 0; }
.stories .entry { text-align: justify; }
.stories .story { max-width: 700px; width: 70%;}
.back { background: #552873; display: block; margin: 2rem auto; padding: 1rem 1.5rem; text-align: center; }

.dates { background: rgba(85,40,115,0.8); border: none; border-collapse: collapse; font-family: 'Roboto Condensed', sans-serif; font-size: 1.25rem; margin: 0 1% 2rem; text-align: center; width: 31.333%; }
.dates td { height: 2.5rem; vertical-align: middle; }
.dates tr:nth-child(odd) {  text-transform: uppercase; }
.dates tr:nth-child(even) { background: #212024; }
.arrow { display: block; margin: 0 auto; }
.arrow:before { background: #212024; content: " "; display: block; height: 1.25rem; margin: 0 auto; transform: skewX(30deg); width: 1rem; }
.arrow:after { background: #212024; content: " "; display: block; height: 1.25rem; margin: 0 auto; transform: skewX(-30deg); width: 1rem; }

.social { background: #6c6273; padding: 2rem 0; text-align: center; }
.social p { font-family: 'Rouge Script', sans-serif; font-size: 3rem; letter-spacing: 1px; margin: 0; }
.social a { display: inline-block; }
.social i { font-size: 2.5rem; margin: 1rem; }

.appointment { background: url(/img/site/jay-back-03.jpg) no-repeat top center; background-attachment: fixed; background-size: cover; padding: 6rem 0;  }

.imprint { background: #212024; color: #ffffff; overflow: auto; }
.imprint p { font-size: 0.825rem; }
.imprint a { display: inline-block; }
iframe.piwik      { border: none; height: 150px; width: 100%; }

.contact { background: #6c6273; padding: 6rem 0;  }
.fieldlong input, .fieldlong textarea { border: none; display: block; font-family: 'Roboto Condensed', sans-serif; font-size: 1.125rem; margin: 0.5rem auto; padding: 1rem 2%; max-width: 700px; width: 80%; }
.fieldapprove { margin: 1rem auto; max-width: 700px; width: 80%; }
.captchapic img { display: block; margin: 0.5rem auto; max-width: 700px; width: 80%; }
.captchafield input { border: none; display: block; font-family: 'Roboto Condensed', sans-serif; font-size: 1.125rem; margin: 0.5rem auto; padding: 1rem 2%; max-width: 700px; width: 80%; }
.buttonfield input { background: #552873; border: none; color: #ddd; cursor: pointer; display: block; font-family: 'Roboto Condensed', sans-serif; font-size: 1.5rem; margin: 0.5rem auto; padding: 1rem 2%; text-transform: uppercase; max-width: 700px; width: 80%; }
.buttonfield input:disabled { background: #888888; color: #dddddd; cursor: default; }

.links { background: #212024; padding: 6rem 0; text-align: center; }
.links .centered img { margin: 0 auto; max-width: 100%; height: auto; }
.tab { overflow: hidden; display: -ms-flexbox; display: -webkit-box; display: -webkit-flex; display: flex; justify-content: center; -webkit-justify-content: center; padding: 1rem; }
.tab a { background-color: #6c6273; border: none; color: #DDDDDD; font-family: 'Roboto Condensed', sans-serif; font-size: 1rem; outline: none; cursor: pointer; padding: 0.5rem 1rem; transition: 0.3s; }
.tab a:hover { background: #552873; }
.tab a.active { background: #552873; }
.tabcontent { display: none; margin: 2rem 0; padding: 1rem 0.5rem; }
.tabcontent p { }
.tabcontent a { color: #6c6273; display: inline-block; font-size: 0.8rem; margin-bottom: 0.5rem; }
.tabcontent a:hover { color: #552873; }
.tabcontent img { margin: 0 auto 0.325rem; }

.columns { margin-bottom: 2rem; -webkit-column-count: 2; -moz-column-count: 2; column-count: 2; -webkit-column-gap: 2rem; -moz-column-gap: 2rem; column-gap: 2rem; text-align: justify; padding: 1rem; }
.centered { text-align: center; }
.info { background: #a20a0a; color: #ffffff; font-size: 1.5rem; padding: 1rem 2rem; position: absolute; left: 0 ; top: 4rem; text-transform: uppercase; z-index: 9999; }
.note { background: rgba(85,40,115,0.8); margin: 2rem 1%; overflow: auto; padding: 1rem 2% 0; text-align: center; width: 98%; }
.small, .small p { font-size: 1rem; }
.sticky { position: fixed!important; top: 0; transition: 1s all ease; }
.gap { margin-top: 80px; }


@-webkit-keyframes marquee { 0% { text-indent: 0% } 100% { text-indent: -150% } }
@keyframes marquee { 0%   { text-indent: 0% } 100% { text-indent: -150% } }
.marquee { width: 65%; margin: 0 auto ; padding: 10px; overflow: hidden; white-space: nowrap; color: #efefef; animation: marquee 17s linear infinite; -webkit-animation: marquee 17s linear infinite; -webkit-animation-delay: 2s; /* Chrome, Safari, Opera */
	animation-delay: 3s;  }
.marquee:hover { animation-play-state: paused; -webkit-animation-play-state: paused; }	
.marquee .date { margin-left: 10px; }


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

	.dates { width: 48%; }
}

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

	#nav .desktop li a { padding: 1rem 1.25rem }
	.about ul { margin-left: 1rem; }
	.about ul li { width: 31.333%; }
}

@media screen and (orientation: portrait) and (max-width: 960px) {

#header { height: 30vh!important; }
#header .slick-slider, #header .slick-slider img { height: 100%; overflow: hidden; }
}


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

	h1 { font-size: 2rem; margin-bottom: 0.75rem; }
	h1:after { border-top: 1px solid; }
	#header .enter { bottom: 0rem; right: 1rem; }
	#header .enter p { font-size: 0.825rem; }

	#nav .mobile { list-style: none; text-align: center; display: -ms-flexbox; display: -webkit-box; display: -webkit-flex; display: flex; justify-content: space-evenly; margin: 0; }
	#nav .mobile li { padding: 1rem 1%; text-transform: uppercase; transition: .5s ease all; width: 16.666% }
	#nav .mobile li:hover { background: #212024; transition: .5s ease all; }
	#nav .desktop { display: none; }
	.about, .gallery, .stories, .domizil, .contact, .links { padding: 2rem 0; }
	.about ul li { width: 48%; }
	.stories .c33 { width: 48%; }
	.col { width: 98%!important; }
	.col img { margin-bottom: 1rem; }
	.columns { margin-bottom: 1rem; -webkit-column-count: 1; -moz-column-count: 1; column-count: 1; }
	.news .entry p { font-size: 1rem; margin: 0; }
	.gap { margin-top: 56px; }
	.gallery .thumb { width: 48%;  }
	.gallery .thumb .details { bottom: 0rem ; }
	.gallery .thumb:hover .first img { transform: scale(1) rotate(0deg); }
	.dates { width: 98%; }
}

@media screen and (max-width: 560px) {
	
	.stories .c33 { width: 98%; }
	.gallery .thumb { width: 98%; }
	.tab { overflow: hidden; display: -ms-flexbox; display: -webkit-box; display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; justify-content: center; }
	.tab a { width: 50%; }
	.tabcontent img { display: block; width: 100%; }
}

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

	.about ul li { width: 98%; }
}

@media screen and (-webkit-min-device-pixel-ratio:0) {
	#header, .news, .appointment { background-attachment: scroll; }
}


/* Animation*/

@-webkit-keyframes arrow-jump {
	0%   { opacity: 0;}
	100% { opacity: 1; -webkit-transform: translateY(10px); -moz-transform: translateY(10px); -0-transform: translateY(10px); transform: translateY(10px); } 

}

