* {
    box-sizing: border-box
}

[scroll=goScrollToForm] {
    cursor: pointer
}

:root {
    --swiper-theme-color: #888
}

:host {
    display: block;
    margin-left: auto;
    margin-right: auto;
    position: relative;
    z-index: 1
}

:root {
    --swiper-navigation-size: 44px
}

body {
    font-family: sans-serif;
    margin: 0
}

* {
    -webkit-tap-highlight-color: transparent !important;
    /*-webkit-appearance: none !important;*/
    -moz-appearance: none !important;
    /*appearance: none !important;*/
    outline: 0 !important
}

body {
    -webkit-animation-duration: 0.4s;
    animation-duration: 0.4s;
    -webkit-animation-name: fadeInLoad;
    animation-name: fadeInLoad;
    position: relative
}

@-webkit-keyframes fadeInLoad {
    0% {
        opacity: 0
    }

    25% {
        opacity: 0
    }

    50% {
        opacity: 0
    }

    75% {
        opacity: .9
    }

    to {
        opacity: 1
    }
}

@keyframes fadeInLoad {
    0% {
        opacity: 0
    }

    25% {
        opacity: 0
    }

    50% {
        opacity: 0
    }

    75% {
        opacity: .9
    }

    to {
        opacity: 1
    }
}

@-moz-document url-prefix() {}

p {
    margin: 0
}

.main {
    background: #fff;
    padding: 20px
}

.red-link {
    color: #c03;
    text-decoration: none
}

.text-about {
    font-family: sans-serif;
    font-size: 16px;
    margin: 15px 0
}

.killer {
    margin-top: 40px
}

.green-modul {
    background-color: #c03;
    border: 1px solid #b11033;
    border-radius: 7px;
    color: #fff;
    display: block;
    font-family: sans-serif;
    font-size: 0.9em;
    font-weight: 400;
    line-height: 1.5;
    margin: 20px auto;
    padding: 15px 20px
}

.proff-img {
    margin: 20px auto;
    max-width: 850px;
    width: 100%
}

.proff-text {
    display: block;
    font-family: sans-serif;
    font-size: 1em;
    font-weight: 400;
    line-height: 1.5;
    margin: 0 0 .8em
}

.pg {
    background-color: #f8ddd4;
    border-radius: 10px;
    margin: 20px auto;
    padding: 20px
}

.ul2 {
    margin-bottom: 15px
}

.center {
    color: #af0000;
    font-size: 1.2em;
    margin-bottom: 10px;
    margin-top: 20px;
    text-align: center
}

.order-form,
h2 {
    margin-top: 40px
}

.ahtung {
    font-family: sans-serif;
    font-size: 1.2em;
    line-height: 1.3
}

.left_count {
    background: #c03;
    max-width: 100px
}

.desc {
    display: block;
    font-family: sans-serif;
    font-size: 1em;
    margin-top: -10px;
    text-align: center
}

.main-t1 {
    display: block;
    font-family: sans-serif;
    font-size: 1.75em;
    font-weight: 700;
    margin-bottom: .5em;
    padding: 0
}

.authors {
    -webkit-align-items: center;
    align-items: center;
    display: -webkit-flex;
    display: flex;
    margin-top: -15px
}

.aut-li {
    display: block
}

.zi1 {
    z-index: 10
}

.zi2 {
    z-index: 9
}

.zi3 {
    z-index: 8
}

.mli {
    margin-left: -30px
}

.aut-text {
    color: #666;
    font-family: sans-serif;
    font-size: 18px;
    line-height: 1.3;
    margin-left: 10px
}

.ul-aut {
    display: -webkit-flex;
    display: flex;
    list-style: none;
    padding: 0 0 0 25px
}

.erik {
    border: 2px solid #fff;
    border-radius: 50%;
    height: 50px;
    width: 50px
}

.main-container {
    margin: 0 auto;
    max-width: 850px;
    width: 100%
}

.l2 {
    border-bottom: 4px solid #c03;
    color: #c03
}

.sub-link {
    color: #666;
    text-decoration: none
}

.sub-link:hover {
    color: #c03
}

.under-nav {
    background-color: #eee;
    padding: 0 20px
}

.under-nav-container {
    -webkit-align-items: center;
    align-items: center;
    -webkit-flex-wrap: nowrap;
    flex-wrap: nowrap;
    gap: 20px;
    -webkit-justify-content: end;
    justify-content: end;
    margin: 0 auto;
    max-width: 850px;
    padding: 15px 0
}

