/* Fonts */
@font-face {
    font-family: 'Futura PT';
    src: url('../fonts/FuturaPT-300.woff') format('woff'),
    url('../fonts/FuturaPT-300.woff2') format('woff2');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'Futura PT';
    src: url('../fonts/FuturaPT-400.woff') format('woff'),
    url('../fonts/FuturaPT-400.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'Futura PT';
    src: url('../fonts/FuturaPT-600.woff') format('woff'),
    url('../fonts/FuturaPT-600.woff2') format('woff2');
    font-weight: 600;
    font-style: normal;
}

@font-face {
    font-family: 'Futura PT';
    src: url('../fonts/FuturaPT-800.woff') format('woff'),
    url('../fonts/FuturaPT-800.woff2') format('woff2');
    font-weight: 800;
    font-style: normal;
}

@font-face {
    font-family: 'Montserrat';
    src: url('../fonts/Montserrat-400.woff') format('woff'),
    url('../fonts/Montserrat-400.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'Montserrat';
    src: url('../fonts/Montserrat-700.woff') format('woff'),
    url('../fonts/Montserrat-700.woff2') format('woff2');
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: 'FuturaBook';
    src: url('../fonts/FuturaBook-400.woff') format('woff'),
    url('../fonts/FuturaBook-400.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
}
@font-face {
    font-family: 'FuturaBook';
    src: url('../fonts/FuturaBook-500.woff') format('woff'),
    url('../fonts/FuturaBook-500.woff2') format('woff2');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'FuturaBook';
    src: url('../fonts/FuturaBook-700.woff') format('woff'),
    url('../fonts/FuturaBook-700.woff2') format('woff2');
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: 'FuturaBook-Oblique';
    src: url('../fonts/Futura-PT-Book-Oblique.woff') format('woff'),
    url('../fonts/Futura-PT-Book-Oblique.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
}


* {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

html {
    scroll-behavior: smooth;
}

body {
    background-image: url("https://static.sobaka.ru/uploads/posts/152107/bg.jpg");
    background-repeat: repeat;
    background-size: contain;
    background-attachment:fixed;
}

/* Reset */
.b-longread * {
    margin: 0;
    padding: 0;
    font: inherit;
    box-sizing: border-box;
}

.b-longread {
    font-size: 10px;
    margin-top: 54px;
}

@media (max-width: 1920px) {
    .b-longread {
        font-size: calc(10vw / 1920 * 100);
    }
}

@media (max-width: 800px) {
    .b-longread {
        font-size: calc(10vw / 800 * 100);
    }
}

/* main */

.b-longread-main {
    position: relative;
}

.b-longread-main__logo {
    position: absolute;
    top: calc(53em / 10);
    right: calc(87em / 10);
    max-width: calc(272em / 10);
    max-height: calc(98em / 10);
}

.b-longread-main__img-1 {
    margin: calc(17em / 10) 0 0 calc(51em / 10);
    width: 100%;
    max-width: calc(1172em / 10);
    max-height: calc(251em / 10);
}

.b-longread__line-1 {
    height: 1px;
    width: 100%;
    max-width: calc(1530em / 10);
    border-bottom: 1px solid #3578C6;
    margin-top: -3px;
}

.b-longread__line-2 {
    height: 1px;
    width: 100%;
    max-width: calc(1242em / 10);
    border-bottom: 1px solid #3578C6;
    margin-bottom: calc(35em / 10);
}

.b-longread-main__content {
    position: relative;
}

.b-longread-main__title {
    font-family: 'Futura PT', Arial, sans-serif;
    font-style: normal;
    font-weight: 800;
    font-size: calc(60em / 10);
    line-height: calc(60em / 60);
    text-transform: uppercase;
    color: #3578C6;
    margin-left: calc(100em / 60);
    margin-top: calc(29em / 60);
}

.b-longread-main__subtitle {
    font-family: 'Futura PT', Arial, sans-serif;
    font-style: normal;
    font-weight: 300;
    font-size: calc(44em / 10);
    line-height: calc(53em / 44);
    letter-spacing: 0.02em;
    text-transform: uppercase;
    color: #3578C6;
    margin-left: calc(100em / 44);
    margin-bottom: calc(23em / 44);
}

.b-longread__text {
    font-family: 'FuturaBook', Arial, sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: calc(24em / 10);
    line-height: calc(28em / 24);
    color: #62667E;
    margin-left: calc(108em / 24);
    margin-bottom: calc(50em / 24);
    max-width: calc(900em / 24);
}

.b-longread__text a {
    font-weight: 600;
    color: #3578C6;
    text-decoration: underline;
}

.b-longread__text a:hover {
    color: #559CFF;
}

.b-longread__text strong {
    font-weight: 600;
    color: #559CFF;
}

.b-longread__text p{
    margin-bottom: calc(25em / 24);
}

.b-longread-main__img-2 {
    position: absolute;
    top: calc(-55em / 10);
    right: calc(33em / 10);
    max-width: calc(870em / 10);
    max-height: calc(838em / 10);
}

.b-longread-main__img-2_m {
    display: none;
}

/* about */
.b-longread-about {
    position: relative;
    padding-bottom: calc(50em / 10);
}

.b-longread-about__img {
    width: 100%;
}

.b-longread-about__logo {
    position: absolute;
    top: calc(32em / 10);
    right: calc(83em / 10);
    max-width: calc(272em / 10);
    max-height: calc(98em / 10);
}

.b-longread__about-text {
    font-family: 'FuturaBook', Arial, sans-serif;
    font-style: normal;
    font-weight: 400;
    position: absolute;
    font-size: calc(24em / 10);
    top: calc(157em / 24);
    left: 0;
    line-height: calc(30em / 24);
    width: 100%;
    text-align: center;
    color: #4E505E;
}

.b-longread__about-text p {
    max-width: calc(826em / 24);
    margin: 0 auto calc(30em / 24);
}

.b-longread__about-text a {
    font-weight: 600;
    color: #3578C6;
    text-decoration: underline;
}

.b-longread__about-text a:hover {
    color: #559CFF;
}

.b-longread__about-text strong {
    font-weight: 600;
    color: #559CFF;
}

/* persona */

.b-longread-persona {
    background-size: cover;
    background-repeat: no-repeat;
    position: relative;
}

.b-longread-persona__logo {
    position: absolute;
    top: 0;
    right: calc(93em / 10);
    max-width: calc(272em / 10);
    max-height: calc(98em / 10);
    z-index: 2;
}

.b-longread-persona-img {
    width: 100%;
    object-fit: contain;
}

.persona__header {
    position: relative;
    display: flex;
    align-items: center;
    margin-bottom: calc(190em / 10);
}

.persona__header-img {
    position: absolute;
}

.persona__info {
    position: relative;
    display: flex;
    flex-direction: column;
}

.persona__header-logo {
    display: none;
}

.persona__img {
    width: calc(237em / 10);
    height: calc(237em / 10);
    margin-bottom: calc(40em / 10);
    border-radius: 50%;
}

.persona__name {
    font-family: 'Futura PT', Arial, sans-serif;
    font-style: normal;
    font-weight: 800;
    font-size: calc(68em / 10);
    line-height: calc(87em / 68);
    text-transform: uppercase;
    color: #3578C6;
    max-width: calc(441em / 68);
}

.persona__about {
    font-family: 'Futura PT', Arial, sans-serif;
    font-style: normal;
    font-weight: 300;
    font-size: calc(32em / 10);
    line-height: calc(41em / 32);
    text-transform: uppercase;
    color: #3578C6;
}

.persona__main {
    max-width: calc(1150em / 10);
    margin: 0 auto;
}

.persona__text {
    font-family: 'FuturaBook', Arial, sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: calc(24em / 10);
    line-height: calc(30em / 24);
    color: #4E505E;
    margin-bottom: calc(30em / 24);
}

.persona__text strong {
    font-weight: 600;
    color: #3578C6;
}

.persona__text a {
    font-weight: 600;
    color: #3578C6;
}

.persona__text a:hover {
    color: #559CFF;
}

.persona__text-center {
    text-align: center;
    margin-bottom: calc(50em / 10);
}

.persona__main-wrap {
    display: flex;
    align-items: center;
    margin-bottom: calc(35em / 10);
}

.persona__main-img {
    width: calc(508em / 10);
    height: calc(736em / 10);
    margin-right: calc(100em / 10);
    border: 3px solid #559CFF;
    border-radius: calc(15em / 10);
}

.gaysina .persona__main-img {
    margin-right: 0;
    margin-left: calc(100em / 10);
}

.persona__text-wrap {
    display: flex;
    flex-direction: column;
}

.persona__quote {
    position: relative;
    font-family: 'FuturaBook', Arial, sans-serif;
    font-style: normal;
    font-weight: 300;
    font-size: calc(40em / 10);
    line-height: calc(51em / 40);
    text-transform: uppercase;
    color: #3578C6;
    margin-bottom: calc(20em / 40);
    max-width: calc(540em / 40);
}

.persona__quote:before {
    content: '';
    position: absolute;
    top: calc(68em / 40);
    left: calc(-100em / 40);
    width: calc(150em / 40);
    border-top: 1.5px solid #3578C6;
    transform: rotate(90deg);
}

.persona__quote-short {
    width: 100%;
    max-width: calc(1000em / 40);
    margin: calc(100em / 40) 0 calc(60em / 40) calc(164em / 40);
}

.persona__text-short {
    max-width: calc(700em / 24);
    margin: 0 auto;
    margin-bottom: calc(50em / 24);
}

.persona__quote strong {
    font-weight: 600;
}

/* persona-card */
.persona-card {
    position: relative;
    width: calc(740em / 10);
    height: calc(924em / 10);
    margin: 0 auto calc(150em / 10);
}

.persona-card__back,
.persona-card__front {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 1px solid #D3E6FF;
    border-radius: calc(30em / 10);
    background-color: #fff;
    box-shadow: 0 calc(4em / 10) calc(16em / 10) rgba(85, 156, 255, 0.2);
}

.persona-card__back {
    transform: rotate(3deg);
}

.persona-card__front {
    z-index: 2;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-around;
    box-shadow: 0 20px 50px 4px rgba(0, 0, 0, .3);
}

.persona-card__title {
    font-family: 'Futura PT', Arial, sans-serif;
    font-style: normal;
    font-weight: 800;
    font-size: calc(40em / 10);
    line-height: calc(51em / 40);
    margin: calc(40em / 40) auto calc(45em / 40);
    text-align: center;
    text-transform: uppercase;
    color: #3578C6;
}

.persona-card-content {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    margin: 0 auto;
}

.persona-card__img {
    width: calc(328em / 10);
    height: calc(475em / 10);
    margin-right: calc(64em  / 10);
    border: 3px solid #559CFF;
    border-radius: calc(15em / 10);
}

.persona-card__lists {
    max-width: calc(290em / 10);
}

.persona-card__list-item {
    margin-bottom: calc(30em / 10);
}

.persona-card__list-title {
    font-family: 'Montserrat', Arial, sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: calc(21em / 10);
    line-height: calc(26em / 21);
    margin-bottom: calc(26em / 21);
    text-transform: uppercase;
    color: #559CFF;
}

.persona-card__list-li {
    font-family: 'Futura PT', Arial, sans-serif;
    font-style: italic;
    font-weight: 400;
    font-size: calc(18em / 10);
    line-height: calc(30em / 18);
    color: #4E505E;
}

.persona-card__list-li-light {
    font-family: 'FuturaBook-Oblique', Arial, sans-serif;
    font-style: italic;
    font-weight: 300;
    font-size: calc(18em / 10);
    line-height: calc(22em / 18);
}

.persona-card__list-li a {
    font-family: 'Futura PT', Arial, sans-serif;
    font-weight: 600;
    color: #559CFF;
    text-decoration: underline;
}

.persona-card__list-li a:hover {
    color: #3578C6;
}

.persona-card-decor {
    width: 100%;
    max-width: calc(740em / 10);
    margin-bottom: calc(40em / 10);
}

.persona__text_img-m {
    display: none;
}

/* persona__cards */
.persona__cards {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: calc(85em / 10);
    margin-top: calc(134em / 10);
}

.persona__card {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: calc(346em / 10);
    height: calc(374em / 10);
    background: #FFFFFF;
    border: 1px solid #D3E6FF;
    box-shadow: 0 calc(4em / 10) calc(16em / 10) rgba(85, 156, 255, 0.2);
    border-radius: calc(30em / 10);
    padding: 0 calc(20em / 10);
}

.persona__card+.persona__card {
    margin-left: calc(40em / 10);
}

.persona__card-title {
    font-family: 'FuturaBook', Arial, sans-serif;
    font-style: normal;
    font-weight: 700;
    font-size: calc(21em / 10);
    line-height: calc(27em / 27);
    margin-top: calc(43em / 27);
    text-align: center;
    text-transform: uppercase;
    color: #559CFF;
}

.persona__card-adress {
    font-family: 'FuturaBook', Arial, sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: calc(16em / 10);
    line-height: calc(20em / 16);
    margin-bottom: calc(40em / 16);
    text-align: center;
    text-transform: uppercase;
    color: #559CFF;
}

.persona__card-text {
    font-family: 'FuturaBook-Oblique', Arial, sans-serif;
    font-style: italic;
    font-weight: 400;
    font-size: calc(18em / 10);
    line-height: calc(24em / 18);
    text-align: center;
    color: #4E505E;
}

/* bobrova */

.bobrova {
    width: 100%;
    background-image: url(https://static.sobaka.ru/uploads/posts/152107/bobrova-bg.png);
}

.bobrova .persona__header-img {
    top: calc(56em / 10);
    left: calc(997em / 10);
    width: calc(528em / 10);
    height: calc(572em / 10);
}

.bobrova .persona__info {
    top: calc(92em / 10);
    left: calc(552em / 10);
    align-items: flex-start;
}

/* gaysina */
.gaysina {
    background-image: url(https://static.sobaka.ru/uploads/posts/152107/gaysina-bg.png);
}

.gaysina .persona__header-img {
    top: calc(119em / 10);
    left: calc(385em / 10);
    width: calc(656em / 10);
    height: calc(461em / 10);
}

.gaysina .persona__info {
    top: calc(92em / 10);
    left: calc(1111em / 10);
    align-items: flex-start;
}

/* kubryakova */
.kubryakova {
    background-image: url(https://static.sobaka.ru/uploads/posts/152107/kubryakova-bg.png?v=1);
}

.kubryakova .persona__header-img {
    top: calc(31em / 10);
    left: calc(830em / 10);
    width: calc(884em / 10);
    height: calc(708em / 10);
}

.kubryakova .persona__info {
    top: calc(92em / 10);
    left: calc(519em / 10);
    align-items: flex-start;
}

.kubryakova .persona__main {
    max-width: calc(1300em / 10);
}

/* quiz */

.quiz {
    background-image: url(https://static.sobaka.ru/uploads/posts/152107/quiz-bg.png);
    background-repeat: no-repeat;
    background-size: cover;
    padding-bottom: calc(100em / 10);
}

.quiz-header {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-bottom: calc(62em / 10);
}

.quiz-header__img {
    width: calc(700em / 10);
    height: calc(700em / 10);
}

.quiz-header__title {
    font-family: 'Futura PT', Arial, sans-serif;
    font-style: normal;
    font-weight: 800;
    font-size: calc(68em / 10);
    line-height: calc(87em / 68);
    max-width: calc(1120em / 68);
    margin-bottom: calc(35em / 68);
    text-align: center;
    text-transform: uppercase;
    color: #3578C6;
}

.quiz-header__text {
    font-family: 'FuturaBook', Arial, sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: calc(24em / 10);
    line-height: calc(30em / 24);
    max-width: calc(1000em / 24);
    text-align: center;
    color: #4E505E;
}

.quiz-wrapper {
    max-width: calc(1130em / 10);
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.quiz__title {
    font-family: 'Futura PT', Arial, sans-serif;
    font-style: normal;
    font-weight: 500;
    font-size: calc(58em / 10);
    line-height: calc(30em / 30);
    margin-bottom: calc(25em /30);
    text-align: left;
    text-transform: uppercase;
    color: #3578C6;
    width: 100%;
}

.quiz-questions {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    margin: 0 0 calc(160em / 10);
    width: 100%;
}

.quiz-question {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.quiz-question+.quiz-question {
    margin-top: calc(100em / 10);
}

.quiz-question-wrap {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.quiz-question-wrap img {
    width: calc(392em / 10);
    height: calc(392em / 10);
}

.quiz-question-wrap+.quiz-question-wrap {
    margin-left: calc(200em / 10);
}

.quiz-question__title {
    font-family: 'Futura PT', Arial, sans-serif;
    font-style: normal;
    font-weight: 500;
    font-size: calc(64em / 10);
    line-height: calc(82em / 64);
    margin-bottom: calc(75em / 64);
    text-transform: uppercase;
    color: #3578C6;
}

.quiz-question__inputs {
    display: flex;
    flex-direction: column;
}

.quiz-question__inputs label {
    display: flex;
    align-items: center;
    font-family: 'FuturaBook', Arial, sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: calc(35em / 10);
    line-height: calc(68em / 36);
    margin-left: calc(65em / 36);
    color: #4E505E;
}

.quiz-question__input {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    padding-left: 20px;
}

.radio-style {
    position: absolute;
    width: calc(45em / 35);
    height: calc(45em / 35);
    border-radius: 50%;
    border: calc(6em / 35) solid #559CFF;
    margin-left: calc(-62em / 35);
}

.quiz-question__input:checked + .radio-style::before {
    content: '';
    position: absolute;
    width: calc(23em / 35);
    height: calc(23em / 35);
    background-color: #559CFF;
    border-radius: 50%;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.quiz-quote {
    position: relative;
    font-family: 'Futura PT', Arial, sans-serif;
    font-style: normal;
    font-weight: 300;
    font-size: calc(38em / 10);
    line-height: calc(51em / 38);
    text-transform: uppercase;
    color: #3578C6;
}

.quiz-quote :before {
    content: '';
    position: absolute;
    top: calc(75em / 38);
    left: calc(-98em / 38);
    width: calc(150em / 38);
    border-top: 1.5px solid #3578C6;
    transform: rotate(90deg);
}

.quiz-quote a {
    font-weight: 600;
    text-decoration: underline;
}

.quiz-quote a:hover {
    color: #559CFF;
}

/* quiz-popup */
.quiz-popup {
    position: relative;
    align-items: center;
    justify-content: center;
    background: #FFFFFF;
    box-shadow: 0 calc(4em / 10) calc(16em / 10) rgba(85, 156, 255, 0.2);
    border-radius: calc(30em / 10);
}

.quiz-popup__desktop {
    position: absolute;
    top: calc(100em / 10);
    left: calc(366em / 10);
}

.quiz-popup-left {
    top: calc(-30em / 10);
    left: calc(-200em / 10);
}

.popup-success {
    display: none;
    width: calc(895em / 10);
    height: calc(199em / 10);
    border: 1px solid #D3E6FF;
    animation: show 1s ease;
}

.popup-error {
    display: none;
    width: calc(437em / 10);
    height:calc( 93em / 10);
    border: 1px solid #ED0000;
    animation: show 1s ease;
}

.quiz-popup__close {
    position: absolute;
    top: calc(10em / 10);
    right: calc(21em / 10);
    max-width: calc(30em / 10);
    cursor: pointer;
}

@keyframes show {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

.quiz-popup__img {
    width: calc(200em / 10);
}

.quiz-popup-wrap {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 0 calc(25em / 10);
}

.quiz-popup__title {
    font-family: 'Montserrat', Arial, sans-serif;
    font-style: normal;
    font-weight: 700;
    font-size: calc(21em / 10);
    line-height: calc(26em / 21);
    text-align: center;
    text-transform: uppercase;
    color: #559CFF;
}

.popup-error .quiz-popup__title {
    color: #ED0000;
}

.quiz-popup__subtitle {
    font-family: 'Montserrat', Arial, sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: calc(16em / 10);
    line-height: calc(19em / 16);
    margin-bottom: calc(10em / 16);
    text-align: center;
    text-transform: uppercase;
    color: #559CFF;
}

.popup-error .quiz-popup__subtitle {
    color: #ED0000;
}

.quiz-popup__text {
    font-family: 'FuturaBook', Arial, sans-serif;
    font-style: italic;
    font-weight: 400;
    font-size: calc(25em / 10);
    line-height: calc(24em / 25);
    text-align: center;
    color: #4E505E;
}

.quiz-popup__text a {
 color: #559CFF;
}

.quiz-popup__text a:hover {
    color: #3578C6;
}

/* mobile */

@media (max-width: 800px) {
    .b-longread__line-1 {
        margin-top: -12px;
    }
    .b-longread-main__img-1 {
        margin: calc(45em / 10) 0 0 calc(19em / 10);
        max-width: calc(768em / 10);
        max-height: calc(195em / 10);
    }

    .b-longread-main__logo {
        top: calc(31em / 10);
        right: calc(58em / 10);
    }

    .b-longread-main__img-2 {
        display: none;
    }

    .b-longread-main__title {
        font-size: calc(42em / 10);
        margin-left: calc(50em / 42);
        margin-top: calc(26em / 42);
    }

    .b-longread-main__subtitle {
        font-size: calc(30em / 10);
        margin-left: calc(63em / 30);
        margin-top: calc(4em / 30);
    }

    .b-longread__text {
        font-size: calc(28em / 10);
        margin-left: calc(30em / 28);
        max-width: calc(724em / 28);
    }

    .b-longread-main__img-2_m {
        display: block;
        width: 100%;
        height: auto;
    }

    .b-longread__circle {
        left: calc(356em / 10);
        bottom: calc(-70em / 10);
    }

    .b-longread__about-text {
        top: calc(525em / 24);
        left: calc(25em / 24);
        max-width: calc(741em / 24);
    }

    /* persona */
    .bobrova,
    .gaysina,
    .kubryakova,
    .quiz
    {
        background-image: none;
    }

    body {
        background-image: url("https://static.sobaka.ru/uploads/posts/152107/bg_m.jpg");
    }

    .b-longread-about__logo {
        top: calc(11em / 10);
        right: calc(58em / 10);
    }

    .b-longread-persona__logo {
        display: none;
    }

    .persona__header {
        flex-direction: row-reverse;
        margin-bottom: calc(80em / 10);
    }

    .persona__info {
        text-align: right;
        margin-right: calc(50em / 10);
    }

    .persona__name {
        max-width: 100%;
    }

    .persona__header-logo {
        display: block;
        margin-bottom: calc(50em / 10);
        width: calc(272em / 10);
        height: calc(100em / 10);
        float: right;
    }

    .persona__main {
        margin: 0;
    }

    .persona__main-wrap {
        flex-direction: column-reverse;
    }

    .persona__quote {
        margin: 0 auto;
    }

    .persona__text {
        text-align: center;
        font-size: calc(28em / 10);
        margin-bottom: calc(40em / 28);
        padding: calc(30em /28);
    }

    .persona__main-img {
        margin: 0 auto;
    }

    .persona__quote-short {
        max-width: calc(640em / 40);
    }

    .persona__quote.persona__quote-short:before {
        top: calc(100em / 40);
        left: calc(-120em / 40);
        width: calc(200em / 40);
    }

    .persona-card__back {
        display: none;
    }

    .persona__card-text {
        font-size: calc(20em / 10);
        line-height: calc(24em / 20);
    }

    /* bobrova */
    .bobrova .persona__header-img {
        top: calc(32em / 10);
        left: calc(52em / 10);
        width: calc(348em / 10);
        height: calc(378em / 10);
    }

    .bobrova .persona__info {
        top: calc(32em / 10);
        left: 0;
        align-items: flex-end;
    }

    .bobrova .persona__text_img-m {
        display: block;
        width: calc(635em / 24);
        height: calc(287em / 24);
        margin: calc(53em / 24) auto 0;
    }

    .bobrova .persona__text_img-3m {
        display: block;
        width: 100%;
        height: auto;
    }

    /* gaysina */
    .gaysina .persona__header {
        flex-direction: row;
    }

    .gaysina .persona__info {
        top: calc(31em / 10);
        left: calc(58em / 10);
        margin-right: calc(75em / 10);
        align-items: flex-end;
    }

    .gaysina .persona__header-img {
        top: calc(93em / 10);
        left: calc(31em / 10);
        width: calc(393em / 10);
        height: calc(277em / 10);
        margin-right: 0;
    }

    .gaysina .persona__main-img {
        margin-left: 0;
    }

    .gaysina .persona__main-wrap {
        flex-direction: column;
    }

    .gaysina .persona__text_img-2m {
        display: block;
        width: calc(564em / 24);
        height: calc(183em / 24);
        margin: calc(53em / 24) auto 0;
    }

    .gaysina .persona__text_img-3m {
        display: block;
        width: 100%;
        height: auto;
    }

    /*kubryakova*/

    .kubryakova .persona__header-img {
        top: calc(4em / 10);
        left: calc(-82em / 10);
        width: calc(584em / 10);
        height: calc(468em / 10);
    }

    .kubryakova .persona__info {
        top: calc(31em / 10);
        left: 0;
        margin-right: calc(75em / 10);
        align-items: flex-end;
    }

    .kubryakova .persona__name {
        font-size: calc(56em / 10);
    }

    .kubryakova .persona__text_img-2m {
        display: block;
        width: calc(449em / 24);
        height: calc(279em / 24);
        margin: calc(53em / 24) auto 0;
    }

    .kubryakova .persona__text_img-3m {
        display: block;
        width: 100%;
        height: auto;
    }

    /* pesrona-card */
    .persona__cards {
        flex-wrap: wrap;
    }
    .persona__card:nth-child(3n) {
        margin-top: calc(40em / 10);
        margin-left: 0;
    }

    /* quiz */
    .quiz__title {
        text-align: center;
    }

    .quiz-questions {
        align-items: center;
        margin-bottom: calc(50em / 10);
    }

    .quiz-header__img {
        width: calc(575em / 10);
        height: calc(575em / 10);
    }

    .quiz-header__title {
        font-size: calc(56em / 10);
        line-height: calc(72em / 56);
    }

    .quiz-question {
        flex-direction: column;
    }

    .flex-reverse {
        flex-direction: column-reverse;
    }

    .quiz-question-wrap {
        margin-bottom: calc(50em / 10);
        align-items: center;
    }

    .quiz-question-wrap img {
        margin-bottom: calc(30em / 10);
    }

    .quiz-question-wrap+.quiz-question-wrap {
        margin-left: 0;
    }

    .quiz-question__title {
        max-width: calc(542em / 64);
        text-align: center;
    }

    .quiz-quote {
        font-size: calc(34em / 10);
        line-height: calc(44em  / 34);
        max-width: calc(663em / 34);
    }

    .quiz-quote :before {
        top: calc(85em / 34);
        left: calc(-100em / 34);
        width: calc(165em / 34);
    }

    .popup-success {
        width: calc(709em / 10);
        height: calc(245em / 10);
    }

    .popup-error {
        width: calc(444em / 10);
        height: calc(93em / 10);
    }

    .quiz-popup__text {
        text-align: left;
    }

    .quiz-popup-left {
        top: 0;
        left: 0;
    }

    .quiz-header__text {
        font-size: calc(28em / 10);
        max-width: calc(723em / 28);
    }

}