@charset "utf-8";
/* CSS Dokument */
	/***************** FONTS ********************/
@import url("http://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css");
@import url("http://fonts.googleapis.com/css?family=Open+Sans:400,300");
html{font-size: 62.5%; font-family: 'Open Sans', sans-serif;}
body{font-size: 1.6rem; min-height: 100vh;}
h1{font-size: 3rem; margin-bottom: 1rem;}
h2{font-size: 1.6rem;}
header{position: relative;}
main{padding: 2rem;}
/***************** NAVIGATION ********************/

nav1 ul{display: flex; flex-wrap: wrap; max-width: 1080px; margin: 0 auto;background:rgba(223,250,252,1);}
nav1 ul,nav1 li{flex: 1;}
nav1 li:last-child{border-bottom: none;}
nav1 a{text-decoration: none;color:#000;display: block;font-size: 2rem;}
nav1 a:hover{background: #adacac;color: #fff;}
nav1 li{position: relative;line-height: 50px;color: #fff;text-align: center;}  
nav1 input,nav1 label{display: none;width: 36px; height: 36px; background:#1E6363; color: #fff; text-align: center; line-height: 36px;
	 font-size: 1.6rem;border-radius: 4px;} 
nav1 label{position: absolute; top: 8px; right: 8px; transition: .4s;}
nav1 label:hover{cursor:pointer;}
nav1 label:before{font-family: FontAwesome;font-size: 26px;content: "\f0c9";text-align: center;}

/*************** MEDIA QUERIES *******************/
@media only screen and (max-width: 720px){
	#banner, #wrapper1, #wrapper2, #nav_top, #nav_bottom, nav, footer{display:none;}
	body {background-image: url(../images/background_mobil1.jpg); background-color:#2cacaa;background-position: top center; background-repeat:
		  no-repeat; background-attachment:scroll; background-size:100% auto;}
	nav1 ul{transform: translateY(0);box-shadow: 0 0 5px rgba(0,0,0, .7);transition: all 0.7s;}
	nav1 li{flex: none; width: 100%;border-bottom: solid 1px #777;} 
	nav1 input:checked + ul{transform: translateY(-100%);width: 100%;background: #999;transition: all 0.7s;}
	nav1 label{display: block;}  
	nav1 input:checked + ul li:nth-child(1){background: #777; color: #fff;}  
	.mobil-footer {display:flex;margin-top:130%;background:rgba(223,250,252,1);padding:2% 0;}
	.mobil-footer li{list-style:none;text-decoration:none;font-size:4.5vw;}
	.mobil-footer a{text-decoration:none;color:#000;}
	a:active, a:focus{outline:none;}
}
@media only screen and (min-width: 720px){
	header, nav1{display:none;}
}