.red-nav,
.under-nav-container {
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    flex-direction: row
}

.red-nav {
    background-color: #c03;
    width: 100%
}

.red-nav,
.under-b {
    -webkit-justify-content: center;
    justify-content: center
}

.under-b {
    -webkit-align-items: center;
    align-items: center;
    background-color: #c5c5c5;
    border: 1px solid transparent;
    border-radius: 5px;
    color: #fff;
    display: -webkit-flex;
    display: flex;
    font-family: sans-serif;
    font-size: 1rem;
    font-size: 16px;
    font-weight: 700;
    font-weight: 600;
    height: 34px;
    padding: 0 15px;
    text-align: center;
    text-decoration: none
}

.under-b:hover {
    background-color: #aaa
}

.item2 img,
.item3 img {
    width: 22px
}

.nav-link {
    -webkit-align-items: center;
    align-items: center;
    font-family: sans-serif;
    font-size: 16px;
    font-weight: 600;
    margin-right: 1.875em
}

.nav-container,
.nav-link {
    display: -webkit-flex;
    display: flex
}

.nav-container {
    -webkit-justify-content: center;
    justify-content: center;
    margin: 0 auto;
    max-width: 1200px;
    padding: 0 20px;
    width: 100%
}

.nav-logo {
    display: -webkit-flex;
    display: flex
}

.nav-left {
    -webkit-align-items: center;
    align-items: center;
    -webkit-flex-wrap: nowrap;
    flex-wrap: nowrap
}

.nav-left,
.nav-right {
    display: -webkit-flex;
    display: flex;
    max-width: 410px;
    width: 100%
}

.nav-right {
    -webkit-justify-content: end;
    justify-content: end
}

.nav-logo img {
    display: inline-block
}

.nav-link a {
    color: #fff;
    cursor: pointer;
    font-weight: 700;
    text-decoration: none
}

.nav-link a:hover {
    color: #000
}

.three-dots img {
    width: 20px
}

.sub-search img {
    width: 21px
}

.sub-nav-container {
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: nowrap;
    flex-wrap: nowrap;
    gap: 10px;
    -webkit-justify-content: center;
    justify-content: center;
    margin: 0 auto;
    max-width: 1200px;
    width: 100%
}

.sub-input input {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-clip: padding-box;
    background-color: #fff;
    border: none;
    border-bottom: 2px solid #eee;
    color: #666;
    display: block;
    font-size: 1em;
    outline: none;
    padding: .375rem .5rem .375rem .125rem;
    width: 419px
}

.sub-input input::-webkit-input-placeholder {
    opacity: 0
}

.sub-input input::-moz-placeholder {
    opacity: 0
}

.sub-input input:focus::-webkit-input-placeholder {
    opacity: 1
}

.sub-input input:focus::-moz-placeholder {
    opacity: 1
}

.sub-input input:focus {
    border-color: #9c3
}

.sub-right {
    -webkit-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: nowrap;
    flex-wrap: nowrap;
    gap: 10px
}

.sub-right,
.three-dots {
    -webkit-align-items: center;
    align-items: center;
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: center;
    justify-content: center
}

.sub-ul {
    color: #888;
    font-size: 1em;
    list-style: none;
    padding-left: 0
}

.sub-left,
.sub-ul {
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: nowrap;
    flex-wrap: nowrap
}

.sub-li {
    font-family: sans-serif;
    font-size: 16px;
    font-weight: 600;
    margin-right: 1.875em
}

@media(max-width:992px) {
    .sub-input input {
        width: 321px
    }
}

@media(max-width:830px) {
    .sub-input input {
        width: 200px
    }
}

@media(max-width:768px) {
    .sub-nav-container {
        display: none
    }
}

@media(max-width:656px) {
    .sub-input input {
        width: 100px
    }
}

@media(max-width:550px) {
    .sub-input input {
        width: 60px
    }
}

@media(max-width:500px) {
    .sub-input input {
        display: none
    }
}

.authors-container {
    -webkit-align-items: center;
    align-items: center;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    flex-direction: row
}

@media(max-width:430px) {
    .l4 {
        display: none
    }
}

.text-about {
    font-style: italic
}

@media(max-width:400px) {
    .authors {
        display: -webkit-flex;
        display: flex;
        -webkit-flex-direction: column;
        flex-direction: column;
        -webkit-justify-content: center;
        justify-content: center
    }

    .text-about {
        text-align: center
    }

    .authors-container {
        margin-bottom: -20px
    }

    .aut-text p,
    .main-t1 {
        text-align: center
    }
}

