@font-face {font-family: "Montserrat-Regular"; src: url("/si_upload/OPR/Maxcom/1308651_maxcom-eco_ecowatch-1-black_v1/fonts/Montserrat-Regular.ttf") format('truetype');}
@font-face {font-family: "Montserrat-Medium"; src: url("/si_upload/OPR/Maxcom/1308651_maxcom-eco_ecowatch-1-black_v1/fonts/Montserrat-Medium.ttf") format('truetype');}
@font-face {font-family: "Montserrat-Bold"; src: url("/si_upload/OPR/Maxcom/1308651_maxcom-eco_ecowatch-1-black_v1/fonts/Montserrat-Bold.ttf") format('truetype');}
@font-face {font-family: "Montserrat-SemiBold"; src: url("/si_upload/OPR/Maxcom/1308651_maxcom-eco_ecowatch-1-black_v1/fonts/Montserrat-SemiBold.ttf") format('truetype');}
@font-face {font-family: "Montserrat-ExtraBold"; src: url("/si_upload/OPR/Maxcom/1308651_maxcom-eco_ecowatch-1-black_v1/fonts/Montserrat-ExtraBold.ttf") format('truetype');}
@font-face {font-family: "Montserrat-MediumItalic"; src: url("/si_upload/OPR/Maxcom/1308651_maxcom-eco_ecowatch-1-black_v1/fonts/Montserrat-MediumItalic.ttf") format('truetype');}
@font-face {font-family: "Montserrat-BoldItalic"; src: url("/si_upload/OPR/Maxcom/1308651_maxcom-eco_ecowatch-1-black_v1/fonts/Montserrat-BoldItalic.ttf") format('truetype');}
@font-face {font-family: "Montserrat-ExtraBoldItalic"; src: url("/si_upload/OPR/Maxcom/1308651_maxcom-eco_ecowatch-1-black_v1/fonts/Montserrat-ExtraBoldItalic.ttf") format('truetype');}

@charset "UTF-8";

