/*
Theme Name: Reisswolf
Theme URI: https://www.reisswolf.ch
Author: Serdar Zengin
Author URI: -
Description: Client-Theme Reisswolf
Version: 1.0
*/

/*----------------------------------------------------------------------
build in: 06 2024
copyright: -
----------------------------------------------------------------------*/

.admin-bar header {
  margin-top: 32px;
}

/*----------------------------------------------------------------------
colors
----------------------------------------------------------------------*/

:root {
    --sulo-red: #004494;
    --sulo-white: #FFFFFF;
    --sulo-black: #000000;
    --sulo-deepgrey: #2e3235;
    --sulo-darkgrey: #333333;
    --sulo-midgrey: #444444;
    --sulo-smokegrey: #646467;
    --sulo-lightgrey: #e6e6e6;
    --sulo-green: #76B843;
    --sulo-blue: #0073aa;
    --sulo-yellow: #ffc06d;
    --sulo-red-rgb:38,135,194;
    }


/*----------------------------------------------------------------------
Fonts
----------------------------------------------------------------------*/

/* dosis-200 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Dosis';
  font-style: normal;
  font-weight: 200;
  src: url('fonts/dosis-v32-latin-200.eot'); /* IE9 Compat Modes */
  src: url('fonts/dosis-v32-latin-200.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/dosis-v32-latin-200.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('fonts/dosis-v32-latin-200.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
       url('fonts/dosis-v32-latin-200.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
       url('fonts/dosis-v32-latin-200.svg#Dosis') format('svg'); /* Legacy iOS */
}
/* dosis-300 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Dosis lght';
  font-style: normal;
  font-weight: 300;
  src: url('fonts/dosis-v32-latin-300.eot'); /* IE9 Compat Modes */
  src: url('fonts/dosis-v32-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/dosis-v32-latin-300.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('fonts/dosis-v32-latin-300.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
       url('fonts/dosis-v32-latin-300.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
       url('fonts/dosis-v32-latin-300.svg#Dosis') format('svg'); /* Legacy iOS */
}
/* dosis-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Dosis regular';
  font-style: normal;
  font-weight: 400;
  src: url('fonts/dosis-v32-latin-regular.eot'); /* IE9 Compat Modes */
  src: url('fonts/dosis-v32-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/dosis-v32-latin-regular.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('fonts/dosis-v32-latin-regular.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
       url('fonts/dosis-v32-latin-regular.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
       url('fonts/dosis-v32-latin-regular.svg#Dosis') format('svg'); /* Legacy iOS */
}
/* dosis-500 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Dosis medium';
  font-style: normal;
  font-weight: 500;
  src: url('fonts/dosis-v32-latin-500.eot'); /* IE9 Compat Modes */
  src: url('fonts/dosis-v32-latin-500.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/dosis-v32-latin-500.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('fonts/dosis-v32-latin-500.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
       url('fonts/dosis-v32-latin-500.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
       url('fonts/dosis-v32-latin-500.svg#Dosis') format('svg'); /* Legacy iOS */
}
/* dosis-600 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Dosis semi-bold';
  font-style: normal;
  font-weight: 600;
  src: url('fonts/dosis-v32-latin-600.eot'); /* IE9 Compat Modes */
  src: url('fonts/dosis-v32-latin-600.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/dosis-v32-latin-600.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('fonts/dosis-v32-latin-600.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
       url('fonts/dosis-v32-latin-600.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
       url('fonts/dosis-v32-latin-600.svg#Dosis') format('svg'); /* Legacy iOS */
}
/* dosis-700 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Dosis bold';
  font-style: normal;
  font-weight: 700;
  src: url('fonts/dosis-v32-latin-700.eot'); /* IE9 Compat Modes */
  src: url('fonts/dosis-v32-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/dosis-v32-latin-700.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('fonts/dosis-v32-latin-700.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
       url('fonts/dosis-v32-latin-700.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
       url('fonts/dosis-v32-latin-700.svg#Dosis') format('svg'); /* Legacy iOS */
}
/* dosis-800 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Dosis black';
  font-style: normal;
  font-weight: 800;
  src: url('fonts/dosis-v32-latin-800.eot'); /* IE9 Compat Modes */
  src: url('fonts/dosis-v32-latin-800.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/dosis-v32-latin-800.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('fonts/dosis-v32-latin-800.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
       url('fonts/dosis-v32-latin-800.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
       url('fonts/dosis-v32-latin-800.svg#Dosis') format('svg'); /* Legacy iOS */
}

/*----------------------------------------------------------------------
global structure & normalize
----------------------------------------------------------------------*/

body {
    margin: 0;
    border: 0 none;
    padding: 0;
    color: var(--sulo-midgrey);
    background: var(--sulo-white);
    font-family: 'Dosis regular', sans-serif;
    font-weight: normal;
    font-size: 20px;
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    overflow-x: hidden;
    }

p, form, img, legend, ul, ol, li, h1, h2, h3, h4, h5, h6, dl, dt, dd {
    margin: 0;
    border: 0 none;
    padding: 0;
    }

input, textarea, button, select {
    margin: 0;
    font: inherit;
    text-transform: none;
    accent-color: var(--sulo-red);
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    outline: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    }

input[type="submit"], button {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    }

textarea {
    overflow: auto;
    }

a {
    color: var(--sulo-red);
    text-decoration: none;
    }

a:hover, a:focus, a:active {
    color: var(--sulo-red);
    outline-width: 0;
    text-decoration: underline;
    }

mark {
    background-color: var(--sulo-red);
    color: var(--sulo-white);
    padding: 1px 5px;
    }

sub, sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
    }

sub {
    bottom: -0.25em;
}

sup {
    top: -0.7em;
    }

strong {
    font-weight: 700;
    }

.wrapper {
    margin: 0px auto;
    max-width: 1280px;
    position: relative;
    }

.clear::after {
    content: ".";
    clear: both;
    display: block;
    visibility: hidden;
    height: 0px;
    }

.fade * {
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    transition: all 0.5s ease;
    }

.flex {
    display: -ms-flexbox;
    display: flex;
    flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    }

h1, h1 a {
    font-family: 'Dosis semi-bold', 'Arial', sans-serif;
    font-style: bold;
    font-size: 49px;
    line-height: 49px;
    margin-bottom: 1.2rem;
    color: var(--sulo-red);
    }

h2, h2 a {
    font-family: 'Dosis medium', 'Arial', sans-serif;
    font-weight: normal;
    font-size: 42px;
    line-height: 42px;
    margin-bottom: 1.2rem;
    color: var(--sulo-black);
    }

h3 {
    font-family: 'Dosis medium', 'Georgia', serif;
    font-weight: normal;
    font-size: 32px;
    line-height: 32px;
    margin-bottom: 1.2rem;
    color: var(--sulo-midgrey);
    }

h4 {
    font-family: 'Dosis semi-bold', 'Arial', sans-serif;
    font-weight: bold;
    font-size: 22px;
    line-height: 22px;
    margin-bottom: 0.6rem;
    color: var(--sulo-red);
    }

*, ::after, ::before {
    -webkit-box-sizing: inherit;
    -moz-box-sizing: inherit;
    box-sizing: inherit;
    scroll-behavior: smooth;
    }

::-moz-selection,
::selection {
    background: #f00; color: #fff;
}

main ul {
  padding-left:22px;
}

blockquote {
  margin: 0;
  padding: 0;
  font-style: italic;
}

.normalcase {
  text-transform: inherit !important;
}

/*----------------------------------------------------------------------
Forms
----------------------------------------------------------------------*/

.wpcf7-form input[type="text"],
.wpcf7-form input[type="password"],
.wpcf7-form input[type="email"],
.wpcf7-form textarea,
.wpcf7-form select {
    border-top: none;
    border-right: none;
    border-bottom: 2px solid transparent;
    border-left: none;
    padding: 8px 15px;
    display: block;
    width: 100%;
    background: var(--sulo-lightgrey);
    -webkit-transition: all 0.7s ease;
    -moz-transition: all 0.7s ease;
    transition: all 0.7s ease;
    }

.wpcf7-form input[type="text"]:hover,
.wpcf7-form input[type="password"]:hover,
.wpcf7-form input[type="email"]:hover,
.wpcf7-form textarea:hover,
.wpcf7-form select:hover,
.wpcf7-form input[type="password"]:focus,
.wpcf7-form input[type="text"]:focus,
.wpcf7-form textarea:focus,
.wpcf7-form select:focus {
    background: var(--sulo-lightgrey);
    border-bottom: 2px solid var(--sulo-red);
    }

.wpcf7-form label {
    display: block;
    padding: 15px 0 5px 0;
    }

.wpcf7-form input[type="submit"] {
    display: inline-block;
    box-sizing: border-box;
    font-size: 1em;
    line-height: 1em;
    padding: 0.7em 1.7em;
    margin: 30px 0 0 0;
    border: 2px solid var(--sulo-red);
    color: var(--sulo-red);
    background: var(--sulo-white);
    border-radius: 20px;
    text-transform: uppercase;
    -webkit-transition: all 0.7s ease;
    -moz-transition: all 0.7s ease;
    transition: all 0.7s ease;
    cursor: pointer;
    }

.wpcf7-form input[type="submit"]:hover {
    background: var(--sulo-red);
    color: var(--sulo-white);
    }

.forms-item-check {
    margin: 30px 0 0 0;
    }

.wpcf7-list-item {
    margin: 0 1em 0 0;
    }

.displaynone {
  display: none;
}

/*----------------------------------------------------------------------
Header
----------------------------------------------------------------------*/

header {
    background: linear-gradient(179deg, rgba(20,20,20,1) 0%, rgba(20,20,20,0) 70%);
    -webkit-transition: all 0.7s ease;
    -moz-transition: all 0.7s ease;
    transition: all 0.7s ease;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 700;
    }

header.get-sticky,
.menu-solutions-active,
.menu-main-active {
    background: var(--sulo-white);
    position: fixed;
    top: 0;
    width: 100%;
    box-shadow: 1px 16px 15px -13px rgba(0,0,0,0.15);
    }

header.get-sticky a,
header.menu-solutions-active a,
header.menu-main-active a {
    color: var(--sulo-black);
    }




header:hover {
    background: var(--sulo-white);
    color: var(--sulo-black);
    }

.portal-header {
    padding: 40px 0;
    justify-content: space-between;
    font-weight: 700;
    font-size: 20px;
    z-index: 800;
    }

header.get-sticky .portal-header {
    padding: 20px 0;
    }

.portal-header > ul {
    display: flex;
    }

.portal-header a {
    color: var(--sulo-white);
    }

@media (min-width: 1025px) {
  .portal-header:hover a,
  header:hover .main-navigation a {
    color: var(--sulo-black);
  }
}
header.get-sticky .before-header {
  height: 0px !important;
  padding: 0px !important;
  margin: 0px !important;
  opacity: 0 !important;
}

.before-header * {
  font-size: 14px;
}

.basic-language-switcher {
  display: flex;
  list-style: none;
  text-decoration: none !important;
}

.basic-language-switcher li a {
  text-decoration: none;
}

.basic-language-switcher li.active {
  color: var(--sulo-red);
  font-weight: bold;
}

.basic-language-switcher li {
  border-right: 1px solid var(--sulo-smokegrey);
  padding: 0 10px;
}

.basic-language-switcher li:last-child {
  border-right: none;
}


.before-header a[href^="tel:"] {
    background: url(img/phone-white.svg) left center no-repeat;
    background-size: 18px 18px;
    color: var(--sulo-white);
    padding: 0 0 0 35px;
    }

.before-header a[href^="tel:"]:hover {
    background: url(img/phone-black.svg) left center no-repeat;
    color: var(--sulo-white);
    }

.before-header .menu {
  display: flex;
  list-style-type: none;
  justify-content: center;
  font-size: 14px;
}

.before-header .menu li {
  border-right: 1px solid var(--sulo-white);
  padding: 0 10px;
}

.before-header .menu li:last-child {
  border-right: none;
}

.before-header .menu li a{
  text-decoration: none;
  color: var(--sulo-white);
}

.before-header .menu li:hover a {
  color: var(--sulo-black);
}

.before-header .searchform {
  display: flex;
  font-size: 14px;
  max-height: 60%;
}

.before-header .social-media-links a {
  padding: 6px;
  font-size: 18px;
}

.before-header .social-media-links.right {
  text-align: right;

}

.before-header .social-media-links.white a {
  color: var(--sulo-white);
}

.before-header .social-media-links.white a:hover span {
  color: var(--sulo-black);
}

.before-header .social-media-links a:hover span {
  text-decoration: none !important;
}

.main-navigation * {
  -webkit-transition: none;
  -moz-transition: none;
  transition: none;
  list-style: none;
}


.nav-menu-toggle {
  display:none;
}

@media (min-width: 1025px) {
  .main-navigation {
    width: auto;
    color: var(--sulo-white);
    margin: 12px 0 0 0;
  }
}
@media (min-width: 1025px) {
  .main-navigation li > a {
    padding: 10px 26px;
  }
}
@media (min-width: 1025px) {
  .main-navigation > li.menu-dropdown > a:first-child .menu-item-img,
  .main-navigation > li.menu-dropdown .menu-item-img {
    display: none !important;
  }
}

@media (min-width: 1025px) {
  .main-navigation > li > a:hover {
    border-bottom: 4px solid var(--sulo-red);
  }

  .main-navigation > li:hover > a {
    color: var(--sulo-red);
  }
}

.main-navigation li a{
  text-decoration: none !important;
}
@media (min-width: 1025px) {
  .main-navigation li > a:hover,
  .main-navigation li > a.active,
  .main-navigation .current-menu-parent > a:not([href="#"]),
  .main-navigation .current-menu-item > a:not([href="#"]),
  header:hover .main-navigation .current-menu-parent > a:not([href="#"]),
  header:hover .main-navigation .current-menu-item > a:not([href="#"]),
  .current-menu-parent > a:not([href="#"]),
  .current-menu-item > a:not([href="#"]) {
    color: var(--sulo-red);
  }
}
@media (min-width: 1025px) {
  .menu-dropdown > a:hover,
  .menu-dropdown.visible > a {
    border-bottom: 4px solid var(--sulo-red);
  }

  .menu-dropdown.visible > a {
    color: var(--sulo-red);
  }

  .menu-dropdown .sub-menu {
    flex-wrap: wrap;
    position: absolute;
    width: auto;
    max-width: 300px;
    min-width: 200px;
    visibility: hidden;
    background-color: var(--sulo-white);
    padding: 0 20px 20px 20px;
    margin: 50px 0 0 0;
    -webkit-box-shadow: 1px 27px 20px -5px rgba(0,0,0,0.18);
    box-shadow: 1px 27px 20px -5px rgba(0,0,0,0.18);
    z-index: 999 !important;
    -webkit-transition: margin-top 0.4s ease, visibility 0.3s ease;
    -moz-transition: margin-top 0.4s ease, visibility 0.3s ease;
    transition: margin-top 0.4s ease, visibility 0.3s ease;
  }

  .menu-dropdown .sub-menu .menu-item-has-children {
    background: url(img/menu-arrow-right.svg) right center no-repeat;
    background-size: 12px 12px;
  }

  .menu-dropdown .sub-menu li a {
    display: flex;
    flex-wrap: wrap;
    color: var(--sulo-black);
    padding: 8px 0;
    font-size: 20px;
    line-height: 24px;
  }

  .menu-dropdown .sub-menu .sub-menu {
    flex-wrap: wrap;
    width: max-content;
    max-width: 300px;
    min-width: 180px;
    visibility: hidden;
    background-color: #fff;
    padding: 10px 20px 20px 20px;
    margin: -16px 0 0 0;
    -webkit-box-shadow: 1px 27px 20px -5px rgba(0,0,0,0.18);
    box-shadow: 1px 27px 20px -5px rgba(0,0,0,0.18);
    z-index: 998 !important;
    left: 99%;
  }

  .menu-dropdown .sub-menu li .sub-menu li > a {
    padding: 8px 0;
  }

  .menu-dropdown .sub-menu li .sub-menu li .sub-menu * {
    display: none;
  }

  .menu-dropdown .sub-menu a {
    color: var(--sulo-midgrey);
  }

  .menu-dropdown .sub-menu.visible {
    visibility: visible;
    margin-top: 20px;
    -webkit-transition: margin-top 0.4s ease, visibility 0.3s ease;
    -moz-transition: margin-top 0.4s ease, visibility 0.3s ease;
    transition: margin-top 0.4s ease, visibility 0.3s ease;
  }

  .menu-dropdown .sub-menu .sub-menu.visible {
    visibility: visible;
    margin-top: -45px;
    -webkit-transition: margin-top 0.4s ease, visibility 0.3s ease;
    -moz-transition: margin-top 0.4s ease, visibility 0.3s ease;
    transition: margin-top 0.4s ease, visibility 0.3s ease;
  }

  /* Optionaler Hover-Fallback, auskommentiert lassen */
  /* .menu-dropdown:hover > .sub-menu {
      background: var(--sulo-white);
      visibility: visible;
  } */

  .menu-dropdown > .sub-menu li > a > .sub-menu.visible {
    background: var(--sulo-white);
    visibility: visible;
    -webkit-box-shadow: 1px 27px 20px -5px rgba(0,0,0,0.18);
    box-shadow: 1px 27px 20px -5px rgba(0,0,0,0.18);
  }
}

.language-menu-wrapper {
    position: fixed;
    width: 0;
    height: auto;
    left: -2000px;
    right: 0;
    bottom: 0;
    background-color: var(--sulo-white);
    }

.overlay-active .language-menu-wrapper {
    width: 33.33%;
    left: 0;
    }

.language-menu {
    border-top: 3px solid var(--sulo-lightgrey);
    padding: 30px 60px;
    }

#language-overlay {
    position: fixed;
    display: none;
    width: 33.33%;
    height: auto;
    left: 0;
    right: 0;
    bottom: 0;
    border-top: 3px solid var(--sulo-lightgrey);
    background-color: var(--sulo-white);
    }

.language-menu-content {
    padding: 30px 60px;
    }

.language-menu-content h3 {
    font-size: 18px;
    line-height: 1.6;
    margin-bottom: 10px;
    color: var(--sulo-smokegrey);
    }

.language-menu-content ul {
    list-style: none;
    }

.current-site-language {
    padding: 0 0 0 35px;
    border: 0;
    background: transparent;
    cursor: pointer;
    background: url(img/globus-black.svg) left center no-repeat;
    background-size: 25px 25px;
    }

.current-site-language:hover {
    color: var(--sulo-red);
    }

.country-name {
    font-weight: 700;
    cursor: pointer;
    }

.country-name:hover {
    color: var(--sulo-red);
    }

.country.active-country {
    color: var(--sulo-red);
    }

.country ul li a {
    color: var(--sulo-black);
    text-decoration: none;
    padding-left:10px;
    }

.country ul li.active-language a,
.country ul li a:hover {
    color: var(--sulo-red);
    }

.meta-navigation {
    width: calc(100% - 332px);
    margin: 12px 0 0 0;
    }

.meta-navigation li {
    text-transform: uppercase;
    display: inline-block;
    }

.meta-navigation li button {
    border: 0;
    padding: 0;
    cursor: pointer;
    color: var(--sulo-black);
    background: transparent;
    }

    .icon-nav,
    .icon-nav::before,
    .icon-nav::after {
        background: var(--sulo-black);
        content: "";
        display: none;
        height: 3px;
        transition: 0.5s;
        position: absolute;
        }

    .icon-nav {
        width: 32px;
        margin: -15px 0 0 0;
        }

    .icon-nav::before {
        top: -9px;
        width: 25px;
        right: 0;
        }

    .icon-nav::after {
        top: 9px;
        width: 25px;
        right: 0;
        }


header:hover .icon-nav,
header:hover .icon-nav::before,
header:hover .icon-nav::after,
header.get-sticky .icon-nav,
header.get-sticky .icon-nav::before,
header.get-sticky .icon-nav::after,
.menu-solutions-active .icon-nav,
.menu-solutions-active .icon-nav::before,
.menu-solutions-active .icon-nav::after {
    background: var(--sulo-black);
    }

header:hover .meta-navigation button,
header.get-sticky .meta-navigation button,
header:hover button .main-menu-text,
header.get-sticky button .main-menu-text,
.menu-solutions-active button .main-menu-text {
    color: var(--sulo-black);
    }

.menu-solutions-active .meta-navigation button {
    color: var(--sulo-red) !important;
    }

.meta-navigation li button:hover,
header:hover .meta-navigation button:hover,
header.get-sticky .meta-navigation button:hover,
.menu-solutions-active .meta-navigation button:hover,
header:hover button:hover .main-menu-text,
header.get-sticky button:hover .main-menu-text {
    color: var(--sulo-red);
    }

.portal-logo {
    display: block;
    width: 232px;
    vertical-align: middle;
    font-size: 0;
    line-height: 0;
    background: url(./logo-reisswolf.svg) right center no-repeat;
    /* img/sulo-logo.svg */
    background-size: auto 120px;
    }

.portal-logo {
    background-repeat: no-repeat;
    background-position: right center;
    }

.portal-logo.left {

    background-repeat: no-repeat;
    background-position: left center;
    }

.portal-logo a {
    display: block;
    width: 232px;
    height: 120px;
    }


/*----------------------------------------------------------------------
Main + Pagebuilder
----------------------------------------------------------------------*/

.main-content {
    width: 100%;
    }

.center {
  text-align: center;
  align-items: center;
}

.is-red-border {
  border: 2px solid var(--sulo-red);
}

.is-blue-border {
  border: 2px solid var(--sulo-blue);
}

.is-yellow-border {
  border: 2px solid var(--sulo-yellow);
}

.is-green-border {
  border: 2px solid var(--sulo-green);
}

.is-lightgrey-ground {
    background: var(--sulo-lightgrey);
    }

.is-deepgrey-ground {
    background: var(--sulo-deepgrey);
    }

.is-white-ground {
    background: var(--sulo-white);
    }

.is-blue-ground {
    background: var(--sulo-blue);
    color: var(--sulo-white);
    }

.is-red-ground {
    background: var(--sulo-red);
    color: var(--sulo-white);
    }

.is-green-ground {
    background: var(--sulo-green);
    color: var(--sulo-white);
    }

.is-yellow-ground {
    background: var(--sulo-yellow);
    color: var(--sulo-white);
    }

.is-dark-ground {
    background: var(--sulo-deepgrey);
    color: var(--sulo-white);
    }

.is-blue-ground h2,
.is-blue-ground h3,
.is-blue-ground h4,
.is-green-ground h2,
.is-green-ground h3,
.is-green-ground h4,
.is-red-ground h2,
.is-red-ground h3,
.is-red-ground h4,
.is-dark-ground h2,
.is-dark-ground h3,
.is-dark-ground h4 {
    color: var(--sulo-white);
    }

.main-content ul { //.main-content ol
    margin: 0 0 30px 20px;
    list-style: square;
    }

.main-content h1 {
    font-size: 42px;
    line-height: 42px;
    }

.main-content img {
    max-width: 100%;
    height: auto;
    }

.main-content .widget_sow-hero .sow-slider-image {
   // min-height: 600px;
    }

.main-content .sow-slider-image-wrapper {
    padding-left: 0 !important;
    padding-right: 0 !important;
    }

.main-content .is-stage-header {
    min-height: 80vh;
    height: auto;
    width: 100%;
    }

.main-content .is-stage-header .sow-slider-image {
    min-height: 80vh;
    }

.main-content .is-stage-header .sow-slider-image-wrapper {
    padding: 10% 10px 0 0px !important;
    }

.main-content .is-productfamily-header .sow-slider-image {
    min-height: 600px;
    }

.main-content .is-productfamily-header .sow-slider-image-wrapper {
    padding: 400px 10px 100px 10px !important;
    }

.main-content .is-content-header .sow-slider-image {
    min-height: 600px;
    }

.main-content .is-content-header .sow-slider-image-wrapper {
    padding: 400px 10px 100px 10px !important;
    }

.sow-slider-image-container h1 {
    font-weight: 700;
    text-transform: uppercase;
    font-size: 59px !important;
    line-height: 59px !important;
    width: 60%;
    margin: 0 0 0 0 !important;
    padding: 10px 20px;
    background: var(--sulo-red);
    -webkit-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto;
    }

.sow-slider-image-container .subtitle {
    display: block;
    width: 60%;
    font-weight: 400;
    text-transform: normal;
    font-size: 26px !important;
    line-height: 26px !important;
    margin: 0 0 1.4rem 0 !important;
    padding: 0 20px 60px 20px;
    background: var(--sulo-red);
    color: var(--sulo-white);
    -webkit-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto;
    }

.sow-slider-image-container h2 {
    font-weight: 700;
    text-transform: uppercase;
    font-size: 59px !important;
    line-height: 59px !important;
    width: 50%;
    margin: 0 0 1.4rem 0 !important;
    }

.sow-slider-image-container h3 {
    font-weight: 400;
    font-size: 32px !important;
    line-height: 36px !important;
    width: 50%;
    margin: 0 0 1.4rem 0 !important;
    }

.sow-slider-image-container h4 {
    font-weight: 400;
    font-size: 22px !important;
    line-height: 22px !important;
    margin: 0 0 0.6rem 0 !important;
    }

.sow-slider-image-container p {
    font-size: 17px !important;
    line-height: 1.2 !important;
    }

.sow-slider-base .sow-slider-pagination {
    z-index: 160 !important;
    }

.so-widget-sow-hero .sow-slider-base .sow-slider-pagination {
    padding: 0 0 0 30px !important;
    text-align: left !important;
    }

.so-widget-sow-hero .sow-slider-pagination li a {
    border-radius: 20px !important;
    height: 20px !important;
    width: 20px !important;
    margin: 0 15px 0 0 !important;
    }

.so-widget-sow-button *,
.sow-accordion-panel-header  {
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    transition: all 0.3s ease;
    }

[class*="sulobase"] .ow-button-base a {
    box-sizing: border-box;
    font-size: 1em;
    padding: 0.7em 1.7em;
    background: transparent;
    border: 2px solid var(--sulo-white);
    color: var(--sulo-white);
    border-radius: 20px;
    }

[class*="sulobase"] .ow-button-base a:active,
[class*="sulobase"] .ow-button-base a:hover {
    color: var(--sulo-black);
    }

[class*="sulobase"] .ow-button-base a.ow-button-hover:hover {
    background: var(--sulo-white);
    border-color: var(--sulo-white);
    }

[class*="suloredsimple"] .ow-button-base a {
    box-sizing: border-box;
    font-size: 1em;
    padding: 0.7em 1.7em;
    background: var(--sulo-red);
    border: 2px solid var(--sulo-red);
    color: var(--sulo-white);
    border-radius: 20px;
    text-decoration: none;
    cursor: pointer;
    }

[class*="suloredsimple"] .ow-button-base a:active,
[class*="suloredsimple"] .ow-button-base a:hover {
    color: var(--sulo-red);
    }

[class*="suloredsimple"] .ow-button-base a.ow-button-hover:hover {
    background: var(--sulo-white);
    border-color: var(--sulo-red);
    }

[class*="sulowhitesimple"] .ow-button-base a {
    box-sizing: border-box;
    font-size: 1em;
    padding: 0.7em 1.7em;
    background: var(--sulo-white);
    border: 2px solid var(--sulo-red);
    color: var(--sulo-red);
    border-radius: 20px;
    }

[class*="sulogreen"] .ow-button-base a {
    box-sizing: border-box;
    font-size: 1em;
    padding: 0.7em 1.7em;
    background: var(--sulo-green);
    border: 2px solid var(--sulo-green);
    color: var(--sulo-white);
    border-radius: 20px;
    }

[class*="suloblue"] .ow-button-base a {
    box-sizing: border-box;
    font-size: 1em;
    padding: 0.7em 1.7em;
    background: var(--sulo-blue);
    border: 2px solid var(--sulo-blue);
    color: var(--sulo-white);
    border-radius: 20px;
    }

[class*="sulogrey"] .ow-button-base a {
    box-sizing: border-box;
    font-size: 1em;
    padding: 0.7em 1.7em;
    background: var(--sulo-midgrey);
    border: 2px solid var(--sulo-midgrey);
    color: var(--sulo-white);
    border-radius: 20px;
    }

[class*="sulowhitesimple"] .ow-button-base a:active,
[class*="sulowhitesimple"] .ow-button-base a:hover,
[class*="sulogreen"] .ow-button-base a:active,
[class*="sulogreen"] .ow-button-base a:hover,
[class*="suloblue"] .ow-button-base a:active,
[class*="suloblue"] .ow-button-base a:hover,
[class*="sulogrey"] .ow-button-base a:active,
[class*="sulogrey"] .ow-button-base a:hover {
    color: var(--sulo-white);
    }

[class*="sulowhitesimple"] .ow-button-base a.ow-button-hover:hover,
[class*="sulogreen"] .ow-button-base a.ow-button-hover:hover,
[class*="suloblue"] .ow-button-base a.ow-button-hover:hover,
[class*="sulogrey"] .ow-button-base a.ow-button-hover:hover {
    background: var(--sulo-red);
    border-color: var(--sulo-red);
    }

.box-bottomoverlay {
    position: relative;
    }

.box-bottomoverlay::after {
    position: relative;
    display: block;
    content: "";
    width: 100%;
    height: auto;
    min-height: 100px;
    font-size: 0;
    line-height: 0;
    background: url(img/box-bottomoverlay.svg) center top no-repeat;
    margin: -50px 0 0 0;
    z-index: 200;
    }

.table-tiles-smartsulo {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -moz-flex;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap !important;
}

.table-tiles-smartsulo .panel-grid-cell:not(.panel-grid-cell .panel-grid-cell) {
    width: 20% !important;
    margin: 0 60px 100px 0 !important;
}

@media only screen and (max-width: 1800px) {
    .table-tiles-smartsulo .panel-grid-cell:not(.panel-grid-cell .panel-grid-cell) {
        width: 40% !important;
    }
}

@media only screen and (max-width: 1100px) {
    .table-tiles-smartsulo .panel-grid-cell:not(.panel-grid-cell .panel-grid-cell) {
        width: 100% !important;
    }
}

@media only screen and (max-width: 800px) {
    .table-tiles-smartsulo .panel-grid-cell:not(.panel-grid-cell .panel-grid-cell) {
        width: 100% !important;
        margin: 0 0 100px 0 !important;
    }
}

.tile-title-smartsulo {
    background-color: var(--sulo-red);
    padding: 20px;
    height: 160px;
    width:  100%;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
}

.tile-title-smartsulo h3 {
    color: var(--sulo-white);
}

@media only screen and (max-width: 800px) {
    .tile-title-smartsulo {
      padding: 20px;
      height: 100px;
      width:  100%;
    }
}

.is-word-tile-black {
  background-color: var(--sulo-smokegrey);
  color: white;
  padding: 20px;
  font-size: 22px;
  height: 100px;
  text-transform: uppercase;
}

.is-word-tile-white {
  background-color: var(--sulo-white);
  padding: 20px;
  font-size: 22px;
  height: 100px;
  text-transform: uppercase;
}

.is-word-tile-red {
  background-color: var(--sulo-red);
  color: white;
  padding: 20px;
  font-size: 22px;
  height: 100px;
  text-transform: uppercase;
}

.is-hover-teaser,
.is-hover-teaser * {
    -webkit-transition: all 0.7s ease;
    -moz-transition: all 0.7s ease;
    transition: all 0.7s ease;
    }

.is-hover-teaser {
    /* box-shadow: 0px 0px 20px 6px rgba(0, 0, 0, 0.5); */
    background-repeat: no-repeat;
    border-bottom: 12px solid transparent;
    }

.is-hover-teaser:hover {
    margin: -5px 0 5px 0;
    /* box-shadow: 0px 0px 20px 6px rgba(0, 0, 0, 0.5); */
    border-bottom: 12px solid var(--sulo-darkgrey);
    }

.is-hover-teaser:hover {
    margin: -5px 0 5px 0;
    /* box-shadow: 0px 0px 20px 6px rgba(0, 0, 0, 0.5); */
    border-bottom: 12px solid var(--sulo-darkgrey);
    }

.is-hover-teaser .so-widget-sow-button {
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    transition: all 0.3s ease;
    }

.is-hover-teaser .so-widget-sow-cta {
    color: var(--sulo-white);
    height: 400px;
    width: 100%;
    display: flex;
  	flex-direction: column;
  	justify-content: flex-end;
    }

.is-teaser-icon .so-widget-sow-cta {
    height: 300px !important;
}

.double-teaser-high .so-widget-sow-cta {
    height: 830px;
    }

.is-hover-teaser .so-widget-sow-cta {
    background: linear-gradient(10deg, rgba(0,0,0,0.5) 30%, rgba(0,0,0,0) 70%);
    }

.is-teaser-icon .so-widget-sow-cta {
    background: none !important;
    justify-content: flex-start !important;
    align-items: center !important;
    text-align: center !important;
    }

.is-hover-teaser:hover .so-widget-sow-cta {
    background: rgba(var(--sulo-red-rgb), 0.8);
    }

.is-hover-teaser .sow-cta-base {
    border: none !important;
    }

.is-hover-teaser .sow-cta-base .sow-cta-text {
    float: none !important;
    text-align: left !important;
    }

.is-hover-teaser .sow-cta-title {
    font-size: 32px;
    line-height: 34px;
    margin: 0 !important;
    -webkit-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto;
    color: var(--sulo-white);
    }

.is-teaser-icon .sow-cta-base .sow-cta-text {
    text-align: center !important;
    }

.is-hover-teaser .sow-cta-subtitle {
    font-size: 0px;
    line-height: 0;
    visibility: hidden;
    }

.is-teaser-icon .sow-cta-subtitle {
    justify-content: flex-end !important;
    font-size: 19px;
    line-height: 1.2;
    visibility: visible;
    }

.is-teaser-icon img {
    padding: 40px 0 40px 0;
    }

.is-hover-teaser:hover .sow-cta-subtitle {
    font-size: 19px;
    line-height: 1.2;
    visibility: visible;
    }

.is-hover-teaser .so-widget-sow-button {
    margin: 20px 0 0 0 !important;
    }

.is-hover-teaser .so-widget-sow-button a[href="#"] {
    display: none;
    }

.is-hover-item,
.is-hover-item * {
    -webkit-transition: all 0.7s ease;
    -moz-transition: all 0.7s ease;
    transition: all 0.7s ease;
    }

.is-hover-item:hover {
    margin: -5px 0 5px 0;
    box-shadow: 0px 0px 20px 6px rgba(0, 0, 0, 0.5);
    }

.is-hover-item .so-widget-sow-editor {
    background: rgba(0,0,0,0.3);
    color: var(--sulo-white);
    height: 400px;
    width: 100%;
    display: flex;
    padding: 2em 2.5em;
	flex-direction: column;
	justify-content: flex-end;
    }

.is-hover-item .so-widget-sow-editor:hover {
    background: rgba(var(--sulo-red-rgb), 0.8);

    }

.is-hover-item h4 {
    font-size: 32px;
    line-height: 34px;
    margin: 0 !important;
    color: var(--sulo-white);
    }

.is-hover-item.is-double-item-high .so-widget-sow-editor {
    height: 830px;
    }

.is-hover-item .so-widget-sow-cta {
    background: rgba(0,0,0,0.3);
    }

.is-hover-item:hover .so-widget-sow-cta {
    background: rgba(var(--sulo-red-rgb), 0.8);
    }

.is-hover-item .sow-cta-base .sow-cta-text {
    float: none !important;
    text-align: left !important;
    }

.is-hover-item ul,
.is-hover-item ol,
.is-hover-item p {
    font-size: 0px;
    line-height: 0;
    visibility: hidden;
    margin: .4em 0 0 0;
    }

.is-hover-item ul,
.is-hover-item ol {
    margin: .4em 0 0 20px;
    }

.is-hover-item:hover ul,
.is-hover-item:hover ol,
.is-hover-item:hover p {
    font-size: 19px;
    line-height: 1.2;
    visibility: visible;
    }

.is-hover-item.start-open ul,
.is-hover-item.start-open ol,
.is-hover-item.start-open p {
    font-size: 19px;
    line-height: 1.2;
    visibility: visible;
    }

.is-icon-item,
.is-icon-item * {
    -webkit-transition: all 0.7s ease;
    -moz-transition: all 0.7s ease;
    transition: all 0.7s ease;
    }

.is-icon-item {
    background-position: top right+35px !important;
    background-size: 100px 80px !important;
    background-repeat: no-repeat !important;
    padding: 40px 40px 40px 0;
    }

.is-icon-item:hover {
    background-size: 110px 80px !important;
    background-position: top right+55px !important;
    }

.is-icon-item .sow-cta-title {

    }
    /*
    border-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='100' height='100' viewBox='0 0 100 100' fill='none' xmlns='http://www.w3.org/2000/svg'%3E %3Cstyle%3Epath%7Banimation:stroke 2s infinite linear%3B%7D%40keyframes stroke%7Bto%7Bstroke-dashoffset:776%3B%7D%7D%3C/style%3E%3ClinearGradient id='g' x1='0%25' y1='0%25' x2='0%25' y2='100%25'%3E%3Cstop offset='0%25' stop-color='%232d3561' /%3E%3Cstop offset='25%25' stop-color='%23c05c7e' /%3E%3Cstop offset='50%25' stop-color='%23f3826f' /%3E%3Cstop offset='100%25' stop-color='%23ffb961' /%3E%3C/linearGradient%3E %3Cpath d='M1.5 1.5 l97 0l0 97l-97 0 l0 -97' stroke-linecap='square' stroke='url(%23g)' stroke-width='3' stroke-dasharray='388'/%3E %3C/svg%3E") 1;

  */
.is-icon-item .sow-cta-base {
    border: none !important;
    padding: 0;
    height: 100%;
    }


.is-icon-item .sow-cta-wrapper {
  display: flex;
  flex-direction: column;
  padding-top: 40px;
}


.is-icon-item .so-widget-sow-cta {
    height: 400px;
    width: 100%;
    padding: 80px 0 0 0;
    flex-direction: column;
    justify-content: flex-start;
}

.is-icon-item-double-height .so-widget-sow-cta {
    height: auto !important;
}

.is-icon-item .sow-cta-text {
  flex-direction: column;
  justify-content: flex-start;
}
.is-icon-item .so-widget-sow-button {
  align-self: flex-start;
  justify-content: flex-end;
}

.is-icon-item-double-height .so-widget-sow-button {
  margin-top: 20px !important;
}

.is-icon-item-double-height .sow-cta-text {
  height: 800px;
}




.is-icon-item .sow-cta-title {
    font-size: 32px;
    line-height: 34px;
    margin: 0 !important;
    padding: 0 0 10px 0;
}


.is-icon-item .so-widget-sow-cta::before {
  display: flex;
  flex-direction: column;
  margin-top:-70px;
  content: "";
  height:5px;
  width:77%;
  background-color: #ff0000;
  -webkit-transition: all 0.7s ease;
  -moz-transition: all 0.7s ease;
  transition: all 0.7s ease;
}


.is-icon-item:hover .so-widget-sow-cta::before {
 transform: translate(30px, 0);
  width:65%;
}

@keyframes nudge {
  0%,100% {
    transform: translate(0, 0);
  }

  50% {
    transform: translate(30px, 0);
  }

}

.is-icon-item .sow-cta-subtitle {
  min-height:110px;
}

.is-icon-item .so-widget-sow-button a[href="#"] {
    display: none;
    }

.is-without-icon {
  padding-top: 0;
  padding-bottom: 0;
}

.is-without-icon .so-widget-sow-cta,
.is-without-icon .sow-cta-wrapper {
    height: auto !important;
    padding: 0;
}

.is-without-icon .so-widget-sow-cta::before {
  display: none;
}

.is-without-icon .sow-cta-subtitle::before {
  display: flex;
  flex-direction: column;
  margin: 20px 0;
  content: "";
  height: 5px;
  width: 77%;
  background-color: #ff0000;
  -webkit-transition: all 0.7s ease;
  -moz-transition: all 0.7s ease;
  transition: all 0.7s ease;
}

.is-without-icon:hover .sow-cta-subtitle::before {
 transform: translate(30px, 0);
  width:65%;
}

.is-below-header-icon::after {
  display: flex;
  flex-direction: column;
  margin-top:0;
  content: "";
  height:5px;
  width:100%;
  background-color: #ff0000;
  -webkit-transition: all 0.7s ease;
  -moz-transition: all 0.7s ease;
  transition: all 0.7s ease;
  margin-left: -100%;
  margin-top: -53%;
}

.is-feature-item {
    text-align: center;
    border-bottom: 10px solid var(--sulo-lightgrey);
    margin: 40px 0 0 0;
    -webkit-transition: all 0.7s ease;
    -moz-transition: all 0.7s ease;
    transition: all 0.7s ease;
    }

.is-feature-item:hover {
    border-bottom: 10px solid var(--sulo-red);
    }

.is-feature-item h2,
.is-feature-item h2 a {
    color: var(--sulo-red);
    }

.is-feature-item p {
    min-height: 80px;
    }

.is-content-slider .panel-layout {
    padding: 60px 80px;
    margin: 30px 60px;
    box-shadow: 0px 0px 20px 6px rgba(200, 200, 200, 0.5);
    }

.is-content-slider .sow-slider-pagination li a {
    background: var(--sulo-smokegrey) !important;
    }

.is-content-slider .sow-slider-pagination li.sow-active a {
    background: var(--sulo-red) !important;
    }

.is-content-slider .sow-slider-pagination {
    text-align: center !important;
    bottom: 0px !important;
    padding: 0px !important;
    }

.is-content-slider .sow-slider-pagination li a {
    border-radius: 20px !important;
    height: 10px !important;
    width: 60px !important;
    margin: 0 15px 0 0 !important;
    }

.sow-slider-base .sow-slide-nav {
    z-index: 150 !important;
    }

.is-content-slider .sow-slider-base .sow-slide-nav a {
    color: var(--sulo-smokegrey) !important;
    }

.is-fullwidth-teaser-text {
    padding: 120px 0 120px 0px;
    max-width: 625px;
    margin: 0 0 0 auto;
    }

.is-download-item,
.is-download-item * {
    -webkit-transition: all 0.7s ease;
    -moz-transition: all 0.7s ease;
    transition: all 0.7s ease;
    }

.is-download-item {
    min-height: 300px;
    padding: 30px 30px 0 30px;
    color: var(--sulo-white);
    background: var(--sulo-midgrey);
    /* background: url(img/sulo-logo-trans.svg) right bottom no-repeat var(--sulo-midgrey); */
    background-size: 50px auto;
    }

.is-download-item:hover {
    background: var(--sulo-midgrey);
    /* background: url(img/sulo-logo-trans.svg) right bottom no-repeat var(--sulo-midgrey); */
    background-size: 50px auto;
    margin: -5px 0 5px 0;
    box-shadow: 0px 0px 20px 6px rgba(0, 0, 0, 0.5);
    }

.is-download-item h4 {
    color: var(--sulo-white);
    min-height: 190px;
    }

.is-download-item a {
    background: url(img/download.svg) left center no-repeat;
    background-size: auto 20px;
    padding: 0 0 0 30px;
    color: var(--sulo-white);
    }

.is-download-item:hover a {
    border: 2px solid var(--sulo-white);
    background-position: 10px center;
    padding: 8px 15px 8px 40px;
    }

.is-download-item:hover a:hover {
    border: 2px solid var(--sulo-darkgrey);
    background: url(img/download.svg) left center no-repeat var(--sulo-darkgrey);
    background-size: auto 20px;
    background-position: 10px center;
    text-decoration: none;
    }

.is-product-title {
    /*margin: -400px 0 0 0;*/
    margin-top: -400px !important;
    position: relative;
    z-index: 100;
    }

.is-product-title .widget_media_image {
    width: 100%;
    margin: 0 auto 0 0;
    }

.is-product-title .widget_media_image img {
    max-height: 500px;
    width: auto;
    }

.is-product-headline h1 {
    display: flex;
    flex-direction: column;
    text-align: center;
    width: 100%;
    min-width: 300px;
    margin: 60px 0 0 0;
    }

.is-product-headline h1 strong {
    display: inline-block;
    background: var(--sulo-red);
    color: var(--sulo-white);
    font-size: 59px;
    line-height: 59px;
    padding: 15px 0;
    }

.is-product-headline sup,
.sow-slider-image-container sup {
    font-size: 50%;
    margin: 0 -15px 0 0;
    }

.is-product-headline h1 span {
    display: inline-block;
    background: var(--sulo-white);
    font-family: 'Dosis regular', 'Georgia', serif;
    font-weight: normal;
    padding: 8px 0;
    margin: 3px 0 0 0;
    }

.is-image-tabs .sow-tabs-tab-container {
    padding: 0 !important;
    }

.is-image-tabs .sow-tabs-panel-container {
    background: transparent !important;
    }

.is-image-tabs .sow-tabs-panel {
    padding: 0 30px 30px 30px !important;
    }

.is-image-tabs .sow-tabs-tab {
    font-size: 0 !important;
    border: 2px solid var(--sulo-white);
    margin: 0 0 5px 0 !important;
    padding: 2px !important;
    }

.is-tabs-configurator .sow-tabs-tab {
    font-size: 20px !important;
    font-weight: bold;
    border: 0 !important;
    border-bottom: 2px solid transparent !important;
    padding-bottom: 10px !important;
    }

.is-image-tabs .sow-tabs-tab:hover {
    background: transparent !important;
    border: 2px solid var(--sulo-midgrey) !important;
    }

.is-tabs-configurator .sow-tabs-tab:hover {
    background: transparent !important;
    border: 0 !important;
    border-bottom: 2px solid var(--sulo-midgrey) !important;
    }

.is-image-tabs .sow-tabs-tab img {
    width: 60px !important;
    height: auto !important;
    margin: 0 !important;
    }

.is-tabs-configurator .sow-tabs-tab img {
    width: 250px !important;
    height: auto !important;
    margin: 0 !important;
    }

.is-image-tabs .sow-tabs-tab.sow-tabs-tab-selected {
    background: transparent !important;
    border: 2px solid var(--sulo-red) !important;
    }

.is-tabs-configurator .sow-tabs-tab.sow-tabs-tab-selected {
    background: transparent !important;
    border: 0 !important;
    border-bottom: 2px solid var(--sulo-red) !important;
    }

.is-set-image-height img {
    height: 300px !important;
    width: auto;
    padding: 0 0 40px 0;
    }

.is-set-logos-size img {
    height: 140px !important;
    width: auto;
    padding: 0 35px 25px 0;
    }

.is-contact-widget,
.is-contact-widget * {
    -webkit-transition: all 0.7s ease;
    -moz-transition: all 0.7s ease;
    transition: all 0.7s ease;
    }

.is-contact-widget {
    position: fixed;
    right: -1000px;
    bottom: 10%;
    z-index: 600;
    width: 140px;
    height: auto;
    }

.is-contact-widget.show-contact {
    right: 0;
    }

@keyframes pulse-shadow {
    0% {
    box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.7);
    }

    70% {
    box-shadow: 0px 0px 0px 10px rgba(0, 0, 0, 0);
    }

    100% {
    box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0);
    }
}

.is-contact-widget .widget_media_image {
    position: relative;
    border-radius: 50%;
    border: 5px solid var(--sulo-red);
    width: 110px;
    height: 110px;
    margin: 0 30px 0 0 !important;
    z-index: 605;
    box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 1);
	animation: pulse-shadow 2s infinite;
    }

.is-contact-widget .widget_media_image img {
    width: 100px !important;
    height: 100px !important;
    border-radius: 50%;
    border: 2px solid var(--sulo-white);
    }

.is-contact-widget .widget_custom_html {
    position: absolute;
    right: -1000px;
    bottom: 70px;
    background: var(--sulo-white);
    padding: 30px 30px 60px 30px !important;
    margin: 0 !important;
    box-shadow: 0px 0px 30px 6px rgba(0, 0, 0, 0.4);
    width: 450px;
    }

.is-contact-widget:hover .widget_custom_html {
    right: 0;
    }

.is-contact-widget:hover .widget_media_image {
    box-shadow: 0px 0px 0px 0px transparent;
    animation-play-state: paused;
    }

.is-contact-widget .widget_custom_html h4 {
    margin: 0;
    }

.is-contact-widget .widget_custom_html p {
    margin: 0 0 15px 0;
    }

.is-contact-widget .widget_custom_html a[href^="tel:"],
.main-menu a[href^="tel:"] {
    background: url(img/phone-black.svg) left center no-repeat;
    background-size: 20px 20px;
    color: var(--sulo-black);
    padding: 0 0 0 35px;
    }

.is-contact-widget .widget_custom_html a[href^="mailto:"],
.is-contact-widget .widget_custom_html a[href^="javascript:;"],
.main-menu a[href^="mailto:"],
.main-menu a[href^="javascript:;"] {
    background: url(img/mail-black.svg) left center no-repeat;
    background-size: 20px 20px;
    color: var(--sulo-black);
    padding: 0 0 0 35px;
    }

.main-menu a[data-icon*="contactform"] {
    background: url(img/contactform-black.svg) left center no-repeat;
    background-size: 20px 20px;
    color: var(--sulo-black);
    padding: 0 0 0 35px;
    }

.main-menu a[data-icon*="contactperson"] {
    background: url(img/contactperson-black.svg) left center no-repeat;
    background-size: 20px 20px;
    color: var(--sulo-black);
    padding: 0 0 0 35px;
    }

.is-contact-widget .active {
    right: 0;
    }

.is-contact-widget .widget_custom_html a:hover {
    color: var(--sulo-red);
    text-decoration: none;
    }

.is-contact-widget .download-message {
    padding: 20px 0 20px 0;
    margin: 0 0 40px 0;
    border-bottom: 2px solid #f00;
    }

.is-contact-widget .download-message strong {
    padding: 0 0 5px 0;
    }

.is-contact-widget .download-message p {
    padding: 0;
    margin: 0;
    font-size: 18px;
    }

.is-scrolltop-widget {

}

.is-scrolltop-widget,
.is-scrolltop-widget * {
    -webkit-transition: all 0.7s ease;
    -moz-transition: all 0.7s ease;
    transition: all 0.7s ease;
    cursor: pointer;
    }

.is-scrolltop-widget {
    position: fixed;
    left: -1000px;
    bottom: 20px;
    z-index: 600;
    background-color: var(--sulo-lightgrey);
    border: 1px solid var(--sulo-lightgrey);
    padding: 0px 10px 5px 10px;
    }

.is-scrolltop-widget::after {
    content: "";
    display: inline-block;
    width: 0px;
    height: 0px;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-bottom: 10px solid var(--sulo-midgrey);
    }

.is-scrolltop-widget:hover {
    background-color: var(--sulo-red);
    border: 1px solid var(--sulo-red);
    }

.is-scrolltop-widget:hover::after {
    border-bottom: 10px solid var(--sulo-white);
    }

.is-scrolltop-widget.show-scrolltop {
    left: 20px;
    }

.is-icon-widget h2 {
	font-size: 28px;
}

.is-icon-widget img {
	height: 100px;
	width: auto;
	padding-bottom: 20px;
}

.is-notfound {
    background: var(--sulo-red);
    color: var(--sulo-white);
    }

.is-notfound * {
    -webkit-transition: all 0.7s ease;
    -moz-transition: all 0.7s ease;
    transition: all 0.7s ease;
    }

.is-notfound .is-content-header {
  background: url() no-repeat;
  background-size: cover;
  background-position-y: -110px;
  width: 100%;
  height: 50vh;
  padding-bottom: 0;
}


.is-notfound h1 {
    color: var(--sulo-white);
    }

.notfound-content {
    padding: 10vh 0 30vh 0;
    }

.notfound-button a {
    display: inline-block;
    margin: 30px 0 0 0;
    padding: 0.7em 1.7em;
    background: transparent;
    border: 2px solid var(--sulo-white);
    color: var(--sulo-white);
    text-decoration: none;
    }

.notfound-button a:active,
.notfound-button a:hover {
    color: var(--sulo-black);
    border: 2px solid var(--sulo-black);
    }

.is-has-overlay {
    position: relative;
    }

.is-has-overlay::after {
    position: absolute;
    top: 0;
    left: 0;
    content: "";
    width: 100%;
    height: 100%;
    background: rgba(0, 68, 148, 0.5);
    }

.is-has-overlay div {
    z-index: 50;
    }

.panel-row-style,
.panel-widget-style {
      scroll-margin-top: 150px;
    }


.so-premium-image-overlay {
  background-color: var(--sulo-lightgrey);
}

/*----------------------------------------------------------------------
Solutions-Menu
----------------------------------------------------------------------*/

#solutions-overlay,
#solutions-overlay *,
.solutions-menu * {
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    transition: all 0.5s ease;
    }

#solutions-overlay.before-header-active {
    margin-top: 50px;
}

#solutions-overlay {
    position: fixed;
    width: 100%;
    height: 0;
    top: -100%;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: var(--sulo-white);
    z-index: 850;
    overflow-y: auto;
    }