@media(max-width:370px) {
    .l3 {
        display: none
    }
}

.nav-logo img {
    width: 100px
}

@media(max-width:600px) {
    .red-nav {
        height: 48px
    }

    .nav-logo img {
        height: 48px;
        width: auto
    }
}

:focus,
input,
input:active {
    outline: none
}

.fot-link:hover {
    color: #c03
}

input[value='']:active {
    box-shadow: none !important;
    -webkit-transform: translateY(2px);
    transform: translateY(2px)
}

.ruletka-p {
    color: #000;
    font-weight: 700;
    line-height: 25px;
    margin: 15px;
    text-align: center !important;
    text-indent: 0
}

.ruletka-p h2 {
    font-size: 25px;
    margin-bottom: 15px
}

.ruletka-a {
    color: #1697ce
}

.left_count {
    display: table;
    font-size: 130% !important;
    margin: 12px auto;
    padding: 10px 30px;
    text-align: center
}

.left_count {
    background: red;
    border-radius: 5px;
    color: #fff;
    font-size: 26px !important;
    margin: 12px 0;
    padding: 10px 20px;
    text-shadow: 0 -1px 0 #000, 0 -1px 0 #000, 0 1px 0 #000, 0 1px 0 #000, -1px 0 0 #000, 1px 0 0 #000, -1px 0 0 #000, 1px 0 0 #000, -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000, -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000
}

.left_count .prod_left_val {
    font-size: 32px !important
}

@media screen and (max-width:370px) {
    .startdate {
        display: block;
        padding: 5px 0
    }
}

h2 {
    font-family: sans-serif !important
}

.fot-li {
    margin-bottom: 20px
}

.fot-link {
    color: #888;
    text-decoration: none
}

.fwb {
    font-weight: 600
}

.ul-fot {
    list-style: none;
    margin: 20px 0 0;
    padding-left: 0
}

.f-t {
    -webkit-justify-content: space-around;
    justify-content: space-between;
    padding: 30px 20px
}

.f-t {
    display: -webkit-flex;
    display: flex;
    margin: 0 auto;
    max-width: 850px
}

#fMask {
    background: #f6f6f6
}

@media screen and (max-width:450px) {
    .f-t {
        display: none
    }
}

.ruletka-p {
    text-indent: 0;
    color: #000;
    text-align: center !important;
    margin: 15px;
    line-height: 25px;
    font-weight: 700
}

.ruletka-p h2 {
    font-size: 25px;
    margin-bottom: 15px;
    line-height: 31px
}

.ruletka-a {
    color: #1697ce
}

body {
    min-width: 300px
}

.rullete-container {
    max-width: 692px
}

.dobav {
    background: rgb(255 0 0/7%) !important;
    padding: 6px 7px !important;
    font: 18px sans-serif !important;
    line-height: 1.5 !important;
    text-align: center !important;
    color: #1f1414 !important;
    max-width: 652px;
    margin: 0 auto !important;
    display: block;
    margin-top: 10px !important;
    margin-bottom: 10px !important;
    font-family: sans-serif
}

.dobav font {
    text-transform: uppercase;
    display: block;
    font-size: 20px;
    color: #ff4343;
    text-shadow: 0 0 1px #fff;
    font-weight: 700
}

.coment_ava img {
    border-radius: 5px;
    height: 50px;
    margin: 0;
    width: 50px
}

.pg {
    font-size: 20px;
    line-height: 1.4;
    margin-left: 60px;
    background-color: transparent !important;
    padding: 0 !important;
    margin: 0 !important
}

.row-y-name b {
    font-weight: bolder
}

.row-y-item {
    margin-bottom: 30px
}

#comments .coment_ava {
    float: left;
    margin-right: 10px
}

.button.scroll1 {
    background-color: red;
    border-radius: 15px;
    color: #fff !important;
    display: table;
    font-size: 24px;
    font-weight: 700;
    margin: 25px auto 35px;
    max-width: 100%;
    max-width: 340px;
    padding: 10px;
    text-align: center;
    text-decoration: none;
    width: 100%;
    cursor: pointer;
}

.come {
    display: flex;
    align-items: center;
    margin: 20px 0
}

.come__line {
    width: 100%;
    height: 2px;
    background: #b4b4b4
}

.come__text {
    text-transform: uppercase;
    font-size: 20px;
    padding: 0 10px;
    color: #148fb9;
    font-weight: 600;
    white-space: nowrap
}

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

ul.block li {
    flex-basis: 30%;
    list-style: none;
    text-align: center
}

