@charset "UTF-8";
/*
Theme Name: Umzüge Paul Langen
Theme URI: http://www.umzuege-langen.de/
Author: SIGN+DESIGN Werbeagentur
Author URI: https://www.signunddesign.com/
Description: Wozu lange um den „heißen Brei“ reden: Unser Ziel ist Ihr Erfolg! Denn nur erfolgreiche Kunden sind auf Dauer glückliche Kunden. Und um Sie glücklich zu machen, richten wir unsere Energie auf Ihren stimmigen Auftritt und die Entwicklung zielführender Kommunikationsmaßnahmen. Werbung darf bei uns Spaß machen und ist trotzdem niemals Selbstzweck. Was zählt ist Ihr Erfolg! Die Früchte unserer Bemühungen: treue, langjährige Kunden und zahlreiche Weiterempfehlungen – mit ein Grund dafür, dass viele unserer Kunden aus dem Bereich Immobilien stammen. Und hier liegt auch seit über 20 Jahren ein Schwerpunkt unserer Arbeit.
Version: 2.1
*/

/*Global Reset*/

body,html,h1,h2,h3,h4,h5,h6,p,ul,ol,li{padding:0;margin:0;}
body,html{overflow: unset!important;width:100%;-webkit-font-smoothing:antialiased;-webkit-overflow-scrolling:touch;}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block;}

/* ########## Fonts ++ WICHTIG font-display: swap; ++ ########## */

.floating_new {
  border: none;
    border-radius: 10px !important;
    background-color: var(--primary-color);
    color: white !important;
    z-index: 10000;
    box-shadow: 0 0 50px 0 rgba(0,0,0,.4) !important;
    margin: 0;
    font-size: 18px !important;
    line-height: 24px !important;
    font-weight: bold !important;
    text-align: center !important;
    text-decoration: none !important;
    
  }
  .floating_new:hover{
    background-color: var(--secondary-color);
    color: white !important;
  }
  
  @media screen and (min-width: 478px) {
  .floating_new{
    padding: 0.66em 0.5em;
    position: fixed;
    top: 46vh;
    border: none;
    right: 1rem;
    width: 130px;
  }
    .floating_new:hover{
      background-color: #002B54;
    }
  .arrow_1 {
  font-size: 30px !important;
  margin: 2px auto 7px auto !important;
  }
  .arrow_1 img {
  width: 50px !important;
  }
    .arrow_2 {
  display: none !important;
  }
  }
  @media screen and (max-width: 477px) {
  .floating_new{
  padding: 0.7em 1em 0.5em 1.5em;
  position:fixed;
  right: 5px;
  bottom: 5px;
  height:47px;
  }
  .arrow_1 {
  display: none;
  }
  }

/* ########## Variables ########## */

* {
    --font-family: "Open Sans", sans-serif;
    --transition: .45s ease;
    --wrp-width: 1240px;
    --font-size: 18px;
    --line-height: calc(var(--font-size) * 1.8);
    --box-shadow: 0px 5px 13px 0px rgba(0, 0, 0, 0.3);
    --border-radius: 15px;
    --primary-color: #DA0031;
    --secondary-color: #00315D;
    --text-color: #707172;
}

/* ########## Globals ########## */
body.nav-open {overflow: hidden !important;}