#solutions-overlay.solution-active {
    height: calc(100% - 130px);
    min-height: fit-content;
    top: 130px;
    border-top: 3px solid var(--sulo-lightgrey);
    background-color: rgba(0, 0, 0, 0.7);
    overflow-y: scroll;
    scrollbar-width: none; /* Firefox */
    -ms-overflow-style: none;  /* Internet Explorer 10+ */
    }

.get-sticky.menu-solutions-active #solutions-overlay.solution-active {
    height: calc(100% - 100px);
    top: 100px;
    }

.solutions-menu {
  /*  margin: 30px 0 0 0; */
    background: var(--sulo-white);
    padding: 30px 0 160px 0;
    hyphens: auto;
    height: 100vh;
    }

.solutions-menu img {
    /*height: 110px;*/
    width: auto;
    max-width: 160px;
    }

.solutions-menu .menu-item-img {
    display: block;
    margin: -15px -15px 10px -15px;
    }

.solutions-menu ul:first-child {
    border-right: 3px solid var(--sulo-lightgrey);
    padding: 30px 0 30px 0;
    }

.solutions-menu ul {
  list-style: none;
  width: 300px;
  position: relative;
  hyphens: auto;
  word-wrap: break-word;
}


.solutions-menu ul ul {
    min-width: 935px;
    position: absolute;
    top: 0;
    left: 300px;
    padding: 15px 0 0 30px;
    }

