/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/

/*html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}*/
/* HTML5 display-role reset for older browsers */
/*article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}*/
/*
 ██████╗ ███████╗███╗   ██╗███████╗██████╗  █████╗ ██╗     
██╔════╝ ██╔════╝████╗  ██║██╔════╝██╔══██╗██╔══██╗██║     
██║  ███╗█████╗  ██╔██╗ ██║█████╗  ██████╔╝███████║██║     
██║   ██║██╔══╝  ██║╚██╗██║██╔══╝  ██╔══██╗██╔══██║██║     
╚██████╔╝███████╗██║ ╚████║███████╗██║  ██║██║  ██║███████╗
 ╚═════╝ ╚══════╝╚═╝  ╚═══╝╚══════╝╚═╝  ╚═╝╚═╝  ╚═╝╚══════╝*/

*,
*::after,
*::before {
	box-sizing: border-box;
}

html {
	font-size: 16px;
}

h2{
	font-size: 16px;
}

body {
	font-family: 'Atma', cursive;
	margin: 0;
	padding: 0;
}

a {
	text-decoration: none;
	color: #b67929;
	font-weight: 600;
}

a:hover, a:active{
	color: #5b3c14;
}

#anmeldung button{
	background: #eed5b7;
	color: #000;
	font-size: 17px;
	font-family: 'Atma', cursive;
	font-weight: 600;
	border-radius: 10px;
	padding:10px;
}






/*
██████╗ ███████╗███████╗██████╗  ██████╗ ███╗   ██╗███████╗██╗██╗   ██╗███████╗
██╔══██╗██╔════╝██╔════╝██╔══██╗██╔═══██╗████╗  ██║██╔════╝██║██║   ██║██╔════╝
██████╔╝█████╗  ███████╗██████╔╝██║   ██║██╔██╗ ██║███████╗██║██║   ██║█████╗  
██╔══██╗██╔══╝  ╚════██║██╔═══╝ ██║   ██║██║╚██╗██║╚════██║██║╚██╗ ██╔╝██╔══╝  
██║  ██║███████╗███████║██║     ╚██████╔╝██║ ╚████║███████║██║ ╚████╔╝ ███████╗
╚═╝  ╚═╝╚══════╝╚══════╝╚═╝      ╚═════╝ ╚═╝  ╚═══╝╚══════╝╚═╝  ╚═══╝  ╚══════╝*/


.embed-responsive-16by9::before {
	padding-top: 56.25%;
}
.embed-responsive::before {
	display: block;
	content: "";
}

.embed-responsive {
	position: relative;
	display: block;
	width: 100%;
	padding: 0;
	overflow: hidden;
}

.embed-responsive .embed-responsive-item,
.embed-responsive embed,
.embed-responsive iframe,
.embed-responsive object,
.embed-responsive video {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 100%;
	border: 0;
}


.responsive {
	max-width: 100%;
}







/*

https://colorpalettes.net/color-palette-4031/
#277647
#b4cc4e
#ffc600
#853a76
#4b0c3b 
*/

/*
██╗  ██╗███████╗ █████╗ ██████╗ ███████╗██████╗ 
██║  ██║██╔════╝██╔══██╗██╔══██╗██╔════╝██╔══██╗
███████║█████╗  ███████║██║  ██║█████╗  ██████╔╝
██╔══██║██╔══╝  ██╔══██║██║  ██║██╔══╝  ██╔══██╗
██║  ██║███████╗██║  ██║██████╔╝███████╗██║  ██║
╚═╝  ╚═╝╚══════╝╚═╝  ╚═╝╚═════╝ ╚══════╝╚═╝  ╚═╝
                                                */


header {
	/*display: flex;
	text-align: center;
	justify-content: center;*/
	/*background: #ffc600;*/
	background-color: #eed5b7;
	color: #000;
	text-align: center;
	position: relative;
	padding-top: 15px;
	padding-bottom: 0px;
	padding-right: 0px;
	padding-left: 0px;
	border-bottom: 15px solid #b67929;
	
}


/*
███╗   ██╗ █████╗ ██╗   ██╗
████╗  ██║██╔══██╗██║   ██║
██╔██╗ ██║███████║██║   ██║
██║╚██╗██║██╔══██║╚██╗ ██╔╝
██║ ╚████║██║  ██║ ╚████╔╝ 
╚═╝  ╚═══╝╚═╝  ╚═╝  ╚═══╝  
                           */


/*nav#nav {}
nav#nav > ul {}
nav#nav > ul li {}
nav#nav > ul li a {}
nav#nav > a {}*/

#nav {
 	position: relative;
  	padding: 0px;
	margin: 0px;
	font-size: 22px;
	background-color: #b67929;
}


#nav ul {
	padding: 0px;
	margin: 0px;
}

