/* PRINT ######################################################################################## */
@media print {

body {
	background: none !important;
	background-color: #fff !important;
	color: #555 !important;
}

h1, h2, h3, h4, h5 {
	color: #777 !important;
}

}



/* BIG SCREEN #################################################################################### */
@media screen and (min-width: 1281px) {

}

/* STANDARD VIEW ################################################################################# */
@media screen and (max-width: 2205px) {

#intro-top {
  transform: scaleX(-1) translateY(-7vh);
}

}


/* STANDARD VIEW ################################################################################# */
@media screen and (max-width: 2150px) {

h2.eyecatcher {
  top: -3vh;
  width: 40%;
}

}


/* STANDARD VIEW ################################################################################# */
@media screen and (max-width: 2100px) {

.footer-logo {
  width: 75%;
}

}


/* STANDARD VIEW ################################################################################# */
@media screen and (max-width: 1940px) {


  .intro {
    padding: 0 5rem;
  }

}


/* STANDARD VIEW ################################################################################# */
@media screen and (max-width: 1900px) {

#intro-top {
  transform: scaleX(-1.15) translateY(-6vh);
}

}


/* STANDARD VIEW ################################################################################# */
@media screen and (max-width: 1865px) {

  h2.eyecatcher {
    top: -1.5vh;
    width: 45%;
    left: 15vh;
  }

}


/* STANDARD VIEW ################################################################################# */
@media screen and (max-width: 1680px) {

#footer-top {
  transform: translateY(-7vh);
}

#intro-top {
  transform: scaleX(-1.15) translateY(-5vh);
}

}

/* STANDARD VIEW ################################################################################# */
@media screen and (max-width: 1595px) {

  h2.eyecatcher {
    top: -1.5vh;
    width: 40%;
    left: 15vh;
    font-size: 2.15vh;
    line-height: 4vh;
  }

  main {
  	width: 70%;
  }

}


/* STANDARD VIEW ################################################################################# */
@media screen and (max-width: 1570px) {

.intrologo h1 {
	margin: 0 auto 0 9%;
	width: 45%;
  }

  #intro-inner {
	  padding: 280px 0;
	}

  .overlay {
	  width: 150%;
	  transform: translate(-750px, 0px);
	}

  .section-inner,
  #infocenter {
	  width: 70%;
	}

  #infocenter-icons.icons-4 .infocenter-icon {
	  margin: 0 3% 4% 0;
	  vertical-align: top;
	  width: 35%;
	}

	.badge {
	  padding: 20px 50px 40px 200px;
	  max-width: 45%;
	}

}


/* STANDARD VIEW ################################################################################# */
@media screen and (max-width: 1510px) {
  
.overlay {
  right: -5%;
  transform: translate(0px, 0px);
}

}

/* STANDARD VIEW ################################################################################# */
@media screen and (max-width: 1460px) {

#footer-top {
  transform: translateY(-6vh);
}

}


/* STANDARD VIEW ################################################################################# */
@media screen and (max-width: 1390px) {

  h2.eyecatcher {
    top: -0.7vh;
    left: 13vh;
  }

  .left, .right {
  	width: 100%;
  }
}


/* STANDARD VIEW ################################################################################# */
@media screen and (max-width: 1355px) {

  #intro-top {
    transform: scaleX(-1) translateY(-5vh) translateX(9vh) scale(1.5);
  }

    h2.eyecatcher {
    top: 0.1vh;
    left: 12vh;
    width: 45%;
  }

}


/* STANDARD VIEW ################################################################################# */
@media screen and (max-width: 1365px) {

.gallery {
  width: 75%;
}

}


/* STANDARD VIEW ################################################################################# */
@media screen and (max-width: 1320px) {

  .intro {
    display: inline-block;
  }

  .intro p {
    margin: 2rem 0;
  }

  #home-logo {
    width: 45%;
  }

  .footer-logo {
    width: 90%;
    margin-bottom: 2rem;
  }

}


/* STANDARD VIEW ################################################################################# */
@media screen and (max-width: 1305px) {

  #intro-top {
    transform: scaleX(-1) translateY(-4vh) translateX(9vh) scale(1.5);
  }

}


/* STANDARD VIEW ################################################################################# */
@media screen and (max-width: 1250px) {


#footer-top {
  transform: translateY(-8vh);
   background-size: 210%;
}


}


/* STANDARD VIEW ################################################################################# */
@media screen and (max-width: 1215px) {

h2.eyecatcher {
    top: 1vh;
    left: 10vh;
    font-size: 1.9vh;
    line-height: 3.5vh;
  }

   main {
    width: 75%;
  }

}