.solutions-menu ul ul ul {
    min-width: 875px;
    position: relative;
    top: 0;
    left: 0;
    display: -ms-flexbox;
    display: flex;
    flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    padding: 30px 0 60px 0;

    }

.solutions-menu ul li {
    border-right: 3px solid transparent;
    margin: 0 -3px 0 0;
    }

.solutions-menu ul li a {
    display: block;
    color: var(--sulo-black);
    font-weight: 700;
    line-height: 23px;
    text-decoration: none;
    }

.solutions-menu ul li a:hover {
    color: var(--sulo-red);
    text-decoration: none;
    }

.solutions-menu ul li li {
    border: 0px solid transparent;
    display: none;
    margin: 15px;

    }

.solutions-menu ul li:hover {
    border-right: 3px solid var(--sulo-red);
    }

.solutions-menu ul li:hover a {
    color: var(--sulo-red);
    }

.solutions-menu ul li li a {
    background: url(img/menu-arrow-right.svg) no-repeat right center;
    background-size: 18px 18px;
    padding: 0 30px 0 0;
    display: inline;
    }

.solutions-menu ul li:hover li a {
    color: var(--sulo-black);
    }

.solutions-menu ul li:hover li a:hover {
    color: var(--sulo-red);
    }

.solutions-menu ul li:hover li li a:hover {
    color: var(--sulo-black);
    }

