﻿/* 
grau: # 262625
weiß: # dcdcdc 
blau: # e4c178
*/


html,body {
	font-family: 'poppins', sans-serif;
	/* font-weight:300; */
	color:#262625;
	font-size:100%;
	/* background-color:#dcdcdc; */
}
.clear{
	clear: both;
}
/*::selection {
	background-color:#262625;
    color: #dcdcdc;
	opacity:1;
}
*/
/* .content {
	padding: 10px;
	margin: 10px;
} */
.bg{
	background-color:blue;
}
.content{
	/* background-color:red; */
	margin-top:100px;
	/* margin-top:4%; */
	margin-bottom:3%;
}
.content2{
	/* background-color:red; */
	margin-top:10px;
	/* margin-top:4%; */
	margin-bottom:3%;
}
.formular{
	padding-left: 20%;
	padding-right: 20%;
}
.terminliste{
	padding-left: 10%;
	padding-right: 10%;
}
td{
	height: 30px;
	margin: 5px;
	padding: 5px;
}
input{
	width: 100%;
	max-width: 320px;
}
textarea{
	width: 100%;
	max-width: 320px;
}
img{
	width: 100%;
	height:auto;
	margin-left: auto;
	margin-right: auto;
	
}
header{
	z-index:200;
	/* position:fixed; */
	width:100%;
/* 	background-color:rgba(255,255,255,0.8);
	border-bottom:dotted 0.5px #4d6684 */;
}
a:hover{
	/* opacity:0.8; */
	transition:ease-out 0.6s;
}
a img:hover{
	opacity:0.98;
	transition:ease-out 0.6s;
}
.buehne{
	/* background-color:green; */
}
.buehne img{
	width:100%;
	border-top:solid 0px #4d6684;
	
	
}
.button{
	margin:0 auto;
	width:30%;
	margin-bottom:2%;
	padding:1% 2%;
	text-align:center;
	border:solid #dcdcdc 1px;
	cursor:pointer;
	color:white;
	background-color:#0c3183;
}
.button:hover, .button:focus{
	transition:ease-out 0.6s;
	background-color:white;
	color:#0c3183;
	border:solid 1px #0c3183;
}
.cards:hover .button, .cards:focus .button{
	transition:ease-out 0.6s;
	background-color:white;
	color:#0c3183;
	border:solid 1px #0c3183;
}
.links:hover .button, .links:focus .button{
	transition:ease-out 0.6s;
	background-color:white;
	color:#0c3183;
	border:solid 1px #0c3183;
}

.linie{
	width:40%;
	margin:0 auto;
	margin-top:1%;
	border-bottom:solid 0.5px;
	/* border-color:rgba(236,118,29,0.8); */
	border-color:#e4c178;
}
/* ---- */
/* -------------------------------------- */
			/* Textauszeichnungen */

h1{
	font-family: 'Helvetica Neue', sans-serif;
	text-align:center;
	font-size:3em;
	line-height:1em;
	letter-spacing:0.0002;
	margin-top:1%;
}
h2{
	font-family: 'poppins', sans-serif;
	font-size:1.5em;
	text-align:center;
}
h3{
	font-family: 'Helvetica Neue', sans-serif;
	text-align:center;
	font-size:1.5em;
	line-height:1.2em;
	/*line-height:2.6em;*/
	margin-top: 12px;
	margin-bottom: 12px;
}
h4{
	font-family: 'poppins', sans-serif;
	font-size:1em;
	line-height:1.2em;
    margin-bottom: 5px;
}
h5{
	font-family: 'Helvetica Neue', sans-serif;
	text-align:center;
	font-size:3em;
	line-height:1em;
	letter-spacing:0.0002;
	margin-top:1%;
}

h6{
	font-family: 'Helvetica Neue', sans-serif;
	text-align:center;
	font-size:2em;
	line-height:1em;
	letter-spacing:0.0002;
	margin-top:1%;
}

h7{
	font-family: 'Helvetica Neue', sans-serif;
	text-align:center;
	font-size:2.5em;
	line-height:1.2em;
	/*line-height:2.6em;*/
	margin-top: 12px;
	margin-bottom: 12px;
}


