/* Reset */
html, body, ul, ol, li, dl, dt, dd, p, pre, h1, h2, h3, h4, h5, h6, blockquote, form, fieldset, legend, table, td, th {margin:0;padding:0;}
html, body {width:100%;height:100%}

html {scroll-behavior:smooth;}

body {min-height:100%;margin:0;color:#000;display:flex;flex-direction:column;height:100vh;background:#fff;}

img {margin:0;border-width:0;padding:0;}
a, button {outline:0;color:#17181f;text-decoration:none;}
a {color:#17181f;}
a:hover {text-decoration:none;}
ul {list-style:none;}
p {margin:6px 0;}

h1,h2,h3,h4 {font-weight:700;}

h1 {font-size:40px;font-weight:900;}
h2 {font-size:24px;font-weight:900;}
h3 {font-size:20px;}
h4 {font-size:16px;}

header, footer, nav, section, article {display:block;}

* {outline:none;box-sizing:border-box;font-size:15px;font-family:'Roboto',sans-serif;line-height:1.3;letter-spacing:.025em;}

/* layout */

.main {width:100%;flex-direction:column;flex:1 0 auto;margin:0 auto;}
.container {margin:0 auto;width:1220px;position:relative;padding:0 25px;}

/* header */

header {position:sticky;top:0;z-index:10;background:#fff;}
header.shadow {box-shadow:0 5px 10px rgba(0,0,0,.1);}
header .container {display:flex;flex-direction:row;align-items:center;justify-content:space-between;padding:15px 25px;;}
header ul {display:flex;flex-direction:row;align-items:center;justify-content:space-between;width:520px;}
header ul li a {color:#3b4965;font-weight:700;font-size:16px;}
header ul li.selected a {color:#226df6;font-weight:700;}
header ul li a:hover {text-decoration:underline;color:#226df6;}
header .contacts {display:flex;flex-direction:row;align-items:center;}
header .contacts a.btn {padding:15px 17px !important;}
header .contacts a.mobile-btn {display: none;padding: 12px 24px !important;}
header .contacts .phone {position:relative;padding:13px 17px;display:flex;flex-direction:row;align-items:center;background:transparent;margin-right:10px;border-radius:6px;border:1px solid #3b4965;}
header .contacts .phone img:first-child {margin-right:20px;}
header .contacts .phone:hover {background:#3b4965;}
header .contacts .phone:hover img {filter:invert(1) sepia(1) saturate(0);}
header .contacts .phone .contacts-info {display:none;position:absolute;top:40px;left:-160px;padding-top:20px;}
header .contacts .phone .contacts-info div {box-shadow:0 13px 63px rgba(0,0,0,.06), 0 5.00741px 20.0667px rgba(0,0,0,.0364444), 0 1.05926px 5.13333px rgba(0,0,0,.0235556);border-radius:6px;padding:10px 30px 20px;background:#fff;width:240px;}
header .contacts .phone .contacts-info div span {display:block;margin:10px 0;color:#3b4965;font-weight:500;}
header .contacts .phone .contacts-info div span.title {color:#226df6;font-weight:700;margin:20px 0 5px 0;}
header .contacts .phone:hover .contacts-info {display:block;}

/* footer */

footer {background:#3b4965;padding:30px 0 15px;}
footer .container {display:flex;flex-direction:row;align-items:center;justify-content:space-between;}
footer ul {display:flex;flex-direction:row;align-items:center;justify-content:space-between;width:500px;}
footer ul li a {color:#fff;font-weight:400;font-size:16px}
footer ul li a:hover {text-decoration:underline;}
footer ul.copyright {width:100%;justify-content:flex-start;}
footer ul.copyright li {margin-right:20px;}
footer ul.copyright li, footer ul.copyright li a {color:#fff;font-weight:300;font-size:12px;}
footer ul.copyright li:last-child {margin:0 0 0 auto;}
footer .container-separator {height:1px;background:rgba(255,255,255,.3);margin:30px 0 15px;}

/* sections */

section {margin:50px 0;position:relative;}
section .anchor {position:absolute;top:-120px;}
section h1 {text-align:center;margin:10px 0;}
section p {width:470px;max-width:100%;margin:0 auto;text-align:center;}

/* demo */

section.demo-section {height:455px;background:url(../images/bg.png) 0 0 no-repeat;position:relative;padding:80px;border-radius: 25px;}
section.demo-section h1 {margin:0;text-align:left;width:660px;color:#fff;line-height:1.2;margin-top:15px;}
section.demo-section .renewal {color:#226df6;background:rgba(255,255,255,.8);display:inline-flex;flex-direction:row;align-items:center;font-size:12px;font-weight:500;padding:3px 4px 3px 12px;border-radius:100px}
section.demo-section .renewal span {background:rgba(34,109,246,.3) url(../images/arrows/arrow_right_renewal.svg) 55% 50% no-repeat;width:24px;height:24px;display:block;border-radius:100px;margin-left:10px;}
section.demo-section .buttons {margin:80px 0 0;}
section.demo-section .buttons .btn.btn-white {background:#fff url(../images/icons/desktop.svg) 20px 50% no-repeat;padding-left:50px;}
section.demo-section .freedays {font-size:14px;font-weight:300;color:#bbb;margin-left:10px;}
section.demo-section img {position: absolute;top: 49px;right: 57px;}

/* diff */

section.diff-section {}
section.diff-section .blocks {display:flex;flex-direction:row;align-items:center;justify-content:space-between;flex-wrap:wrap;margin-top:40px;}
section.diff-section .blocks .block {width:375px;border-radius:24px;background:#f6f6f6;padding:30px 40px;display:flex !important;flex-direction:row;align-items:center;margin-bottom:20px;}
section.diff-section .blocks .block img {margin-right:20px;}
section.diff-section .blocks .block span {font-size:18px;font-weight:500;line-height:1.1;}

/* solutions */

section.solutions-section {}
section.solutions-section .blocks {display:flex;flex-direction:row;align-items:center;justify-content:space-between;flex-wrap:wrap;margin-top:40px;border-radius:24px;background:#3b4965;padding:20px 25px;}
section.solutions-section .blocks .block {width:200px;border-radius:12px;background:#fff;padding:15px 25px;position:relative;}
section.solutions-section .blocks .block img {display:block;margin-bottom:5px;}
section.solutions-section .blocks .block span {font-size:16px;font-weight:500;white-space:nowrap;}
section.solutions-section .blocks .block.inactive {background:#e3e5e9;}
section.solutions-section .blocks .block span.soon {font-size:12px;font-weight:500;border:2px dashed #40a45a;color:#40a45a;position:absolute;right:10px;top:10px;padding:4px 10px;border-radius:100px;}

/* sections */

section.tariffs-section {}
section.tariffs-section .tariffs {display:flex;flex-direction:row;justify-content:space-between;margin:30px 0 80px;align-items:stretch;flex-wrap:wrap;}
section.tariffs-section .tariffs .tariff {width:370px;height:650px;display:flex;flex-direction:column;border-radius:24px;background:#fff;box-shadow:0 13px 63px rgba(0,0,0,.06), 0 5.00741px 20.0667px rgba(0,0,0,.0364444), 0 1.05926px 5.13333px rgba(0,0,0,.0235556);padding:30px 50px;}
section.tariffs-section .tariffs .tariff span {display:block;text-align:center;margin-bottom:10px;}
section.tariffs-section .tariffs .tariff .title {font-size:20px;color:#1c222e;}
section.tariffs-section .tariffs .tariff .title b {font-size:100%;font-weight:900;}
section.tariffs-section .tariffs .tariff .price {font-size:36px;color:#3b4965;font-weight:900;}
section.tariffs-section .tariffs .tariff .desc {font-size:14px;color:#226df6;font-weight:400;}
section.tariffs-section .tariffs .tariff img {display:block;margin:60px auto 92px;}
section.tariffs-section .tariffs .tariff .btn {border-radius:100px;padding:12px;width:100%;text-align:center;}
section.tariffs-section .tariffs .tariff ul {margin:20px auto;padding:0 10px;}
section.tariffs-section .tariffs .tariff ul li {padding:10px 0 10px 30px;background:url(../images/icons/check_checked.svg) 0 49% no-repeat;font-size:16px;}
section.tariffs-section .tariffs .tariff ul li.inactive {background:url(../images/icons/check.svg) 0 49% no-repeat;}
section.tariffs-section .tariffs .tariff .btn.btn-white {border:1px solid #3b4965;}

/* contacts */

section.contacts-section {background:url(../images/bg-contacts.png) 0 0 no-repeat;height:331px;padding:40px;border-radius: 25px;}
section.contacts-section h1 {width:800px;text-align:left;line-height:1.1;color:#fff;}
section.contacts-section .form {margin-top:20px;}
section.contacts-section input {padding:20px 15px;border-radius:6px;border:none;background:#e3e5e9;width:240px;margin-right:10px;}
section.contacts-section input:focus {background:#fff;}
section.contacts-section button.send {padding:20px 80px;}
section.contacts-section input[type=checkbox] {display:none;}
section.contacts-section input[type=checkbox] + label {width:26px;height:26px;margin-right:10px;background:url(../images/icons/check_green_white.svg) no-repeat;display:inline-block;}
section.contacts-section input[type=checkbox]:checked + label {width:26px;height:26px;background:url(../images/icons/check_green_white_checked.svg) no-repeat;}
section.contacts-section .agree {margin:10px 0 0 auto;width:330px;display:flex;flex-direction:row;}
section.contacts-section .agree label {width:52px !important;height:26px;}
section.contacts-section .agree span, section.contacts-section .agree span a {color:#fff;font-size:12px;}
section.contacts-section .agree span a {text-decoration:underline;}

/* static */
section.static-section h1 {text-align:left;}
section.static-section p {width:100%;text-align:left;}
section.static-section {margin:30px 0 100px;}
section.static-section .content {margin:30px 20px 0;}
section.static-section .content h2 {margin:25px 0 15px;}
section.static-section .content h3 {font-weight:900;}
section.static-section .content p a:not(.btn) {text-decoration:revert;color:revert;}
section.static-section .content ul {margin-left:30px;}
section.static-section .content ul li {list-style:disc;}

/* error */
section.error-section {margin-top:60px;text-align:center;}
section.error-section h3 {margin:30px 0 10px 0;font-size:30px;}
section.error-section img {width:200px;display:block;margin:0 auto 60px;}
section.error-section img.lock {width:140px;}
section.error-section p {text-align:center;font-size:18px;margin:0 auto 80px;width:auto;}
section.error-section .btn {padding:20px 60px;}

/* login */
section.login-section {}
section.login-section .form-row-single {margin:20px 0 40px;}
section.login-section .form-row-single-column {margin-bottom:20px;}
section.login-section .form-row-single input {padding:10px 16px;font-size:18px;font-weight:400;width:500px;border-radius:4px;border:2px solid #ccc;}
section.login-section .form-row-single input:focus {border:2px solid #21add9;}
section.login-section .form-row-single input[iserror=true] {border:2px solid #ff402b;background:#fff9f8 url(../images/icons/attention.svg) 100% -1px no-repeat;}
section.login-section .form-row-single .error-hint {color:#ff402b;font-size:90%;width:100%;margin:5px 0 0 4px;}

/* profile */
section.profile-section form {margin-top:40px;}
section.profile-section .row {margin:10px 0;display:flex;flex-direction:row;justify-content:space-between;}
section.profile-section .row label {margin:0 5px 5px 0;width:25%;}
section.profile-section .row-wide label {width:100%;}
section.profile-section .row-double label {width:300px;}
section.profile-section .row label span {font-size:14px;margin-bottom:5px;display:block;}
section.profile-section .row label input, section.profile-section .row label select {padding:8px 10px;border-radius:4px;border:2px solid #ccc;width:100%;}
section.profile-section .row label input:focus {border:2px solid #21add9;}
section.profile-section .controls {margin-top:30px;}
section.profile-section .row-total {margin-top:20px;}
section.profile-section .row-total .total {font-size:140%;}
section.profile-section .row-total .total span {display:inline;margin-right:5px;font-size:110%;font-weight:bold;}
section.profile-section .client-steps {margin-bottom:50px;}
section.profile-section .client-steps li {font-size:110%;margin:10px 0}
section.profile-section .client-steps li.done {color:#40a45a;}
section.profile-section .logout {margin-left:30px;color:#226df6;text-decoration:underline;}

/* cookies */

.cookie-notify {background:#fff;position:fixed;left:50%;bottom:20px;margin-left:-600px;z-index:100;display:none;padding:0;width:1200px;border-radius:5px;box-shadow:0 5px 23px -3px rgba(0,0,0,.3);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);}
.cookie-notify-content {display:flex;justify-content:space-between;align-items:center;padding:20px;}
.cookie-notify-content p {margin:0 20px 0 0;font-size:13px;font-weight:300;}
.cookie-notify a {text-decoration:underline;font-size:13px;font-weight:300;}
.cookie-notify button {transition:.4s;padding:13px 30px;}
.cookie-notify button:hover {background:#1c222e;}
.cookie-notify button span {font-size:13px;}

/* form */

.btn {background:#226df6;border-radius:6px;text-transform:uppercase;color:#fff;border:none;font-weight:500;padding:20px 30px;font-size:13px;}
.btn-white {background:#fff;color:#3b4965;}
.btn-green {background:#40a45a;color:#fff;}

/* modal */

.box-modal {position:relative;background:#fff;margin:0 auto;border-radius:24px;display:flex;flex-direction:column;top:50px;padding:30px;}
.box-modal .box-modal-close {position:absolute;right:15px;top:10px;font-size:30px;font-weight:100;cursor:pointer;color:#aaa;}
.box-modal .box-modal-close:hover {color:#333;}
.box-modal .title {}
.box-modal .content {}
.box-modal-error, .box-modal-success, .box-modal-info {width:460px;}
.box-modal-error .title {font-weight:900;font-size:30px;color:#c00;margin-bottom:20px;}
.box-modal-error .content p {font-size:18px;margin:10px 0;}
.box-modal-info .title {font-weight:900;font-size:30px;margin-bottom:20px;}
.box-modal-info .content p {font-size:18px;margin:10px 0;}
.box-modal-success {text-align:center;}
.box-modal-success .content img {display:block;margin:20px auto 40px;}
.box-modal-success .content p {font-size:30px;font-weight:900;line-height:1;margin-bottom:30px;}
.box-modal-success .success {padding:20px 60px;}

/* margins */
/* margins top */
.mt5 {margin-top:5px !important;}
.mt10 {margin-top:10px !important;}
.mt15 {margin-top:15px !important;}
.mt20 {margin-top:20px !important;}
.mt25 {margin-top:25px !important;}
.mt30 {margin-top:30px !important;}
/* margins right */
.mr5 {margin-right:5px !important;}
.mr10 {margin-right:10px !important;}
.mr15 {margin-right:15px !important;}
.mr20 {margin-right:20px !important;}
.mr25 {margin-right:25px !important;}
.mr30 {margin-right:30px !important;}
/* margins left */
.ml5 {margin-left:5px !important;}
.ml10 {margin-left:10px !important;}
.ml15 {margin-left:15px !important;}
.ml20 {margin-left:20px !important;}
.ml25 {margin-left:25px !important;}
.ml30 {margin-left:30px !important;}
/* margins bottom */
.mb5 {margin-bottom:5px !important;}
.mb10 {margin-bottom:10px !important;}
.mb15 {margin-bottom:15px !important;}
.mb20 {margin-bottom:20px !important;}
.mb25 {margin-bottom:25px !important;}
.mb30 {margin-bottom:30px !important;}

/* others */

.link {color:#00e;text-decoration:underline;}
.center {text-align:center;}

.none {display:none !important;}
.block {display:block !important;}

.is-mobile, .is-mobile-flex {display:none !important;}
.is-desktop {display:block !important;}
.is-desktop-flex {display:flex !important;}

/*menu toggle*/
.toggle {
    background: transparent;
    border: none;
    cursor: pointer;
    height: 20px;
    padding: 0;
    display: none;
}

.toggle-lines {
    position: relative;
    border: none;
    padding: 0;
    z-index: 6;
}

.toggle-lines,
.toggle-lines:before,
.toggle-lines:after {
    width: 20px;
    height: 2px;
    content: '';
    transition: transform .3s, width .3s;
    border-radius: 3px;
    background: #000;
    display: block;
    transform: rotate(0);
}

.toggle-lines:before {
    position: absolute;
    transform: translateY(-6px);
    display: block;
    right: 0;
}

.toggle-lines:after {
    content: '';
    position: absolute;
    display: block;
    transform: translateY(6px);
    right: 0;
}


header .menu ul .contacts-info {
    display: none;
}

header .menu ul .contacts-info span  {display:block;margin:10px 0;color:#3b4965;font-weight:500;}
header .menu ul .contacts-info span.title  {color:#226df6;font-weight:700;margin:20px 0 5px 0;}