﻿

/*------------------------------------------------
   FONTS
-------------------------------------------------*/
/* fira-sans-100italic - 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: 'Fira Sans';
    font-style: italic;
    font-weight: 100;
    src: url('/fonts/fonts-polyfill/fira-sans-v17-latin-100italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* fira-sans-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: 'Fira Sans';
    font-style: normal;
    font-weight: 200;
    src: url('/fonts/fonts-polyfill/fira-sans-v17-latin-200.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* fira-sans-200italic - 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: 'Fira Sans';
    font-style: italic;
    font-weight: 200;
    src: url('/fonts/fonts-polyfill/fira-sans-v17-latin-200italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* fira-sans-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: 'Fira Sans';
    font-style: normal;
    font-weight: 300;
    src: url('/fonts/fonts-polyfill/fira-sans-v17-latin-300.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* fira-sans-300italic - 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: 'Fira Sans';
    font-style: italic;
    font-weight: 300;
    src: url('/fonts/fonts-polyfill/fira-sans-v17-latin-300italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* fira-sans-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: 'Fira Sans';
    font-style: normal;
    font-weight: 400;
    src: url('/fonts/fonts-polyfill/fira-sans-v17-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* fira-sans-italic - 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: 'Fira Sans';
    font-style: italic;
    font-weight: 400;
    src: url('/fonts/fonts-polyfill/fira-sans-v17-latin-italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* fira-sans-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: 'Fira Sans';
    font-style: normal;
    font-weight: 500;
    src: url('/fonts/fonts-polyfill/fira-sans-v17-latin-500.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* fira-sans-500italic - 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: 'Fira Sans';
    font-style: italic;
    font-weight: 500;
    src: url('/fonts/fonts-polyfill/fira-sans-v17-latin-500italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* fira-sans-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: 'Fira Sans';
    font-style: normal;
    font-weight: 600;
    src: url('/fonts/fonts-polyfill/fira-sans-v17-latin-600.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* fira-sans-600italic - 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: 'Fira Sans';
    font-style: italic;
    font-weight: 600;
    src: url('/fonts/fonts-polyfill/fira-sans-v17-latin-600italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* fira-sans-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: 'Fira Sans';
    font-style: normal;
    font-weight: 700;
    src: url('/fonts/fonts-polyfill/fira-sans-v17-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* fira-sans-700italic - 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: 'Fira Sans';
    font-style: italic;
    font-weight: 700;
    src: url('/fonts/fonts-polyfill/fira-sans-v17-latin-700italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* fira-sans-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: 'Fira Sans';
    font-style: normal;
    font-weight: 800;
    src: url('/fonts/fonts-polyfill/fira-sans-v17-latin-800.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* fira-sans-800italic - 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: 'Fira Sans';
    font-style: italic;
    font-weight: 800;
    src: url('/fonts/fonts-polyfill/fira-sans-v17-latin-800italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* fira-sans-900 - 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: 'Fira Sans';
    font-style: normal;
    font-weight: 900;
    src: url('/fonts/fonts-polyfill/fira-sans-v17-latin-900.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* fira-sans-900italic - 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: 'Fira Sans';
    font-style: italic;
    font-weight: 900;
    src: url('/fonts/fonts-polyfill/fira-sans-v17-latin-900italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}


/*------------------------------------------------
  Override Canvas Vars
-------------------------------------------------*/
:root {
    --cnvs-line-height-content: 24px;
    --cnvs-header-height: 50px;
    --cnvs-primary-menu-padding-x: 10px !important;
}

/*------------------------------------------------
   Global							
-------------------------------------------------*/
.is-expanded-menu #header.transparent-header {
    border-bottom: 0;
    padding:50px 0px;
}

#header {
   background: rgba(0,0,0,1);
}

.is-expanded-menu .full-header #logo
{
    border-right:solid 0px transparent;
}

#footer {
    background-image: url(/images/contenthub/footer_svolt_lay.png);
    background-size: cover;
    background-repeat: no-repeat;
}

    #footer .social-icon {
        float: right;
        --cnvs-socialicon-border-color: #ffffff;
        color:#ffffff;
    }

    body {
        font-family: 'Fira Sans', sans-serif;
    }

h1, h2, h3, h4, h5, h6 {
    font-family: 'Fira Sans', sans-serif;
    font-weight:900;
}

h1, h2 {
    font-weight: 300;
}

.cat_headline {
    font-family: 'Fira Sans', sans-serif;
    font-weight: 700;
    font-size: 50px;
}

.title-sm h3 {
    font-size: 24px;
}

strong, b {
    font-family: 'Fira Sans', sans-serif;
    font-weight: 700;
}