p{
	font-size:1em;
	/* margin-top:1%; */
	letter-spacing:0.02em;
	line-height:1.5em;
}
.fett{
	font-family: 'poppins';
}
.ansprechpartner{
	/* color:#0c3183; */
	font-family: 'poppins';
	font-size:1.2em;
	line-height:2em;
}
.footertext{
	font-size:0.8em;
}	
.left{
	text-align:left;
}
.right{
	text-align:right;
}
.center{
	text-align:center;
}
.white{
	color:#dcdcdc;
}
.black{
	color:#262625:
}
.zweispaltig {
	/* margin-bottom: 4%; */
	-moz-column-count: 2;
	-webkit-column-count: 2;
	column-count: 2;
	-moz-column-width: 400px;
	-webkit-column-width: 400px;
	column-width: 400px;
	-webkit-column-gap: 42px; /* Chrome, Safari, Opera */
    -moz-column-gap: 42px; /* Firefox */
    column-gap: 42px;
	text-align:left;
	-webkit-column-fill: balance; /* Chrome, Safari, Opera */
    -moz-column-fill: balance; /* Firefox */
    column-fill: balance; /* linksbündig und flattersatz */
	margin-top: 30px;
}
.liste, .aufzaehlung{
	/* padding-top:2%; */
	padding-bottom:2%;
}
.aufzaehlung li{
	list-style-position: oustide;
	list-style-type:decimal;
	margin-left:40px;
	margin-top:5px;
	font-size:1.2em;
	line-height:1.6em;
}
.liste li{
	list-style-position: oustide;
	list-style-type:disc;
	margin-left:40px;
	/* margin-top:10px; */
	font-size:1em;
	letter-spacing:0.02em;
	line-height:1.5em;
	/* font-size:1.2em; */
	/* line-height:1.6em; */
}
/* -------------- */
/* Header */
.info{
	width:100%;
	height:50px;
	background-color:#262625;
	color:#dcdcdc;
	padding-top: 10px;
}
.info a{
	font-family: 'Poppins', sans-serif;
	font-size:0.8em;
}
.info a:hover{
	opacity:0.8;
}
.info .lang{
	/* background-color:green; */
	
	float:right;
	border-right:solid 1px;
	padding-left:5px;
	padding-right:15px;
	margin-right:2%;
	margin-top:15px;
	font-size:0.8em;
}
.info .lang:first-child{
	border:none;
}
.info img{

	margin-top:10px;
	width:48%;
	/* background-color:red; */
	float:left;
}
.head{
	
	width:100%;
	height:180px;
	border-bottom:solid 1px #262625;
}
.head img{
	margin-top:5%;
	width:100%;
}

.icons{
	font-family: 'typicons';
	font-size:2em;
	padding-right:5px;
	font-weight:50;
	padding-left:20px;
}
.icons:first-child{
	padding-left:0px;
}
.mail:before{
	content: '\e0a5';
}
.phone:before { 
  content: '\E0C4';
} 
.fb:before { 
  content: '\e0e5';
  font-size:1.5em;
} 
.ig:before { 
  content: '\e0ed';
  font-size:1.5em;
} 
.yt:before { 
  content: '\e0fd';
    font-size:1.5em;
	margin-left:2%;
}
 
/* ------- */

.contactfull{
	background-color:#0c3183;
	width:100%;
	padding-top:2%;
	padding-bottom:1%;
}

/* ----- */
.card{
	/* border:solid 1px rgba(0,0,0,0.1); */
	border-top:solid 4px #0c3183;
	margin-left:6%;
	width:20%;
	padding-bottom:2%;
	float:left;
	overflow: hidden;
}
.card:first-child{
	margin-left:0%;
}
.cards{
	border:solid 1px rgba(0,0,0,0.1);
	margin:1%;
	width:23%;
	padding-bottom:2%;
	float:left;
}
.speisekarteausgabe{
	/*border: 1px solid #c1a35f;*/
	margin: 10px;
	margin-bottom: 20px;
	min-height: 100px;
	min-width: 200px;
	padding-top: 10px;
	padding-bottom: 20px;
	text-align: center;
	margin-left:auto;
	margin-right:auto;
	/*float:left;*/
}
.vorspeisen {
	display:block;
	width: 100%;
	max-width: 500px;
	margin-left: auto;
	margin-right: auto;
}

.hauptspeisen {
	display: none;
	width: 100%;
	max-width: 500px;
	margin-left: auto;
	margin-right: auto;
}

.desserts {
	display: none;
	width: 100%;
	max-width: 500px;
	margin-left: auto;
	margin-right: auto;
}

.beilagen {
	display: none;
	width: 100%;
	max-width: 500px;
	margin-left: auto;
	margin-right: auto;
}

.getraenke {
	display: none;
	width: 100%;
	max-width: 500px;
	margin-left: auto;
	margin-right: auto;
}