.solutions-menu ul ul li:hover,
.solutions-menu ul ul ul li:hover {
    border-right: 0px solid transparent;
    }

.solutions-menu ul li li li {
    border: 0px solid transparent;
    display: inline-block;
    width: 160px;
    text-align: center;
    margin: 0 15px 0 0;
    }

.solutions-menu ul li li li a,
.solutions-menu ul li:hover li li a {
    display: block;
    border-bottom: 3px solid transparent;
    padding: 15px;
    font-weight: 400;
    color: var(--sulo-black);
    background: transparent;
    }

.solutions-menu ul li li li a:hover,
.solutions-menu ul li li li.current-menu-item a {
    background: var(--sulo-lightgrey);
    border-bottom: 3px solid var(--sulo-red);
    color: var(--sulo-black);
    }

.solutions-menu ul li li li a img {
  transform: inherit;
  -webkit-transform: scale(0.95);
  -moz-transform: scale(0.95);
  -ms-transform: scale(0.95);
  -o-transform: scale(0.95);
  transform: scale(0.95);
}

.solutions-menu ul li li li a:hover img {
  transform: inherit;
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1);
}

.solutions-menu ul li li li.current-menu-item.menu-item-is-productfamily a {
    background: var(--sulo-lightgrey);
    border-bottom: 3px solid transparent;
    }

