

/* Start:/local/templates/donate_landing/template_styles.css?16752355956964*/
*,
*::after {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
body {
    min-width: 300px;
    line-height: 1.4;
}
@font-face {
    font-family: "Source Serif Semibold";
    src: url('/local/templates/donate_landing/fonts/SourceSerifPro-Semibold.ttf'); 
}
@font-face {
    font-family: "Gilroy Regular";
    src: url('/local/templates/donate_landing/fonts/gilroy-regular.ttf');
}
@font-face {
    font-family: "Gilroy RegularIt";
    src: url('/local/templates/donate_landing/fonts/gilroy-regularitalic.ttf');
}
@font-face {
    font-family: "Gilroy Semibold";
    src: url('/local/templates/donate_landing/fonts/gilroy-semibold.ttf');
}
@font-face {
    font-family: "Gilroy Bold";
    src: url('/local/templates/donate_landing/fonts/gilroy-bold.ttf');
}
@font-face {
    font-family: "Gilroy Medium";
    src: url('/local/templates/donate_landing/fonts/gilroy-medium.ttf');
}
:root {
    /* --font_1 : 'SourceSerifSemibold', sans-serif; */
    --font_1 : Source Serif Semibold, sans-serif;
    --font_2 : Gilroy Regular, sans-serif;
    --font_3 : Gilroy Semibold, sans-serif;
    --font_4 : Gilroy RegularIt, sans-serif;
    --font_5 : Gilroy Bold, sans-serif;
    --font_6 : Gilroy Medium, sans-serif;
    --white : #fff;
    --branded-pink : #c83a57;
    --branded-blue : #1c3969;
    --trans : .2s;
    --trans_white : #aeaeae;
}
.container {
    width: 100%;
    max-width: 1270px;
    margin: 0 auto;
}
.wrapper {
    padding: 0 15px;
}
.w-100 {
    width: 100%;
}
.w-fc {
    width: fit-content;
}
.h-100 {
    height: 100%;
}
.flex {
    display: flex;
}
.column {
    flex-direction: column;
}
.align-center {
    align-items: center;
}
.align-stretch {
    align-items: stretch;
}
.justify-end {
    justify-content: flex-end;
}
.justify-center {
    justify-content: center;
}
.justify-between {
    justify-content: space-between;
}
.dec-none {
    text-decoration: none;
}
.pos-rel {
    position: relative;
}
.pos-abs {
    position: absolute;
}
.font1 {
    font-family: var(--font_1);
}
.font2 {
    font-family: var(--font_2);
}
.font3 {
    font-family: var(--font_3);
}
.font4 {
    font-family: var(--font_4);
}
.font5 {
    font-family: var(--font_5);
}
.font6 {
    font-family: var(--font_6);
}
.fs-20 {
    font-size: 20px;
}
.fs-25 {
    font-size: 25px;
}
.fs-36 {
    font-size: 36px;
}
.fs-48 {
    font-size: 48px;
}
.tr_back {
    transition: background var(--trans);
    -webkit-transition: background var(--trans);
    -moz-transition: background var(--trans);
    -ms-transition: background var(--trans);
    -o-transition: background var(--trans);
}
.branded-pink {
    color: var(--branded-pink);
}
.branded-blue {
    color: var(--branded-blue);
}
.white {
    color: var(--white);
}
.pointer {
    cursor: pointer;
}
/* --- HEADER --- */
    header,
    #about_payment {
        height: 100vh;
        min-height: 830px;
        max-height: 830px;
        max-width: 1920px;
        margin: 0 auto;
        padding: 155px 0 230px 0;
        position: relative;
        color: var(--white);
        background-color: #0A1035;
        background-image: url('https://vademec.ru/images/donate/back.png');
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
    }
    header #logo {
        width: min(100%, 50vw);
    }
    h1 {
        margin: 60px 0 20px;
        font-size: min(112px,11vw);
        font-family: var(--font_1);
        line-height: 1;
        text-transform: uppercase;
    }
    header p {
        max-width: 500px;
        padding: 0 10px 0 0;
        margin: 0 0 25px 0;
        font-size: min(25px, 4vw);
        font-family: var(--font_2);
    }
    .btn {
        width: fit-content;
        margin: 20px 0;
        padding: 20px 35px;
        display: block;
        color: #000;
        font-size: 21px;
        font-family: var(--font_2);
        background-color: var(--white);
        line-height: 1;    
    }
    header .btn:hover {
        background-color: var(--trans_white);
    }
    #header_btn {
        margin-bottom: 100px;
    }
    header #mockups {
        width: min(861px, 50vw);
        right: -60px;
        top: 60%;
        transition: right var(--trans), top var(--trans);
        -webkit-transition: right var(--trans), top var(--trans);
        -moz-transition: right var(--trans), top var(--trans);
        -ms-transition: right var(--trans), top var(--trans);
        -o-transition: right var(--trans), top var(--trans);
    }
    header #back_img_2 {
        margin-top: 20px;
        left: -36px;
    }
/* --- MAIN --- */
main {
    margin: 150px 0;
}
main .mb-80 {
    margin-bottom: 80px;
}
main .mb-40 {
    margin-bottom: 40px;
}
main .mb-25 {
    margin-bottom: 25px;
}
main .wrapper {
    padding: 0 15px;
}
#about_payment {
    max-height: unset;
}
#about_payment .t_shadow {
    text-shadow: 0 0 10px black;
}
#about_payment .go_vademec {
    transition: color var(--trans);
    -webkit-transition: color var(--trans);
    -moz-transition: color var(--trans);
    -ms-transition: color var(--trans);
    -o-transition: color var(--trans);
}
#about_payment .go_vademec:hover {
    color: var(--branded-blue);
}
/* --- FOOTER --- */
footer {
    padding: 50px 0;
    border-top: 5px solid var(--branded-pink);
}
footer .left_part {
    padding: 0 50px 0 0;
}
footer .left_part,
footer .right_part {
    width: 50%;
}
footer .icon {
    width: 24px;
    height: 24px;
    margin-right: 10px;
}
footer .item {
    margin: 0 0 15px 0;
}
footer a {
    color: black;
    transition: fill .2s, color .2s;
    -webkit-transition: fill .2s, color .2s;
    -moz-transition: fill .2s, color .2s;
    -ms-transition: fill .2s, color .2s;
    -o-transition: fill .2s, color .2s;
}
footer a:hover {
    color: var(--branded-pink);
}
footer a:hover svg {
    fill: var(--branded-pink);
}
@media screen and (max-width: 1400px) {
    header #mockups {
        right: 0;
        top: 80%;
    }
}
@media screen and (max-width: 1200px) {
    header {
        padding: 100px 0;
    }
}
@media screen and (max-width: 998px) {
    #logo_wrapper {
        justify-content: flex-start;
    }
}
@media screen and (max-width: 768px) {
    header #mockups {
        width: 70%;
        top: 110%;
    }
    #extra_elems {
        display: none;
    }
    footer .left_part,
    footer .right_part {
        padding: 0;
        width: 100%;
    }
    #footer_line {
        flex-direction: column;
    }
}
@media screen and (max-width: 576px) {
    header {
        max-height: 640px;
        padding: 50px 0;
    }
    .fs-36 {
        font-size: 26px;
    }
    .fs-48 {
        font-size: 32px;
    }
}
/* End */
/* /local/templates/donate_landing/template_styles.css?16752355956964 */
