*  {margin:0; padding:0}



body, div,  h1, h2, h3, h4, p, ul, li,  header, footer, main, aside, figure, section, article, nav 

{display:block; margin:0; padding:0; box-sizing: border-box}

body {			
		font-family: 'Barlow Condensed', sans-serif;
		background-image: url("../images/chok-dee-thai-imbiss-2.jpg");
	/*url("../images/kachel.jpg");*/
  		background-position: center -400px;
 		background-repeat: no-repeat;
		background-color: #0b181a;
		color:#fff;
	
	
				
}

header {	
			height:auto;
			padding:1rem 0 0;
		

	
	
	 /* set animation */
            transition: all 0.4s ease;
			-webkit-transition:  all 0.4s ease;
    		-moz-transition:  all 0.4s ease;
    		-o-transition: all 0.4s ease;
	
	
	}






nav { margin:0 auto; width:100%; text-align: center}
nav ul li {display:inline-block; }



section#kontakt {width:100%}


#container {
	/*	background-color:#F4CBD1b;*/
		position:relative;
		margin: 0 auto;
		width:100%;
		max-width:1400px;
		height:auto;
		
	
	}


	
header section#thaifood figure img {text-align: center;}


header section#thaifood
			{
text-align: center;
height: 80vh;
	}	
	


main article{ width:90%; float:left; height:auto; margin:3rem 5% 2rem; text-align:left;}


	


.flexContainer {
	width: 100%;
	max-width:1400px;
	float:left; 
	display:flex;
	display:-webkit-box;
  		display:-ms-flexbox;
  		display:-webkit-flex;

	flex-flow:row nowrap;
	-webkit-flex-flow:row nowrap;
	
	
	

} 

.flexContainer div {-webkit-flex:1 ; flex: 1 ;   padding:1rem;  border-right:1px solid rgba(204,204,51,.5); }


.flexContainer div:nth-child(2) {margin-right:0; border-right:0}





.zeig {height:auto;	}

.weg {
	height:.1rem; }


.up {
	width:40px;
	height:40px;
	background-color: #cc3;
	color:#000;
	text-align: center;
	padding-top: .55rem;
	box-sizing: border-box;
	position: fixed;
	bottom: 1rem;
	right:1rem;
	z-index: 90;
	border:3px solid #000;
	opacity: 0;
	 visibility: hidden;
  	-webkit-transition: 0.5s;
 	 -o-transition: 0.5s;
 	 transition: 0.5s;


}

.up.active {
  opacity: 1;
  visibility: visible;
}

.up a:hover, .up:active, .up a:focus {
  text-decoration: none;
  outline: none;
}






/*---------------------------------------------- TYPO -------------------------------------------*/
	
p { 
	font-family: 'Barlow Condensed', sans-serif;
	margin:1rem 0;
	color:#fff;
	font-size:1.25rem;
	font-weight:400;
		
	}

