/*
* Prefixed by https://autoprefixer.github.io
* PostCSS: v8.4.14,
* Autoprefixer: v10.4.7
* Browsers: last 4 version
*/

/* Blog / List */

.list__wrapper {
    background: -webkit-gradient(linear, left top, left bottom, from(#F9F3ED), to(rgba(249, 243, 237, 0)));
    background: -o-linear-gradient(top, #F9F3ED 0%, rgba(249, 243, 237, 0) 100%);
    background: linear-gradient(180deg, #F9F3ED 0%, rgba(249, 243, 237, 0) 100%);
    padding-top: 160px;
}
.list__title {
    font-family: 'Lumios Marker';
    font-size: 64px;
    font-style: italic;
    font-weight: 400;
    line-height: 58px;
    text-align: center;
    margin-bottom: 50px;
}

@media (min-width: 769px) {
    .list__wrapper {
        padding-top: 4.75vw
    }
    .list__title {
        font-family: 'Lumios Marker';
        font-size: 5.25vw;
        line-height: 0.8095;
        margin-bottom: 5.5vw;
    }
    .list__blocs {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
        margin-left: -0.9375vw;
        margin-right: -0.9375vw;
    }
}

@media (min-width: 1600px) {
    .list__wrapper {
        padding-top: 76px
    }
    .list__title {
        font-size: 84px;
        margin-bottom: 88px;
    }
    .list__blocs {
        margin-left: -15px;
        margin-right: -15px;
    }
}

/* Blog / Article */

.blog__wrapper {
    padding-top: 162px
}
.blog__back {
    margin-bottom: 27px;
}
.blog__back_icon {
    width: 36px;
    -webkit-transform: rotate(180deg);
        -ms-transform: rotate(180deg);
            transform: rotate(180deg);
    margin-right: 7px;
}
.blog__back_link {
    color: var(--color-blue);
    text-decoration: underline;
    font-weight: 500;
}
.blog__back_link:hover,
.blog__back_link:focus,
.blog__back_link:visited {
    color: var(--color-blue);
}
.blog__title {
    font-size: 32px;
    font-weight: 600;
    line-height: 1.3125;
    letter-spacing: -0.03em;
    margin-bottom: 55px;
}
.blog__title_primary {
    font-size: 30px;
    font-weight: 600;
    line-height: 1.36667;
    letter-spacing: -0.03em;
    color: #000;
    margin-bottom: 44px;
}
.blog__title_secondary {
    font-size: 30px;
    font-weight: 600;
    line-height: 1.466667;
    letter-spacing: -0.03em;
    margin: 42px 0 34px;
}
.blog__hero_picture {
    display: inline-block;
    margin-bottom: 37px;
    width: 100%
}
.blog__hero_img {
    width: 100%
}
.blog__content {
    margin-bottom: 42px;
}
.blog__content p {
    font-size: 18px;
    font-weight: 400;
    line-height: 1.77778;
    letter-spacing: -0.03em;
    color: #000;
    margin-bottom: 32px;
}
.blog__content_link,
.blog__content_link:visited,
.blog__content_link:focus {
    color: #000
}
.blog__content p.blog__header {
    font-size: 30px; font-weight: 600; line-height: 41px; letter-spacing: -0.03em;
}
.color--blue {
    color: var(--color-blue); font-weight: 600
}

@media (max-width: 768px) {
    .blog__footer_picture {
        display: inline-block;
        width: 100%
    }
    .blog__footer_img {
        width: 100%
    }
}
@media (min-width: 769px) {
    .blog__wrapper {
        padding-top: 225px
    }
    .blog__title {
        font-size: 60px;
        line-height: 1.21667;
        margin-bottom: 73px
    }
    .blog1 .blog__title span {
        max-width: 910px;
        display: inline-block;
    }
    .blog2 .blog__title span {
        max-width: 650px;
        display: inline-block;
    }
    .blog3 .blog__title span {
        max-width: 1160px;
        display: inline-block;
    }
    .blog4 .blog__title span {
        max-width: 730px;
        display: inline-block;
    }
    .blog5 .blog__title span {
        max-width: 760px;
        display: inline-block;
    }
    .blog6 .blog__title span {
        max-width: 940px;
        display: inline-block;
    }
    .blog__content {
        max-width: 767px
    }
    .blog__hero_picture {
        margin-bottom: 56px;
        width: 100%
    }
    .blog__hero_img {
        width: 100%
    }
    .blog__title_primary {
        margin-bottom: 59px
    }
    .blog__title_secondary {
        margin: 69px 0 11px
    }
    .blog__footer_media {
        text-align: center; 
        padding-top: 27px
    }

    .blog7 .blog__footer_media { 
        max-width: 1060px; 
    }
    .blog8 .blog__footer_media { 
        max-width: 1012px; 
    }
}