@font-face {
    font-family: 'open-sans-regular';
    src: url('../fonts/OpenSans-Regular.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'open-sans-bold';
    src: url('../fonts/OpenSans-Bold.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
}

:root {
    --font-main-regular: 'open-sans-regular', 'Tahoma', sans-serif;
    --font-main-bold: 'open-sans-bold', 'Tahoma', sans-serif;
    --c-main: #007585;
    --c-table-head-background: #cddbde;
    --c-table-head-color: #272836;
    --c-base-text: #494c54;
    --c-btn-color: #fff;
    --c-btn-background: hsl(354, 100%, 46%);
    --c-btn-background-darken: hsl(354, 100%, 39%);
    --c-gray-00: #f5f6f8;
    --c-gray-01: #EEF6F7;
    --c-gray-04: #81858d;
    --c-gray-05: #494c54;
    --c-gray-09: #e5eff0;
    --c-gray-10: #ccd1d8;
    --c-gray-12: #9a9fa9;
    --c-white: #fff;
    --c-error: #bc193a;
}

html {
    height: 100%;
}
body {
    width: 100%;
    min-height: 100%;
    margin: 0;
    padding: 0;
    font-family: var(--font-main-regular);
    font-size: 14px;
    line-height: 1.3;
    color: var(--c-base-text);
    /*background-color: @c-gray-01;*/
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    box-sizing: border-box;
}
body * {
    box-sizing: inherit;
}
h1, h2, h3, h4, h5, h6, b, strong {
    font-family: var(--font-main-bold);
    font-weight: normal;
}
.image-fullpage {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.field-wrapper {
    text-align: left;
}
.field-element, select {
    width: 100%;
    height: 44px;
    line-height: 44px;
    padding: 0 15px;
    font-family: var(--font-main-regular);
    font-size: 14px;
    border-radius: 16px;
    color: var(--c-gray-05);
    transition: box-shadow .2s ease-in-out, border-color .2s ease-in-out;
    background-color: #f5f6f870;
    border: 1px solid rgb(205 209 216 / 70%);
    -webkit-appearance: none;
}
.field-element.error, select.error {
    border-color: var(--c-error);
}
.field-element:focus, select:focus {
    outline: none;
    border-color: var(--c-main);
}

input::-moz-placeholder {
    color: var(--c-gray-12);
    opacity: 1;
}
input::-webkit-input-placeholder {
    color: var(--c-gray-12);
    opacity: 1;
}
input:-ms-input-placeholder {
    color: var(--c-gray-12);
    opacity: 1;
}
textarea:-moz-placeholder {
    color: var(--c-gray-12);
    opacity: 1;
}
textarea::-webkit-input-placeholder {
    color: var(--c-gray-12);
    opacity: 1;
}
textarea:-ms-input-placeholder {
    color: var(--c-gray-12);
    opacity: 1;
}
select {
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAABXCAYAAABGBhZYAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAydpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDkuMC1jMDAxIDc5LmMwMjA0YjJkZWYsIDIwMjMvMDIvMDItMTI6MTQ6MjQgICAgICAgICI+IDxyZGY6UkRGIHhtbG5zOnJkZj0iaHR0cDovL3d3dy53My5vcmcvMTk5OS8wMi8yMi1yZGYtc3ludGF4LW5zIyI+IDxyZGY6RGVzY3JpcHRpb24gcmRmOmFib3V0PSIiIHhtbG5zOnhtcD0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wLyIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bXA6Q3JlYXRvclRvb2w9IkFkb2JlIFBob3Rvc2hvcCAyNC40IChXaW5kb3dzKSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDo4REYwQ0ExQUIyRjQxMUVGODBEODg1MEJDQzExNzEwMSIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDo4REYwQ0ExQkIyRjQxMUVGODBEODg1MEJDQzExNzEwMSI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjhERjBDQTE4QjJGNDExRUY4MEQ4ODUwQkNDMTE3MTAxIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjhERjBDQTE5QjJGNDExRUY4MEQ4ODUwQkNDMTE3MTAxIi8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+XifFRgAAAt9JREFUeNrs3Dtv1EAQB/C95SoQoUL0fCMEFYHwLC4gCA0kJyFRAEoIFa8kQjzCJUcFEqJBfBigoYEGlJ6EGWUtzCm7O17PrBc0I/2LO9tr/+5sr+2zr/f+w0cjVPsgdyDn3Os1yG3IL4mZ9QURI8jJ2nu3IEchZyA73DO0mRBVnYasQHqlQ0KIqgYSGJsZIYbhguACvSAiRDCWCYELNOMZvu0iirFMiEEAMeMiiulnQIxr7408H17VxqXUXbPNiBhLfjNWAIF1YQIhjukLIHD1WA8MH7t2NgKYxquZFUCsEtradOOy7ZptB4iqVjkxtiNEE8wiF2RJCEHFzLtlaAXBBm4IItgwNoKYz4BgwdhCEK0xtiBEK4wtDJGMsQ0QVzMhkjCWiBhCHpn8RcbgsdZlAmLJdFeIORToGHHZv9pIP9E1or7aDwPDryNkqnAEBTOFkLf/ACKGeYPbyJzb6I9BfkLuQp6Zcgsx3yA3IQch7yDXeoLXfrOWNf9JKUQhClGIQhSiEIUoRCEKUYhCFKIQhShEIQpRiEIUUjRkP+Qp5Dvkk/lzC3jJdRHyBfLD7N7degB/6HngBmAddgOOmDJ/scJaMH//MIof/DZ+Iyf2GHnRTVA6oqrjCNnyTFQaxofA2kLI/cDEpWBCCKxlhDyG3ItgZgtG4LI/sbWRQ5iVjjBXCIiFyX6kNAzO6yEFsVeHWApm1s2LhPD17F1jGiNChyhdYZIQsWOt3JhkBOWgMRcmhliO9WeUo19pTAyxRumUqYfxQ9cgN4aCID21QIXsuAY5MWyIpidWVMyp3IiUM0QK5hVkOjD8LDci9VQ3hsE2Rx4MvvecG9HmnD0FM238T721QmC1eXyvwmANApiqxBBtIU0xYggOCBXjqxEHos02krI3m6zXkPOG6SF9zgt0TTCIwAcr2f42gftKIwXDjpCA1DEbuRBcG7sPg1cAP9d2AC/N7m3gIv/C8VuAAQDP+O0xB+NpBwAAAABJRU5ErkJggg==");
    background-repeat: no-repeat;
    background-position: center right 12px;
    background-size: 8px auto;
}
.field-label, .field-error {
    display: block;
    padding-left: 10px;
    margin-bottom: 5px;
    font-size: 12px;
    color: var(--c-gray-04);
}
.field-error {
    margin: 5px 0 0;
    color: var(--c-error);
}
.switcher input[type="checkbox"] {
    position: absolute;
    width: 0;
    opacity: 0;
}
.switcher > span {
    position: relative;
    display: block;
    min-height: 11px;
    padding-top: 4px;
    padding-left: 55px;
    font-size: 12px;
    line-height: 1.3;
    color: var(--c-gray-04);
}
.switcher > span:after, .switcher > span:before {
    content: '';
    display: block;
    position: absolute;
}
.switcher > span:after {
    width: 16px;
    height: 16px;
    top: 4px;
    left: 5px;
    border-radius: 50%;
    background-color: var(--c-main);
    opacity: 1;
    transform: none;
    transition: transform .2s ease-in, background-color .2s ease-in-out;
}
.switcher > span:before {
    width: 46px;
    height: 23px;
    top: 0;
    left: 0;
    border-radius: 20px;
    border: 1px solid var(--c-gray-10);
    background-color: var(--c-white);
    box-shadow: 1px 1px 6px -3px rgba(0,0,0,.4);
    transition: box-shadow .2s ease-in-out, border-color .2s ease-in-out, background-color .2s ease-in-out;
}
.switcher input:checked ~ span:before {
    background-color: var(--c-main);
    box-shadow: 0 0 10px -2px rgba(0,0,0,.25);
}
.switcher input:checked ~ span:after {
    background-color: var(--c-white);
    transform: translateX(20px);
}
.switcher input[disabled] ~ span:after {
    background-color: var(--c-gray-04);
}
.switcher input[disabled]:checked ~ span:after {
    background-color: var(--c-white);
}
.switcher input[disabled]:checked ~ span:before {
    background-color: var(--c-gray-04);
    box-shadow: none;
}

.modal-wrapper {
    display: flex;
    /*align-items: center;
    justify-content: center;*/
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    padding: 0;
    overflow-y: auto;
    background-size: cover;
    z-index: 10;
}
.modal-wrapper:before {
    content: '';
    display: block;
    position: fixed;
    width: 100%;
    height: 100%;
    backdrop-filter: blur(8px);
    background-color: rgba(255, 255, 255, 0.8);
}
.modal-wrapper .modal {
    position: relative;
    max-width: 870px;
    width: calc(100% - 40px);
    max-height: calc(100% - 40px);
    margin: auto;
    padding: 20px;
    background-color: var(--c-white);
    border-radius: 20px;
    box-shadow: 0 0 20px -10px rgba(73, 76, 84, 0.5);
    z-index: 2;
}
.modal-close {
    position: absolute;
    top: 0;
    right: 0;
    width: 40px;
    height: 40px;
    font-family: "Times New Roman", serif;
    font-size: 30px;
    text-align: center;
    border-radius: 0 18px 0 18px;
    border: none;
    color: var(--c-white);
    background-color: var(--c-btn-background);
    transition: background-color .2s ease-in-out;
    cursor: pointer;
    z-index: 2;
}
.modal-close span {
    display: inline-block;
    transform: rotate(45deg);
}
.modal-close:hover {
    background-color: var(--c-btn-background-darken);
}
.modal-wrapper .buttons-wrapper {
    display: flex;
    justify-content: center;
    gap: 15px;
    padding-top: 20px;
}
.modal-wrapper .modal-cols {
    display: flex;
}
.modal-wrapper .col-left {
    display: flex;
    flex-direction: column;
    flex-shrink: 0;
    text-align: center;
    min-width: 500px;
    padding: 0 10px 10px;
}
.modal-wrapper .col-left .field-wrapper {
    max-width: 360px;
    width: 100%;
    margin: 10px auto;
}
.modal-wrapper .col-left .buttons-wrapper {
    margin-top: auto;
}
.modal-wrapper .col-right {
    margin: -20px -20px -20px 20px;
    border-radius: 0 18px 18px 0;
    background-color: var(--c-gray-00);
}
.modal-wrapper .col-right .head {
    position: relative;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    height: 155px;
    padding: 20px 25px;
    border-top-right-radius: 18px;
    font-family: var(--font-main-bold);
    color: var(--c-white);
    background-size: cover;
    background-position: center top -10px;
}
.modal-wrapper .col-right .head:before {
     content: '';
     display: block;
     position: absolute;
     top: 0;
     left: 0;
     right: 0;
     bottom: 0;
     margin: auto;
     background-image: linear-gradient(to bottom, rgba(0,0,0,0) 60%, rgba(0,0,0,.9))
}
.modal-wrapper .col-right span {
    position: relative;
    font-size: 16px;
}
.modal-wrapper .col-right p {
    margin: 0 0 10px;
}
.modal-wrapper .col-right .body {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    padding: 20px 25px 30px;
}
.modal-wrapper .col-right .body .secondary-button {
    margin: 0 auto;
}

.modal-wrapper .col-right img {
    max-width: 200px;
}
.main-button, .secondary-button {
    display: inline-block;
    height: 38px;
    padding: 0 20px;
    font-size: 14px;
    line-height: 38px;
    border: none;
    font-weight: normal;
    text-decoration: none;
    border-radius: 13px;
    font-family: var(--font-main-bold);
    color: var(--c-btn-color);
    background-color: var(--c-btn-background);
    box-shadow: 2px 2px 8px -4px rgba(0, 0, 0, .5);
    transition: background-color .2s ease-in-out, box-shadow .2s ease-in-out, color .2s ease-in-out, border-color .2s ease-in-out;
    cursor: pointer;
}
.main-button:hover, .secondary-button:hover {
     text-decoration: none;
     box-shadow: none;
     background-color: var(--c-btn-background-darken);
}
.main-button:focus, .secondary-button:focus {
     outline: none;
}
.main-button i, .secondary-button i {
    margin-right: 8px;
}
.main-button[disabled], .secondary-button[disabled] {
    cursor: not-allowed;
    opacity: .5;
    box-shadow: none;
}
.secondary-button {
    border: 1px solid var(--c-white);
    color: var(--c-btn-background);
    background-color: var(--c-white);
}
.secondary-button:hover {
     border-color: var(--c-btn-background-darken);
     color: var(--c-btn-background-darken);
     background-color: var(--c-white);
}

@media screen and (max-width: 991px) {
    .modal-wrapper .modal-cols {
        flex-direction: column;
    }
    .modal-wrapper .col-left {
        min-width: 0;
    }
    .modal-wrapper .col-right {
        margin-top: 40px;
        margin-left: -20px;
        border-bottom-left-radius: 18px;
    }
    .modal-wrapper .col-right .head {
        border-top-right-radius: 0;
    }
    .modal-wrapper .buttons-wrapper {
        flex-wrap: wrap;
    }
    .modal-wrapper .buttons-wrapper .main-button {
        flex-basis: 200px;
    }
}
@media screen and (max-width: 479px) {
    .modal-wrapper .modal {
        width: calc(100% - 20px);
        max-height: calc(100% - 20px);
    }
}