.links{
	border:solid 1px rgba(0,0,0,0.1);
	margin:1%;
	width:31%;
	padding-bottom:2%;
	float:left;
}
.small{
	width:23%;
}
.cards img{
	padding: 0% 0% 0% 0%;
	width:100%;
}
.links img{

	padding: 0% 0% 0% 0%;
	width:100%;
}
.cardcontent{
	text-align:center;
	background-color:rgba(0,0,0,0.02);
	padding-top:20px;
	/* padding-bottom:20px; */
	color:	#6f7072;
	min-height:150px;
	-moz-hyphens: auto;
	-o-hyphens: auto;
	-webkit-hyphens: auto;
	-ms-hyphens: auto;
	hyphens: auto;
}
.cardcontent h3{

	font-family: 'Shadows Into Light', cursive;
	font-size:2em;
	line-height:1.2em;
	padding-bottom:10px;
}
.cardcontentlinie{
	width:60%;
	margin:0 auto;
	margin-top:1%;
	margin-bottom:1%;
	border-bottom:solid 0.5px;
	border-color:rgba(0,0,0,0.08);
}
.buttoncard{
	margin-top:20px;
	padding:10px;
	width:60%;
}
.buttoncardimbild{
	
	position:absolute;
	margin-top:8%;
	cursor:pointer;
	z-index:200;
}
.linkimbild{
	background-color:rgba(13,135,215,0.9);
	color:#0c3183;
	float:left;
	padding-left:6%;
	padding-top:3%;
	padding-bottom:3%;
	width:130px;
	min-height:45px;
}
.go{
	color:#dcdcdc;
	background-color:rgba(60,60,60,0.9);
	float:left;
	padding-top:10px;
	padding-bottom:3%;
	width:40px;
	text-align:center;
	cursor:pointer;
	min-height:45px;
}
.card img{
 max-width: 100%;
  	overflow: hidden;
  -moz-transition: all 0.6s;
  -webkit-transition: all 0.6s;
  transition: all 0.6s;
}
.card:hover img{
	cursor:pointer;
	-moz-transform: scale(1.1);
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
}
.card:hover .go{
	background-color:rgba(13,135,215,0.9);
	transition: ease-out 0.8s;
}
.card:hover .linkimbild{
	background-color:rgba(60,60,60,0.9);
	transition: ease-out 0.8s;
}
/* --- */
/* 
grau: # 262625
weiß: # dcdcdc 
blau: # e4c178
*/
/* Produktübersicht */

.downloadcard{
	/* border:solid 1px rgba(0,0,0,0.1); */
	margin-left:6%;
	width:80%;
	padding-bottom:2%;
	float:left;
	overflow: hidden;
	background-color:rgba(0,0,0,0.04);
	cursor:pointer;
	border:solid 1px rgba(13,135,215,0.1);
	-webkit-filter: grayscale(80%); /* Safari 6.0 - 9.0 */
    filter: grayscale(80%);
	color:#e4c178;
}
.downloadcard:hover, .downloadcard:focus{
	-webkit-filter: grayscale(0%); /* Safari 6.0 - 9.0 */
    filter: grayscale(0%);
	border:solid 1px rgba(13,135,215,0.9);
	transition:ease-out 0.6s;
}
.downloadcardcontent{
	/* background-color:red; */
	width:80%;
	margin:0 auto;
}
.downloadcardcontent p{
	text-align:center;
	margin-top:5px;
	margin-bottom:15px;
/* 	margin-left:20px;
	margin-right:5px; */
}
.downloadcard img{
	width:50%;
	margin-top:5%;
	margin-left:25%;
}
.map{
	/* width:60%; */
}

.siteinfo{
	border:solid 1px rgba(13,135,215,0.3);
	width:100%;
	padding:6% 4%;
}
.siteinfo img{
	width:80%;
	margin-left:10%;
}
footer{
	margin-top:5%;
	padding-top:4%;
	padding-bottom:4%;
	background-color:#262625;
	color:#dcdcdc;
}
footer img{
	/* background-color:red; */
	width:80%;
	margin:0 auto;
}
footer .social img{
	/* float:left; */
	/* background-color:green; */
	width:40;
	margin-top:12%;
	/* margin:2%; */
}