.main {
        width: 920px;
        display: block;
        margin: auto;
        font-family: Montserrat-Regular, sans-serif !important;
        color: #1f1f1f;
    }
    
    .hero__container {
        position: relative;
        z-index: -10;
        margin-top: 50px;
        height: 720px;
    }

    .hero {
        text-align: center;
        position: relative;
        width: 920px;
    }
    
    .hero.web {
        height: 100%;
    }

    .hero__img {
        max-width: 100%;
    }
    
    .hero__web-img {
        background-image: url(//f00.esfr.pl/si_upload/OPR/Maxcom/1308651_maxcom-eco_ecowatch-1-black_v1/img/hero-img-bg.png);
        background-attachment: fixed;
        background-repeat: no-repeat;
        background-position: center;
        height: 100%;
        position: relative;
        z-index: -10;
    }
    
    .hero__web-img-back {
        position: absolute;
        left: 0;
        bottom: -2px;
        width: 100%;
        z-index: -11;
    }
    
    .hero__web-img-front {
        position: absolute;
        left: 0;
        bottom: -2px;
        width: 100%;
        z-index: -9;
    }
    
    .hero__head {
        font-family: Montserrat-Bold, sans-serif !important;
        font-size: 56px;
        font-weight: 700;
        text-align: center;
        max-width: 820px;
        display: block;
        margin: 15px auto;
    }

    .hero__desc {
        font-size: 18px;
        max-width: 820px;
        display: block;
        margin: auto;
    }
    
    .section1__top {
        height: 290px;
        max-width: 100%;
        position: relative;
    }
    
    .section1__top-img-1 {
        max-width: 100%;
        position: absolute;
        top: 2px;
        z-index: -11;
    }
    
    .section1__top-img-2 {
        max-width: 100%;
        position: absolute;
        z-index: -8;
        top: 2px;
    }
    
    .section1 {
        background-color: #9EDBD2;
        text-align: center;
    }
    
    .section1__txt-wide {
        display: block;
        margin: auto;
        max-width: 90%;
        font-family: Montserrat-Regular, sans-serif !important;
        padding-bottom: 50px;
    }
    
    .section1__txt-wide-head {
        font-family: Montserrat-Bold, sans-serif !important;
        font-weight: 700;
        font-size: 36px;
        margin-bottom: 15px;
    }
    
    .section1__txt-wide-desc {
        font-family: Montserrat-Regular, sans-serif !important;
        font-size: 22px;
    }
    
    .section1__img {
        max-width: 50%;
        padding-bottom: 50px;
    }
    
    .section1__bottom {
        max-width: 100%;
        position: relative;
    }
    
    .section1__bottom-img {
        max-width: 100%;
        position: absolute;
        top: -20px;
        z-index: -8;
    }
    
    .section2 {
        background-color: white;
        position: relative;
        z-index: -9;
    }
    
    .grid__row {
        display: flex;
        flex-wrap: nowrap;
    }
    
    .grid__col {
        width: 50%;
    }
    
    .grid__col-img {
        max-width: 95%;
    }
    
    .grid__col-txt {
        width: 90%;
        position: relative;
        left: 50%;
        top: 50%;
        translate: -50% -50%;
        
    }
    
    .grid__col-head {
        font-family: Montserrat-Bold, sans-serif !important;
        font-weight: 700;
        font-size: 28px;
        margin-bottom: 10px;
    }
    
    .grid__col-desc {
        font-family: Montserrat-Regular, sans-serif !important;
        font-size: 18px;
    }
    
    .img-wide {
        max-width: 95%;
        display: block;
        margin: 25px auto;
        border-radius: 30px;
    }
    
    .section2__txt-wide {
        display: block;
        margin: auto;
        max-width: 90%;
        font-family: Montserrat-Regular, sans-serif !important;
        padding-bottom: 50px;
    }
    
    .section2__txt-wide-head {
        font-family: Montserrat-Bold, sans-serif !important;
        text-align: center;
        font-weight: 700;
        font-size: 28px;
        margin-bottom: 15px;
    }
    
    .section2__txt-wide-desc {
        font-family: Montserrat-Regular, sans-serif !important;
        text-align: center;
        font-size: 18px;
    }
    
    .section3 {
        background-color: #9EDBD2;
        max-width: 100%;
    }
    
    .section3__top {
        height: 135px;
        max-width: 100%;
        position: relative;
    }
    
    .section4 {
        background-color: white;
        position: relative;
        z-index: -9;
    }
    
    .grid__col-txt-green-left {
        width: 90%;
        position: relative;
        left: 60%;
        top: 50%;
        translate: -50% -50%;
    }
    
    .grid__col-txt-green-right {
        width: 90%;
        position: relative;
        left: 40%;
        top: 50%;
        translate: -50% -50%;   
    }
    
    .section4__txt-wide {
        display: block;
        margin: auto;
        max-width: 90%;
        font-family: Montserrat-Regular, sans-serif !important;
        padding-bottom: 50px;
    }
    
    .section4__txt-wide-head {
        font-family: Montserrat-Bold, sans-serif !important;
        text-align: center;
        font-weight: 700;
        font-size: 28px;
        margin-bottom: 15px;
    }
    
    .section4__txt-wide-desc {
        font-family: Montserrat-Regular, sans-serif !important;
        text-align: center;
        font-size: 18px;
    }
    
    @media (min-width: 1023.80px) {
        .mob {
            display: none;
        }
        
        .pt-100-web {
            padding-top: 100px;
        }
        
        .pt-150-web {
            padding-top: 150px;
        }
    }
    
    @media (max-width: 1024px) {
        .pt-25-mob {
            padding-top: 25px;
        }
        
        .web {
            display: none;
        }
        
        .col-1 {
            order: 1;
        }
        
        .col-2 {
            order: 2;
        }
        
        .main {
            max-width: 100%;
        }
        
        .hero__container {
            height: unset;
            margin-bottom: 25px;
        }
        
        .hero {
            max-width: 100%;
            width: unset;
            position: static;
        }
        
        .hero__img {
            max-width: 90%;
        }
        
        .section1__top {
            height: unset;
        }
        
        .section1__top-img-2 {
            position: relative;
            top: 4px;
        }
        
        .section1__img {
            max-width: 90%;
        }
        
        .section1__txt-wide-desc {
            font-family: Montserrat-Regular, sans-serif !important;
            font-size: 20px;
        }
        
        .section1__bottom-img {
            position: relative;
            top: -4;
        }
        
        .grid__row {
            flex-wrap: wrap;
            margin-bottom: 50px;
        }
        
        .grid__row-green-end {
            margin-bottom: 0;
            padding-bottom: 25px;
        }
        
        .grid__col {
            width: 100%;
        }
        
        .grid__col-img {
            display: block;
            margin: auto;
        }
        
        .grid__col-txt {
            width: 95%;
            display: block;
            margin: auto;
            left: unset;
            top: unset;
            translate: unset;
        }
        
        .section2__txt-wide {
            width: 95%;
            max-width: unset;
        }
        
        .section2__txt-wide-head,
        .section2__txt-wide-desc {
            text-align: left;
        }
        
        .section3__top {
            height: unset;
            top: 2px;
        }
        
        .grid__col-txt-green-right,
        .grid__col-txt-green-left {
            width: 90%;
            display: block;
            margin: auto;
            left: unset;
            top: unset;
            translate: unset;
        }
        
        .section4__txt-wide-head, 
        .section4__txt-wide-desc {
            text-align: left;
        }
    }