/* ====== animations ========= */
@keyframes bganim
{
	0%
	{
		background-position: left 0px top 0%, left 0px top 0%;
	}
	100%
	{
		background-position: left 0px top -400%, left 0px top -100%;
	}
}
@keyframes logoanim
{
	0%
	{
		max-height: 100%;
		opacity: 0;
	}
	50%
	{
		max-height: 100%;
		opacity: 1;
	}
	100%
	{
		max-height: 70%;
	}
}
@keyframes menuanim
{
	0%
	{
		opacity:0;
	}
	50%
	{
		opacity:0;
	}
	100%
	{
		opacity:1;
	}
}

/* === GENERAL === */
html,body
{
	margin:0; padding:0;
	width:100%;
	max-width: 100vw;
	overflow-x: hidden;
	overflow-y:auto;
}
html
{
	background-repeat: repeat-y;
	background-size: contain;
}
body
{
	background-repeat: no-repeat;
	background-size: cover;
	background-attachment: fixed;
	background-position: center;
}

.desktop 	{	display: none;		}
.mobile 	{	display: inherit;	}
.shown 		{	opacity:1;	}
.hidden		{	opacity:0;	}

/* top-bar */
.top-bar
{
	color:#515151;
	width:100%;
	box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.6);
}
.top-bar img
{
	margin:10px auto;
	float:none;
	background-color: #69224B;
	border: solid 2px #69224B;
	display: block;
	max-width: 85vw;
}
.top-bar img.icon
{
	display: inline;
	background: none;
	border: none;
	margin:0px 10px 0px 15px;
	width:24px; height: 24px;
	line-height: 36px;
	vertical-align: middle;
}
.top-bar .info .telephone img.icon
{
	vertical-align: text-bottom;
}
.top-bar h1
{
	margin: 20px auto;
	font-size: 22px;
	text-align: center;
	border-bottom: solid 1px #CCC;
	padding-bottom: 10px;
/*	width:90%;*/
}
.top-bar h1 span
{
	display: block;
	font-size: 34px;
}
.top-bar .info
{
	padding:0 0 20px 0;
	margin:0;
	vertical-align: middle;
	font-size: 16px; line-height: 36px;
	border-bottom: solid 1px #CCC;
}
.top-bar .info span
{
	display: block;
}

/* menu */
#menu, .top-bar
{
	background-color: white;
	padding:10px;
	z-index: 10;
}
#menu
{
	width:100%;
}
#menu a
{
	color:#515151;
	text-decoration: none;
	margin:10px;
	padding-bottom: 5px;
	transition:0s;
	font-size: 18px;
	display: block;
	border-bottom: 2px solid rgba(139,79,112,0.00);
}
#menu a.desktop {display: none;}
#menu a:hover
{
	color:#69224B;
}

/* white pane */
.white_pane
{
	background-color: white;
	padding: 0;
	margin: auto;
}
.white_pane article
{
	text-align: justify;
}
.white_pane article p
{
	padding: 0 20px;	
	font-size: 20px;
}
.white_pane h2
{
	font-size: 24px;
	margin: 0px 0px 10px 0px;
	padding:20px;
	color: #702549;
	text-align: center;
}
.white_pane h3
{
	margin: 0px 20px;
}
.white_pane img
{
	z-index:1;
	width:100%; height:100%;
	margin: 0; padding: 0;
}
.white_pane iframe
{
	border:none;
	width:100%;
	margin:0;
	padding:0;
}
.white_pane #map_cookieprompt
{
	text-align: center;
	color: #8B4F70;
	margin:5px;
	font-size: 14px;
	font-weight: normal;
}
.white_pane img.main
{
	display:block;
	margin:0 auto;
}
.white_pane img.mini
{
	dispaly:none;
	float:left;
	margin: 20px;
}
.white_pane img.icon
{
	background: none;
	border: none;
	margin:0px 10px 0px 15px;
	width:30px; height: 30px;
	line-height: 36px;
	vertical-align: middle;
	box-shadow: none;
	border-radius: 0px;
}
.white_pane .info *
{
	margin:10px;
	line-height: 36px;
}
.white_pane .info .telephone img.icon
{
	vertical-align: baseline;
}
.white_pane .item
{
	clear: both;
	margin:20px; padding:20px;
}
.white_pane .item p
{
	min-height: 140px;
}
.white_pane .signature
{
	text-align: right;
}
.white_pane ul
{
	line-height: 20px;
	list-style: none;
	padding:0px;
	margin: 20px 20px 40px 20px;
}
.white_pane ul li
{
	padding:0px 0px 0px 40px;
	margin: 0px 10px 20px 0px;
	background-image: url("../images/logo/logo_mini.svg");
	background-position: left top;
	background-repeat: no-repeat;
	background-size: 26px;
	min-height: 26px;
	text-align: left;
}
.white_pane ul strong
{
	padding:0; margin:0;
	font-weight: bold;
}

/* section */
.section
{
	width:100%;
	padding:0;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	font-size: 20px;
	color:#515151;
	text-align: center;
}