h2 {
    font-size: 35px;
}

h4
{
    font-size:18px;
    font-weight:700;
}

p, ul, li {
    font-family: 'Fira Sans', sans-serif;
    font-weight: 300;
    font-size: 15px;
    color: #000;
}

hr {
    opacity: 1;
    width: 100%;
    color: #ccc;
}

.logo-sticky
{
    padding:8px 0px;
}

.border-right {
    border-right: solid 1px #ccc
}

.button.button-border {
    --cnvs-btn-border-color: #f9b002;
    color: #312783;
    font-size: 27px;
    padding-top: 20px;
    padding-bottom: 20px;
}

.button.button-border i
{
    margin-right:25px;
}

    .button.button-border:not(.button-fill):hover {
        background-color: #f9b002;
    }

.button
{
    margin:0px;
}

#header-wrap #logo img {
    height: 54px;
}

#copyrights {
    background-color: #000;
    color: #fff;
    padding: 25px 0px;
}

.copyrights-menu a {
    color: #fff;
}

.is-expanded-menu #slider + #header.transparent-header.full-header #header-wrap,
.is-expanded-menu #header.transparent-header.full-header #logo,
.is-expanded-menu .full-header .primary-menu .menu-container {
    border: 0px;
}

.sticky-header .logo-dark
{
    display:none !important;
}

.sticky-header .logo-sticky {
    display: flex !important;
}

.menu-item {
    margin-right: 30px;
}

.menu-link {
    background-size: 100% 4px;
    background-position: center bottom;
    background-repeat: no-repeat;
    width: 200px;
    color: #fff;
    text-transform: uppercase;
    text-align: center;
    font-family:"Fira Sans";
    font-weight:700;
    font-size:16px;
}

    .menu-link.active {
        background-size: 100% 100%;
    }
    .menu-link:not(:hover) {
        background-size: 100% 4px;
        transition: ease-in background-size .2s;
    }

    .menu-link:hover {
        background-size: 100% 100%;
        color: #fff !important;
        transition: ease-out background-size .2s;
    }


.languages .list-group
{
    background:none;
}

.languages .list-group-item {
    border: solid 0px #fff !important;
    padding-left: 0px;
    padding-right: 0px;
    background: none;
}

.languages .button {
    background-color: #000;
    color: #B2B2B2;
}

    .languages .button:hover {
        background-color: #312783;
        color: #fff;
    }

    .languages .button.active {
        background-color: #B2B2B2;
        color: #fff;
    }

.bg-secondary 
{
    background-color: rgb(249, 176, 2) !important;
    color: #000;
    padding-left: 10px !important;
    padding-right: 10px !important;
    border-radius: 3px !important;
}


.readMore:before {
    content: '';
    background-image: url(/images/arrow-links.svg);
    display: inline-block;
    width: 25px;
    height: 12px;
    margin-right: 0px;
    background-size: contain;
    background-repeat: no-repeat;
}


.btnBattery:before {
    content: '';
    background-image: url('/images/Gruppe 298.svg');
    display: inline-block;
    width: 25px;
    height: 17px;
    margin-right: 0px;
    background-size: contain;
    background-repeat: no-repeat;
}

.border-bottom-1 {
    border-bottom: solid 1px #D0D0D0;
}

.grey {
    color: #959595;
}

.newsDetailHeadline {
    font-size: 50px;
    font-weight:700;
}

.newsDetailHeadline small
{
    font-size:12px;
    font-weight:500;
    display:block;
    margin-top:15px;
}

.umb-grid .caption {
    font-size: 12px;
    padding-top: 10px;
    color: #B2B2B2
}

.newsAside {
    padding-top: 150px
}

.umb-grid .row {
    margin-left: -20px;
    margin-right: -20px;
}

.pt-70 {
    padding-top: 70px !important;
}

.pt-140 {
    padding-top:140px !important;
}

.mainArticle .entry-title h3 {
    font-size: 35px;
    line-height: 37px;
}

.entry-title h3 a:hover {
    color:#000 !important;
    text-decoration: underline !important;
}

.entry-categories {
    color: #000 !important;
    margin-bottom: 12px;
}

.entry-categories a {
    color: #000 !important;    
}

.entry-title.title-sm h3, .entry-title.title-sm .h3 {
    font-size: 24px !important;
    line-height: 30px;
    font-weight: 700;
}

.entry-title.title-xs h3
{
    width:75%;
}

.product-image > .badge, .sale-flash {
    top: 20px;
    left: 22px;
}

.bigFont {
    font-size: 18px;
}