html {scroll-behavior: smooth;}
body {font-size: var(--font-size); font-family: var(--font-family), sans-serif; line-height: var(--line-height); color: var(--text-color);}
img {-ms-interpolation-mode:bicubic; vertical-align: bottom;}
svg {width: 100%; height: 100%;}
hr {border:none;height:1px;background:#ddd; margin:0;}

.wrp {max-width: var(--wrp-width); width: 90%; margin: 0 auto; position:relative; box-sizing:border-box;}

/* Margins */

.mb {margin-bottom: 100px;}
.mb50 {margin-bottom: 50px;}

@media (max-width: 500px) {
  .mb {margin-bottom: 50px;}
  .mb50 {margin-bottom: 25px;}
}

/* Page Build */

main.withsidebar .page-build {display: grid; grid-template-columns: 68% 25%; align-items: flex-start; justify-content: space-between; max-width: var(--wrp-width); width: 90%; margin: 0 auto;}
main.withsidebar .content .wrp {width: 100%;}

@media (max-width: 1024px) {
    main.withsidebar .page-build {grid-template-columns: 100%;}
    main.withsidebar .page-build .sidebar {display: none;}
}

/* Typo Styles */

h1{margin:0 0 30px 0;font-size:35px;line-height:45px;color:var(--secondary-color);text-transform:uppercase}
h2{margin:0 0 30px 0;font-size:30px;line-height:40px;color:var(--secondary-color);text-transform:uppercase}
h3{margin:15px 0;font-size:24px;line-height:34px;color:var(--secondary-color);text-transform:uppercase}

a {text-decoration: none; outline:none !important; color: var(--text-color); transition: var(--transition);}
a:hover {color: var(--secondary-color); transition: var(--transition);}

.btn {padding: 12px 16px; background: var(--primary-color); display: inline-block;}

p {margin-bottom: var(--line-height);}
p:last-child {margin-bottom: 0;}
address {font-style: normal; color: var(--text-color);}
address a {display: block;}
ol, ul {margin-bottom: var(--line-height);}
li {margin-left: 20px;}

/* ########## Mainnav ########## */

#mainnav ul.mainnav.smart {display:none;}
#mainnav {display: block; transform: translate(0);}
#mainnav ul.mainnav.desktop li {font-family:"din-1451-lt-pro", sans-serif;text-transform:uppercase;list-style-type: none; font-size: 17px; margin-left: 25px;}
#mainnav ul.mainnav.desktop li:first-child {margin-left:0;}
#mainnav ul.mainnav.desktop li a{display:block; color: var(--text-color); transition: var(--transition); padding:20px 0;}
.scrolled #mainnav ul.mainnav.desktop li a{display:block; color: var(--text-color); transition: var(--transition); padding: 10px 0;}
#mainnav ul.mainnav.desktop li.menu-item-type-custom a{display:block; color: #fff; transition: var(--transition); padding: 5px 40px;box-sizing:border-box;background:var(--secondary-color);border-radius:20px}
#mainnav ul.mainnav.desktop li.menu-item-type-custom a:hover{color: #fff;background:var(--primary-color);transition: var(--transition);}
#mainnav ul.mainnav.desktop li a:hover, #mainnav ul.mainnav.desktop li.current-menu-item a{color: var(--primary-color); transition: var(--transition);}
#mainnav ul.mainnav.desktop li.current-page-ancestor a{color: var(--primary-color); transition: var(--transition);}

/* Submenu */

@media (min-width: 1151px){

    #mainnav ul.mainnav.desktop {display: flex; align-items: center; margin: 0;}
    html.scrolled #mainnav ul.mainnav li a {padding: 15px 0; transition: var(--transition);}

    #mainnav ul.mainnav li.menu-item-has-children {position: relative;}
    #mainnav ul.mainnav li.menu-item-has-children ul.sub-menu {position: absolute; top: 115px; left: 0; display: block; height: auto; max-height: 0; overflow: hidden;}
    .scrolled #mainnav ul.mainnav li.menu-item-has-children ul.sub-menu {top: 89px;}
    #mainnav ul.mainnav li.menu-item-has-children ul.sub-menu li {width:350px; height: 100%;box-sizing:border-box;transition: 0.8s ease; background: rgba(255,255,255, 0.9); margin: 0 0 5px 0;}
    #mainnav ul.mainnav li.menu-item-has-children:hover > ul.sub-menu {max-height: 674px; padding: 0; overflow: visible; margin-top: -6px;}

    #mainnav ul.mainnav li.menu-item-has-children ul.sub-menu li:hover {background: var(--primary-color);}
    #mainnav ul.mainnav li.menu-item-has-children ul.sub-menu li:hover a {color: #fff;}
    #mainnav ul.mainnav li.menu-item-has-children ul.sub-menu li a {font-size:18px;color:var(--text-color);padding: 10px;}
    #mainnav ul.mainnav li.menu-item-has-children ul.sub-menu li.current-menu-item a {color: #fff;background:var(--primary-color);transition: var(--transition);}
    #mainnav ul.mainnav li.menu-item-has-children ul.sub-menu li:last-child {margin-bottom: 0;}

    /* Zweite Ebene */

    #mainnav ul.mainnav li.menu-item-has-children ul.sub-menu li.menu-item-has-children ul.sub-menu {position: absolute; left: 100%; top: 6px; overflow: hidden;}
    #mainnav ul.mainnav li.menu-item-has-children ul.sub-menu li.menu-item-has-children:hover ul.sub-menu {overflow: visible;}
    #mainnav ul.mainnav li.menu-item-has-children ul.sub-menu li.menu-item-has-children ul.sub-menu li {background: #f5f5f5;}
    #mainnav ul.mainnav li.menu-item-has-children ul.sub-menu li.menu-item-has-children ul.sub-menu li a {color: var(--text-color);}
    #mainnav ul.mainnav li.menu-item-has-children ul.sub-menu li.menu-item-has-children ul.sub-menu li:hover a {color: var(--primary-color);}

    /* Desktop ausblenden */

    #mainnav .head,
    #mainnav address.contact,
    #mainnav ul.mainnav li.back {display: none;}
}

@media (max-width: 4500px) {


    /* Offcanvas */

    #mainnav-smart ul.mainnav.smart {display:block;}
    #mainnav-smart {position: fixed; top: 0; right: 0; bottom: 0; background: rgba(254,252,250, 0.9); width: 100%; max-width: 850px; transform: translateX(100%); transition: var(--transition); box-shadow: var(--box-shadow); z-index: 88;}
    #mainnav-smart.active {transform: translateX(0); transition: var(--transition);}
    #mainnav-smart .head {display: grid;grid-template-columns: auto auto 55px; align-items: center; padding: 20px 20px 20px 0; box-sizing: border-box; box-shadow: 0 0 8px rgba(0,0,0,0.05);}
    #mainnav-smart .head p {margin: 0; font-size: 25px; color: var(--text-color);}
    #mainnav-smart .head .buttons {display: flex; justify-content: center;justify-self: end;}

    #mainnav-smart .head .buttons a {width: 50px; height: 50px; border-radius: 2px; background: var(--primary-color); margin-left: 5px; display: flex; align-items: center; justify-content: space-around; }
    #mainnav-smart .head .buttons a:first-child {margin-left: 0;}
    #mainnav-smart .head .buttons a svg {width: 25px; height: 25px;}
    #mainnav-smart .head .buttons a svg g path {stroke: #fff}

    /* Submenu */

    #mainnav-smart ul.mainnav.smart {display: block;}
    #mainnav-smart ul.mainnav li {padding: 0; box-sizing: border-box; margin:0; border-bottom: 1px solid rgba(255,255,255, 0.5);background: none;list-style-type: none;}
    #mainnav-smart ul.mainnav li:hover {padding: 0; box-sizing: border-box; margin:0; background:none;list-style-type: none;}
    #mainnav-smart ul.mainnav li.current-menu-item a{background:var(--primary-color);list-style-type: none;}
    #mainnav-smart ul.mainnav li.current_page_ancestor a {background:var(--primary-color);}
    #mainnav-smart ul.mainnav li.menu-item-1117 {background: var(--secondary-color);font-weight: 700;color: #fff;list-style-type: none;position: absolute;top: 20px;right: 200px;text-align: center;border-radius: 30px;}
    #mainnav-smart ul.mainnav li a {padding: 13px 45px 13px 5%;display: block;text-transform: uppercase;font-size:18px;}
    #mainnav-smart ul.mainnav li:hover a {color:var(--text-color);}
    #mainnav-smart ul.mainnav li.current-menu-item a {color:#fff}
    #mainnav-smart ul.mainnav li.current_page_ancestor a {color:#fff;}
    #mainnav-smart ul.mainnav li.menu-item-1117 a {text-align:center;padding:8px 30px;color:#fff;}
    #mainnav-smart .opensubnav {cursor: pointer; width: 49px; height: 52px; position: absolute; right: 0; background:none; display: block; z-index: 100; box-sizing: border-box;}
    #mainnav-smart .opensubnav.active {background: var(--primary-color);}
    #mainnav-smart .opensubnav:after  {content: ''; transform: rotate(-45deg) translate(-50%, -50%); border: solid var(--text-color); border-width: 0 4px 4px 0; display: inline-block; padding: 3px; left: 50%; top:42%; position: absolute; transition: var(--transition);}
    #mainnav-smart .opensubnav.active:after  {content: ''; transform: rotate(45deg); -webkit-transform: rotate(45deg);  border: solid #fff; border-width: 0 4px 4px 0; left: 19px; top:18px; transition: var(--transition);}
    #mainnav-smart ul.mainnav li.current-menu-item .opensubnav:after {content: ''; transform: rotate(-45deg) translate(-50%, -50%); border: solid #fff; border-width: 0 4px 4px 0; display: inline-block; padding: 3px; left: 50%; top:42%; position: absolute; transition: var(--transition);}
    #mainnav-smart ul.mainnav li.current-menu-item .opensubnav.active:after  {content: ''; transform: rotate(45deg); -webkit-transform: rotate(45deg);  border: solid #fff; border-width: 0 4px 4px 0; left: 19px; top:18px; transition: var(--transition);}
    #mainnav-smart ul.mainnav li.current-page-ancestor .opensubnav:after {content: ''; transform: rotate(-45deg) translate(-50%, -50%); border: solid #fff; border-width: 0 4px 4px 0; display: inline-block; padding: 3px; left: 50%; top:42%; position: absolute; transition: var(--transition);}
    #mainnav-smart ul.mainnav li.current-page-ancestor .opensubnav.active:after  {content: ''; transform: rotate(45deg); -webkit-transform: rotate(45deg);  border: solid #fff; border-width: 0 4px 4px 0; left: 19px; top:18px; transition: var(--transition);}
    #mainnav-smart address.contact {padding: 5%; box-sizing: border-box; display: block;}

    /* Offcanvas Sub Layer 1 */

    #mainnav-smart li.menu-item-has-children ul.sub-menu {display: none; transition: var(--transition); margin-bottom: 0;}
    #mainnav-smart li.menu-item-has-children.active ul.sub-menu {display: block;margin-left: 5%;margin-bottom:30px}
    #mainnav-smart li.menu-item-has-children.active ul.sub-menu li {border-bottom:0;font-size:16px;}
    #mainnav-smart li.menu-item-has-children.active ul.sub-menu li a {color:var(--text-color);font-size:15px;background:none;padding: 0;margin:10px 0}
    #mainnav-smart li.menu-item-has-children.active ul.sub-menu li:hover a {background:none;}
    #mainnav-smart li.menu-item-has-children.active ul.sub-menu li.current-menu-item {background:none;}
    #mainnav-smart li.menu-item-has-children.active ul.sub-menu li.current-menu-item a {background:none;color:var(--primary-color);}
    #mainnav-smart li.menu-item-has-children.active ul.sub-menu li ul.sub-menu li a {padding-left: 10%;}

    /* Offcanvas Sub Layer 2 */

    #mainnav-smart li.menu-item-has-children ul.sub-menu li.menu-item-has-children .opensubnav {background: #f5f5f5;}
    #mainnav-smart li.menu-item-has-children.active ul.sub-menu li.menu-item-has-children ul.sub-menu {display: none; transition: var(--transition);}
    #mainnav-smart li.menu-item-has-children.active ul.sub-menu li.menu-item-has-children.active ul.sub-menu {display: block; transition: var(--transition);}

    #mainnav-smart ul.offcanvas-menu li.back a:before {display: none;}

    /* Mainnav Toggle */

    .mainnav-toggle {border-radius: 2px; display: block!important; position: relative; z-index: 10;width: 50px;height: 50px;background: var(--primary-color);box-shadow:none; transition: var(--transition);}
    .mainnav-toggle.off {border-radius: 2px; display: block!important; position: fixed; z-index: 10; top: 50px; right: 30px;transform: translateY(-50%);width: 40px;height: 40px;background:none;transition: var(--transition);}
    .scrolled .mainnav-toggle.off {top: 35px;transition: var(--transition);}
    .mainnav-toggle.off.active {display:none!important}
    .mainnav-toggle .btn-mainnav-toggle {position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);width: 35px;cursor: pointer;}
    .mainnav-toggle .btn-mainnav-toggle span {display: block;width: 100%;border-radius: 4px;height: 2px;background: var(--text-color);transition: all .3s;position: relative;}
    .mainnav-toggle.active .btn-mainnav-toggle span {display: block;width: 100%;border-radius: 4px;height: 2px;background: #fff;transition: all .3s;position: relative;}
    .mainnav-toggle .btn-mainnav-toggle span + span {margin-top: 7px;}
    .mainnav-toggle .btn-mainnav-toggle.active span + span {margin-top: 13px;}
    .mainnav-toggle .btn-mainnav-toggle.active span:nth-child(1) {animation: ease .7s top forwards;}
    .mainnav-toggle .btn-mainnav-toggle.not-active span:nth-child(1) {animation: ease .7s top-2 forwards;}
    .mainnav-toggle .btn-mainnav-toggle.active span:nth-child(2) {animation: ease .7s scaled forwards;}
    .mainnav-toggle .btn-mainnav-toggle.not-active span:nth-child(2) {animation: ease .7s scaled-2 forwards;}
    .mainnav-toggle .btn-mainnav-toggle.active span:nth-child(3) {animation: ease .7s bottom forwards;}
    .mainnav-toggle .btn-mainnav-toggle.not-active span:nth-child(3) {animation: ease .7s bottom-2 forwards;}

    @keyframes top { 0% {top: 0; transform: rotate(0);} 50% {top: 15px;transform: rotate(0);} 100% {top: 15px;transform: rotate(45deg);} }
    @keyframes top-2 { 0% {top: 15px;transform: rotate(45deg);} 50% {top: 15px;transform: rotate(0deg);} 100% {top: 0;transform: rotate(0deg);} }
    @keyframes bottom { 0% {bottom: 0;transform: rotate(0);} 50% {bottom: 15px;transform: rotate(0);} 100% {bottom: 15px;transform: rotate(135deg);} }
    @keyframes bottom-2 { 0% {bottom: 15px;transform: rotate(135deg);} 50% {bottom: 15px;transform: rotate(0);} 100% {bottom: 0;transform: rotate(0);} }
    @keyframes scaled { 50% {transform: scale(0);} 100% {transform: scale(0);} }
    @keyframes scaled-2 { 0% {transform: scale(0);} 50% {transform: scale(0);} 100% {transform: scale(1);} }

    #mainnav-overlay {position: fixed; top: 0; right: 0; left: 0; bottom: 0; background: rgba(0,0,0,0.2); backdrop-filter: blur(7px); opacity: 0; z-index: -5; transition: var(--transition); visibility: hidden;}
    #mainnav-overlay.active {opacity: 1; z-index: 1; visibility: visible; transition: var(--transition);}
}

/* ########## Header ########## */

header {position: fixed; top: 0; width: 100%; z-index: 10; padding: 15px 0; box-sizing: border-box; background: #fff; box-shadow: var(--box-shadow);transition: var(--transition);}
.scrolled header {padding: 10px 0;transition: var(--transition);}
header .header-grid {display: grid; grid-template-columns: 200px auto; grid-template-rows: auto; justify-items: start; align-items: center; justify-content: space-between;transition: var(--transition);}
.scrolled header .header-grid {display: grid; grid-template-columns: 130px auto;transition: var(--transition);}
header .header-grid .logo {width: 100%;}
header .header-grid .logo a {display: flex; align-items: center;}
header .header-grid .mainnav-toggle {display: none;justify-self: end;}

/* Kopfbereich Startseite / Unterseite  */

.stage {aspect-ratio: 3/1; width: 100%; min-height: 400px; position: relative; margin-top: 90px;background:#000;}
.stage .wrp {position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); z-index: 2;}
.stage img {width: 100%; height: 100%; object-fit: cover; object-position: center;}
.stage.subpage {aspect-ratio: 3/.7; width: 100%; position: relative;}
.stage h2 {display:block;margin:0;color:#fff;font-size:43px;line-height:60px;font-weight:700;text-transform: uppercase;text-shadow: 1px 1px 2px rgba(0,0,0, 0.7);}
.stage p {display:block;color:#fff;margin:0;font-size:20px;line-height:32px;font-weight:600;text-shadow: 1px 1px 2px rgba(0,0,0, 0.7);}

.stage .wrp .btn {font-size:18px;background:var(--primary-color);display: inline-block;padding: 10px 40px;color:#fff;font-weight:600;border-radius:30px;margin:20px 5px;transition: var(--transition);}
.stage .wrp .btn:hover {background:var(--secondary-color);transition: var(--transition);}

.introblock .wrp {position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); z-index: 2;}
.introblock h2 {display:block;margin:0;color:#fff;font-size:43px;line-height:60px;font-weight:700;text-transform: uppercase}
.introblock p {display:block;margin:0;color:#fff;font-size:20px;line-height:32px;font-weight:600;}
.introblock .btn {margin-top:30px;margin-right:10px;padding: 13px 40px;background: var(--primary-color);display: inline-block;border:1px solid var(--primary-color);color:#fff;font-size:18px;font-weight:700;text-align:center;border-radius:40px; transition: var(--transition);}
.introblock .btn-border {margin-top:30px;padding: 13px 40px;background: none;display: inline-block;border:1px solid var(--primary-color);color:#fff;font-size:18px;font-weight:700;text-align:center;border-radius:40px; transition: var(--transition);}
.introblock .btn:hover {background: var(--secondary-color);border:1px solid var(--secondary-color); transition: var(--transition);}
.introblock .btn-border:hover {background: var(--secondary-color);border:1px solid var(--secondary-color); transition: var(--transition);}

/* ########## Content ########## */

/* Text */

.text.multiple-col .wrp {-webkit-columns: 2 350px; -moz-columns: 2 350px; columns: 2 350px; -webkit-column-gap: 4em; -moz-column-gap: 4em; column-gap: 4em;}
.text.align-center {text-align: center;}
.text .wrp h3 {margin-bottom:40px;font-size: 30px;line-height: 40px;}
/* Text Bild */

.textbild .wrp {display: grid; align-items: center; justify-content: space-between; box-sizing: border-box; background: #fff;}
.textbild .text {border-radius: 5px 0 0 5px; box-sizing: border-box;}
.textbild .bild {width: 100%; height: 100%;}
.textbild .bild img {width: 100%; height: 100%; object-fit: cover;}

@media (max-width: 768px) {
    .textbild .text {order: 1!important;}
    .textbild .bild {order: 2!important;}
    .textbild .wrp {grid-template-columns: 100%!important; gap: 50px;}
}

/* Teasercards */

.teasercards .cards.no-carousel {display: grid; grid-column-gap: 50px; grid-row-gap: 50px; margin: 0;}
.teasercards .cards.no-carousel li {list-style-type: none; margin: 0;}
.teasercards .splide ul.cards {display: flex; grid-column-gap: unset;}
.teasercard-item {position:relative;}
.teasercard-item .img-wrp {width: 100%; aspect-ratio: 2/1.5; display: block;}
.teasercard-item .img-wrp img {width: 100%; height: 100%; object-fit: cover;border-radius: 5px;}

.teasercard-item .teasercard-content {display: block;min-height:280px;}
.teasercard-item .teasercard-content .btn {position: absolute;bottom: 0;padding: 7px 30px;background:var(--primary-color);display: inline-block;color:#fff;font-size:16px;font-weight:600;border-radius:30px;margin:20px 0;transition: var(--transition);}
.teasercard-item:hover .teasercard-content .btn {background:var(--secondary-color);transition: var(--transition);}
.teasercard-item .teasercard-content h3 {font-size:22px;}

.splide__arrow--next {right:-5%!important}
.splide__arrow--prev {left:-5%!important}

@media (max-width: 1150px) {
    #mainnav {display:none;}
}

@media (max-width: 1024px) {
    .teasercards .cards.no-carousel {grid-template-columns: repeat(2, 1fr)!important;}
}

@media (max-width: 500px) {
    .teasercards .cards.no-carousel {grid-template-columns: 100% !important;}
}

/* Image */

.image img {display:block; width:100%; height:auto;}

.bildtrenner {width:100%; aspect-ratio:4/.7; overflow: hidden; position: relative;background:#000;}
.bildtrenner img {width:100%; height: 100%; object-fit: cover; object-position: center;filter: blur(5px);opacity:0.4}
.bildtrenner .wrp {position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); z-index: 2;}
.bildtrenner .wrp .stage-content p {font-size:30px;font-weight:700;line-height:40px;text-align:center;color:#fff;text-shadow: 1px 1px 2px rgba(0,0,0, 0.7);text-transform:uppercase}
.bildtrenner .wrp .stage-content .buttons {text-align:center}
.bildtrenner .wrp .stage-content .btn {font-size:18px;background:var(--primary-color);display: inline-block;padding: 10px 40px;color:#fff;font-weight:600;border-radius:30px;margin:20px 5px;transition: var(--transition);}
.bildtrenner .wrp .stage-content .btn:hover {background:var(--secondary-color);transition: var(--transition);}

/* Galerie */

.gallery .glightbox-gallery:not(.masonry) {display: grid; gap: 50px; margin-bottom: 0;}
.gallery .glightbox-gallery li {list-style-type: none; margin: 0 0 25px 0; border-radius: 5px;overflow: hidden; aspect-ratio: 1;}
.gallery .glightbox-gallery:not(.masonry) li {margin: 0;}
.gallery .glightbox-gallery li a {position: relative; display: block; overflow: hidden; height: 100%;}
.gallery .glightbox-gallery li a .overlay {width: 100%; position: absolute; height: 100%; top: 0; left: 0; right: 0; bottom: 0; background: var(--secondary-color); opacity: 0; transition: var(--transition);}
.gallery .glightbox-gallery li a:hover .overlay {opacity: 0.6; transition: var(--transition);}
.gallery .glightbox-gallery li a .overlay .icon-wrp {position: absolute; top: 50%; left: 50%; width: 45px; height: 45px; transform: translate(-50%, -50%);}
.gallery .glightbox-gallery li a .overlay .icon-wrp svg {width: 100%; height: 100%; transform: scale(0); transition: var(--transition);}
.gallery .glightbox-gallery li a .overlay .icon-wrp svg path {fill: #fff;}
.gallery .glightbox-gallery li a:hover .overlay .icon-wrp svg { transform: scale(1); transition: var(--transition);}
.gallery .glightbox-gallery li img {width: 100%; height: 100%; object-fit: cover;}
.gallery .glightbox-gallery.masonry {gap: 25px; columns: 4; margin: 0 auto;}

.gallery .video-gallery-grid {display: grid; grid-column-gap: 50px; grid-row-gap: 50px;}
.gallery .video-gallery-grid .video-gallery-item {height: 220px; width: 100%; display: block; position: relative; overflow: hidden;}
.gallery .video-gallery-grid .video-gallery-item .overlay {width: 100%; position: absolute; height: 100%; top: 0; left: 0; right: 0; bottom: 0; background: var(--secondary-color); opacity: 0; transition: var(--transition); z-index: 4;}
.gallery .video-gallery-grid .video-gallery-item:hover .overlay {opacity: 0.6; transition: var(--transition);}
.gallery .video-gallery-grid .video-gallery-item .overlay .icon-wrp {position: absolute; top: 50%; left: 50%; width: 45px; height: 45px; transform: translate(-50%, -50%);}
.gallery .video-gallery-grid .video-gallery-item .overlay .icon-wrp svg {width: 100%; height: 100%; transform: scale(0); transition: var(--transition);}
.gallery .video-gallery-grid .video-gallery-item .overlay .icon-wrp svg path {fill: #fff!important;}
.gallery .video-gallery-grid .video-gallery-item:hover .overlay .icon-wrp svg { transform: scale(1); transition: var(--transition);}
.gallery .video-gallery-grid .video-gallery-item img {height: 100%; width: 100%; object-fit: cover; object-position: center; transform: scale(1.2);}


@media (max-width: 1024px) {
  .gallery .glightbox-gallery {grid-template-columns: repeat(3, 1fr)!important;}
  .gallery .video-gallery-grid {grid-template-columns: repeat(2, 1fr)!important;}
  .gallery .filterrow {display: grid; grid-template-columns: 100%; gap: 25px;}
  .gallery .filterrow #filter {flex-wrap: wrap;}
}

@media (max-width: 550px) {
  .gallery .video-gallery-grid {grid-template-columns: 100%!important;}
  .gallery .glightbox-gallery {grid-template-columns: repeat(2, 1fr)!important;}
}

/* oEmbed */

.embed .respo-video{position: relative;height: 0;overflow: hidden;}
.embed .respo-video iframe {position: absolute; top: 0; left: 0; width: 100%;	height: 100%;}
.embed .respo-video ._brlbs-cb-youtube {margin-bottom: -56.25%;}

/* Accordion */

.accordion .item-accordion-head {cursor: pointer; position: relative; background: #f2f2f2; margin-bottom:10px; padding:20px; border:1px solid #f2f2f2;text-transform:uppercase;font-weight:600;}
.accordion .active .item-accordion-head {color:var(--secondary-color);background-color:#f8f8f8}
.accordion .item-accordion-btn {width: 26px; height: 26px;float: right; margin: 0; cursor: pointer; position: absolute; right: 5px; top: 50%; transform: translateY(-50%);}
.accordion .item-accordion-btn:before {content: '+'; color: #555; position: absolute; width: 26px; height: 26px; text-align: center; line-height: 22px; font-size: 24px;}
.accordion .item-accordion {margin-bottom: 5px; }
.accordion .item-accordion.hidden .item-accordion-btn:before {content: '+'; line-height: 26px;}
.accordion .item-accordion.active .item-accordion-btn:before {content: '-'; line-height: 22px; }
.accordion .item-accordion.hidden.active .item-accordion-btn:before {content: '-'; line-height: 22px;}
.accordion .item-accordion.hidden .item-accordion-content {display: none;padding:20px 20px;background:#f8f8f8;margin-bottom:10px;}
.accordion .item-accordion.hidden .item-accordion-content:after {display:block;width: 0;height: 0;border-right: 100px solid #037CA9;border-top: 50px solid transparent;border-bottom: 50px solid transparent;}
.accordion .item-accordion.hidden .item-accordion-content p a {padding: 5px 20px;background:var(--primary-color);display: inline-block;color:#fff;font-size:14px;font-weight:600;border-radius:30px;margin:10px 0;transition: var(--transition);}
.accordion .item-accordion.hidden .item-accordion-content p a:hover {background:var(--secondary-color);transition: var(--transition);}


/* ########## Blog + Sidebar ########## */

main.withsidebar .content .blog-grid {display: grid; grid-template-columns: repeat(3, 1fr); grid-column-gap: 50px; grid-row-gap: 50px;}
main.withsidebar .content .blog-grid .post {width: 100%;}
main.withsidebar .content .blog-grid .post img {width: 100%; height: auto; object-fit: cover;}

article.singlepost .post-image {}
article.singlepost .post-image img {width: 100%; height: auto; object-fit: cover;}

/* Sidebar */

main.withsidebar .sidebar {width: 100%; position: -webkit-sticky; position: sticky; top: 150px;padding: 0; box-sizing: border-box;}
main.withsidebar .sidebar .sidebar-content {background:#f2f2f2;padding:20px;}


@media (max-width: 1024px) {
    main.withsidebar .page-build .sidebar {display: none;}
    #mainnav {
        display: none;
        transform: translate(0);
    }
}

@media (max-width: 768px) {
    main.withsidebar .content .blog-grid {grid-template-columns: repeat(2, 1fr);}
}

/* ########## Footer ########## */

footer {background:var(--secondary-color);color:#fff;font-size:16px;font-weight:400;text-align:center;padding:25px 0}
footer a {color:#fff;font-weight:700;display:inline-block;margin: 0 5px}
footer a:hover {color:#fff;}

/* Bottom */

.bottom .wrp {display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap;font-size:14px;padding:10px 0}
.bottom .wrp ul {list-style-type: none;margin:0;}
.bottom .wrp ul li{display:inline-block;margin:0;}
.bottom .wrp ul li:after{display:inline-block;margin:0 0 0 5px;content:"-"}
.bottom .wrp ul li:nth-child(4):after{display:none;}

/* 404 */

.error404 .stage {display: none;}
.pageerror {padding: 250px 0 100px 0; text-align: center;}
@media (max-width: 1420px) {
    #mainnav ul.mainnav.desktop {margin-right:30px;}
    #mainnav ul.mainnav.desktop li {font-size:17px;margin-left:30px;}
}
@media (max-width: 1300px) {
    #mainnav ul.mainnav.desktop li {font-size:16px;margin-left:20px;}
}
@media (max-width: 1100px) {
    .teasercard-item .teasercard-content {
        display: block;
        min-height: 320px;
    }
	header .header-grid {grid-template-columns: 170px auto;}
}
@media (max-width: 1024px) {
    .teasercard-item .teasercard-content {
        min-height: 270px;
    }
    .introblock h2 {
        font-size: 30px;
        line-height: 42px;
    }
    .stage h2 {
        font-size: 30px;
        line-height: 42px;
    }
    .stage p {font-size:18px;}
    .stage .wrp .btn {font-size:16px;padding: 8px 30px;}
    h1 {
        margin: 0 0 30px 0;
        font-size: 30px;
        line-height: 45px;
        color: var(--secondary-color);
        text-transform: uppercase;
    }
    h2 {
        margin: 0 0 30px 0;
        font-size: 24px;
        line-height: 40px;
        color: var(--secondary-color);
        text-transform: uppercase;
    }
    .text .wrp h3 {
        margin-bottom: 40px;
        font-size:24px;
        line-height: 40px;
    }
    .bildtrenner {
        width: 100%;
        aspect-ratio: 4 / 1;
        overflow: hidden;
        position: relative;
        background: #000;
        min-height: 310px;
    }
    .bildtrenner .wrp .stage-content p {
        font-size: 24px;
    }
    .bildtrenner .wrp .stage-content .btn {font-size:16px;padding: 8px 30px;}
}
@media (max-width: 820px) {
    .teasercard-item .teasercard-content {
        min-height: 310px;
    }
    .gallery .glightbox-gallery:not(.masonry) {gap:20px;}
}
@media (max-width: 640px) {
    .stage p {display:none;}
    .stage .wrp .btn {margin:20px 10px 0 0}
    .teasercards .cards.no-carousel {
        grid-template-columns: 100% !important;
    }
    .teasercard-item .teasercard-content {
        min-height: inherit;
    }
    .teasercard-item .teasercard-content .btn {position:relative;bottom:inherit;}
    .bottom .wrp {display:block;text-align:center}
}
@media (max-width: 580px) {
    .bildtrenner .wrp .stage-content .btn {
        font-size: 14px;
        padding: 8px 20px;
    }
    .bildtrenner .wrp .stage-content p {
        font-size: 20px;line-height:32px
    }
    .teasercard-item .img-wrp {
        width: 100%;
        aspect-ratio: 2 / .7;
        display: block;
    }
    .stage.mb {margin-bottom:40px;}
    .mb {margin-bottom:70px;}
}