#nav li {
	display: block;
	padding-left: 10px;
	padding-right: 10px
}

#nav li.desktop {
	display: none;
}

#nav li a:active, #nav li a:focus  {
	background-color: #5b3c14;
	color: #eed5b7;
}


#nav.shownav li.desktop {
	display: block;
}

#nav a{
	color:	#000;	
	padding: 14px 16px;
  	text-decoration: none;
  	font-size: 17px;
  	display: block;
}


#nav a.icon {
  display: block;
  position: absolute;
  right: 0;
  top: 0;
 }







/*
███╗   ███╗ █████╗ ██╗███╗   ██╗
████╗ ████║██╔══██╗██║████╗  ██║
██╔████╔██║███████║██║██╔██╗ ██║
██║╚██╔╝██║██╔══██║██║██║╚██╗██║
██║ ╚═╝ ██║██║  ██║██║██║ ╚████║
╚═╝     ╚═╝╚═╝  ╚═╝╚═╝╚═╝  ╚═══╝
                                */

/* Diese Selektoren adressieren dasselbe Element 
section[id="main"],
section#main,
#main {}*/

#main {
	width: 100%;
	display: flex;
	justify-content: center;
}


#main article {
	width: 100%;
	max-width: 600px;
	text-align: center;
	margin: 1.5rem;
	padding: 2.5rem;
	background: white;
	border-radius: 5px;
}


#main article h1 {
	margin-top: 0;
	padding-top: 0;
}



.no_style {
	margin: 0;
	padding: 0;
	list-style-type: none;
}

.no_style li {
	display: inline-block;
}

figcaption{
	font-style: italic;
}


/*
███████╗ ██████╗  ██████╗ ████████╗███████╗██████╗ 
██╔════╝██╔═══██╗██╔═══██╗╚══██╔══╝██╔════╝██╔══██╗
█████╗  ██║   ██║██║   ██║   ██║   █████╗  ██████╔╝
██╔══╝  ██║   ██║██║   ██║   ██║   ██╔══╝  ██╔══██╗
██║     ╚██████╔╝╚██████╔╝   ██║   ███████╗██║  ██║
╚═╝      ╚═════╝  ╚═════╝    ╚═╝   ╚══════╝╚═╝  ╚═╝
*/
footer {
	/*display: flex;
	text-align: center;
	justify-content: center;*/
	text-align: center;
	background: #3c0407;
	padding: 1.125rem;
	border-top: 15px solid #b67929;
	color: #eed5b7;
}

.foot li{
	display: inline-block;
	padding-left: 10px;
	padding-right: 10px;
}






/*
██████╗ ███████╗███████╗██╗  ██╗████████╗ ██████╗ ██████╗     ███████╗██████╗ ███████╗ ██████╗██╗ █████╗ ██╗     
██╔══██╗██╔════╝██╔════╝██║ ██╔╝╚══██╔══╝██╔═══██╗██╔══██╗    ██╔════╝██╔══██╗██╔════╝██╔════╝██║██╔══██╗██║     
██║  ██║█████╗  ███████╗█████╔╝    ██║   ██║   ██║██████╔╝    ███████╗██████╔╝█████╗  ██║     ██║███████║██║     
██║  ██║██╔══╝  ╚════██║██╔═██╗    ██║   ██║   ██║██╔═══╝     ╚════██║██╔═══╝ ██╔══╝  ██║     ██║██╔══██║██║     
██████╔╝███████╗███████║██║  ██╗   ██║   ╚██████╔╝██║         ███████║██║     ███████╗╚██████╗██║██║  ██║███████╗
╚═════╝ ╚══════╝╚══════╝╚═╝  ╚═╝   ╚═╝    ╚═════╝ ╚═╝         ╚══════╝╚═╝     ╚══════╝ ╚═════╝╚═╝╚═╝  ╚═╝╚══════╝
*/


@media all and (min-width: 600px) {
	#nav {
		background-color: #eed5b7 ;
		display: block !important;
	}
	
	#nav li {
		display: inline-block !important;
	}

	#nav li.desktop {
		display: inline-block !important;
	}

	#nav li.home {
 		background-color: #eed5b7 !important;
 	}

	#nav a.active, #nav a:hover {
		color: #5b3c14 !important;
	}

	/*{
		color: #000;
		background-color: #eed5b7 !important;
	}*/

	#nav a:active, #nav a:focus {
		background-color: #5b3c14 !important;
		color: #eed5b7 !important;
	}

	#nav a.icon{
		display: none !important;
	}

	#main {
		background-image: url('/img/spaeti.jpg');
		background-attachment: fixed;
		background-size: cover;
		background-repeat: no-repeat;
	}

	

 	
}

@media only screen and (min-width: 1025px) {

	#main article {
		max-width: 700px;
	}

}