@import url('https://fonts.googleapis.com/css?family=Roboto:300,400,500,700&display=swap&subset=cyrillic');

.blog__offer.vitamin {
    background: #2c3138;
    font-family: 'Roboto', sans-serif;
    padding: 20px 0;
    overflow: hidden;
    position: relative;
}

.blog__offer.vitamin .fYellow {
    color: #ffd14b;
}

.blog__offer.vitamin > .container {
    position: relative;
    padding: 20px 0;
}

.vitamin .blog__offer__arts,
.vitamin .blog__offer__arts__art-chelik {
    position: absolute;
    right: 30px;
    bottom: -32px;
}

.vitamin .blog__offer__ring {
    position: absolute;
    width: 985.05px;
    height: 493.35px;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    z-index: 0;
}

.blog__offer.vitamin .blog__offer__content {
    position: relative;
    z-index: 10;
}

.vitamin .blog__offer__arts {
    left: 0;
}

.blog__offer.vitamin .blog__offer__logo {
    line-height: 0;
}

.blog__offer.vitamin .title {
    font-weight: normal;
    margin: 1.2em 0 1.5em;
}

.vitamin .blog__offer__lists_cont {
    display: block;
}

.vitamin .blog__offer__lists_cont ul {
    font-weight: 300;
}

.blog__offer__lists_cont li.yellow:before {
    background-color: #ffd14b;
    border: 1px solid #ffd14b;
}

.blog__offer__lists_cont li.blue:before {
    background-color: #4285f4;
    border: 1px solid #4285f4;
}

.blog__offer__lists_cont li.magenta:before {
    background-color: #ea4335;
    border: 1px solid #ea4335;
}

.blog__offer__lists_cont li:before {
    border-radius: 500px;
}

.blog .vitamin .button.magenta {
    z-index: 999;
    background: rgba(158,105,207);
}

.blog .vitamin .button.magenta:hover {
    background: rgba(146,29,124,.9);
}

.blog .vitamin .button.green {
    background: rgba(71,194,111,1);
}

.blog .vitamin .button.green:hover {
    background: rgba(71,194,111,.9);
}

.blog .vitamin .button.large {
    box-sizing: border-box;
    font-weight: 500;
    padding: .5417em;
    border-radius: 25px;
    z-index: 999;
}

@media only screen and (max-width: 639px) {
    .blog__offer.vitamin {
        padding-bottom: 0;
    }
    .blog__offer.vitamin > .container {
        padding-top: 0;
        margin-left: 20px;
        margin-right: 20px;
        max-width: 639px;
    }

    .vitamin .blog__offer__arts__art-chelik {
        display: none;
    }

    .blog__offer.vitamin .blog__offer__logo {
        margin-top: 10px;
        position: relative;
        display: flex;
        justify-content: center;
        align-items: center;
        transform: scale(1.5);
    }

    .blog__offer.vitamin .title {
        font-size: 36px;
        max-width: 400px;
    }

    .vitamin .blog__offer__lists_cont ul {
        margin-left: 13px;
    }
    .vitamin .blog__offer__lists_cont li {
        font-size: 21px;
        line-height: 1.2em;
        margin-bottom: 25px;
    }
    .blog__offer__lists_cont li:before {
        width: 5px;
        height: 5px;
        margin: -2px 5px 0 -12px;
    }

    .vitamin .blog__offer__button_cont {
        margin-top: 20px;
    }

    .blog .vitamin .button.large {
        font-size: 20px;
        display: flex;
        justify-content: center;
        align-items: center;
        width: 90%;
        max-width: 100%;
        margin: auto;
    }

    .blog .vitamin .button.large:first-child {
        margin-right: 20px;
    }
}

@media only screen and (min-width: 640px) {

    .vitamin .blog__offer__button_cont {
        margin-top: 20px;
        display: flex;
        justify-content: center;
        align-items: center;
    }
}

@media only screen and (min-width: 640px) and (max-width: 959px) {

    .vitamin .blog__offer__arts__art-chelik {
        display: none;
    }

    .blog__offer.vitamin .blog__offer__logo {
        width: 224px;
    }

    .blog__offer.vitamin .title {
        font-size: 24px;
        line-height: 29px;
        max-width: 440px;
    }

    .vitamin .blog__offer__lists_cont ul {
        margin-left: 20px;
    }
    .vitamin .blog__offer__lists_cont li {
        font-size: 13px;
        line-height: 28px;
    }
    .blog__offer__lists_cont li:before {
        width: 5px;
        height: 5px;
        margin: -2px 5px 0 -19px;
    }

    .blog .vitamin .button.large {
        font-size: 16px;
        width: 222px;
    }
    .blog .vitamin .button.large:first-child {
        margin-right: 10px;
    }
}

@media only screen and (max-width: 959px) {
}

@media only screen and (min-width: 960px) {

    .blog .vitamin .container {
        position: relative;
        max-width: 760px;
    }

    .vitamin .blog__offer__arts__art-chelik {
        min-width: 383px;
    }

    .blog__offer.vitamin .blog__offer__logo {
        width: 224px;
    }

    .blog__offer.vitamin .title {
        font-size: 40px;
        line-height: 44px;
        max-width: 726px;
    }

    .vitamin .blog__offer__lists_cont ul {
        margin-left: 30px;
    }
    .vitamin .blog__offer__lists_cont li {
        font-size: 20px;
        line-height: 42px;
    }
    .blog__offer__lists_cont li:before {
        width: 5px;
        height: 5px;
        margin: -2px 8px 0 -29px;
    }

    .blog .vitamin .button.large {
        font-size: 24px;
        position: relative;
    }
    .blog .vitamin .button.large:first-child {
        margin-right: 52px;
    }
}