/* Schmucki Gutenberg General (Frontend + Backend) main CSS */
/* weitere Styles in theme.css und backend.css */
/* ------------------------- Fonts ------------------------- */

/* 
** Ersetzen mit Font vom Theme 
*/

@font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Inter';
    font-style: normal;
    font-weight: 100;
    src: url('../fonts/Inter-100.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}

@font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Inter';
    font-style: normal;
    font-weight: 300;
    src: url('../fonts/Inter-300.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}

@font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Inter';
    font-style: normal;
    font-weight: 400;
    src: url('../fonts/Inter-Regular.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}

@font-face {
    font-display: swap; 
    font-family: 'Inter';
    font-style: italic;
    font-weight: 500;
    src: url('../fonts/Inter-500.ttf') format('truetype'); 
}

@font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Inter';
    font-style: normal;
    font-weight: 700;
    src: url('../fonts/Inter-700.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}

@font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Inter';
    font-style: normal;
    font-weight: 900;
    src: url('../fonts/Inter-900.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
    


/* ------------------------- typography ------------------------- */
/* for use in text and headings */
.row.center-xs {
    text-align: unset;
}

.row.text_center,
.text_center {
    text-align: center;
}


/* ------------------------- Colors ------------------------- */

/* invert text color automatically */
/* .has-black-background-color,
.has-primary-background-color,
.has-secondary-background-color {
    color: var(--smk--color--white);
} */

.has-primary-background-color .partner_content--spacing {
    background-color: #FFF9EF;
}


/* Schmucki Colors */
/* body {
    --smk--color--primary: #AC9E00;
    --smk--color--white: #ffffff;
    --smk--color--black: #000000;   
} */
/* .colors-schmucki-theme.farbwerte-sind-im-html.das-ist-kein-selector { */
    /* :root {
        --smk--color--normal: #494949;
        --smk--color--primary: #E5053A;
        --smk--color--secondary: #CABAA0;
        --smk--color--tertiary: #F0EDE8;
        --smk--color--white: #ffffff;
        --smk--color--black: #000000;
        --smk-transition: all 250ms ease;
    } */
    
    
    /* Swiper Colors (Slider) */
    .swiper {
        --swiper-theme-color: var(--smk--color--normal);
        --swiper-pagination-color: var(--swiper-theme-color);
        --swiper-pagination-bullet-inactive-color: #000;
    }
    
    
/* ------------------------- Wrapper ------------------------- */
    

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

/* --- theme.css header */


/* ----general.css header ---- */

/* Defaults */
.smk_logo {
    width: 102px;
    /* max-width: calc(100% - 80px); */
}

.site-header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    width: 100%;
    border: 0px solid var(--Gray-5, #E0E0E0);
    background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.72)), color-stop(6.67%, rgba(0, 0, 0, 0.71)), color-stop(13.33%, rgba(0, 0, 0, 0.69)), color-stop(20%, rgba(0, 0, 0, 0.66)), color-stop(26.67%, rgba(0, 0, 0, 0.61)), color-stop(33.33%, rgba(0, 0, 0, 0.55)), color-stop(40%, rgba(0, 0, 0, 0.48)), color-stop(46.67%, rgba(0, 0, 0, 0.40)), color-stop(53.33%, rgba(0, 0, 0, 0.32)), color-stop(60%, rgba(0, 0, 0, 0.24)), color-stop(66.67%, rgba(0, 0, 0, 0.17)), color-stop(73.33%, rgba(0, 0, 0, 0.11)), color-stop(80%, rgba(0, 0, 0, 0.06)), color-stop(86.67%, rgba(0, 0, 0, 0.03)), color-stop(93.33%, rgba(0, 0, 0, 0.01)), to(rgba(0, 0, 0, 0.00)));
    background: -o-linear-gradient(top, rgba(0, 0, 0, 0.72) 0%, rgba(0, 0, 0, 0.71) 6.67%, rgba(0, 0, 0, 0.69) 13.33%, rgba(0, 0, 0, 0.66) 20%, rgba(0, 0, 0, 0.61) 26.67%, rgba(0, 0, 0, 0.55) 33.33%, rgba(0, 0, 0, 0.48) 40%, rgba(0, 0, 0, 0.40) 46.67%, rgba(0, 0, 0, 0.32) 53.33%, rgba(0, 0, 0, 0.24) 60%, rgba(0, 0, 0, 0.17) 66.67%, rgba(0, 0, 0, 0.11) 73.33%, rgba(0, 0, 0, 0.06) 80%, rgba(0, 0, 0, 0.03) 86.67%, rgba(0, 0, 0, 0.01) 93.33%, rgba(0, 0, 0, 0.00) 100%);
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.72) 0%, rgba(0, 0, 0, 0.71) 6.67%, rgba(0, 0, 0, 0.69) 13.33%, rgba(0, 0, 0, 0.66) 20%, rgba(0, 0, 0, 0.61) 26.67%, rgba(0, 0, 0, 0.55) 33.33%, rgba(0, 0, 0, 0.48) 40%, rgba(0, 0, 0, 0.40) 46.67%, rgba(0, 0, 0, 0.32) 53.33%, rgba(0, 0, 0, 0.24) 60%, rgba(0, 0, 0, 0.17) 66.67%, rgba(0, 0, 0, 0.11) 73.33%, rgba(0, 0, 0, 0.06) 80%, rgba(0, 0, 0, 0.03) 86.67%, rgba(0, 0, 0, 0.01) 93.33%, rgba(0, 0, 0, 0.00) 100%);
    position: fixed;
    -webkit-box-shadow: none;
            box-shadow: none;
    padding: 0;
    z-index: 1000;
}

