/*-------------------------------------------------------------------------------------------*/
@media (max-width:1480px){

  .inhaltsbloecke, #phpsingle{margin-top: 130px;}

  #page-header .menubuttonburger{display:block;margin:0 5px 5px;transition:all .3s ease;}
  #page-header .menubuttonburger:focus{outline: none;}
  #page-header #toppermenu{display:none;position: fixed;top: 0;right: 0;bottom: 0;left:60%;background: var(--main);align-content:center;overflow:scroll;}
  #page-header #toppermenu.active{display:block;margin-top:0;transition:all .3s ease;}
  #page-header #toppermenu .menu-topmenu-container{height: 100%;}
  #page-header #toppermenu .menu{height: 100%;margin-top: 140px;display: flex;flex-direction: column;width: 60%;text-align: left;margin-left: 20px;align-items: unset!important;justify-content: unset!important;}
  #page-header .mainmenu #toppermenu .menu li .sub-menu{position: relative;top: 0;left: 0;padding: 15px 10px;margin-top: 0;}
  #page-header .mainmenu #toppermenu .menu li:hover .sub-menu{display: none;}
  #page-header #toppermenu .menu li.menu-item-has-children.open .sub-menu{display: flex;justify-content: space-between;flex-direction: column;}
  #page-header .mainmenu #toppermenu .menu li a{padding: 10px 0;}
  #page-header .mainmenu #toppermenu .menu li .sub-menu li{margin: 10px 0;}
  #page-header .mainmenu #toppermenu .menu li{width: max-content;margin: 10px;}
  #page-header #toppermenu .menu li.menu-item-has-children::after{content: '';display: block;width: 20px;height: 10px;position: absolute;top: 15px;left: 0;background: url('../media/down.png');background-position: center;background-repeat: no-repeat;background-size: 100%;transition: all .3s ease;}
  #page-header #toppermenu .menu li.menu-item-has-children.open::after{transform: rotate(180deg);transition: all .3s ease;}
  #page-header .mainmenu #toppermenu .menu li.btn{position: absolute;bottom: 40px;}
  #page-header.bottom .logo img{max-width: 75%;}
  #page-header.bottom .menubuttonburger{margin: 12px 5px 0;}
  #page-header .topmenu{z-index: 99;position: relative;}
  #page-header .topmenu .info{display: none;}
  #page-header .topmenu a{margin: 0 5px 0 20px;}
  #page-header .logo{height: 50%;}
  #page-header .logo img{max-height: 60px;}
  #page-header .col-sm-3{display: flex;align-items: center;}

  .flx_headerblock .content{width: 60%;}

  .flx_headerblock.mitjobs .content{bottom: 50%;}

  .flx_iconblock.kachel.whitekachel .kachel-col--left .kachel .item span.headline{word-break: break-all;hyphens: auto;}

  #karriere .sidebar .headline{font-size: 200%;}

}
/*-------------------------------------------------------------------------------------------*/
@media (max-width:1199px){

  h1{font-size: 330%;}
  h2{font-size: 220%;}

  .topline{font-size: 140%;}
  .subline{font-size: 160%;}

  .btnlight{font-size: 115%;}

  .owl-controls{width: 100%;}

  .flx_headerblock .content .headerbox .headline{font-size: 350%;width: 100%;}
  .flx_headerblock .content .headerbox .subline{font-size: 160%;}
  .flx_headerblock .badge{right: 1%;}

  .flx_headerblock.mitjobs .item .headline{font-size: 130%;}
  .flx_headerblock.mitjobs .stellen{margin-top: 20px;}

  .flx_iconblock.kachel .kachel-container{margin-top: 115px;}

  .flx_iconblock.drei .item{padding: 0 25px;}

  .flx_referenzen .item .headline{font-size: 225%;}
  .flx_referenzen .item .ort{font-size: 150%;}

  .flx_teamblock .team .col-xl-3.col-lg-6{padding-top: 30px;}

  .flx_iconblock.kachel .textwrapper{width:100%;}

  .flx_iconblock .textwrapper .headline{margin-bottom:25px;}

  #karriere h1{font-size: 200%;}
  #karriere h3{font-size: 150%;}
  #karriere .sidebar .headline{font-size: 150%;}
  #karriere input[type="submit"]{padding: 10px 85px;}

  #phpsingle .content .headline{font-size: 180%;}

  #page-footer .bottom .copyright{width: 100%;order: 2;}
  #page-footer .bottom .links{width: 100%;order: 1;}
  #page-footer .bottom{flex-direction: column;}
 
}
/*-------------------------------------------------------------------------------------------*/
@media (max-width:991px) {

  div[class^="flx_"], div[class*="flx_"]{padding: 50px 0;}

  h1{font-size: 300%;}

  .btn{margin-top: 20px;margin-bottom: 20px;}

  #page-header #toppermenu{left: 40%;}
  #page-header #toppermenu .menu-topmenu-container{height: 80%;}

  .flx_headerblock .content{width: 90%;}
  .flx_headerblock .content .headerbox .subline{margin-bottom: 10px;}
  .flx_headerblock .badge{top: 50%;}

  .flx_headerblock.mitjobs .bild img{height: 400px;object-fit: cover;}
  .flx_headerblock.mitjobs .content{bottom: 70%;}
  .flx_headerblock.mitjobs .stellen .col-lg-4{margin-bottom: 20px;}
  
  .flx_iconblock.drei .row .col-lg-4.col-md-6{padding-top: 30px;}
  .flx_iconblock.drei .item img{max-width: 25%;}

  .flx_seitenteaser.rundgang .bildwrapper .badge{top: -120px;right: 1%;}

  .flx_sliderblock .contentwrapper .headlinewrapper{width: 60%;}

  #page-footer .col-lg-4{margin-top: 40px;}
  #page-footer .main .logowrapper .logo img{width: 250px;}

  .flx_faqblock .accordion .accordion-item .accordion-header button{margin: 20px 0 0;}

}
/*-------------------------------------------------------------------------------------------*/
@media (max-width:767px) {

  div[class^="flx_"], div[class*="flx_"]{padding: 30px 0;}

  h1{font-size: 250%;}
  h2{font-size: 180%;}

  .topline{font-size: 120%;}
  .subline{font-size: 120%;}

  .text{order: 1;}
  .bild{order: 2;margin-top: 20px;}

  .inhaltsbloecke, #phpsingle{margin-top: 100px;}

  #page-header{padding: 15px 0 10px;}
  #page-header .topmenu span.tel, #page-header .topmenu span.mail{display: none;}
  #page-header .telefon::before{width: 30px;height: 30px;top: -15px;}
  #page-header .email::before{width: 35px;height: 35px;top: -15px;}
  #page-header .topmenu a{margin: 0 16px;}
  #page-header .topmenu{padding:  10px 0 0;}
  #page-header #toppermenu .menu{margin-top: 40px;}
  #page-header.bottom .logo img{max-width: 100%;}
  #page-header.bottom .menubuttonburger{margin: 12px 5px;}

  .flx_headerblock.mitvideo video{height: 500px;}
  
  .flx_headerblock .content .headerbox .headline{font-size: 250%;}
  .flx_headerblock .content .headerbox .subline{font-size: 120%;}
  .flx_headerblock .badge{height: 25%;width: 25%;top: 60%;}

  .flx_headerblock.mitjobs .content{bottom: 72%;}

  .flx_seitenteaser.rundgang .badge img{width: 70%;height: 70%;}
  .flx_seitenteaser.rundgang .bildwrapper .badge{right: -9%;}
  .flx_seitenteaser.rundgang .bildwrapper .content{width: 90%;left:5%;}
  .flx_seitenteaser.rundgang .bildwrapper::before{background: linear-gradient(0deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0.5) 100%);}

  .flx_seitenteaser .content{padding: 0;}
  .flx_seitenteaser .content::before{display: none;}

  .flx_sliderblock .slider .item{height: 250px;}

  .flx_iconblock.drei .item img{max-width: 10%;}
  .flx_iconblock.drei .row .col-lg-4.col-md-6{padding-top: 15px;}
  .flx_iconblock.drei .item .headline{font-size: 100%;}

  .flx_iconblock .item .headline{font-size: 110%;}

  .flx_referenzen .item .headline{font-size: 180%;}
  .flx_referenzen .item .ort{font-size: 130%;}

  #phpsingle .text{margin-top: 0;}
  #phpsingle .content .topline{font-size: 100%;}
  #phpsingle .content{margin-top: 10px;}
}
/*-------------------------------------------------------------------------------------------*/
@media (max-width:600px) {

  .btn{margin-bottom: 40px;}

  h1{font-size: 200%;}
  h2{font-size: 140%;}

  .headline{margin-bottom:15px;}
  .topline{font-size: 100%;}
  .subline{font-size: 110%;}

  #page-header .logo img{z-index: 999;position: relative;}
  #page-header #toppermenu{left: 0;}

  .flx_headerblock.mitvideo video{height:365px;}
  .flx_headerblock.mitfarbe{height:200px;min-height:auto;}

  .flx_headerblock .content .headerbox .headline{font-size: 200%;}

  .flx_headerblock.headline{padding: 50px 0!important;}

  .flx_headerblock.mitbild img{height: 400px;}
  .flx_headerblock.mitbild .badge img{height: auto;}
  .flx_headerblock.mitbild .badge{height: 35%;width: 35%;top: 70%;}
  .flx_headerblock.mitbild .content .headerbox .headline{font-size: 180%;}

  .flx_headerblock.mitjobs .content{bottom: 78%;}

  .flx_seitenteaser.rundgang .bildwrapper{height: 700px;}
  .flx_seitenteaser.rundgang .bildwrapper .badge{right:15px;top: -50px;width:175px;}
  .flx_seitenteaser.rundgang .bildwrapper .badge img{width:100%;}

  .flx_iconblock.kachel .kachel-container{flex-direction: column;}
  .flx_iconblock.kachel .kachel-col--left{transform: none;}
  .flx_iconblock.kachel .kachel-container{margin-top: 0;}
  .flx_iconblock.kachel .textwrapper .buttonwrapper{margin-top: 0;}

  .flx_iconblock .item img{max-width: 25%;}

  .flx_iconblock.vier .item{padding: 0 15px;}

  .flx_iconblock.drei .item{padding: 0;}
  .flx_iconblock.drei .item .headline{max-width: 100%;}
  .flx_iconblock.drei{padding: 20px 0;}

  .flx_sliderblock .contentwrapper .textwrapper, .flx_sliderblock .contentwrapper .headlinewrapper{width: 100%;}
  .flx_sliderblock .contentwrapper{flex-direction: column;}
  .flx_sliderblock .buttonwrapper{margin-top: -20px;}

  .flx_bewertungsblock .contentwrapper{flex-direction: column;}
  .flx_bewertungsblock .contentwrapper .headlinewrapper, .flx_bewertungsblock .contentwrapper .textwrapper{width: 100%;}

  .flx_logoblock .contentwrapper{flex-direction: column;}
  .flx_logoblock .contentwrapper .headlinewrapper, .flx_logoblock .contentwrapper .textwrapper{width: 100%;}

  .flx_newsteaser .item .inner{padding: 20px;}

  .flx_referenzen .item .slider, .flx_referenzen .item .vorhernachherslider{margin-top: 20px;}
  .flx_referenzen .item .headline{font-size: 130%;}
  .flx_referenzen .item .ort{font-size: 100%;}

  .flx_faqblock .accordion .accordion-item{margin-bottom: 0;}

  .flx_logoblock .logowrapper .item img{width: 100%;height: 100px;object-fit: contain;}

  #karriere h1{font-size: 175%;}
  #karriere .topline{font-size: 100%;}
  #karriere h2, #karriere h3{font-size: 125%;}
  #karriere{margin-top: 150px;}

  #karriere .singlepage-back{bottom:0;right:0;width:100%;margin:0;padding:20px 0;}

  #page-footer .bottom .links a{margin-left: 0;font-size: 80%;}
  #page-footer .bottom .links{display: flex;justify-content: space-between;}
  #page-footer .bottom .copyright span{font-size: 80%;text-align: center;}
  #page-footer .col-lg-4{margin-top: 30px;}
  #page-footer .main .headline{font-size: 105%;text-align: center;}
  #page-footer p, #page-footer span{font-size: 90%;text-align: center;}
  #page-footer .main .logowrapper .logo img{margin-bottom: 0;}
  #page-footer{padding: 30px 0 0;}

  #page-footer .main .offnungszeitenwrapper .day{width: max-content;min-width: auto;text-align: left;font-weight:400;}
  #page-footer .main .offnungszeitenwrapper .zeit{width: max-content;min-width: auto;text-align: left;display: inline-block;}
  #page-footer .main .offnungszeitenwrapper .zeitraum{text-align: center;}

  #page-footer .main .kontaktwrapper .telefon{width: max-content;margin: 0 auto 10px;}
  #page-footer .main .kontaktwrapper .email{width: max-content;margin: 0 auto 10px;}

  #page-footer .main .anfahrtswrapper .anfahrt{width: max-content;margin: 0 auto;}

  #page-footer .main .socialwrapper .instagram{width: max-content;margin: 0 auto 10px;}
  #page-footer .main .socialwrapper .facebook{width: max-content;margin: 0 auto 10px;}

  #page-footer a.logo{width: max-content;margin: 0 auto;}

}
/*-------------------------------------------------------------------------------------------*/
@media (max-width:400px) {

  body, html, *{font-size: 16px;}

}