.section h2
{
	color:white; background-color: #69224B;
	font-weight: normal;
	font-size: 36px;
	font-variant: small-caps;
	font-family: "Helvetica Neue", Helvetica, Arial, "sans-serif";
}
.section .stopper
{
	display: none;
}
.section img.inter
{
	width:100%;
}

/* GLOWNA */
#glowna
{
	position:relative;
	z-index: 0;
}
#glowna img
{
	position: absolute;
	left:0; right: 0;
	top:0;
	margin:auto;
	max-height: 80%;
	max-width: 80%;
}
#glowna #logo_wrapper
{
	position:absolute;
	max-height: 60%;
	top:0; bottom:0;
	left:0; right:0;
	margin:auto;
}
#glowna #logo_wrapper #menu2
{
	position: absolute;
	left:0; right:0;
	bottom:0;
}
#glowna #logo_wrapper #menu2 a
{
	text-decoration: none;
	color: rgba(139,79,112,0.72);
	font-size: 26px;
	display: inline-block;
	margin:18px 26px;
	font-variant: small-caps;
	letter-spacing: 2px;
	opacity:0;
	transition:0.8s;
}
#glowna #logo_wrapper #menu2 a:hover
{
	transform:scale(1.15);
	-moz-transform:scale(1.15);
	-o-transform:scale(1.15);
	-webkit-transform:scale(1.15);
	color: rgba(105,34,75,1.00);
}

/* cookie box - mobile */
#cookie_box
{
	
}

/* === DESKTOP === */
@media all and (min-width:1024px)
{
	.desktop 	{	display:inherit;	}
	.mobile 	{	display: none;		}
	html
	{
		background-image: url("../images/bg/bg_layer2.png"), url("../images/bg/bg_layer1.jpg");
	}
	.top-bar
	{
		position:fixed;
		top:0;
	}
	.top-bar img
	{
		max-height: 32px;
		margin:0;
		display: inline-block;
	}
	.top-bar h1
	{
		font-size: 18px;
		font-weight: 100;
		font-variant: small-caps;
		height: 36px;
		line-height: 36px;
		margin: 0 10px;
		display: inline-block;
		vertical-align: top;
		border:none;
		width: auto;
		padding:0;
	}
	.top-bar h1 span
	{
		display: inline;
		border:none;
		letter-spacing: 2px;
		font-size: 24px;
	}
	.top-bar .info
	{
		float:right;
		height: auto;
		margin: 0 20px;
		padding:0;
		border:none;
	}
	.top-bar .info span
	{
		display: inline;
	}
	#menu
	{
		position:fixed;
		bottom:0;
		font-size: 16px;
		line-height: 36px;
		box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.6);
	}
	#menu a, #menu a.desktop
	{
		display:inline;
	}
	#menu a.active
	{
		transition:1s;
		color:#69224B;
		border-bottom: 2px solid rgba(139,79,112,1.00);
	}
	/* section */
	.a,.b,.c,.d {min-height: 100vh;}
	.section.a {background-image: url("../images/bg/a.png")}
	.section.b {background-image: url("../images/bg/b.png")}
	.section.c {background-image: url("../images/bg/c.png")}
	.section.d {background-image: url("../images/bg/d.png")}
	.section .stopper
	{
		width:100px;
		margin:20px auto;
		border-bottom: solid 1px #ccc;
		display: block;
	}
	
	/* white pane */
	.white_pane
	{
		background: none;
	}
	.white_pane article
	{
		text-align: justify;
		padding:20px; margin:auto;
		max-width: 960px;
	}
	.white_pane article p
	{
		padding: 0 20px;
		color: #924d6f;
		font-variant: normal;
		font-style: italic;
	}
	.white_pane h2
	{
		font-size: 50px;
		color:#69224B;
		background-color: inherit;
	}
	.white_pane img, iframe
	{
		z-index:1;
		margin: 0; padding: 0;
		max-width: 950px;
		border:solid 5px white;
		box-shadow: 0px 3px 5px black;
		border-radius: 15px;
	}
	.white_pane iframe
	{
		border:solid 5px white;
	}
	.white_pane img.mini
	{
		float:left;
		max-width: 200px;
		border-radius: 200px;
	}
	.white_pane #map_cookieprompt
	{
		font-size: 20px;
	}
	
	/* info & map */
	#lower_info
	{
		display: flex;
		margin:0 5%;
	}
	#lower_info .flexed
	{
		flex: 1;
	}
	#kontakt
	{
		margin-bottom: 60px;
	}
	
	/* cookie box - desktop */
	#cookie_box
	{
		
	}
}

/* === HIGH END === */
@media all and (min-width:1400px)
{
	html
	{
		animation: bganim 3200s linear infinite;
		animation-delay: 0s;
	}
}

/* === Additional querries === */
@media all and (min-width:1024px) and (max-width:1400px)
{
	.top-bar .info .hours {display: none;}
	.top-bar .info .address {display: none;}
}