.site-header > .wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
    width: 100%;
    margin: 0px;    
    -ms-flex-preferred-size: 75%;    
        flex-basis: 75%;
    max-width: 75%;
}

.gb-container-inside {
    width: 100%;
}

.background_dark {
    background-color: #333;
}

.nav_sys_wrapper {
    height: auto;
    -webkit-transition: height 0.5s ease;
    -o-transition: height 0.5s ease;
    transition: height 0.5s ease;
}

.nav_sys_wrapper.fade-out {
    height: 0px;
}

/* Header Navigations */
.nav-primary, .menu-toggle, .nav-system {
    margin-left: auto;
}

.nav-system li {
    display: inline-block;
}

.nav-system a {
    color: #ffffff;
    display: block;
    font-size: 13px;
    font-weight: 400;
    outline-offset: -1px;
    padding: 8px;
    text-decoration: none;
}

/* Hero Header */
.topline {
    font-size: 18px !important;
    margin-bottom: 0px !important;
}

.iframe-wrapper {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    overflow: hidden;
    display: block
}

.iframe-wrapper iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    max-width: 100%;
    top: 50%;
    -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
            transform: translateY(-50%);
}

@media (min-aspect-ratio: 16 / 9) {
    .iframe-wrapper {
        width: 100vw;
        height: 56.25vw;
        top: 50%;
        -webkit-transform: translateY(-50%);
            -ms-transform: translateY(-50%);
                transform: translateY(-50%);
    }
}

@media (max-aspect-ratio: 16 / 9) {
    .iframe-wrapper {
        width: 209.778vh;
        height: 100vh;
        left: 50%;
        -webkit-transform: translateX(-50%);
            -ms-transform: translateX(-50%);
                transform: translateX(-50%);
    }
}

.smk_custom_header:not(.no-background) {
    background-image: url("https://www.smartwaste.agenturschmucki.ch/wp-content/uploads/bg-loader-smartwaste-frame.jpg");
    position: relative;
    overflow: hidden;
    height: 100vh;
    width: 100vw;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    background-size: cover;
}

.smk_custom_header:not(.no-background) .smk_custom_hero_background {
    position: absolute;
    height: 100%;
    width: 100%;
}

.smk_custom_header:not(.no-background) .smk_custom_hero_content {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-flex: revert;
        -ms-flex-positive: revert;
            flex-grow: revert;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    position: absolute;
    /* width: initial; */
    height: auto;
    min-height: 100%;
    z-index: 99;
    /* margin-top: -50%; */
    margin: 0 auto;
    max-width: 100%;
    width: 100%;
}

.smk_custom_header:not(.no-background) .smk_custom_hero_content .smk_custom_hero_content_inner  {
    padding: 30px 30px 60px 30px;
}

/* Hero Overlay */
.smk_custom_header:after {
    content:"";
    display: block;
    top:0; bottom: 0; left: 0; right: 0;
    position: absolute;
    z-index: 9;
    /* background-color: #000000; */
    opacity: 0.6;
    pointer-events: none;
}

.smk_scroll_down {
    display: block;
    position: absolute;
    bottom: 10px;
    z-index: 100;
    padding: 0 30px 0;
}

.smk_scroll_down-button {
    color: white;
    text-decoration: none;
    font-size: 1.5rem;
    font-style: normal;
    font-weight: 900;
    line-height: 115%;
    text-align: center;
}

a.smk_scroll_down-button:after {
    content: url(https://www.smartwaste.ch/wp-content/uploads/hero-arrow.svg);
    display: block;
    margin-top: 1rem;
}

.owl-hero {
    height: 100%;
}

.owl-hero .owl-stage-outer {
    height: 100%;
}

.owl-hero .owl-stage {
    height: 100%;
}

.owl-hero .owl-item, .owl-hero .item {
    height: 100%;
}

.owl-carousel .owl-item img {
    height: auto;
    width: auto;
    min-height: 100%;
    min-width: 100%;
    -o-object-fit: cover;
       object-fit: cover;
}

/* ------------------------- Content ------------------------- */
/* -------------
    Heading
------------- */

/* -------------
    Layout (more in container-block.css)
------------- */



/* -------------
    Spacing
------------- */

/* block spacing is in theme.css */

.smk-container {
/* minimize spacing */
    padding-bottom: 5rem;
}
    
.block-wrapper {
    margin-bottom: 40px;
}

/* .has-background {
    padding: 2rem;
} */

.has-background p:last-child {
    margin-bottom: 0;
}

@media screen and (max-width: 575px) {
    body,
    .site-container {
        width: 100vw;
    }

    .site-inner {
        padding-left: 0;
        padding-right: 0;
    }

    .site-inner .entry-content .block-wrapper > div {
        padding-left: 20px;
        padding-right: 20px;
    }
}

/* -------------
    button 
------------- */


/* ------------------------- Footer ------------------------- */
footer {}




/* -------------------------  Warning missing content ------------------------- */



/* ------------------------- Flexboxgrid add row to inner blocks ------------------------- */
/* -----
**** ist im columns-editor.css
  ----- */