/* Media Queries*/
/*----------------------- mobile menu ie 10/11 hack start*/
@media all and (-ms-high-contrast:none) {
   #my-menu {
      display: none
   } /* IE10 */
   *::-ms-backdrop, #my-menu {
      display: none
   } /* IE11 */
}
/*----------------------- mobile menu ie 10/11 hack end*/
/*----------------------- navbar start*/
@media only screen and (min-width: 1651px) {
   #btn-menu {
      display: none;
   }
   .language-dropdown {
      display: none;
   }
}
@media only screen and (max-width: 1650px) {
   .language {
      display: none;
   }
}
@media only screen and (min-width: 1391px) {
   #btn-menu {
      display: none;
   }
}
@media only screen and (max-width: 1390px) {
   .margin-navbar {
      padding-top: 70px;
   }
   #header-right {
      margin-right: 40px;
   }
   .language-dropdown {
      margin-top: 22px;
   }
   .mainmenu {
      display: none;
   }
   #navbar {
      height: 70px;
   }
   #logo-header {
      margin-top: 10px;
      margin-left: 20px;
   }
   #logo-header img {
      height: 50px;
      width: auto;
   }
   .header-more {
      margin-top: 10px;
   }
}
@media only screen and (max-width: 1130px) {
   .header-more {
      display: none;
   }
}
@media only screen and (min-width: 531px) {
   .logo-mobile-small {
      display: none;
   }
}
@media only screen and (max-width: 530px) {
   .logo-mobile-big {
      display: none;
   }
   .header-more {
      display: none;
   }
   .language-dropdown {
      margin-left: 0px;
   }
   #header-right {
      margin-right: 20px;
   }
}
/*----------------------- navbar end*/
/*----------------------- subnavbar start*/
@media only screen and (max-width: 1400px) {
   .submenu ul li {
      font-size: 1.3rem;
      font-size: 13px;
      line-height: 4.8rem;
      line-height: 48px;
   }
}
@media only screen and (max-width: 1250px) {
   #subnavbar {
      display: none;
   }
}
@media only screen and (max-width: 1280px) {
   #subnavbar {
      top: 70px; /*= height navbar*/
   }
}
/*----------------------- subnavbar end*/
/*----------------------- hero start*/
@media only screen and (min-width: 1101px) and (max-width: 1500px) {
   #hero h3 {
      padding: 13px 17px 13px 17px;
      background: rgba(126, 174, 182, 0.6);
   }
}
@media only screen and (max-width: 1100px) {
   .hero-wrapper {
      position: absolute;
      width: 50%;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      padding: 45px;
      background: rgba(126, 174, 182, 0.6);
      z-index: 30;
   }
   #hero h2, #hero h3 {
      color: #000;
      text-align: center;
   }
   #hero .btn {
      position: relative;
      martin-top: 0;
      left: 50%;
      -webkit-transform: translateX(-50%);
      -moz-transform: translateX(-50%);
      -ms-transform: translateX(-50%);
      -o-transform: translateX(-50%);
      transform: translateX(-50%);
   }
   .jump {
      position: absolute;
      bottom: 3%;
      left: 50%;
      width: 3rem;
      margin-left: -3rem;
      -webkit-transform: translate(-50%, 0);
      -moz-transform: translate(-50%, 0);
      -ms-transform: translate(-50%, 0);
      -o-transform: translate(-50%, 0);
      transform: translate(-50%, 0);
      color: #cc6666;
      font-size: 2rem;
      font-size: 20px;
      line-height: 2rem;
      line-height: 20px;
      text-align: center;
      padding: 14px 10px 14px 10px;
      vertical-align: middle;
      -webkit-border-radius: 50%;
      -moz-border-radius: 50%;
      -ms-border-radius: 50%;
      -o-border-radius: 50%;
      border-radius: 50%;
      -webkit-box-shadow: 0 0 0 3px #cc6666;
      -moz-box-shadow: 0 0 0 3px #cc6666;
      box-shadow: 0 0 0 3px #cc6666;
      z-index: 2000;
   }
   #hero h2 {
      font-size: 6.0rem;
      font-size: 60px;
      line-height: 6.0rem;
      line-height: 60px;
   }
   #hero h3 {
      font-size: 2.1rem;
      font-size: 21px;
      line-height: 2.7rem;
      line-height: 27px;
      font-weight: 400;
   }
}
@media only screen and (max-width: 750px) {
   #hero {
      height: 100%;
   }
   #hero h2 {
      margin-top: 0;
      font-size: 4.0rem;
      font-size: 40px;
      line-height: 4.0rem;
      line-height: 40px;
   }
   #hero h3 {
      margin-top: 30px;
      font-size: 1.9rem;
      font-size: 19px;
      line-height: 2.2rem;
      line-height: 22px;
      font-weight: 400;
   }
   .hero-wrapper {
      width: 50%;
      padding: 25px;
   }
   .visual-home img {
      width: 1100px;
   }
}
/*----------------------- hero end*/
/*----------------------- panel start*/
@media only screen and (max-width: 1250px) {
   .panel-left-top, .panel-left-bottom, .panel-right {
      padding: 50px 50px 50px 50px;
   }
}
@media only screen and (max-width: 900px) {
   .panel-left-top, .panel-left-bottom {
      position: relative;
      width: 100%;
      padding: 35px;
   }
   .panel-right {
      position: relative;
      width: 100%;
      padding: 35px;
      -webkit-transform: translateY(0%);
      -moz-transform: translateY(0%);
      -ms-transform: translateY(0%);
      -o-transform: translateY(0%);
      transform: translateY(0%);
      -webkit-transform: translateX(-50%);
      -moz-transform: translateX(-50%);
      -ms-transform: translateX(-50%);
      -o-transform: translateX(-50%);
      transform: translateX(-50%);
   }
   .panel-100 h2 {
      font-size: 3.8rem;
      font-size: 38px;
      line-height: 4rem;
      line-height: 40px;
      margin-bottom: 20px;
   }
   .icon img {
      width: 55px;
      height: auto;
   }
   .icon {
      margin-bottom: 23px;
   }
}
@media only screen and (max-width: 430px) {
   .panel-100 .align-left {
      float: none;
   }
   .panel-100 .ul-default-2 + .ul-default-2 {
      margin-top: 20px;
      margin-left: 0px;
   }
}
/*----------------------- panel end*/
/*----------------------- konzept start*/
@media only screen and (max-width: 750px) {
   #konzept .offset-35 {
      margin-left: 0px;
   }
}
/*----------------------- konzept end*/
/*----------------------- konzept unterseiten start*/
@media only screen and (max-width: 1300px) {
   #konzept {
      overflow: hidden;
   }
}
@media only screen and (max-width: 1000px) {
   #konzept .box-before:before {
      margin-right: 9px;
      width: 36px;
      height: 36px;
   }
}
@media only screen and (max-width: 460px) {
   #konzept .box-before:before {
      margin-right: 9px;
      width: 28px;
      height: 28px;
   }
}
@media only screen and (max-width: 750px) {
   #konzept .shadow {
      -webkit-box-shadow: none;
      -moz-box-shadow: none;
      box-shadow: none;
   }
   #konzept .margin-mobil {
      margin-bottom: 30px;
   }
}
/*----------------------- konzept unterseiten end*/
/*----------------------- logistik start*/
@media only screen and (max-width: 750px) {
   #logistik .margin-mobil {
      margin-bottom: 30px;
   }
   #logistik .shadow {
      -webkit-box-shadow: none;
      -moz-box-shadow: none;
      box-shadow: none;
   }
}
/*----------------------- logistik end*/
/*----------------------- ueber-uns start*/
@media only screen and (max-width: 750px) {
   #ueber-uns .margin-mobil {
      margin-bottom: 30px;
   }
   #ueber-uns img.margin-mobil {
      margin-top: 30px;
   }
   #ueber-uns .shadow {
      -webkit-box-shadow: none;
      -moz-box-shadow: none;
      box-shadow: none;
   }
}
/*----------------------- ueber-uns end*/
/*----------------------- standorte start*/
@media only screen and (max-width: 1000px) {
   .map-box-right {
      position: relative;
      float: none;
      width: 100%;
      padding: 40px 40px 0px 40px; /*padding bottom: 0 for scroll padding */
      -webkit-box-shadow: none;
      -moz-box-shadow: none;
      box-shadow: none;
   }
   /*add element with height at bottom for scroll padding */
   .map-box-right:after {
      height: 40px;
   }
   .map-box-left {
      position: relative;
      float: none;
      width: 100%;
      z-index: 5;
   }
   .map-box-right img {
      width: 60%;
   }
}
@media only screen and (max-width: 600px) {
   .map-box-right img {
      width: 100%;
   }
}
/*----------------------- standorte end*/
/*----------------------- kontakt start*/
@media only screen and (max-width: 750px) {
   #kontakt .mb-50 {
      margin-bottom: 10px;
   }
}
/*----------------------- kontakt end*/
/*----------------------- misc start*/
@media only screen and (max-width: 750px) {
   .margin-navbar {
      padding-top: 70px;
   }
   .inner-100 {
      padding-top: 30px;
      padding-bottom: 30px;
   }
}
@media only screen and (max-width: 550px) {
   .box p {
      font-size: 1.5rem;
      font-size: 15px;
      line-height: 2.5rem;
      line-height: 25px;
   }
}
@media only screen and (max-width: 550px) {
   #form .btn {
      width: 100%;
   }
}
@media only screen and (max-width: 1100px) {
   .inner-80 {
      padding-top: 20px;
      padding-bottom: 20px;
   }
   .inner-100 {
      padding-top: 20px;
      padding-bottom: 20px;
   }
   .inner-160 {
      padding-top: 80px;
      padding-bottom: 80px;
   }
}
@media only screen and (max-width: 750px) {
   .background-split-right-light-grey, .background-split-left-light-grey {
      background: none;
   }
   .inner-80 {
      padding-top: 40px;
      padding-bottom: 40px;
   }
   .inner-100 {
      padding-top: 40px;
      padding-bottom: 40px;
   }
   .inner-160 {
      padding-top: 40px;
      padding-bottom: 40px;
   }
   .mb-200 {
      display: none;
   }
   .mb-150 {
      margin-bottom: 40px;
   }
   .mb-100 {
      display: none;
   }
}
/*----------------------- misc end*/
/*----------------------- cta start*/
@media only screen and (max-width: 1350px) {
   #cta-konzept img {
      margin-top: 0px;
      margin-left: 0px;
   }
}
@media only screen and (max-width: 1100px) {
   #cta-konzept {
      padding-top: 40px;
      padding-bottom: 40px;
   }
   #cta-konzept h2 {
      margin-top: 18px;
      margin-bottom: 20px;
      font-size: 4.0rem;
      font-size: 40px;
      line-height: 4rem;
      line-height: 40px;
   }
   #cta-konzept h3 {
      font-size: 2.5rem;
      font-size: 25px;
      line-height: 3.4rem;
      line-height: 34px;
   }
}
@media only screen and (max-width: 750px) {
   #cta-konzept {
      padding-top: 10px;
      padding-bottom: 40px;
   }
   #cta-konzept img {
      -webkit-box-shadow: none;
      -moz-box-shadow: none;
      box-shadow: none;
      margin-bottom: 30px;
   }
   #cta-konzept h2 {
      margin-top: 0px;
      text-align: center;
   }
   #cta-konzept h3 {
      margin-top: 20px;
      margin-bottom: 0;
      text-align: center;
      font-size: 2.3rem;
      font-size: 23px;
      line-height: 3.1rem;
      line-height: 31px;
   }
   #cta-konzept .btn {
      position: relative;
      martin-top: 0;
      left: 50%;
      -webkit-transform: translateX(-50%);
      -moz-transform: translateX(-50%);
      -ms-transform: translateX(-50%);
      -o-transform: translateX(-50%);
      transform: translateX(-50%);
   }
}
/*----------------------- cta end*/
/*----------------------- fonts start*/
@media only screen and (max-width: 1000px) {
   h1, h2 {
      font-size: 5rem;
      font-size: 50px;
      line-height: 5.5rem;
      line-height: 55px;
   }
   h3 {
      font-size: 2.5rem;
      font-size: 25px;
      line-height: 2.8rem;
      line-height: 28px;
      margin-bottom: 15px;
   }
}
@media only screen and (max-width: 460px) {
   h1, h2 {
      font-size: 3.8rem;
      font-size: 38px;
      line-height: 4rem;
      line-height: 40px;
      margin-bottom: 20px;
   }
   h3 {
      font-size: 2.3rem;
      font-size: 23px;
      line-height: 2.6rem;
      line-height: 26px;
   }
   p {
      font-size: 1.8rem;
      font-size: 18px;
      line-height: 2.5rem;
      line-height: 25px;
   }
}
/*----------------------- fonts end*/
/*----------------------- footer start*/
@media only screen and (max-width: 1600px) {
   .footer-contact ul {
      font-size: 1.6rem;
      font-size: 16px;
   }
   .footer-contact .intent {
      margin-left: 47px;
      padding-top: 6px;
   }
   .ul-footer-nav {
      font-size: 1.6rem;
      font-size: 16px;
   }
   .ul-footer-nav li {
      float: none;
      padding-right: 0px;
      padding-left: 0px;
      margin-bottom: 10px;
      border-right: none;
   }
   .footer-copyright-text {
      padding-top: 5px;
      font-size: 1.6rem;
      font-size: 16px;
   }
}
@media only screen and (max-width: 999px) {
   .footer-contact {
      margin-top: 16px;
   }
   .footer-contact span {
      float: left;
   }
   .footer-contact .intent {
      margin-left: 47px;
      padding-top: 6px;
      text-align: left;
   }
   .footer-logo {
      float: none;
      display: block;
      margin-top: 0;
      margin-bottom: 5px;
   }
   .footer-logo img {
      width: 42px;
   }
   .footer-copyright-text {
      margin: 0;
      padding-top: 0px;
      text-align: center;
   }
   #footer {
      padding-top: 30px;
      padding-bottom: 30px;
      text-align: center;
   }
   #footer .column-footer, #footer .columns-footer {
      width: 100%;
   }
   #footer h3 {
      margin-top: 0px;
      margin-bottom: 10px;
      padding-bottom: 0px;
      border-bottom: none;
   }
   #footer p {
      font-size: 1.5rem;
      font-size: 15px;
      line-height: 2.2rem;
      line-height: 22px;
   }
   .ul-footer-nav {
      margin-top: 26px;
      margin-bottom: 20px;
      padding-top: 20px;
      padding-bottom: 0;
      list-style: none;
      text-align: center;
      border-top: solid 1px #757575;
   }
   .ul-footer-nav li {
      float: none;
      display: inline-block;
      padding-right: 14px;
      padding-left: 14px;
      border-right: solid 1px #ccc;
   }
   .ul-social-media {
      padding-top: 20px;
      padding-bottom: 20px;
      margin-top: 0;
      margin-bottom: 26px;
      text-align: center;
   }
   .ul-social-media li {
      float: none;
      display: inline-block;
      margin-right: 10px;
      margin-left: 10px;
   }
}
/*----------------------- footer end*/