ul.block {
    padding: 0
}

ul.block li img {
    max-width: 150px;
    width: 100%
}

ul.block li:nth-child(4) img {
    max-width: 80px
}

ul.block li:nth-child(5) img {
    max-width: 80px
}


nav {

            padding-left: 30px;
            padding-right: 30px;
            display: flex;
            font-family: sans-serif !important;
            gap: 20px;
        }


        .head-container {
                        text-align: center;
                        max-width: 700px;
                        margin: 0 auto;
                        padding: 20px;
                    }

                    .head-label {
                        font-size: 12px;
                        line-height: 18px;
                        font-weight: 900;
                        text-transform: uppercase;
                        color: #fff;
                        background-color: #c20017;
                        border-radius: 4px;
                        text-align: center;
                        display: inline-block;
                        padding: 2px 6px 2px 6px;
                        margin: 0 0 8px 0;
                    }

                    .head-title {
                        font-size: 26px;
                        font-weight: bold;
                        color: #000;
                        margin: 10px 0 15px 0;
                        line-height: 1.4;
                    }

                    .head-subtitle {
                        font-size: 16px;
                        color: #555;
                        margin-bottom: 20px;
                    }

                    .head-info {
                        font-size: 14px;
                        color: #666;
                    }

                    .head-author {
                        display: block;
                        font-weight: bold;
                        margin-bottom: 5px;
                    }

                    .head-date {
                        font-size: 14px;
                        color: #666;
                        margin-top: 10px;
                        margin-bottom: 10px;
                    }



                     .main-title {
                        display: flex;
                        flex-direction: column;
                        align-items: center;
                        padding-top: 0px;
                        padding-left: 10px;
                        padding-right: 10px;
                    }

                    .heading1 {
                        border-radius: 5px;
                        background-color: #c20017;
                        display: flex;
                        flex-direction: row;
                        align-items: center;
                        justify-content: center;
                        padding: 3px 6px;
                        font-size: 14px;
                        color: white;
                        font-weight: 700;
                    }

                    .heading2 {
                        font-size: 48px;
                        color: black;
                        font-weight: 700;
                        max-width: 1140px;
                        text-align: center;
                        margin-bottom: 20px;
                        font-family: 'Roboto';
                        font-weight: 900;
                        letter-spacing: -1px;
                        line-height: 1;
                    }

                    .heading3 {
                        color: #003366;
                        font-size: 14px;
                        display: flex;
                        align-items: center;
                        gap: 6px;
                        margin-top: 10px;
                        margin-bottom: 10px;
                    }

                    .heading3 .dot {
                        width: 2px;
                        position: relative;
                        border-radius: 50%;
                        background-color: #8e6b66;
                        height: 2px;
                    }

                    .social-container {
                        text-align: center;
                        padding: 20px 0;
                        padding-bottom: 0px;
                        padding-top: 10px !important;
                    }

                    .social-border {
                        height: 1px;
                        background-color: #fdfdfd;
                        margin: 10px 0;
                    }

                    .comment-bottom a {
                        color: #0096b2;
                    }

                    .comment-bottom a:hover {
                        color: #00697b;
                    }

                    .social-image-placeholder {
                        max-width: 100%;
                        height: 50px;
                        margin: 0 auto;
                    }

                    @media screen and (max-width: 768px) {
                        .heading2 {
                            font-size: 22px;
                            color: black;
                            font-weight: 700;
                            max-width: 1140px;
                            text-align: center;
                            margin-bottom: 10px;
                            font-family: 'Roboto';
                            font-weight: 900;
                            letter-spacing: -1px;
                            line-height: 1.2;
                        }

                        .social-container {
                            padding: 0;
                        }
                    }

                    header {
                        padding: 0;
                    }

                    .gif-logo {
                        position: relative;
                        max-width: 600px;
                    }

                    .gif-logo:after {
                        position: absolute;
                        content: ' ';
                        left: 15px;
                        bottom: 15px;
                        width: 50px;
                        height: 50px;
                        background: no-repeat url("logo.png");
                        background-size: 50px 50px;
                    }

                    figcaption {
                        margin: 0 auto;
                        margin-bottom: 10px;
                        max-width: 800px;
                        line-height: 1.5;
                    }




                     .info .pg {
                        font-size: 15px;
                    }

                    .name {
                        margin-bottom: 10px;
                    }

                    .doc-1 {
                        font-size: 1.1em;
                        margin-bottom: 5px;
                    }



                     .newrow {
                    display: block !important;
                }

            

                .form_flex {
                    display: flex;
                    padding: 20px;
                    border: 1px solid #000;
                    max-width: 800px;
                    margin: 0 auto;
                }

                .after-h2::after {
                    content: "";
                    margin-top: 12px;
                    border-bottom: 4px solid #168de2;
                    display: block;
                }

                .after-h2 {
                    margin-bottom: 0px;
                    font-weight: bold;
                }

                .mb-20 {
                    margin: 20px 0
                }

                .img-responsive {
                    width: 100%;
                    max-width: 100%;
                }

                @media (max-width: 550px) {
                    .form_flex {
                        flex-direction: column
                    }

                    .img-responsive {
                        margin-top: 0px !important;
                        margin-bottom: 0px !important;
                    }

                   
                }








                 :root {
                        --font-liberation-sans: "Liberation Sans";
                        --font-size-5xl: 24px;
                        --font-size-lg: 18px;
                        --font-size-sm: 14px;
                        --font-size-3xl: 22px;
                        --font-size-xl: 20px;
                        --color-whitesmoke: #f7f7f7;
                        --color-white: #fff;
                        --color-red-100: #ff2020;
                        --color-red-200: #ff0000;
                        --color-gray-100: #808080;
                        --color-gray-200: #1d1d1d;
                        --color-cadetblue-100: #0099b4;
                        --color-cadetblue-200: #0096b2;
                        --color-black: #000;
                        --color-green: #008000;
                        --color-darkslategray-100: #474c4f;
                        --color-darkslategray-200: #404040;
                        --color-palegoldenrod: #fff1b3;
                        --color-oldlace: #fff4e0;
                        --color-teal: #007b92;
                        --color-darkgray: #b0b0b0;
                        --gap-3xs: 10px;
                        --gap-mini: 15px;
                        --gap-4xs: 9px;
                        --padding-xl: 20px;
                        --padding-3xs: 10px;
                        --padding-xs: 12px;
                        --padding-31xl: 50px;
                        --padding-mini: 15px;
                        --padding-11xl: 30px;
                        --padding-21xl: 40px;
                        --padding-5xl: 24px;
                        --padding-lgi: 19px;
                        --padding-3xl: 22px;
                    }

                    .comments1 {
                        align-self: stretch;
                        background-color: var(--color-cadetblue-200);
                        padding: 14px 17px;
                        font-size: var(--font-size-3xl);
                        color: var(--color-white);
                        margin-bottom: 20px;
                    }

                    .comments1,
                    .kyttj-kirjoittaa {
                        display: flex;
                        flex-direction: column;
                        align-items: flex-start;
                        justify-content: flex-start;
                    }

                    .kyttj-kirjoittaa {
                        width: 100%;
                    }

                    .kyttj-kirjoittaa {
                        padding: 0 0 var(--padding-xl);
                        color: var(--color-black);
                    }

                    .kyttj-kirjoittaa .text-22 {
                        width: 100%;
                    }

                    .text-22 {
                        display: flex;
                        flex-direction: row;
                        align-items: center;
                        justify-content: center;
                        gap: 10px;
                    }

                    .write-comment {
                        padding: 10px;
                        width: 100%;
                        height: 40px;
                        box-sizing: border-box;
                        border-radius: 5px;
                        border: 1px solid black;
                        margin-top: 15px;
                        margin-bottom: 15px;
                    }

                    .text-22 button {
                        padding: 10px 50px;
                        border-radius: 5px;
                        background: #0096b2;
                        border: none;
                        height: 40px;
                        box-sizing: border-box;
                        color: white;
                        font-weight: 500;
                        text-transform: uppercase;
                        cursor: pointer;
                    }

                    .comment-top {
                        margin-bottom: 0px;
                    }

                    .comment-bottom {
                        line-height: 1.5;
                    }

                    .js-set-date {
                        color: gray;
                    }

                    .img-x::before {
                        content: '';
                        background: rgba(86, 86, 86, 0.45);
                        position: absolute;
                        width: 100%;
                        height: 100%;
                    }

                    .comment-create__image-input-wrap {
                        position: relative;
                        display: inline-block;
                    }

                    .comment-create__image-input-wrap img {
                        display: block;
                    }

                    .comment-create__image-input-wrap:hover img {
                        opacity: 0.7;
                    }

                    .comment-name,
                    .comment-bottom a {
                        color: #007b92;
                    }

                    .user-picture-to-load {
                        margin: 0 0 !important;
                    }

                    .comment-create__text-field::placeholder {
                        text-indent: 0px !important;
                    }