.solutions-menu ul li li li.current-menu-item.menu-item-is-productfamily {
    background: var(--sulo-lightgrey);
    border-bottom: 3px solid var(--sulo-red);
    color: var(--sulo-smokegrey);
    font-size: 18px;
    }

.solutions-menu .menu-item-description {
    color: var(--sulo-smokegrey);
    font-size: 18px;
    display: inline-flex;
    }

.solutions-menu .menu-item-block .menu-item-description {
    display: block;
    }

.solutions-menu .menu-title-big-red > a  {
    font-size: 44px;
    color: var(--sulo-red) !important;
}

.solutions-menu .ow-button-base a {
    display: block;
    color: var(--sulo-white) !important;
    width: fit-content;
}

.solutions-menu .ow-button-base a:hover {
    color: var(--sulo-red) !important;
}



.solutions-menu .firstlevel-active > a {
    color: var(--sulo-red);
    text-decoration: none;
    }


.menu-close {
    background: url(img/menu-close.svg) no-repeat center center;
    background-size: 24px 24px;
    display: inline-block;
    position: absolute;
    top: 0;
    right: 0;
    margin: 30px;
    z-index: 950;
    }

.menu-close:hover {
    transform: rotate(180deg);
    }

.menu-close button {
    display: block;
    width: 30px;
    height: 30px;
    font-size: 0;
    border: 0;
    background: transparent;
    cursor: pointer;
    }

.activeMenu {
    display: block !important;
    }

.solutions-menu .menu-item-is-productfamily {
    padding: 25px 0;
    background: var(--sulo-lightgrey);
}

.solutions-menu ul li:hover li .menu-item-is-productfamily a:hover {
    border-bottom: 3px solid transparent;
}

.menu-item-is-productfamily .menu-item-description {
    display: inline-block;
    background: var(--sulo-midgrey);
    color: var(--sulo-white);
    width: 100%;
    padding: 5px 0;
    cursor: pointer;
    hyphens: initial;
}

.menu-item-is-productfamily:hover .menu-item-description {
    background: var(--sulo-red);
}

.menu-item-is-productfamily .menu-item-img {
    display:none;
}


/*----------------------------------------------------------------------
Footer
----------------------------------------------------------------------*/

footer {
    background: var(--sulo-darkgrey);
    color: var(--sulo-smokegrey);
    font-size: 14px;
    }

footer small {
    font-size: 14px;
    }

footer a {
    color: var(--sulo-smokegrey);
    }

footer a:hover {
    color: var(--sulo-white);
    text-decoration: none;
    }

footer ul {
    list-style: none;
    }

footer address {
    font-style: normal;
    color: var(--sulo-white);
    line-height: 1.4;
    margin: 30px 0;
    }

.footer-main {
    padding: 45px 0 15px 0;
    }

.footer-contact {
    width: 20%;
    min-width: 232px;
    }

.footer-navigation {
    width: 80%;
    }

.footer-navigation div ul {
    display: -ms-flexbox;
    display: flex;
    flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    }

.footer-navigation div ul li {
    width: calc(20% - 30px);
    margin: 0 0 30px 30px;
    }

.footer-navigation div ul li a {
    font-weight: 700;
    color: var(--sulo-white);
    font-size: 16px;
    text-decoration: none;
    }

.footer-navigation div ul li li {
    width: 100%;
    margin: 0;
    }

.footer-navigation div ul li li a {
    font-weight: 400;
    font-size: 14px;
    color: var(--sulo-smokegrey);
    }

.footer-navigation div ul li li a:hover {
    color: var(--sulo-white);
    }

.footer-meta {
    background: var(--sulo-deepgrey);
    padding: 30px 0;
    }

.footer-meta small {
    width: 33.33%;
    }

.footer-is-imprint-menu {
    width: 66.66%;
    display: block;
    text-align: right;
    }

.footer-meta li {
    display: inline-block;
    margin: 0 0 0 30px;
    }


/*----------------------------------------------------------------------
Popup
----------------------------------------------------------------------*/


.popupcontainer,
.embedpopupcontainer {
    position: fixed;
    display:flex;
    flex-wrap: column;
    align-items: center;
    justify-content: center;
    width:100%;
    height:100%;
    top:0;
    left:0;
    background-color: rgba(0,0,0,0.5);
    z-index:1000;
    -webkit-transition: all 0.7s ease;
    -moz-transition: all 0.7s ease;
    transition: all 0.7s ease;
}
.popupcontainer .menu-close {
    margin: 5px 5px 0 0;
    background-size: 16px 16px;
    align-self: flex-end;
    margin-bottom: auto !important;
}

.embedpopupcontainer .menu-close  {
    margin: none;
    /*background-size: 16px 16px;*/
}

.not-active {
    display: none;
    -webkit-transition: all 0.7s ease;
    -moz-transition: all 0.7s ease;
    transition: all 0.7s ease;
}

.popupcontainer-inner {
    display: flex;
    align-items: center;
    justify-content:space-between;
    width: 90%;
    max-width: 850px;
    background-color: var(--sulopopup-bg-color);
    background-position: 200px;
    color: var(--sulopopup-text-color);
    background-size: cover;
    box-shadow: 0px 0px 30px 6px rgb(0 0 0 / 40%);
    -webkit-transition: all 0.7s ease;
    -moz-transition: all 0.7s ease;
    transition: all 0.7s ease;
}

.embedpopupcontainer-inner {
    display: flex;
    align-items: center;
    justify-content:space-between;
    width: 90%;
    max-width: 1024px;
    background-color: var(--sulopopup-bg-color);
    background-position: 200px;
    color: var(--sulopopup-text-color);
    background-size: cover;
    box-shadow: 0px 0px 30px 6px rgb(0 0 0 / 40%);
    -webkit-transition: all 0.7s ease;
    -moz-transition: all 0.7s ease;
    transition: all 0.7s ease;
  }


.popup-message {
    align-self: flex-start;
    width: 30%;
    background-color: var(--sulopopup-bg-color);
    padding: 15px 15px;
    font-size: 18px;
    text-align: left;
}

.popup-message p {
    padding: 20px 0;
}

.popupcontainer-inner .menu-close {
    position: inherit;
    width: 30px;
    font-size: 20px;
    color: var(--sulopopup-text-color);
    align-self: flex-end;
    background-color: transparent;
    border: none;
    margin-bottom: 10px;
}

.popupcontainer-inner img {
    width: 100%;
}

.popupcontainer-inner .popup-buttons {
    display:flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content:space-between;
}

.popupcontainer-inner .accept {
    background-color: var(--sulopopup-bg-color);
    border: none;
    border-radius: 5px;
    width: 200px;
    padding: 14px;
    font-size: 16px;
    color: var(--sulopopup-text-color);
    box-shadow: 0px 6px 18px -5px rgba(237, 103, 85, 1);
}

.popupcontainer-inner [class*="sulobase"] {
    margin-bottom: 10px;
}

.popupcontainer-inner [class*="sulobase"] .ow-button-base a {
  box-sizing: border-box;
  font-size: 1em;
  padding: 0.7em 1.7em;
  background: transparent;
  border: 2px solid var(--sulopopup-text-color);
  color: var(--sulopopup-text-color);
}

.popupcontainer-inner [class*="sulobase"]:hover > .ow-button-base a {
  box-sizing: border-box;
  font-size: 1em;
  padding: 0.7em 1.7em;
  background: var(--sulopopup-text-color);;
  border: 2px solid var(--sulopopup-text-color);
  color: var(--sulopopup-bg-color);
}





/*----------------------------------------------------------------------
Banner Top Popup
----------------------------------------------------------------------*/

.banner-top-popupcontainer {
    position: fixed;
    display: flex;
    flex-direction: wrap;
    align-items: center;
    justify-content: center;
    width:100%;
    height:40px;
    top:0;
    left:0;
    background-color: #ff0000;
    color: white;
    font-size: 16px;
    line-height:16px;
    transition: all 1s ease;
    z-index: 700;
    -webkit-transition: all 0.7s ease;
    -moz-transition: all 0.7s ease;
    transition: all 0.7s ease;
}