.startlogo{
	position:absolute;
	margin-left: auto;
	margin-right: auto;
	left: 0;
	right: 0;
	width:55%;
	z-index:50;
	margin-top:15%;
/* 	padding-top:2%;
	padding-bottom:0.5%;
	padding-right:5%;
	padding-left:5%; */
	padding:2% 5% 0.5% 5%;
	/* background-color:rgba(255,255,255,0.8); */
	/* background-color:rgba(0,0,0,0.5); */
background: -moz-linear-gradient(left, rgba(0,0,0,0) 8%, rgba(0,0,0,0.2) 34%, rgba(0,0,0,0.5) 41%, rgba(0,0,0,0.61) 43%, rgba(0,0,0,0.5) 50%, rgba(0,0,0,0.46) 51%, rgba(0,0,0,0.31) 57%, rgba(0,0,0,0.2) 67%, rgba(0,0,0,0) 92%); /* FF3.6-15 */
background: -webkit-linear-gradient(left, rgba(0,0,0,0) 8%,rgba(0,0,0,0.2) 34%,rgba(0,0,0,0.5) 41%,rgba(0,0,0,0.61) 43%,rgba(0,0,0,0.5) 50%,rgba(0,0,0,0.46) 51%,rgba(0,0,0,0.31) 57%,rgba(0,0,0,0.2) 67%,rgba(0,0,0,0) 92%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right, rgba(0,0,0,0) 20%,rgba(0,0,0,0.2) 34%,rgba(0,0,0,0.5) 41%,rgba(0,0,0,0.61) 43%,rgba(0,0,0,0.5) 50%,rgba(0,0,0,0.46) 51%,rgba(0,0,0,0.31) 57%,rgba(0,0,0,0.2) 67%,rgba(0,0,0,0) 92%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#00000000',GradientType=1 );
}


.startlogo img{
	width:100%;
}
/* -------------------------------------------------------- */
				/* Scroll Down */
/* -------------------------------------------------------- */
#scrolldown{
	width:100%;
	color:#0c3183 ;
	border-top:solid 1px #0c3183 ;
	z-index:500;
	position:absolute;
	position:fixed;
	height:45px;
	bottom:0;
	text-align:center;
	vertical-align:middle;
	margin-top: 10px;
	font-family: 'Maven Pro', sans-serif;
	font-weight: 400;	
	font-size:1em;
}
#scrolldown:hover{
	transition: 0.8s ease-out ;
	border-top-color:#0c3183;
	cursor:pointer;
	background-color:rgba(69,69,70,0.4);
}

/* ScrollAnimation */
.down a {
	position: absolute;
	bottom: 20px;
	left: 50%;
	z-index: 2;
	display: inline-block;
	-webkit-transform: translate(0, -50%);
	transform: translate(0, -50%);
	color: #0c3183;
	font : normal 400 20px/1 'Shadows Into Light', cursive;
	letter-spacing: .1em;
	text-decoration: none;
	transition: opacity .3s;
}
.down a:hover {
	opacity: .5;
}

#section10 a {
	padding-top: 60px;
}
#section10 a span {
	position: absolute;
	top: 0;
	left: 50%;
	width: 35px;
	height:60px;
	margin-left: -15px;
	border: 2px solid #0c3183;
	border-radius: 50px;
	box-sizing: border-box;
}
#section10 a span::before {
	position: absolute;
	top: 10px;
	left: 50%;
	content: '';
	width: 6px;
	height: 6px;
	margin-left: -3px;
	background-color: #0c3183;
	border-radius: 100%;
	-webkit-animation: sdb10 2s infinite;
	animation: sdb10 2s infinite;
	box-sizing: border-box;
}
/* -------------------------------------- */

@media screen and (max-width: 1350px) {
.head{
	height:120px;
}
}

@media screen and (max-width: 1100px) {
.card, .small, .cards{
	width:40%;
}
.card:first-child{
	margin-left:6%;
}
.link, .small, .links{
	width:80%;
}
.links:first-child{
	margin-left:6%;
}

.buttoncardimbild{
	margin-top:16%;
}
.formular, .terminliste{
	padding-left: 1%;
	padding-right: 1%;
	font-size: 80%;
}
.KursListe{
	transform: scale(0.5);
}
}
@media screen and (max-width: 1024px) {
.head a img{
	width:80%;
}
.head{
	height:140px;
}
}

@media screen and (max-width: 920px) {
.head a img{
	width:100%;
}
.formular, .terminliste, .terminliste-mobil{
	padding-left: 1%;
	padding-right: 1%;
	font-size: 70%;
}
}
@media screen and (max-width: 770px) {
.info{
	height:100px;
	padding-top:8px;
}
.info img{
	margin-top:7px;
	width:10%;
	/* background-color:red; */
	float:left;
}
.head{
	height:140px;
}
.head a img{
	margin-top:20px;
	width:20%;
}
}
@media screen and (max-width: 580px) {
.head{
	height:120px;
}
.card, .small, .cards{
	width:80%;
}
.card:first-child{
	margin-left:6%;
}
.buttoncardimbild{
	margin-top:40%;
}
}
@media screen and (max-width: 500px) {
.head a img{
	margin-top:10px;
	width:40%;
	margin-left:20%;
}
.head{
	height:140px;
}
}