/* Grid Css */

/* für bootstrap mit Breakpoints bei 480px - 626px - 949px */

/* --- GRID / MEDIAQUERIES ------------------------------------------------- */


/* ------------- Haupt-Mediaqueries ---------------- */


@media screen and (min-width: 1200px) {
	
	img#sidenav-logo {
		height:75px;
		width:75px;
	}
		
}


@media screen and (min-width: 1500px) {
	
	.sidenav-hauptbox {
		width: 500px; 
	} 
  
	img#sidenav-logo {
		height:80px;
		width:80px;
	}
  
	.sidenav-header {
		padding: 70px 0px 60px 50px; 
	}
  
	.sidenav-header h2 {
		font-size: 45px; 
	}
	
	label.open span {
		width: 54px;
		left: 120px;
	}
	
	label.open span:nth-of-type(1) {
		top: 33px; 
	}
	  
	label.open span:nth-of-type(2), input.open:checked ~ label span:nth-of-type(1), input.open:checked ~ label span:nth-of-type(2), input.open:checked ~ label span:nth-of-type(3) {
		top: 44px;
	}
	  
	label.open span:nth-of-type(3) {
		top: 55px; 
	}
	
	input.open:checked ~ label.open {
		width: 485px;
		height: 95px;
	}
	
	.sidenav-footer {
	    padding: 14px 0px 0px 50px;
	}
	
	.sidenav-footer-kontaktbox {
	    font-size: 18px;
	}
	
	a.mail-big {
		font-size: 24px;
	}
	
	p.adresse {
		font-size:21px;
	}

	p.impressum {
		font-size:11px;
		padding-right:27px;
	}
  
}


@media screen and (max-width: 949px) {
	
	.sidenav-hauptbox {
		width: 340px; 
	} 
  
	img#sidenav-logo {
		height:70px;
		width:70px;
	}
  
	.sidenav-header {
		padding: 50px 0px 40px 30px; 
	}
	
	.sidenav-header h2 {
		font-size: 35px; 
		line-height: 1.3em;
	}
	
	label.open span {
		width: 50px;
		left: 105px;
		height: 4px;
	}
	
	label.open span:nth-of-type(1) {
		top: 28px; 
	}
	  
	label.open span:nth-of-type(2), input.open:checked ~ label span:nth-of-type(1), input.open:checked ~ label span:nth-of-type(2), input.open:checked ~ label span:nth-of-type(3) {
		top: 39px;
	}
	  
	label.open span:nth-of-type(3) {
		top: 50px; 
	}
	
	label.open {
		width: 180px;
		height: 84px;
		padding-left:20px;
	}
	
	input.open:checked ~ label.open {
		width: 325px;
		height: 84px;
	}
	
	.sidenav-footer-kontaktbox {
	    font-size: 15px;
	}
	
	.sidenav-footer {
	    padding: 14px 0px 0px 30px;
	}
	
	a.mail-big {
		font-size: 19px;
	}
	
	p.adresse {
		font-size:18px;
	}

	p.impressum {
		font-size:11px;
		padding-right:21px;
	}
	
  
}


@media (max-width: 799px) and (max-width: 320px) {
	
	.sidenav-footer-kontaktbox a {
		font-size: 1em;
		margin-bottom: 1em; 
	}
	 
}


@media (max-height: 740px) {
	
	.sidenav-hauptbox {
		overflow: scroll; 
	} 

}


@media screen and (device-aspect-ratio: 2 / 3) {
	.sidenav-footer-kontaktbox a {
		clear: none; 
	} 
}
	  
@media screen and (device-aspect-ratio: 2 / 3) and (min-width: 640px) {
	.sidenav-footer-kontaktbox a {
		clear: both; 
	} 
}


@media screen and (max-width: 480px) {
	
	img#sidenav-logo {
		height:62px;
		width:62px;
	} 
	
	.sidenav-header {
		padding: 35px 0px 32px 30px; 
	}
	
	label.open {
		width: 130px;
		height: 76px;
		padding-left:8px; 
	}
	
	input.open:checked ~ label.open {
		height: 76px;
	}
	
	label.open span:nth-of-type(1) {
		top: 24px; 
	}
	  
	label.open span:nth-of-type(2), input.open:checked ~ label span:nth-of-type(1), input.open:checked ~ label span:nth-of-type(2), input.open:checked ~ label span:nth-of-type(3) {
		top: 34px;
	}
	  
	label.open span:nth-of-type(3) {
		top: 44px; 
	}
	
	label.open span {
		width: 42px;
		height: 3px;
		left: 81px;
	}
	
	a.mail-big {
		font-size: 19px;
	}
	
	
	
}


@media screen and (max-width: 350px) {
	
	.sidenav-hauptbox {
		width: 100%; 
	} 
	
	.sidenav-footer-kontaktbox {
		margin-bottom: 0; 
	} 
	
	.sidenav-footer-kontaktbox a {
		margin-bottom: 1.0em; 
	}
	
	span.socialicons {
		display:block;
		clear:both;
	}
	
	input.open:checked ~ label.open {
		width: 95%;
	}
	
	
  
}


/* ---------- */