/* ---------- RESPONSIVE DESIGN ----------*/
@media screen and (max-width: 1200px) {	
	
}
@media screen and (max-width: 992px) {	
.text-ueber-bild{font-size:39px;right: 20%;top: 50%;}
.text-ueber-bild-links{font-size:39px;left: 10%;top: 50%;}	
.text-ueber-bild-kontakt{font-size:39px;right: 40%;top: 50%;}
}
@media screen and (max-width: 768px) {	
.text-ueber-bild{font-size:30px;right: 20%;top: 50%;}
.text-ueber-bild-links{font-size:30px;left: 10%;top: 50%;}	
  .text-ueber-bild-kontakt{font-size:30px;right: 40%;top: 50%;}
	.laufweite {letter-spacing: 0em; text-align: left;}
	h2 {font-size: 9vw;}
	#navigation-logo {position: relative !important;}
	.hgd-slider {margin-top: 0px;}
	.hgd-social-media .fab {font-size: 2em}
	
	.hgd-bottom-box {margin: 15px 0 5px 0;}
	
	#hgd-flip .col {flex-basis: auto; margin-bottom: 50px;}
	#hgd-flip .col {margin-bottom: 75px;}
	.hgd-flip-front, .hgd-flip-back {min-height: 350px;}
	#HGDscrollBtn {bottom: 10px; right: 10px;}	
	.search {float: left;}
	
	.featureBoxSmall {border-bottom: 1px dashed var(--color-02);  padding: 15px;}
	.featureBoxSmall h4 {text-align: center; margin-top: 25px;}
	.featureBoxSmall p {text-align: center;}
	
	}
	@media screen and (max-width: 580px) {	
.text-ueber-bild{font-size:27px;right: 15%;top: 40%;}
.text-ueber-bild-links{font-size:27px;left: 5%;top: 40%;}
.text-ueber-bild-kontakt{font-size:27px;right: 40%;top: 50%;}
.b2j-contact-group-class.auftragsgeber .control-group,.b2j-contact-group-class.person{float:left;width:98% !important;}
.b2j-contact-group-class.nummer{float:left;width:96% !important;padding-right:4%;}
.terminmenue a {color: #fff; padding-right: 15px;display: block;}  
	}
@media screen and (max-width: 476px) {	
.text-ueber-bild{font-size:19px;right: 10%;top: 40%;}
.text-ueber-bild-links{font-size:19px;left: 5%;top: 40%;} 
.text-ueber-bild-kontakt{font-size:19px;right: 40%;top: 50%;}
	}