.banner-top-popupcontainer img {
    height: 40px;
    width: auto;
    padding-right: 20px;
}

.banner-top-popupcontainer .menu-close {
    margin: 5px 40px 0 0;
    background-size: 16px 16px;
}

.close-white {
    background: url(img/menu-close-white.svg) no-repeat center center;
}

.header-drop-active {
    top: 40px !important;
}

.solutions-overlay-drop-active {
    top: 179px !important;
}


/*----------------------------------------------------------------------
Loading Configurator spinner
----------------------------------------------------------------------*/


.lds-ring {
  display: inline-block;
  position: relative;
  width: 80px;
  height: 80px;
}
.lds-ring div {
  box-sizing: border-box;
  display: block;
  position: absolute;
  width: 64px;
  height: 64px;
  margin: 8px;
  border: 8px solid var(--sulo-red);
  border-radius: 50%;
  animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
  border-color: var(--sulo-red) transparent transparent transparent;
}
.lds-ring div:nth-child(1) {
  animation-delay: -0.45s;
}
.lds-ring div:nth-child(2) {
  animation-delay: -0.3s;
}
.lds-ring div:nth-child(3) {
  animation-delay: -0.15s;
}
@keyframes lds-ring {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}



/*----------------------------------------------------------------------
Widget Postal Codes
----------------------------------------------------------------------*/
#postcodesalessearch{
 margin: 0 0 20px 0;
}

.widget-postcodessales .selection-content {
    padding: 100px 40px 40px 350px;
}

select,
.widget-postcodessales .select2-container--default .select2-selection--single {
    font-size: 18px;
    border: 0;
    border-radius: 20px;
    border-bottom: 1px solid var(--sulo-red);
    background-color: var(--sulo-lightgrey);
    padding: 10px;
    height: 50px;
    width: auto;
    min-width: 260px;
}

.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable {
  background-color: #f00 !important;
}


/*
.select2-container--default .select2-selection--single .select2-selection__arrow::before {
  content: "";
  display: inline-block;
  width: 15px;
  height: 15px;
  margin-right: 5px;
}*/


.select2-container--default .select2-selection--single .select2-selection__arrow b {
      border-width: 10px 10px 0 10px !important;
      margin-left: -15px !important;
      margin-top: 6px !important;
}

.select2-search__field,
.select2-results__options,
.select2-results__option--selectable,
.select2-results__option,
.select2-results__message {
  font-size: 0.9em;
}

.select2-dropdown {
  margin: 20px 0 0 0;
  width: auto;
  min-width: 200px;
  padding: 5px;
  border: none !important;
  border-radius: 20px !important;
  background-color: var(--sulo-lightgrey);
  min-width: 300px;
  top: -70px;
  box-shadow: 0px 19px 27px 0px rgba(0,0,0,0.6);
  padding: 20px;
}

.select2-dropdown--below {

}

.select2-search--dropdown .select2-search__field {
  border-bottom: 2px solid var(--sulo-red) !important;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
  color: var(--sulo-smokegrey);
}

.is-contact-widget .widget_media_image.highlight {
  animation: highlight-shadow 1s infinite;
  animation-iteration-count: 1;
}

@keyframes highlight-shadow {
    0% {
    box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.5);
    }

    80% {
    box-shadow: 0px 0px 0px 600px rgba(0, 0, 0, 0.3);
    }

    100% {
    box-shadow: 0px 0px 0px 800px rgba(0, 0, 0, 0);
    }
}

.button-small {
  font-size: 0.8em !important;
}


.is-contact-widget .widget_custom_html.active-search {
  right: 0 !important;
}


.smalltext {
  font-size: 18px;
}

.is-contact-widget .custom-html-widget .settings {
  float: right;
  display: none;
  transform: translateY(-10px);
  color: var(--sulo-black);
}

.is-contact-widget .custom-html-widget .settings:hover {
  color: var(--sulo-red);
}



/* Hover-Animation for Contact Page picture */

.set-contact {
  position: relative;
  cursor: pointer;
}

.set-contact .sow-image-container .so-widget-image {
  opacity: 1;
  display: block;
  width: 100%;
  height: auto;
  transition: .5s ease;
  backface-visibility: hidden;
}

.set-contact-overlay {
  transition: .5s ease;
  opacity: 0;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  text-align: center;
}

.set-contact:hover .sow-image-container .so-widget-image {
  opacity: 0.3;
}

.set-contact:hover .sow-image-container .set-contact-overlay {
  opacity: 1;
}





/* Show or hide widget-postcodessales if cookie is set / or not */
.hide {
  transition: .5s ease;
  display: none;
}

/*----------------------------------------------------------------------
BorlabsCookie
----------------------------------------------------------------------*/
.BorlabsCookie ._brlbs-video-youtube a._brlbs-btn {
    border-radius: 20px !important;
  	font-size: 20px;
}



/*----------------------------------------------------------------------
Blog Post Artikel (CPT)
----------------------------------------------------------------------*/
.backtoblogoverview {
  background-image: url('https://downloads.sulo.com/Contents/Home/SULO-circular-eco.jpg');
  background-repeat: no-repeat;
  background-position: left center;
  background-size: cover;
  height: 50px;
  padding: 80px;
  max-width: 1120px;
  margin: 0 auto;
}

.is-blog-post .panel-grid:nth-of-type(2) {
  z-index: 100;
  position: relative;
  background-color: var(--sulo-white);
  padding: 80px;
  margin-top: -400px;
}

.is-blog-post-info {
  padding: 0 40px 40px 40px;
}

.is-blog-post-info img {
  max-width: 110px;
}

.is-blog-content-list li{
  line-height: 40px;
}

.blog-archive-loop {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
	max-width: 1280px;
	margin: 0 auto;
}

.blog-archive-loop .panel-50:nth-of-type(2n+1) {
  flex-basis: calc(50% - 20px );
  margin: 0 0 20px 0;
  flex-grow: 1;
}

.blog-archive-loop .panel-50:nth-of-type(2n) {
  flex-basis: calc(50% - 20px );
  margin: 0 0 20px 20px;
  flex-grow: 1;
}

#blog-pagination {
  display: flex;
  align-items: center;
  margin-top: 40px;
}

.pagination a {
  padding: 0.7em 1.7em;
  background-color: var(--sulo-red);
  color: var(--sulo-white);
  border: 2px solid transparent;
  text-decoration: none;
}

.pagination a:hover {
  background-color: var(--sulo-white);
  color: var(--sulo-red);
  border: 2px solid var(--sulo-red);
}

.blog-loop-slider-image {
  padding-right: 40px;
  min-width: 485px;
  max-height: 320px;
}

.blog-loop-slider .is-content-slider {
  box-shadow: none;
}

.is-blog-post .is-content-slider .panel-layout {
	box-shadow: none;
}

.blog-loop-slider .is-content-slider .panel-layout {
  	box-shadow: none;
}

.blog-shadow {
	box-shadow: 0px 0px 20px 6px rgba(200, 200, 200, 0.5) !important;
  padding: 60px 80px;
  margin: 30px 60px;
}

.ow-button-base a {
  text-decoration: none;
}

.is-blog-aside {
    display:flex;
    flex-wrap: no-wrap;
    justify-content: center;
    position: fixed;
    top: 18vh;
    width: 70px;
    padding: 5px;
    background-color: var(--sulo-lightgrey);
}

.bottom-blog-single {
  display: flex;
  flex-wrap: row wrap;
  justify-content: space-around;
  width: 100%;
}

.post-details-cat,
.post-details-tag {
    font-size: 18px;
  margin-bottom: 20px;
    text-decoration: none;
}

.post-details-cat a[rel=tag] {
  text-transform: uppercase;
}

.post-details-cat a[rel=tag],
.post-details-tag a[rel=tag] {
  padding: 0.3em 1.3em;
  color: var(--sulo-black);
  text-decoration: none;
  border: 1px solid var(--sulo-midgrey);
}

.post-details-tag a[rel=tag]::before {
  content: "#";
}

.postdetails a[rel=tag]:hover {
  background-color: var(--sulo-midgrey);
  color: var(--sulo-white);
}

/*----------------------------------------------------------------------
Social Icons
----------------------------------------------------------------------*/
.blog-social-icons {
  display:flex;
  flex-wrap: wrap ;
  align-items: flex-start;
  margin-bottom: 10px;
}

.blog-social-icons .-linkback .dashicons {
  color: var(--sulo-red) !important;
}

.blog-social-icons a span.dashicons {
  font-size: 30px !important;
  color: var(--sulo-black) !important;
  padding: 15px;
  cursor: pointer;
}

.blog-social-icons a:hover span.dashicons {
  color: var(--sulo-red) !important;
}


/*----------------------------------------------------------------------
Scroll position
----------------------------------------------------------------------*/

/* The progress container (grey background) */
.progress-container {
  width: 100%;
  height: 4px;
  background: var(--sulo-lightgrey);
  display: none;
}

/* The progress bar (scroll indicator) */
.progress-bar {
  height: 4px;
  background: var(--sulo-red);
  width: 0%;
}

.progress-container-show {
  display: block;
}





/*----------------------------------------------------------------------
News Loop
----------------------------------------------------------------------*/
.news-archive-loop {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 80px;
  margin: 0 auto;
}

.loop-news-item {
  border-top: 8px solid transparent;
  -webkit-transition: all 0.3s linear;
  -moz-transition: all 0.3s linear;
  -ms-transition: all 0.3s linear;
  -o-transition: all 0.3s linear;
  transition: all 0.3s linear;
}

.loop-news-item:hover {
  border-top: 8px solid var(--sulo-red);
}

/* ----------------------------------------------
   Standardfarben für dunklen Hintergrund
---------------------------------------------- */
.is-dark-news .loop-news-item h3,
.is-dark-news .loop-news-item p,
.loop-news-item h3,
.loop-news-item p {
  color: var(--sulo-white);
}

/* ----------------------------------------------
   Alternative für hellen Hintergrund
---------------------------------------------- */
.is-light-news .loop-news-item h3,
.is-light-news .loop-news-item p {
  color: #000;
}

.loop-news-item small {
  font-size: 16px;
}

.loop-news-item:hover a {
  text-decoration: none !important;
}

.loop-news-item:hover h3 {
  color: var(--sulo-red);
}

.loop-news-item .news-image {
  width: auto;
  min-width: 240px;
  height: 340px;
  margin: 0 0 20px 0;
  overflow: hidden;
}

.loop-news-item .news-image img {
  -webkit-transition: all 0.3s linear;
  -moz-transition: all 0.3s linear;
  -ms-transition: all 0.3s linear;
  -o-transition: all 0.3s linear;
  transition: all 0.3s linear;
  transform: scale(1);
}

.loop-news-item:hover .news-image img {
  transform: scale(1.05);
}

.loop-news-item {
  width: 100%;
  flex-grow: 1;
  font-size: 18px;
  padding-bottom: 40px;
}

.loop-news-item img {
  width: 100%;
  min-height: 350px;
  object-fit: cover;
}

.loop-news-item .so-widget-sow-button {
  margin-top: 20px;
}

/* ----------------------------------------------
   Pagination Styles
---------------------------------------------- */
.pagination a,
.pagination .page-numbers.current {
  padding: 0.7em 1.7em;
  background-color: var(--sulo-white);
  color: var(--sulo-red);
  border: 2px solid var(--sulo-red);
  text-decoration: none;
}

.pagination a:hover,
.pagination .page-numbers.current {
  background-color: var(--sulo-red);
  color: var(--sulo-white);
  border: 2px solid transparent;
}



/*----------------------------------------------------------------------
Simple Tab Styles
----------------------------------------------------------------------*/

.simple-tabs {

}

.so-widget-sow-tabs-default-fc423d285a35-8 .sow-tabs .sow-tabs-panel-container .sow-tabs-panel .sow-tabs-panel-content {
  font-size: 16px;
}

.simple-tabs .widget-title {
  margin-bottom: 80px !important;
  font-size: 58px !important;
  line-height: 60px !important;
}

.simple-tabs .sow-tabs .sow-tabs-tab-container {
  background: none !important;
  padding: 0 !important;
  color: var(--sulo-black) !important;
  border-bottom: 3px solid var(--sulo-lightgrey) !important;
}

.simple-tabs .sow-tabs .sow-tabs-panel-container {
  padding: 120px 0 80px 40px !important;
  background: none !important;

}

.simple-tabs .sow-tabs .sow-tabs-panel-container .sow-tabs-panel .sow-tabs-panel-content {
    font-size: 20px !important;
}

.simple-tabs .sow-tabs .sow-tabs-panel-container .sow-tabs-panel{
  padding: 0 !important;
}

.simple-tabs .sow-tabs .sow-tabs-tab-container .sow-tabs-tab {
  background: none !important;
  color: var(--sulo-midgrey) !important;
  font-size: 20px !important;
  font-weight: 500 !important;
  border-bottom: 4px solid transparent !important;
}