/*------------------------------------------------
  Question and Answers FAQ
-------------------------------------------------*/
.mainCategory {
    margin-bottom: 150px;
}

    .mainCategory h3 {
        position: relative;
        padding-left: 195px;
        font-size: 36px;
        font-weight: 300;
        margin-bottom: 15px;
        font-family: 'Fira Sans', sans-serif;
    }

.counter {
    display: flex;
    width: 150px;
    height: 150px;
    text-align: center;
    background-color: #eee;
    vertical-align: middle;
    align-items: center;
    position: absolute;
    top: -50px;
    left: 0px;
    font-size: 60px;
    justify-content: center;
    font-family: 'Fira Sans';
}

.categories_questions {
    margin-left: 75px;
    background-color: #f9f9f9;
    padding: 40px 80px;
}

    .categories_questions h4 {
        font-size: 25px;
        margin-bottom: 15px;
        margin-top: 40px;
        padding-left: 40px;
        font-family: 'Fira Sans', sans-serif;
        font-weight: 300;
    }

.toggle-title, .accordion-title {
    font-size: 18px;
}

.toggle-bg .toggle-content {
    padding: 20px 45px;
    background-color: #fff;
    font-family: 'Fira Sans', sans-serif;
    font-size: 14px;
}

.toggle-icon i {
    color: #fff !important;
}

.farbschema_Tuerkis h3 .counter {
    color: #fff !important;
}

.farbschema_Tuerkis h3 .counter, .farbschema_Tuerkis .toggle-bg .toggle-header {
    background-color: #9bcdce;
}

.farbschema_Tuerkis .categories_questions {
    background-color: rgba(155, 205, 206, 0.3);
}

.farbschema_Oliv h3 .counter {
    color: #fff !important;
}

.farbschema_Oliv h3 .counter, .farbschema_Oliv .toggle-bg .toggle-header {
    background-color: #cdcd9a;
}

.farbschema_Oliv .categories_questions {
    background-color: rgba(205, 205, 154, 0.3);
}

.farbschema_Lila h3 .counter {
    color: #fff !important;
}

.farbschema_Lila h3 .counter {
    background-color: #312783;
    color: #fff !important;
}

.farbschema_Lila .toggle-bg .toggle-header {
    background-color: rgba(49, 39, 131, 0.22);
}

.farbschema_Lila .categories_questions {
    background-color: rgba(49, 39, 131, 0.3);
}

.copyrights-menu a
{
    cursor:pointer;
}

.gdpr-settings p
{
    color:#fff !important;
}


@media (max-width:1780px) {
    .menu-item {
        margin-right:20px;
    }

    .menu-link {
        width: 180px;
    }
}


@media (max-width:1600px) {
    .menu-link {
        width:auto;
    }

    .menu-item {
        margin-right: 20px;
    }
}

@media (max-width:1200px) {
    #header {
        background: transparent;
    }

    .content-wrap
    {
        padding-top:15px;
    }
}

@media (max-width:1024px) {
    .newsAside {
        padding-top: 20px
    }

}

@media (max-width:490px) {
    .newsDetailHeadline
    {
        font-size:30px;
    }

    .slider-inner
    {
        background-position:-20px !important;
    }

}