p.black  {color:#cc3}
a.black  {color:#cc3; }
	
sup {line-height: 100%}


p.life {font-weight:400; color:#666; font-size:1rem; line-height:1.5rem; max-width:800px}

p.last {padding-bottom:2rem}
	

.small {font-size:.9rem;  font-weight:400; color:#fff; line-height: 1-25rem; margin-top:-.15rem}

small {font-size:70%;  font-weight:400}

strong {font-weight:600}



.white {color:#fff; text-decoration: none}
.white:hover {color:#fff; text-decoration: underline}


.beige {color:#cc9966; text-decoration: none}

.beige:hover {color:#fff}
	
h1 {
	font-family: 'Fredericka the Great','Barlow',  sans-serif;
	color:#fff;
	margin:1.5rem 0 .5rem 0;
	font-size: 4rem;
	text-shadow:0 0 4px #000

}



#speisekarte h1 {color:#fff; text-shadow: 0 0 4px #333}

header h2 {
	font-family: 'Fredericka the Great','Barlow',  sans-serif;
	color:#fff;
	margin:0 0 .5rem 0;
	font-size: 2rem;
	text-shadow:2px 2px 0 #333

	}
h2 {font-family: 'Fredericka the Great','Barlow',  sans-serif; color:#cc3}	

h3 {
	color:#cc3;
	font-size:1.75rem;
	font-weight:300;
	margin:0;
	padding: 0;
	 
	}

#kontakt h3:hover {color:#333; text-shadow: 1px 1px 0 #fff }

h4 {
	font-style: italic;
	color:#000;
	font-size:1.12rem;
	font-weight:400;
	margin: .5rem 0 1rem
	}
/*

.formular {
		font-family: 'Quicksand', sans-serif;
		height:1rem;
		background-color:transparent;
		border:none;
		border-bottom:1px solid #aaa;
		color:#333;
		font-size:.9rem;
		margin:.5rem 0;
		padding:0.5rem 1rem;

}


.form {	border:1px solid #aaa;}

.send {
	font-family: 'Quicksand', sans-serif;
	background-color: transparent;
	border:1px solid #aaa;
	color:#aaa;
	font-size:.9rem;
	font-weight:400;
	margin:.5rem 0;
	padding:0.75rem 1.25rem;
	


	}
	

.ninety {width:90%}*/

/*

.g-recaptcha {width:210px; overflow: hidden; }

*/




a {color:#cc3; text-decoration:none;}


header nav li {color: #333; padding:2px 6px 2px; background-color:#cc3;}
header nav li.active, header nav li:hover {background-color: #fff}


header nav li a {
	font-size:1.25rem;
	color:#333;	

}


header nav li a:hover, header nav li a:focus {
	color:#000;
	}



li.death {
	font-size:1.15rem;
	color:#cc9966;
	padding:3px 10px 2px;
	margin-right:6px;
	
	
	}
	
	
	



.stoerer {
	float:left;
	width:11rem;
	height:11rem;
	-webkit-border-radius:50%;
	-moz-border-radius:50%;
	-o-border-radius:50%;
	border-radius:50%;

	font-size:1rem;
	font-weight:bold;
	letter-spacing:-1px;
	text-align:center;
	color:#000;
	border: 2px  dotted #000;
	
	padding:.75rem;
	box-sizing:border-box;
	
	line-height:1.35rem;
	

/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#7f5026+0,cc9966+50,7f5026+99 */

background: #7f5026; /* Old browsers */

background: -moz-linear-gradient(-45deg,  #7f5026 0%, #cc9966 50%, #7f5026 99%); /* FF3.6-15 */

background: -webkit-linear-gradient(-45deg,  #7f5026 0%,#cc9966 50%,#7f5026 99%); /* Chrome10-25,Safari5.1-6 */

background: linear-gradient(135deg,  #7f5026 0%,#cc9966 50%,#7f5026 99%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */

filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7f5026', endColorstr='#7f5026',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */

	
}



.big {
	font-size:1.7rem;
	text-shadow:#000 0 1px 0;
	color:#fff
	}


p i {  font-size: .8rem; line-height: .8rem; margin-top:1.5rem }






@media screen and (max-width:850px) {
	
	
	.flexContainer div { border-right:0}
	

.flexContainer {
	
	flex-flow:column nowrap;
	-webkit-flex-flow:column nowrap;
	
	
}

.flexContainer div {flex: 1; }

section#kampagne .flexContainer div:first-child {display:none;  }	
	
section  .flexContainer #kka {margin:2rem 0;  }
	
main article {margin:1rem 4%}

	
	
main section#thaifood

		{
	margin-top:-50px; 
	min-height:300px;
	max-height:400px;
	width:100%;
	background: url("../images/fruehlingserwachen.jpg") no-repeat top center;
	background-size: 100%;
	}	
	
	
	
	
}


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


		
	header  {margin:1rem}
	
	
	header nav li a {font-size:1.5rem}
	
	header nav li {margin: 0 0 .5rem}
	
	header section figure img {width:400px}
	
	
	header section#thaifood { height: auto;	}	

	
}



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

	header section figure img, main section figure img#last {width:350px}

	

}