@import "loyalty-btns.css";

.main__img {
    width: 494px;
    height: 577px;
    position: relative;
    right: -7%; 
}

.labels__main {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.label__left {
    position: absolute;
    bottom: -5%;
    left: -18%;
}

/******main****/
.main {
    padding-bottom: 150px;
}

.main__green {
    position: absolute;
    top: 0;
    left: 0;
    width: 300px;
    height: 300px;
    filter: blur(150px);
}

.main__info {
    margin-top: 120px;
}

.main__links-wrapper {
    display: flex;
}

.main__wrapp-line {
    display: flex;
    align-items: center;
    margin-bottom: 15px;
}

.main__wrapper {
    display: flex;
    justify-content: space-between;
}

/********hello*****/
.hello {
    padding-bottom: 150px;
}

.line-wrapper {
    display: flex;
    align-items: center;
    margin-bottom: 15px;
}
.hello__text-wrapper {
    display: flex;
}

.hello__text {
    width: 440px;
    max-width: 100%;
    margin-top: 50px;
}
.hello__text:nth-child(2) {
    margin-left: 156px;
}

.hello__img {
    width: 1160px;
    height: 800px;
    max-width: 100%;
    margin: 60px auto 0;
    position: relative;
}

.hello__picture {
    position: absolute;
    top: 0%;
    left: 0%;
}

.choose__green {
    bottom: unset;
    top: -10%;
    right: -5%;
    width: 180px;
    height: 180px;
}
.choose__items {
    position: relative;
    margin-top: 100px;
    display: flex;
    justify-content: space-between;
}

.choose__item:nth-child(even) {
    margin-top: 100px;
}

.choose__line {
    width: 25px;
    border-bottom: 2px solid black;
    margin: 35px 0 15px;
}

/*****offers****/
.offers {
    padding-top: 200px;
}
.offers__wrapper {
    display: flex;
}

.offers__inf {
    width: 440px;
    max-width: 100%;
    margin-top: 100px;
}

.offers__imgs {
    position: relative;
    top: 0;
    left: -15%;
    max-width: 652px;
}

.offers__text {
    margin: 100px 0 50px;
}

.planten__subtitle {
    width: 360px;
    max-width: 100%;
}

.planten__item {
    border-bottom: 1px solid #000;
    padding-bottom: 20px;
    margin-bottom: 20px;
    height: 70px;
    display: flex;
    align-items: center;
}

.planten-num {
    width: 50px;
    margin-right: 100px;
}

.planten__item:last-child {
    border-bottom: none;
    padding-bottom: 0px;
    margin-bottom: 0px;
}

@media (max-width: 1166px) {
    /****main section ****/

    .main__wrapper {
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }

    .main__info {
        width: 500px;
        max-width: 100%;
        margin-bottom: 100px;
    }

    /********hello*****/
    
    .hello__info {
        width: 500px;
        max-width: 100%;
        margin: 0 auto;
    }
    
    .hello__text-wrapper {
        flex-direction: column;
    }

    .hello__text {
        width: 500px;
        max-width: 100%;
    }

    .hello__text:nth-child(2) {
        margin-left: 0;
    }

    /****choose***/
    .choose__items {
        flex-wrap: wrap;
        justify-content: center;
        width: 512px;
        max-width: 100%;
        margin: 0 auto;
    }
    
    .choose__title {
        width: 512px;
        max-width: 100%;
        margin: 0 auto;
    }
    
    .choose__green {
        bottom: -10%;
        top: unset;
        right: -25%;
        width: 180px;
        height: 180px;
    }
    .choose__item:nth-child(even) {
        margin-top: 80px;
    }
    
    .choose__item {
        width: 256px;
        max-width: 100%; 
        margin-top: 80px;
    }
    
    .planten__subtitle {
        width: 440px;
        max-width: 100%;
        margin-top: 80px;
    }

    .offers__wrapper {
        flex-direction: column;
        align-items: center;
    }
    .offers__imgs {
        left: 0;
    }
}

@media (max-width: 900px) {
    /****main section ****/
    .main__img {
        width: 264px;
        height: 307px;
        right: 0;
    }

    .hello__img {
        width: 444px;
        height: 320px;
        max-width: 100%;
    }
    
    .hello__picture {
        position: absolute;
        top: 0%;
        left: -10%;
    }
}

@media (max-width: 767px) {
    .hello__line {
        width: 88px;
    }

    /****choose***/
    .choose__items {
        width: 500px;
    }

    .choose__item {
        width: 167px;
        max-width: 100%; 
    }

    .offers__imgs {
        left: -10%;
    }
}