.simple-tabs .sow-tabs .sow-tabs-tab-container .sow-tabs-tab.sow-tabs-tab-selected,
.simple-tabs .sow-tabs .sow-tabs-tab-container .sow-tabs-tab:hover {
  background: none !important;
  color: var(--sulo-black) !important;
  border-bottom: 4px solid var(--sulo-red) !important;
}


/*----------------------------------------------------------------------
Small Desktop
----------------------------------------------------------------------*/

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

   .wrapper {
        margin: 0px 30px;
        max-width: 100%;
        }

    .menu-dropdown:last-child .sub-menu
    {
      right: 0;
    }

    .menu-dropdown:last-child .sub-menu .menu-item-has-children {
      background: url(img/menu-arrow-left.svg) left center no-repeat;
      background-size: auto;
      background-size: auto;
      background-size: auto;
      background-size: 12px 12px;
    }

    .menu-dropdown:last-child .sub-menu a,
    .menu-dropdown:last-child .sub-menu .sub-menu a {
      justify-content: flex-end;
    }

    .menu-dropdown:last-child .sub-menu .sub-menu {
      margin-left: -190%;
    }

    .menu-dropdown:last-child .sub-menu .sub-menu.visible {
      margin-top: -45px;
    }

    .overlay-active .main-menu-wrapper,
    .overlay-active .language-menu-wrapper,
    #language-overlay {
        width: 50%;
        }

    .main-content .sow-slider-image-wrapper {
        padding-left: 30px !important;
        padding-right: 30px !important;
        }

    .is-fullwidth-teaser-text {
        padding: 80px 30px 80px 30px;
        max-width: 100%;
        margin: auto;
        }

    .footer-contact {
        width: 100%;
        }

    .footer-navigation {
        width: 100%;
        }

    .footer-navigation div ul li {
        width: calc(33.33% - 30px);
        margin: 0 30px 30px 0;
        }

    .solutions-menu img {
        height: auto;
        width: auto;
        max-width: 140px;
        max-height: 100px;
        }

    .solutions-menu ul ul {
        min-width: 780px;
        }

    .solutions-menu ul ul ul {
        min-width: 620px;
        padding: 20px 0 0px 0;
        }

    .solutions-menu ul li li li {
        width: 140px;
        margin: 0 10px 0 0;
        }

    .solutions-menu ul li li a {
        background-size: 12px 12px;
    }

    .solutions-menu ul li li li a {
        font-size: 16px;
        padding: 12px !important;
        }

    .main-content .is-stage-header .sow-slider-image-wrapper {
        padding: 10% 30px 0 30px !important;
        }

    .main-content .is-productfamily-header .sow-slider-image {
        min-height: 400px;
        }

    .main-content .is-productfamily-header .sow-slider-image-wrapper {
        padding: 300px 30px 100px 30px !important;
        }

    .main-content .is-content-header .sow-slider-image {
        min-height: 400px;
        }

    .main-content .is-content-header .sow-slider-image-wrapper {
        padding: 300px 30px 100px 30px !important;
        }

    .panel-row-style {
          scroll-margin-top: 100px;
        }

    .widget_sow-editor,
    .widget_sow-button,
    .widget_sow-image-grid,
    .widget_sow-tabs,
    .widget_sow-image,
    .widget_custom_html {
        padding: 0 20px !important;
    }


    .widget-postcodessales .select2-container--default .select2-selection--single {
      font-size: 16px;
    }

}



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

  .news-archive-loop {
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
    padding: 0 20px;
  }

}



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

  #solutions-overlay{
    overflow-y: auto !important;
  }

  .solutions-menu ul ul {
    min-width: 600px;
  }

}


/*----------------------------------------------------------------------
Tablet
----------------------------------------------------------------------*/

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

    header.menu-main-active {
      height: 100%;
      overflow-y: scroll;
      overflow-x: hidden;
    }

    .portal-header {
        padding: 20px 0;
        }

    .portal-header button {
        border: none;
        margin: 0;
        padding: 0;
        width: auto;
        background: none;
    }

    .portal-logo {
      position: relative;
      align-self: start;
    }

    .before-header .mobile-hide {
      display: none;
    }

    .meta-navigation {
        width: calc(100% - 220px);
        }

    .meta-navigation button {
        display: none;
        }


    .nav-menu-toggle {
      display:block;
    }

    .nav-menu-toggle.mainmenu-active .icon-nav {
      background: transparent;
    }

    .nav-menu-toggle.mainmenu-active:hover .icon-nav * {
      transform: none;
    }

    .nav-menu-toggle.mainmenu-active .icon-nav:before {
      transform: rotate(-45deg) translateY(10px);
      width: 30px !important;
    }

    .nav-menu-toggle.mainmenu-active .icon-nav:after {
      transform: rotate(45deg) translate(-3px, -12px);
      width: 30px !important;
    }

    .main-navigation {
      position: absolute;
      display: flex;
      flex-wrap: wrap;
      flex-direction: column;
      width: calc(90vw - 20px);
      min-height: 100vh;
      background: var(--sulo-white);
      color: var(--sulo-black) !important;
      overflow-x: auto;
      right: -1000px;
      top: 100px;
      list-style: none;
    }

    .menu-main-active .main-navigation,
    .main-navigation.mainmenu-active {
      right: 0;
    }

    .main-navigation ul {
      display: none;
      font-size: 17px !important;
      font-weight: 400;
    }

    .main-navigation ul.active {
      display: block;
    }

    .main-navigation > li {

      padding: 20px 0;
      font-size: 18px !important;
      border-bottom: 2px solid var(--sulo-lightgrey) !important;
    }

    .main-navigation li a {
      width: 100%;
      display: block;
    }

    .main-navigation li > a {
      padding: 0;
    }

    .main-navigation li:hover > a {
      border: 0;
    }

    .main-navigation li.firstlevel-active {
      color: var(--sulo-red);
    }

    .main-navigation > li.menu-item-has-children {
      background: url(img/menu-arrow-down.svg) right 24px no-repeat;
      background-size: auto;
      background-size: auto;
      background-size: 18px 18px;
    }


    .main-navigation > li.menu-item-has-children.firstlevel-active {
      background: url(img/menu-arrow-up.svg) right 24px no-repeat;
      background-size: auto;
      background-size: auto;
      background-size: 18px 18px;
    }


    .menu-side.firstlevel-active .sub-menu,
    .is-solutions-menu.solution-active .solutions-menu .wrapper div > .sub-menu,
    .firstlevel-active > .sub-menu {
      display: block;
    }


    .menu-dropdown:last-child .sub-menu a, .menu-dropdown:last-child .sub-menu .sub-menu a {
      justify-content: flex-start;
    }

    .menu-dropdown:last-child .sub-menu .menu-item-has-children {
    background: url(img/menu-arrow-down.svg) right 20px no-repeat;
    background-size: auto;
    background-size: auto;
    background-size: auto;
    background-size: 12px 12px;
    }


    .menu-dropdown:last-child .sub-menu .sub-menu {
        margin-left: 0;
        padding: 0 0 0 20px;
    }


    .menu-dropdown .sub-menu {
      padding: 0 0 20px 20px;
    }

    .menu-dropdown .sub-menu li {
      padding: 15px 0 0 0;
      width: 100%;
    }


    .menu-dropdown.visible > a {
      color: var(--sulo-black);
    }

    .menu-dropdown > a:hover, .menu-dropdown.visible > a {
      border-bottom: 0;
    }


    .main-navigation #solutions-overlay {
      position:relative;
      height: auto;
      top: 0;
    }

    .main-navigation #solutions-overlay .wrapper {
      margin: 0;
    }

    .main-navigation .solutions-menu .menu-close {
        display: none;
    }

    .main-navigation .solutions-menu li {
      padding: 0 0 0 10px;
    }




    .icon-nav,
    .icon-nav::before,
    .icon-nav::after {
        display: block;
        }

    button .main-menu-text {
        /*display: none;*/
        font-size: 15px;
        margin: 0 50px 0 0;
        }

    .portal-logo,
    .footer-logo {
        width: 70px;
        background-size: auto 60px;
        height: 60px;
        }

    .portal-logo a,
    .footer-logo a {
        width: 70px;
        height: 60px;
        }

    .sow-slider-image-container h1,
    .sow-slider-image-container h2,
    .sow-slider-image-container h3,
    .sow-slider-image-container h4,
    .sow-slider-image-container .subtitle {
        width: 100%;
        }

    .main-content .is-stage-header .sow-slider-image-container {
        background: rgba(20,20,20,0.3);
        }

    .main-content .is-stage-header .sow-slider-image-wrapper {
        padding: 180px 30px 0 30px !important;
        }

    .main-content .is-productfamily-header .sow-slider-image {
        min-height: 360px;
        }

    .main-content .is-productfamily-header .sow-slider-image-wrapper {
        padding: 260px 10px 80px 10px !important;
        }

    .main-content .is-content-header .sow-slider-image {
        min-height: 360px;
        }

    .main-content .is-content-header .sow-slider-image-wrapper {
        padding: 260px 10px 80px 10px !important;
        }

    .is-hover-teaser .so-widget-sow-cta {
        height: auto;
        }

    .double-teaser-high .so-widget-sow-cta {
        height: 400px;
        }

    .is-hover-teaser:hover,
    .is-hover-item:hover {
        margin: 0;
        box-shadow: 0px 0px 0px 0px transparent;
        }

    .is-hover-teaser .sow-cta-subtitle,
    .is-hover-teaser:hover .sow-cta-subtitle,
    .is-hover-item ul,
    .is-hover-item ol,
    .is-hover-item p,
    .is-hover-item:hover ul,
    .is-hover-item:hover ol,
    .is-hover-item:hover p  {
        font-size: 19px;
        line-height: 1.2;
        visibility: visible;
        }

    .is-feature-item {
        margin: 0;
        }

    .is-feature-item p {
        min-height: auto;
        padding: 0 0 30px 0;
        }

    .is-fullwidth-teaser-text {
        padding: 80px 30px 50px 30px;
        }

    .is-download-item {
        min-height: 200px;
        background-size: 40px auto;
        }

    .is-download-item:hover {
        background-size: 40px auto;
        margin: 0;
        box-shadow: 0px 0px 0px 0px transparent;
        }

    .is-download-item h4 {
        min-height: 100px;
        }

    .is-product-title {
        /*margin: -450px 0 0 0;*/
        margin-top: -450px !important;
        }

    .is-product-headline h1 {
        min-width: 200px;
        margin: 30px 0 0 0;
        }

    .is-product-headline h1 span {
        background: var(--sulo-lightgrey);
        font-family: 'Roboto Slab', 'Georgia', serif;
        margin: 5px 0 0 0;
        }

    .main-menu {
        margin: 0 0 60px 0;
        }

    .overlay-active .main-menu-wrapper,
    .overlay-active .language-menu-wrapper,
    #language-overlay {
        width: 100%;
        }

    .is-before-menu,
    .main-menu-links,
    .language-menu,
    .language-menu-content {
        padding: 30px 30px;
        }

    .solutions-menu-in-main-nav-title {
        text-transform: uppercase;
        color: var(--sulo-smokegrey);
        font-size: 18px;
        font-weight: 400;
        padding: 30px 0 0 30px;
        display: block;
        border-top: 3px solid var(--sulo-lightgrey);
        }

    .after-main-menu {
        padding: 30px 30px 60px 30px;
        }

    .menu-close {
        position: relative;
        margin: 30px 30px 30px 30px;
        }

    .language-menu-content .menu-close {
        margin: 0 0 15px 0;
        }






    #menu-overlay {
      position: relative;
      display: block;
      width: 100%;
      height: auto;
    }

    .main-menu-wrapper {
      position: relative;
      display: block;
      width: 100%;
      height: auto;
      left: inherit;
    }

    .main-menu {
      margin: 0;
    }

    .main-menu-links {
        padding: 0 0 20px 0;
    }

    .main-menu-links ul li {
        padding: 15px 0 0 20px;
    }

    .main-menu .menu-close {
      display: none;
    }

    .main-menu-links {
      border: none;
      padding: 0;
    }

    .main-menu-links li a,
    .main-menu-links li a:hover {
        padding: 0;
    }


    .menu-dropdown .sub-menu {
      flex-wrap: wrap;
      position: relative;
      width: auto;
      max-width: 100%;
      /* min-width: 100%; */
      visibility: visible;
      /* padding: 15px 0 0 20px; */
      margin: 0;
      -webkit-box-shadow: none;
      box-shadow: none;
    }


    .menu-dropdown .sub-menu .sub-menu {
      flex-wrap: wrap;
      width: max-content;
      width: auto;
      max-width: 100%;
      min-width: 100%;
      visibility: visible;
      padding: 0 0 0 20px;
      margin: 0;
      -webkit-box-shadow: none;
      box-shadow: none;
      left: inherit;
    }

    .menu-dropdown .sub-menu .sub-menu li a {
      color: var(--sulo-smokegrey);
      font-size: 16px !important;
    }


    .menu-dropdown .sub-menu .menu-item-has-children {
      background: url(img/menu-arrow-down.svg) right 24px no-repeat;
      background-size: auto;
      background-size: 12px 12px;
    }

    .menu-dropdown .sub-menu .menu-item-has-children.firstlevel-active {
      background: url(img/menu-arrow-up.svg) right 24px no-repeat;
      background-size: auto;
      background-size: 12px 12px;
    }


    #solutions-overlay {
      top: inherit;
    }


    #solutions-overlay.before-header-active {
        margin-top: 0;
    }

    #solutions-overlay.solution-active {
      border: none;
    }

    .solutions-menu,
    .solutions-menu ul:first-child,
    .solutions-menu ul ul {
      padding: 0;
    }

    .solutions-menu ul li {
      margin: 0;
    }



    .get-sticky.menu-solutions-active #solutions-overlay.solution-active {
        height: calc(100% - 80px);
        top: 80px;
        }

    .solutions-menu {
        margin: 0;
        height: 100%;
        }

    .solutions-menu .wrapper div > .sub-menu {
        padding: 20px 0;
        }

    .solutions-menu .wrapper div > .sub-menu > li {
        padding: 0 0 0 10px;
        border: none !important;
        }


    .solutions-menu img {
        height: 100%;
        width: auto;
        max-width: 100%;
        max-height: 120px;
        }

    .solutions-menu ul {
        width: 100%;
        }

    .solutions-menu ul:first-child {
        border-right: 0;
        }

    .solutions-menu li > a {
        background: url(img/menu-arrow-down.svg) right center no-repeat;
        background-size: 18px 18px;
        }

    .solutions-menu li.firstlevel-active > a {
        background: url(img/menu-arrow-up.svg) right center no-repeat;
        background-size: 18px 18px;
        }

    .solutions-menu ul ul {
        min-width: auto;
        position: relative;
        left: 0;
        padding: 0 0 4px 0;
        }

    .solutions-menu ul ul ul {
        min-width: auto;
        position: relative;
        }

    /* .solutions-menu ul li {
        border-right: 0;
        margin: 0 0 30px 0;
        } */

    .solutions-menu ul li li {
        margin: 0 0 15px 0;
        }

    .solutions-menu ul li:hover {
        border-right: 0;
        }

    .solutions-menu ul li li li {
        width: calc(20% - 15px);
        }

    .solutions-menu .menu-title-big-red > a  {
        font-size: 24px;
    }

    .is-contact-widget {
        width: 85px;
        }

    .is-contact-widget .widget_media_image {
        width: 70px;
        height: 70px;
        margin: 0 15px 0 0 !important;
        }

    .is-contact-widget .widget_media_image img {
        transition: .5s ease;
        width: 60px !important;
        height: 60px !important;
        }

    .is-contact-widget .widget_custom_html {
        bottom: 40px;
        }

    .footer-meta small {
        width: 100%;
        }

    .footer-is-imprint-menu {
        width: 100%;
        text-align: left;
        }

    .footer-navigation div ul li li,
    .footer-meta li {
        display: block;
        margin: 5px 0 0 0;
        }

    .notfound-content {
        padding: 5vh 0 30vh 0;
        }

    .widget-postcodessales .selection-content {
        padding: 20px;
        background-color: var(--sulo-white);
    }

    .is-blog-post .panel-grid:nth-of-type(2) {
      padding: 0px;
      margin-top: -40vh;
    }

    .blog-archive-loop .panel-50:nth-of-type(2n+1) {
      flex-basis: 100%;
    }

    .blog-archive-loop .panel-50:nth-of-type(2n) {
      margin: 0 0 20px 0;
      flex-basis: 100%;
    }

    .backtoblogoverview {
        min-height: 200px;
    }

    .bottom-blog-single {
        min-height: 200px;
    }

    .is-blog-post .panel-grid:nth-of-type(2) {
      width: 80vw;
      padding: 10px;
      margin-top: -250px;
    }


    .blog-archive-loop .is-hover-teaser .sow-cta-subtitle {
        font-size: 0px;
        line-height: 0;
        visibility: hidden;
        }

    .is-blog-aside {
        z-index: 150;
        position: fixed;
        top:inherit;
        bottom: 0;
        width: 100%;
        height: 40px;
        padding: 0;
        background-color: var(--sulo-lightgrey);
    }

    .bottom-blog-single {
      display: flex;
      flex-wrap: wrap;
      width: 100%;
    }

    .blog-social-icons {
      display:flex;
      flex-wrap: wrap ;
      align-items: flex-start;
      margin-bottom: 10px;
    }

    .blog-social-icons a span.dashicons {
      font-size: 22px !important;
      color: var(--sulo-black) !important;
      padding: 10px;
    }

    .blog-loop-slider-image {
      padding: 20px;
      min-width: auto;
    }

    .blog-shadow {
      padding: 0 0 20px 0;
      flex-direction: column;
    }

    .is-scrolltop-widget {
        bottom: 10px;
        padding: 0px 10px 5px 10px;
        }

    .is-scrolltop-widget::after {
        border-left: 5px solid transparent;
        border-right: 5px solid transparent;
        border-bottom: 5px solid var(--sulo-midgrey);
        }

    .is-scrolltop-widget:hover::after {
        border-bottom: 5px solid var(--sulo-white);
        }

    .is-scrolltop-widget.show-scrolltop {
        left: 10px;
        }

}