@media (max-width: 767px) {
    .pt-140
    {
        padding-top:40px !important;
    }

    .entry-title.title-xs h3 {
        width: 100%;
    }

    .primary-menu
    {
        padding:0px !important;
    }

    .promo-height {
        height: 500px;
    }

    .infomagazin-image img {
        position: relative !important;
        transform: rotate(90deg);
        top: -15px !important;
        left: 0px !important;
    }

    .fix-icon {
        position: relative;
        left: 0;
        background-color: #9bcdce;
        padding: 20px;
        width: 120px;
        height: 120px;
        box-shadow: 1px 8px 10px gray;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .five-finger-icon-img {
        margin-top: 0px;
    }

    .categories_questions {
        margin-left: 0px;
        padding: 20px;
    }

    .mainCategory h3 {
        padding-left: 90px;
        font-size: 23px;
    }

    .counter {
        width: 75px;
        height: 75px;
        top: -26px;
    }

    .ls-animation-item {
        font-size: 120px;
    }

    .mainCategory {
        margin-top: 135px;
    }

    span.catchphrase {
        font-size: 18px
    }

    .link-list-template > li > a {
        font-size: 12px
    }

    .tp-bullet {
        transform: matrix(1, 0, 0, 1, -90, 170);
    }
}

@media (max-width: 576px) {
    .btn-danger {
        padding-left: 40px;
        padding-right: 40px;
    }

    .karriereInner {
        margin-left: 2px;
    }
}

@media (max-width: 569px) {
    .footerArrow {
        width: 25px;
    }

    #logo img {
        padding: 9px 0px;
    }

    .btn-danger {
        padding-left: 35px;
        padding-right: 35px;
    }

    #sidebarIcons {
        bottom: 0px;
    }

    .overlappedContent-slider {
        position: relative;
        top: -150px;
    }

    .pt-sm-8 {
        padding-top: 275px !important;
    }

    .zusammengefasstText {
        padding-left: 20px;
    }

        .zusammengefasstText h2 {
            font-size: 23px;
            margin-bottom: 10px;
        }

    .infomagazin-text {
        padding-top: 255px;
    }

    .ls-animation-item {
        font-size: 60px;
    }

    .fs68 {
        font-size: 44px;
    }

    .homeSpecialImage1 {
        top: 0px;
        margin-bottom: 0px;
    }

    .karriereOuter {
        width: 100%;
        height: 450px;
        background-repeat: no-repeat;
        background-position: right;
        margin-bottom: 435px;
        position: relative;
    }

    .karriereInner {
        margin-left: 0px;
        top: 295px;
        position: absolute;
        left: 0px;
        width: 100%;
    }

        .karriereInner h2 {
            font-size: 25px;
        }

    .promo-dark h3 {
        font-size: 25px;
    }

    .btn-danger {
        padding-left: 15px;
        padding-right: 15px;
        font-size: 16px;
    }

    .kill-mt {
        margin-top: 1rem !important
    }

    .kill-pt {
        padding-top: 1rem !important
    }

    .forward-link > a {
        font-size: 15px
    }

    .catchphrase p, .catchphrase a {
        font-size: 16px;
    }

    p:has(span.catchphrase) {
        text-align: center;
    }

    p:has(span.forward-link) {
        text-align: center;
    }

    span.forward-link:before {
        margin-right: 5px;
    }

    .p-25 {
        padding: 25px
    }

    .px-25 {
        padding-left: 25px !important;
        padding-right: 25px !important;
    }

        .px-25 > h2 {
            font-size: 35px
        }

    .overlappedContent-slider {
        max-width: 93%; /* max-width: 401px;*/
    }

    .bluebox {
        max-width: 401px;
        text-align: center;
        padding-top: 260px !important;
        padding-bottom: 0px !important
    }

    .mainCategory h3 {
        font-size: 14px;
    }

    .mainCategory {
        margin-top: 100px;
        margin-bottom: 50px;
    }

    .toggle-title {
        font-size: 14px
    }

    .margin-fix-press {
        margin-top: 150px
    }

    .download-height {
        min-height: 510px;
        max-height: 510px;
    }
}

@media (max-width: 376px) {
    .pt-sm-8 {
        padding-top: 250px !important;
    }

    .infomagazin-text {
        padding-top: 320px;
    }

    .button-link {
        padding-left: 15px;
        padding-right: 15px;
    }

    .overlappedContent-slider {
        max-width: 93%; /* max-width: 350px;*/
    }

    .bluebox {
        max-width: 350px;
        text-align: center;
        padding-top: 260px !important;
        padding-bottom: 0px !important
    }

        .bluebox > a > h3 {
            display: block;
            width: 100%;
            height: auto;
            line-height: 2rem;
        }

            .bluebox > a > h3:before {
                display: none
            }


    .me-3 {
        margin-right: 0.5rem !important;
    }

    .ms-3 {
        margin-left: 0.5rem !important
    }

    .margin-fix-press {
        margin-top: 250px
    }
}

@media (max-width: 321px) {
    .pt-sm-8 {
        padding-top: 300px !important;
    }

    .infomagazin-text {
        padding-top: 365px;
    }

    .fs68 {
        font-size: 35px;
    }

    .btn.btn-danger {
        padding-left: 8px;
        padding-right: 8px;
        font-size: 12px;
    }

    .overlappedContent-slider {
        max-width: 290px;
    }

    .bluebox {
        max-width: 290px;
        text-align: center;
        padding-top: 330px !important;
        padding-bottom: 0px !important
    }

        .bluebox > a > h3 {
            display: block;
            margin-top: 40px;
            width: 100%;
            height: auto;
            line-height: 2rem;
        }

            .bluebox > a > h3:before {
                display: none
            }

    #logo img {
        max-height: 50px;
    }

    .content-wrap-faq {
        padding-top: 200px !important;
    }

    .margin-fix-press {
        margin-top: 350px
    }

    h1 {
        font-size: 1rem;
        font-weight: bolder;
        font-family: 'Fira Sans';
    }

    #preFooterBorder {
        margin-top: 20px;
    }

    .karriereOuter {
        height: 490px;
    }

    .paper > h2 {
        font-size: 26px;
        line-break: auto;
    }
}