@font-face {
    font-family: 'Cera Pro';
    src: url('fonts/CeraPro-Italic.eot');
    src: local('Cera Pro Italic'), local('CeraPro-Italic'),
        url('fonts/CeraPro-Italic.eot?#iefix') format('embedded-opentype'),
        url('fonts/CeraPro-Italic.woff') format('woff'),
        url('fonts/CeraPro-Italic.ttf') format('truetype');
    font-weight: normal;
    font-style: italic;
}

@font-face {
    font-family: 'Cera Pro';
    src: url('fonts/CeraPro-Regular.eot');
    src: local('Cera Pro Regular'), local('CeraPro-Regular'),
        url('fonts/CeraPro-Regular.eot?#iefix') format('embedded-opentype'),
        url('fonts/CeraPro-Regular.woff') format('woff'),
        url('fonts/CeraPro-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Cera Pro';
    src: url('fonts/CeraPro-BlackItalic.eot');
    src: local('Cera Pro Black Italic'), local('CeraPro-BlackItalic'),
        url('fonts/CeraPro-BlackItalic.eot?#iefix') format('embedded-opentype'),
        url('fonts/CeraPro-BlackItalic.woff') format('woff'),
        url('fonts/CeraPro-BlackItalic.ttf') format('truetype');
    font-weight: 900;
    font-style: italic;
}

@font-face {
    font-family: 'Cera Pro';
    src: url('fonts/CeraPro-Light.eot');
    src: local('Cera Pro Light'), local('CeraPro-Light'),
        url('fonts/CeraPro-Light.eot?#iefix') format('embedded-opentype'),
        url('fonts/CeraPro-Light.woff') format('woff'),
        url('fonts/CeraPro-Light.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'Cera Pro';
    src: url('fonts/CeraPro-BoldItalic.eot');
    src: local('Cera Pro Bold Italic'), local('CeraPro-BoldItalic'),
        url('fonts/CeraPro-BoldItalic.eot?#iefix') format('embedded-opentype'),
        url('fonts/CeraPro-BoldItalic.woff') format('woff'),
        url('fonts/CeraPro-BoldItalic.ttf') format('truetype');
    font-weight: bold;
    font-style: italic;
}

@font-face {
    font-family: 'Cera Pro';
    src: url('fonts/CeraPro-Black.eot');
    src: local('Cera Pro Black'), local('CeraPro-Black'),
        url('fonts/CeraPro-Black.eot?#iefix') format('embedded-opentype'),
        url('fonts/CeraPro-Black.woff') format('woff'),
        url('fonts/CeraPro-Black.ttf') format('truetype');
    font-weight: 900;
    font-style: normal;
}

@font-face {
    font-family: 'Cera Pro';
    src: url('fonts/CeraPro-Medium.eot');
    src: local('Cera Pro Medium'), local('CeraPro-Medium'),
        url('fonts/CeraPro-Medium.eot?#iefix') format('embedded-opentype'),
        url('fonts/CeraPro-Medium.woff') format('woff'),
        url('fonts/CeraPro-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'Cera Pro';
    src: url('fonts/CeraPro-Bold.eot');
    src: local('Cera Pro Bold'), local('CeraPro-Bold'),
        url('fonts/CeraPro-Bold.eot?#iefix') format('embedded-opentype'),
        url('fonts/CeraPro-Bold.woff') format('woff'),
        url('fonts/CeraPro-Bold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'Cera Pro';
    src: url('fonts/CeraPro-Thin.eot');
    src: local('Cera Pro Thin'), local('CeraPro-Thin'),
        url('fonts/CeraPro-Thin.eot?#iefix') format('embedded-opentype'),
        url('fonts/CeraPro-Thin.woff') format('woff'),
        url('fonts/CeraPro-Thin.ttf') format('truetype');
    font-weight: 100;
    font-style: normal;
}

@font-face {
    font-family: 'Cera Pro';
    src: url('fonts/CeraPro-MediumItalic.eot');
    src: local('Cera Pro Medium Italic'), local('CeraPro-MediumItalic'),
        url('fonts/CeraPro-MediumItalic.eot?#iefix') format('embedded-opentype'),
        url('fonts/CeraPro-MediumItalic.woff') format('woff'),
        url('fonts/CeraPro-MediumItalic.ttf') format('truetype');
    font-weight: 500;
    font-style: italic;
}

@font-face {
    font-family: 'Cera Pro';
    src: url('fonts/CeraPro-LightItalic.eot');
    src: local('Cera Pro Light Italic'), local('CeraPro-LightItalic'),
        url('fonts/CeraPro-LightItalic.eot?#iefix') format('embedded-opentype'),
        url('fonts/CeraPro-LightItalic.woff') format('woff'),
        url('fonts/CeraPro-LightItalic.ttf') format('truetype');
    font-weight: 300;
    font-style: italic;
}

@font-face {
    font-family: 'Cera Pro';
    src: url('fonts/CeraPro-ThinItalic.eot');
    src: local('Cera Pro Thin Italic'), local('CeraPro-ThinItalic'),
        url('fonts/CeraPro-ThinItalic.eot?#iefix') format('embedded-opentype'),
        url('fonts/CeraPro-ThinItalic.woff') format('woff'),
        url('fonts/CeraPro-ThinItalic.ttf') format('truetype');
    font-weight: 100;
    font-style: italic;
}
html {
    scroll-behavior: smooth;
}
:root {
    background: #ffffff;
    overflow-x:hidden;
}

body {
    font-size: 10px;
    background: #fff;
    font-family: 'Cera Pro', sans-serif;
}

.container-fluid {
    max-width: 1200px;
}

.navbar {
    padding: 2rem;
    background: #fff;
    box-shadow: none;
    border: 0;
}

.btn-fs {
    width: 17.7rem;
    height: 5.8rem;
    border-radius: 2.6rem;
    color: #fff;
    transition: background-color 0.5s ease-in-out;
    font-family: 'Cera Pro', sans-serif;
    font-weight: bold;
    font-size: 1.8rem;
}
.btn-fs:hover, .btn-fs:focus, .btn-fs:active {
    background-color: #8bdc18;
    color: #fff;
}

.btn-fs-primary {
    background: #ffa703;
}

.btn-fs-secondary {
    background: #55758e;
}

.slogan {
    color: #8bdc18;
    background: #fff;
    font-size: 5rem;
    line-height: 5.4rem;
    font-family: 'Cera Pro', sans-serif;
    font-weight: bold;
    padding-left: 17.3rem;
    padding-top: 2rem;
    padding-bottom: 12rem;
}

.slogan span {
    font-weight: 900;
}

.page1 {
    width: 100%;
    /* height: 63.4rem; */
    background: rgb(254,225,185);
    background: -moz-linear-gradient(180deg, rgba(254,225,185,1) 0%, rgba(255,255,255,1) 100%);
    background: -webkit-linear-gradient(180deg, rgba(254,225,185,1) 0%, rgba(255,255,255,1) 100%);
    background: linear-gradient(180deg, rgba(254,225,185,1) 0%, rgba(255,255,255,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#fee1b9",endColorstr="#ffffff",GradientType=1);
    padding-top: 6.8rem;
    padding-bottom: 10.8rem;
    color: #55758e;
    border-bottom-left-radius: 4.5rem;
    border-bottom-right-radius: 4.5rem;
    position: relative;
    z-index: 2;
}

ul {
    list-style: none;
    padding: 0 17.3rem;
    margin: 0;
    font-size: 3rem;
    line-height: 4rem;
    
}

ul li {
    color: #55758e;
    padding-left: 8.8rem;
    padding-bottom: 3.6rem;
    background: url(img/check_white.png) no-repeat left 0.5rem;
    background-size: 4.8rem;
}

h1 {
    color: #55758e;
    font-size: 5rem;
    font-weight: bold;
    text-align: center;
    margin-top: 3.6rem;
}

h1 span {
    color: #8bdc18;
}

p {
    color: #55758e;
    margin-top: 1.2rem;
    font-size: 2.4rem;
    line-height: 3.2rem;
    text-align: center;
}

.fs-action-btn {
    width: 58.6rem;
    height: 9.8rem;
    background: #8bdc18;
    color: #fff;
    font-size: 3rem;
    font-weight: bold;
    border-radius: 4rem;
    margin: 0 auto;
    transition: background-color 0.5s ease-in-out;
}

.fs-action-btn span {
    font-weight: normal;
    color: #769d62;
    text-decoration: line-through;
}

.fs-action-btn:hover {
    color: #fff;
    background: #ffa703;
}


.fs-landing-img-real {
    position: fixed;
    top: 11rem;
    width: 100vw;
    height: 100vh;
    background-image: url(img/fs-woman-big.jpg);
    /* background-attachment: fixed; */
    background-position: top center;
    background-repeat: no-repeat;
    background-size: cover;
    z-index: 0;
}

.fs-landing-img {
    width: 100%;
    height: 100vh;
    margin-top: -9.4rem;
    z-index: -1;
}

.page2 {
    padding-top: 4rem;
    padding-bottom: 6.4rem;
}

.page3 {
    margin-top: 0;
    border: 0.1rem solid #ffa703;
    border-radius: 4.5rem;
    background: rgb(254,225,185);
    background: -moz-linear-gradient(180deg, rgba(254,225,185,1) 0%, rgba(255,255,255,1) 100%);
    background: -webkit-linear-gradient(180deg, rgba(254,225,185,1) 0%, rgba(255,255,255,1) 100%);
    background: linear-gradient(180deg, rgba(254,225,185,1) 0%, rgba(255,255,255,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#fee1b9",endColorstr="#ffffff",GradientType=1);
    height: 70.8rem;
}

.page3 p.under-circle {
    font-size: 2rem;
    line-height: 2.4rem;
}

.fs-circle {
    font-size: 3rem;
    font-weight: bold;
    height: 18.4rem;
    width: 18.4rem;
    margin: 0 auto;
    line-height: 2.4rem;
    /*background: linear-gradient(transparent, transparent) padding-box, linear-gradient(to right, #d3e2a4 0%, #90c028 100%) border-box;*/
    background: url(img/krug.svg) no-repeat center;
    background-size: cover;
    border-radius: 50%;
    border: 0.4rem solid transparent;
}

.fs-circle span {
    font-weight: 300;
    font-size: 2rem;
}

.under-page3 {
    margin-top: -12rem;
    color: #769d62;
    font-weight: bold;
    font-size: 3rem;
    line-height: 4rem;
    text-align: center;
    
    height: 30rem;
}

.under-page3-image {
    background: url(img/protokol_400.png) no-repeat top center;
    background-size: /*22.6*/20.6rem;
    padding-top: 24rem;
}

.page4 {
    margin: 6.4rem;
    border: 0.1rem solid #8bdc18;
    border-radius: 4.5rem;
    background: rgb(178,207,102);
    background: -moz-linear-gradient(180deg, rgba(178,207,102,1) 0%, rgba(224,235,195,1) 100%);
    background: -webkit-linear-gradient(180deg, rgba(178,207,102,1) 0%, rgba(224,235,195,1) 100%);
    background: linear-gradient(180deg, rgba(178,207,102,1) 0%, rgba(224,235,195,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#b2cf66",endColorstr="#e0ebc3",GradientType=1);
    padding: 3.4rem;
    text-align: center;
}

.page5 {
    margin: 6.4rem;
    margin-bottom: 0;
    border: 0.1rem solid #ffa703;
    border-radius: 4.5rem;
    background: rgb(254,225,185);
    background: -moz-linear-gradient(180deg, rgba(254,225,185,1) 0%, rgba(255,255,255,1) 100%);
    background: -webkit-linear-gradient(180deg, rgba(254,225,185,1) 0%, rgba(255,255,255,1) 100%);
    background: linear-gradient(180deg, rgba(254,225,185,1) 0%, rgba(255,255,255,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#fee1b9",endColorstr="#ffffff",GradientType=1);
    padding: 3.4rem;
    text-align: center;
}

.plate {
    height: 9.8rem;
    background: #fff;
    width: 38rem;
    line-height: 9.8rem;
    color: #000;
    font-weight: 900;
    font-size: 5rem;
    text-align: center;
    border-radius: 4.4rem;
    margin: 0 auto;
}

.page4 p, .page5 p {
    font-weight: normal;
    font-size: 2.8rem;
    line-height: 3.8rem;
}

.page6 ul {
    padding: 0;
    padding-left: 23.8rem;
}

/*.page6 ul li:not(:last-child):after { */
.page6 ul li:not(:first-child):before {
    display: block;
    content: " ";
    height: 4.4rem;
    width: 0.2rem;
    background: #8bdc18;
    /*margin-left: -6.8rem;*/
    position: absolute;
    left: 2rem;
    top: -5rem;
}

.page7 {
    margin: 6.4rem;
    margin-bottom: 0;
    border: 0.1rem solid #bfe4df;
    border-radius: 4.5rem;
    background: rgb(191,228,223);
    background: -moz-linear-gradient(180deg, rgba(191,228,223,1) 0%, rgba(255,255,255,1) 100%);
    background: -webkit-linear-gradient(180deg, rgba(191,228,223,1) 0%, rgba(255,255,255,1) 100%);
    background: linear-gradient(180deg, rgba(191,228,223,1) 0%, rgba(255,255,255,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#bfe4df",endColorstr="#ffffff",GradientType=1);
    padding: 3.4rem 10.6rem;
    text-align: center;
}

.page7 .plate {
    color: #55758e;
}

.page7 .person {
    margin-top: -1.6rem;
    padding-top: 15.4rem;
    background: url(img/Runenko_sd.png) no-repeat top center;
    background-size: 14rem;
}

.page7 p {
    font-size: 2.2rem;
}

.page7 .person p {
    color: #000;
    text-align: center;
    font-size: 1.8rem;
    line-height: 2.4rem;
    font-weight: normal;
}

.page7 .person p.heading {
    font-size: 2.2rem;
    line-height: 2.8rem;
    font-weight: bold;
}

footer {
    margin-top: -4.5rem;
    border-top-left-radius: 4.5rem;
    border-top-right-radius: 4.5rem;
    background: #5b94ae;
    padding: 3.2rem;
    padding-top: 6rem;
    position: relative;
    z-index: 1;
}

footer h1 {
    color: #fff;
}

footer p {
    color: #000;
    text-align: center;
    font-size: 3rem;
    line-height: 3.6rem;
}

footer .col-4 {
    color: rgba(0,0,0, 0.5);
}

.fs-subscribe-input {
    background-color: #fff;
    color: #000;
    height: 5.8rem;
    line-height: 5.8rem;
    padding: 0 2rem;
    font-size: 1.8rem;
    border-radius: 2.6rem;
    border: 0;
    width: 40rem;
}

.fs-subscribe-input:focus {
    outline: none;
    box-shadow: none;
  }

.fs-subscribe-input::placeholder {
    color: #55758e;
    opacity: 1; /* Firefox */
}
  
.fs-subscribe-input::-ms-input-placeholder { /* Edge 12 -18 */
    color: #55758e;
}

footer .credentials {
    font-size: 1.4rem;
    color: #567891;
}

@media only screen and (hover: none) and (pointer: coarse){
    .fs-landing-img-real {
        display: none;
    }

    .fs-landing-img {
        width: 100vw;
        height: 100vh;
        background-image: url(img/fs-woman-big.jpg);
        /* background-attachment: fixed; */
        background-position: top center;
        background-repeat: no-repeat;
        background-size: cover;
    }
    
}