/* TABLET ####################################################################################### */

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

 #intro-top {
    transform: scaleX(-1) translateY(-3vh) translateX(9vh) scale(1.5);
  }

  h1 {
  	font-size: 37px;
  }

  #claim-footer, #copyright {
  text-align: center;
  width: 60%;
  margin: 0 auto;
}

}


/* TABLET ####################################################################################### */

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

 #footer-top {
    transform: translateY(-7vh);
  }

}


/* TABLET ####################################################################################### */

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

 #intro-top {
    transform: scaleX(-1) translateY(-2vh) translateX(10vh) scale(1.8);
  }

   h2.eyecatcher {
    top: 3vh;
    left: 9vh;
   }

   .intro h2 {
  	font-size: 30px;
  }

  footer {
    margin-top: 5vh;
  }

  #home-logo {
    margin: 6vh auto 5vh auto;
  }

}

/* TABLET ####################################################################################### */

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

 #footer-top {
    transform: translateY(-6vh);
  }

}


/* TABLET QUER ################################################################################### */
@media screen and (max-width: 890px) {

.intro {
    margin: 5rem 0rem;
  }

   .footer-logo {
    width: 100%;
  }

  #intro-top {
    transform: scaleX(-1) translateY(-1vh) translateX(15vh) scale(2.2);
  }

    h2.eyecatcher {
    top: 10vh;
    left: 9vh;
    width: 70%;
    transform: rotate(0deg);
    font-size: 2.5vh;
    line-height: 4vh;
  }


  #home-logo {
    width: 100%;
    position: relative;
    top: 0;
    left: 0;
    display: block;
    text-align: center;
    max-width: 40vw;
    margin: 5rem auto 0 auto;
  }

.datenschutz #home-logo, .impressum #home-logo {
  margin-bottom: 7vh;
}



}


/* TABLET QUER ################################################################################### */
@media screen and (max-width: 865px) {

  #intro-top {
    transform: scaleX(-1) translateY(0vh) translateX(12vh) scale(2.1);
  }

  .footer-logo {
    width: 95%;
  }

}


/* SMARTPHONE ##################################################################################### */
@media screen and (max-width: 745px) {

  #intro-top {
    transform: scaleX(-1) translateY(1vh) translateX(12vh) scale(2.1);
  }

  h1 {
    font-size: 35px;
  }

  #footerboxes {
    padding: 10px 0px 10px 0px;
  }


}




/* SMARTPHONE ##################################################################################### */
@media screen and (max-width: 720px) {


}


/* SMARTPHONE ##################################################################################### */
@media screen and (max-width: 700px) {

  #footer-top {
    transform: translateY(-5vh);
  }


}


/* SMARTPHONE ##################################################################################### */
@media screen and (max-width: 635px) {

  .footer-logo {
    width: 100%;
  }

    #footerboxes {
    width: 70%;
  }


   .intro {
    margin: 0;
    padding: 5rem 2rem 2rem 2rem;
    max-width: 100%;
  }

    main {
    width: 82%;
  }

  h2.eyecatcher {
    top: 10vh;
    left: 0vh;
    width: 80%;
    transform: rotate(0deg);
    font-size: 2.5vh;
    line-height: 4vh;
    margin: 0 auto;
    display: block;
  }

   #home-logo {
    max-width: 50vw;
  }

  h1 {
     max-width: 100%;
  }


}


/* SMARTPHONE ##################################################################################### */
@media screen and (max-width: 600px) {

.datenschutz section, .impressum section {
  margin: 0 2rem;
}

h1 {
    font-size: 2rem;
  }

  .intro h2 {
    font-size: 1.5rem;
    padding: 0;
    text-align: center;
  }

}



/* SMARTPHONE ##################################################################################### */
@media screen and (max-width: 530px) {

}


/* SMARTPHONE ##################################################################################### */
@media screen and (max-width: 455px) {

  #footerboxes, #claim-footer, #copyright {
    width: 80%;
  }

.gallery {
    width: 85%;
  }

    #home-logo {
    width: 90%;
    position: relative;
    top: 4vh;
    left: 0vh;
    display: block;
    text-align: center;
    margin: 0 auto;
  }

    h1 {
    font-size: 30px;
    }

  .intro h2 {
    font-size: 26px;
  }

  p {
  font-size: 18px;
}

.modal.show {
  transform: translateY(8vh);
}

}


/* SMARTPHONE ##################################################################################### */
@media screen and (max-width: 405px) {


main {
    width: 87%;
    margin: 5vh 0;
  }

 h1 {
    font-size: 27px;
  }


}






/* SMARTPHONE ##################################################################################### */
@media screen and (max-width: 350px) {

.intro {
    max-width: 80%;
  }

  h1 {
    hyphens: auto;
  }

}

/* SMARTPHONE ##################################################################################### */
@media screen and (max-width: 340px) {

  #intro-top {
    display: none;
  }

  

}