/*----------------------------------------------------------------------
Smartphone
----------------------------------------------------------------------*/

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

    body {
        font-size: 17px;
        }

    h1,
    .sow-slider-image-container h2,
    .sow-slider-image-container h1,
    .is-product-headline h1 strong {
        font-size: 34px !important;
        line-height: 36px !important;
        }

    .sow-slider-image-container .subtitle {
        font-size: 20px !important;
        line-height: 22px !important;
    }

    h2,
    .main-content h1 {
        font-size: 28px;
        }

    h3 {
        font-size: 24px;
        }

    h4 {
        font-size: 22px;
        }

    /* .main-navigation {
        width: 50px;
        margin: 5px 0 0 0;
        } */

    .meta-navigation {
        width: calc(100% - 200px);
        margin: 8px 0 0 0;
        }

    .solutions-menu ul li li li {
        width: calc(50% - 40px);
        }

    .main-content .is-stage-header .sow-slider-image-wrapper {
        padding: 160px 30px 0 30px !important;
        }

    .footer-navigation div ul li {
        width: calc(50% - 30px);
        }

    .footer-navigation div ul li li {
        width: 100%;
        }

    .is-product-title {
        /*margin: -250px 0 0 0;*/
        margin-top: -250px !important;
        }

    .is-product-title .widget_media_image {
        width: 65%;
        margin: 0 auto;
        }

    .is-content-slider .panel-layout {
        padding: 0 !important;
        margin: 0 !important;
        box-shadow: 0px 0px 0px 0px transparent;
        }

    .sow-slider-image-container p {
        font-size: 15px !important;
      }

    .is-set-image-height img {
        height: auto !important;
        width: auto;
        }

    .is-set-logos-size img {
        height: 120px !important;
        width: auto;
        padding: 0 20px 20px 0;
        }

    .is-image-bottom-set img {
        max-height: 200px !important;
        height: initial !important;
        width: auto !important;
    }

    .is-same-panel-height {
        height: 400px !important;
    }

    .is-contact-widget .widget_custom_html {
        /*width: auto;
        min-width: 300px;
        */
        max-width: 100vw;
        }

    .popup-message {
        align-self: flex-start;
        width: 100%;
        }

    .popupcontainer-inner .popup-buttons {
        flex-wrap: column;
        }

    .popupcontainer-inner .menu-close {
        display: none;
        }

    .notfound-content {
        padding: 0 0 30vh 0;
        }

    .news-archive-loop {
      grid-template-columns: repeat(1, 1fr);
      padding: 0 10px;
    }
 /* Hover Overlay für CTA-Teaser */
.is-hover-teaser {
  position: relative;
  overflow: hidden;
}

.is-hover-teaser .sow-cta-base::before {
  content: '';
  position: absolute;
  z-index: 2;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-color: rgba(0, 0, 0, 0.4); /* dunkler Overlay */
  transition: opacity 0.7s ease;
  opacity: 0;
  pointer-events: none;
}

.is-hover-teaser:hover .sow-cta-base::before {
  opacity: 1;
}

/* Sicherstellen, dass Texte über dem Overlay sichtbar bleiben */
.is-hover-teaser .sow-cta-text,
.is-hover-teaser .so-widget-sow-button {
  position: relative;
  z-index: 3;
}

/* Optional: Übergangseffekte */
.is-hover-teaser * {
  transition: all 0.7s ease;
}
/* Verhindert weißes H3 bei Hover in hellen News-Boxen */
.is-light-news .loop-news-item:hover h3 {
  color: #000;
}
.is-light-news .loop-news-item:hover h3,
.is-light-news .loop-news-item:hover p {
  color: #000 !important;
}
/* =========================================================
   REISSWOLF.CH – RESPONSIVE OPTIMIERUNG (TABLET + MOBILE)
   ========================================================= */

/* ---------- TABLET-BEREICH (769px–1024px) ---------- */
@media (max-width: 1024px) and (min-width: 769px) {

  /* HEADER */
  .portal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 25px 30px !important;
    background-color: var(--sulo-white);
  }

  .portal-logo {
    width: 220px !important;
    background-size: contain !important;
    background-position: left center !important;
  }

  .portal-logo a {
    width: 220px !important;
    height: 100px !important;
  }

  .main-navigation {
    position: relative;
    z-index: 999;
  }

  .main-navigation * {
    font-size: 17px !important;
  }

  /* HERO */
  .so-widget-sow-hero-default {
    margin-top: 80px !important;
  }

  .sow-slider-image-container h1 {
    font-size: 34px !important;
    line-height: 1.2 !important;
    text-align: center !important;
    margin: 0 30px 20px 30px !important;
  }

  .so-widget-sow-button .ow-button-base a {
    font-size: 17px !important;
    padding: 12px 28px !important;
  }

  /* INHALT */
  h1 { font-size: 40px !important; line-height: 1.2 !important; }
  h2 { font-size: 30px !important; line-height: 1.3 !important; }
  h3 { font-size: 22px !important; line-height: 1.4 !important; }
  p, li { font-size: 17px !important; line-height: 1.6 !important; }

  .panel-grid, section {
    padding: 40px 30px !important;
  }

  /* NEWS-GRID */
  .loop-news-wrapper {
    grid-template-columns: repeat(2, 1fr) !important;
    column-gap: 30px !important;
    row-gap: 60px !important;
  }

  /* FOOTER */
  footer {
    text-align: left !important;
    padding: 40px 30px !important;
  }

  .footer-navigation div ul li {
    width: 45% !important;
    margin: 10px 0 !important;
  }

  .footer-meta {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
  }

  .footer-is-imprint-menu {
    margin-top: 15px !important;
  }

  /* BILDER */
  img, .wp-image {
    max-width: 100% !important;
    height: auto !important;
  }
}

/* ---------- MOBILE-BEREICH (≤768px) ---------- */
@media (max-width: 768px) {


  /* === HERO / SLIDER === */
  .so-widget-sow-hero-default { margin-top: 120px !important; }
  .sow-slider-base { height: auto !important; min-height: 350px !important; }
  .sow-slider-image-cover { background-position: center center !important; background-size: cover !important; }

  .sow-slider-image-container h1 {
    font-size: 26px !important;
    line-height: 1.3 !important;
    margin: 0 15px 10px 15px !important;
    text-align: center !important;
  }

  .so-widget-sow-button .ow-button-base a {
    font-size: 16px !important;
    padding: 10px 20px !important;
  }

  /* === TEXTGRÖSSEN === */
  h1 { font-size: 28px !important; line-height: 1.2 !important; }
  h2 { font-size: 24px !important; line-height: 1.3 !important; }
  h3 { font-size: 18px !important; line-height: 1.3 !important; }
  p, li { font-size: 16px !important; line-height: 1.6 !important; margin-bottom: 15px !important; }

  /*section, .panel-grid, .so-panel { padding: 20px 15px !important; } */

 /* === NEWS / FOOTER === */
  .loop-news-wrapper { grid-template-columns: 1fr !important; row-gap: 40px !important; margin-top: 20px !important; }
  footer { text-align: center !important; padding: 30px 15px !important; }
  .footer-navigation div ul { display: block !important; margin: 0 !important; padding: 0 !important; }
  .footer-navigation div ul li { width: 100% !important; margin: 10px 0 !important; }
  .footer-meta { text-align: center !important; }
  .footer-is-imprint-menu { text-align: center !important; margin-top: 15px !important; }

  /* === BILDER === */
  img, .wp-image, .so-widget-image img { max-width: 100% !important; height: auto !important; }

  /* === BUTTONS === */
  .sowb-button, .so-widget-sow-button .ow-button-base a {
    display: inline-block;
    text-align: center;
    width: auto;
    min-width: 180px;
  }

  /* === HEADER-TOP MIT FLAGGEN & SOCIAL === */
  .header-top {
    background-color: #1b2d59;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
    padding: 4px 0;
    min-height: 30px;
  }

  .language-flags img {
    width: 22px;
    height: auto;
    margin: 0 4px;
  }

  .social-icons a,
  .social-icons i {
    font-size: 18px;
    margin: 0 5px;
    color: white;
  }

}
