:root {
    --wt: #fff;
    --wtt: #fff;
    --dt: #303030;
    --wbg: #fff;
    --inp: #f7f7f7c9;
    --dark: rgb(40,40,40);
    --red: red;
    --neutral-dark: #d1d1d1;
    --blue: #007bff;
    --blue-hover: rgb(0 82 170);
    --blue-white: #8ab4f8;
    --success: #28a745;
    --black: #000000;
}
.dark {
    --wbg: rgb(30,30,30);
    --wt: #bdc1c6;
    --dt: rgb(170 170 170);
    --inp: rgb(36 36 36);
    /* transition: .3s; */
}
body {font-family: 'Roboto Flex', sans-serif;font-size: 16px;line-height: 1.55;color: var(--dt);display: flex;flex-direction: column;padding-top: 60px;padding-bottom: 100px;min-height: 100vh;width: 100%;max-width: 100%;background-color: var(--wbg);position: relative;}
body.menu-opened {overflow: hidden;}
body::-webkit-scrollbar {width: 0px;}
body::-webkit-scrollbar-track {box-shadow: inset 0 0 5px grey; border-radius: 0px;}
body::-webkit-scrollbar-thumb {background: #ff0200; border-radius: 0px;}
body::-webkit-scrollbar-thumb:hover {background: #ff0200; }
footer {color: var(--dark);padding: 20px;text-align: center;font-weight: 300;position: absolute;bottom: 0;left: 0;width: 100%;font-size: 14px;display: flex;align-items: flex-end;overflow: hidden;}
.footer-flex {display: flex;align-items: center;justify-content: space-between;}
.footer-flex p {margin: 0;line-height: 1.3;opacity: .7;}
.footer-flex a {color: var(--blue);opacity: 1;}
.footer-flex a>i {margin: 0 0 0 5px;font-size: 80%}
.dark footer {color: var(--wt)}
#content {padding-bottom: 30px;padding-top: 20px;}
.d-flex {display: flex;}
.aic {align-items: center;}
.jcsb {justify-content: space-between;}
a {color: var(--blue);}
a:hover {text-decoration: none}
.fa {font-size: 16px;}
form {margin: 0}
button {border: none;background: transparent;cursor: pointer;padding: 0 15px;color: var(--dt);outline: none;height: 40px;border-radius: 4px;font-size: 15px;min-width: 200px;}
button:focus, input:focus, a:focus, textarea:focus, textarea:focus-visible {outline: none!important}
button span + .fa {margin: 0 0 0 10px}
button i {font-style: normal;}
input, textarea {-webkit-appearance: none;border: none;}
.btn-primary {color: var(--wtt);text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);background-color: rgb(2 124 255);background-repeat: repeat-x;border-radius: 4px;display: inline-flex;align-items: center;justify-content: center;min-height: 34px;}
.btn-primary:hover {background: var(--blue-hover);}
.btn-secondary {text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);}
.btn-danger {text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);height: 34px;display: inline-flex;align-items: center;justify-content: center;}
.none, .languages .list, .example .item .wishlist, .my-popup, .my-popup .tabus, .input .error-info, .input .good-info, 
.my-popup .tabus-switcher.non, .input-big.two>div+div input, .input-big .good-info, .input-big .error-info,
.mobile-navigation .links .languages, .mobile-navigation .links>button.l, .dark .mobile-navigation .links>button.d,
.help-question, .visible-xs {display: none;}
.mobile-menu-closer {z-index: -10;background: transparent;}
.mobile-navigation {position: fixed;top: 0;width: 384px;right: -385px;background: var(--wbg);height: 100%;display: flex;box-shadow: 0 0 3px rgba(30,41,59,0.15);z-index: 14;padding: 100px 35px 20px;transition: .2s;}
.dark .mobile-navigation {background: var(--wbg);}
.mobile-navigation .links {display: flex;align-items: center;justify-content: space-between;padding-top: 15px;border-top: 1px solid #2929292b;position: relative;}
.dark .mobile-navigation .links {border-color: #ffffff2e}
.mobile-navigation .links a {color: var(--dt);display: inline-flex;align-items: center;font-size: 14px;}
.mobile-navigation .links a>span {padding-right: 10px}
.mobile-navigation .links>button {background: var(--dark-reverse);color: var(--wt-rev);display: inline-flex;align-items: center;padding: 0;min-width: unset;height: 34px;}
.dark .mobile-navigation .links>button.l {display: inline-flex;}
.mobile-navigation .mobile-menu {width: 100%;display: flex;flex-direction: column;justify-content: space-between;}
.menu-opened .mobile-navigation {right: 0;}
.menu-opened .mobile-menu-closer {display: flex;position: fixed;top: 0;left: 0;width: 100vw;height: 100dvh;background-color: var(--dark);opacity: .7;z-index: 13;filter: blur(3px);backdrop-filter: blur(20px);-webkit-backdrop-filter: blur(20px);}
.menu-opened header .login .menu-trigger span:nth-child(2) {background: transparent;}
.menu-opened header .login .menu-trigger span:nth-child(1) {transform: rotate(45deg);margin: -4px 0;}
.menu-opened header .login .menu-trigger span:nth-child(3) {transform: rotate(-45deg);margin: -5px 0;}
h1 {font-size: 35px;margin: 0 0 25px;}
h2 {font-weight: 300;margin: 20px 0}
.info-page h2 {margin-top: 50px;}
h3 {font-weight: 300;font-size: 22px;}
.sm-title {font-size: 18px;font-weight: 500;}
header {background-color: var(--dark);color: var(--wt);padding: 10px 0;height: 56px;position: fixed;width: 100%;top: 0;left: 0;z-index: 15;border-top: 1px solid #3d3d3d40;border-bottom: 1px solid #3d3d3d40;}
header .logo {width: 25%;display: flex;align-items: center;}
header .logo a {color: var(--wt);font-size: 24px;font-weight: 500;display: flex;align-items: center;line-height: 1;}
header .logo a>span {display: inline-block;margin: 0 0 4px}
header .logo img.ex {width: fit-content;margin: 0 10px 0 0;width: 32px;}
header .user-area {width: 75%;display: flex;align-items: center;justify-content: space-between;}
header .user-area .links {display: flex;align-items: center;}
header .user-area .links a {color: var(--wt);display: inline-block;line-height: 1.3;}
header .user-area .links a+a {margin: 0 0 0 30px}
header .user-area .links a:hover {text-decoration: none;color: var(--blue-white);}
input::-webkit-input-placeholder {font-weight: 200;font-size: 14px;}
input::-moz-placeholder {font-weight: 200;font-size: 14px;}
input:-ms-input-placeholder {font-weight: 200;font-size: 14px;}
input:-moz-placeholder {font-weight: 200;font-size: 14px;}
textarea::-webkit-input-placeholder {font-weight: 200;font-size: 14px;line-height: 1.3;}
textarea::-moz-placeholder {font-weight: 200;font-size: 14px;line-height: 1.3;}
textarea:-ms-input-placeholder {font-weight: 200;font-size: 14px;line-height: 1.3;}
.dark input::-webkit-input-placeholder {color: rgb(146 146 146 / 49%)}
.dark input::-moz-placeholder {color: rgb(146 146 146 / 49%)}
.dark input:-moz-placeholder {color: rgb(146 146 146 / 49%)}
.dark textarea::-webkit-input-placeholder {color: rgb(146 146 146 / 49%)}
.dark textarea::-moz-placeholder {color: rgb(146 146 146 / 49%)}
.dark textarea:-ms-input-placeholder {color: rgb(146 146 146 / 49%)}
header .login button {height: 34px;border-radius: 4px;width: fit-content;min-width: unset;font-size: 14px;}
header .login button.btn-success {min-width: 150px}
header .login button i {font-style: normal;}
header .login .menu-trigger {margin: 0 0 0 15px;display: flex;flex-direction: column;justify-content: center;align-items: center;background: transparent;padding-left: 0;padding-right: 0;}
header .login .menu-trigger:focus, header .login .menu-trigger:active, header .login .menu-trigger:hover {box-shadow: none}
header .login .menu-trigger span {width: 22px;height: 2px;background-color: var(--wt);display: block;margin: 2.5px;border-radius: 10px;transition: .3s;}
header .login .menu-trigger span:nth-child(2) {transition: 0s}
header .login {display: flex;align-items: center;}
.user-letter {width: 65px;height: 65px;border-radius: 50%;display: inline-flex;align-items: center;justify-content: center;font-size: 22px;font-weight: 500;position: relative;margin: 0 20px 0 0;background: var(--inp);color: var(--dt);border: 1px solid #e0e0e038;}
.home-description {border-radius: 5px;margin: 0 0 35px;padding: 20px 20px 10px;background-color: rgba(59,130,246,0.05);box-shadow: 0 0 3px rgba(30,41,59,0.15);transition: .3s;}
.dark .home-description {color: var(--wt);background: var(--dark);transition: .3s;}
.home-description h1 {font-size: 32px;font-weight: 500;margin: 0 0 15px;}
.home-description b {color: var(--blue);}
.home-description p {margin: 0 0 10px;}
.input {margin: 0 0 15px;position: relative;}
.input input {height: 42px;border-radius: 4px;padding: 0 10px;border: 1px solid #e0e0e038;border-left-width: 2px;background: var(--inp);color: var(--dt);transition: .3s;font-size: 14px;width: 100%;}
.input.with-see>input {padding-left: 60px;}
.input.with-see>button {position: absolute;width: 48px;display: flex;align-items: center;justify-content: center;min-width: fit-content;padding: 0;background-color: #f3f3f3;height: 40px;border-radius: 4px 0 0 4px;margin: 1px;left: 0;top: 0;transition: .3s;}
.dark .input.with-see>button {background: #242424;border-right: 1px solid #4d4d4d;transition: .3s;}
.input.with-see>input+button {background: transparent;left: calc(100% - 40px);width: 40px;border-radius: 0 4px 4px 0;}
.input.good.with-see>button {margin-left: 2px}
.input.with-see>button>span {font-size: 19px;}
.input.with-see>button.active>span {color: var(--blue)}
.input.with-see>button>span.acc {font-size: 21px;}
.input input.iti__tel-input {padding-left: 60px!important}
.input.good input {border-left-color: var(--success);border-left-width: 2px;}
.input.has-error input {border-left-color: var(--red);border-left-width: 2px;}
.input input:focus {border-color: var(--blue);background-color: var(--wt)}
.dark .input input:focus {border-color: #007bff66;background: var(--inp);}
.registration-form button {width: 100%;height: 50px;border-radius: 4px;}
.input-agree {font-size: 12px;}
.input-agree p {padding-left: 33px;cursor: pointer;position: relative;line-height: 1.4;margin: 0 0 25px}
.input-agree p>a {text-decoration: underline;}
.input-agree p:before {content: '';position: absolute;left: 0;width: 20px;height: 20px;border: 1px solid #d2d2d2;border-radius: 3px;}
.input-agree p.active:after {border-color: var(--blue);}
header .login>.languages {margin: 0 30px 0 0;position: relative;display: flex;align-items: center;}
.languages .selected {padding-right: 14px;cursor: pointer;display: flex;align-items: center;position: relative;font-size: 14px;line-height: 1;}
.languages .selected:after {content: '';width: 6px;height: 6px;border-bottom: 1px solid var(--wt);border-right: 1px solid var(--wt);transform: rotate(45deg);right: 0;position: absolute;top: 4px;transition: .2s;}
.languages .active .selected:after {transform: rotate(-135deg);top: 5px;}
.languages .selected img {margin: 0 5px 2px 0;width: 16px;}
.languages .list button {display: flex;align-items: center;margin: 0;padding: 2px 15px;min-width: fit-content;}
.languages .list button>img {margin: 0 10px 0 0;width: 16px;}
.languages .active .list {display: flex;position: absolute;flex-direction: column;background: white;box-shadow: 3px 15px 30px #bebebe, 11px -4px 30px transparent;z-index: 3;right: 0;top: 37px;border-radius: 4px;}
.dark .languages .active .list {background: var(--dark);box-shadow: none;box-shadow: 0px 1px 15px #6f6d6d33;}
.example>.title {margin: 0 0 15px;font-size: 26px;font-weight: 500;color: var(--dt);}
.example .item {padding: 15px;margin: 0 0 10px;border-radius: 4px;display: flex;justify-content: space-between;box-shadow: 0 0 3px rgba(30,41,59,0.15);position: relative;flex-wrap: wrap;justify-content: space-between;}
.dark .example .item {background-color: var(--dark);color: var(--wt);}
.example .item:hover {box-shadow: 0 0 3px rgb(134 177 246 / 70%);}
.example .item .added {opacity: .5;font-size: 12px}
.example .item .some {display: flex;justify-content: space-between;font-size: 12px;align-items: flex-start;margin: 0;flex-direction: column-reverse;}
.example .item .title {font-size: 16px;line-height: 1.3;margin: 0 0 5px;padding-right: 30px;width: 75%;text-decoration: underline;}
.example .item .location, .example .item .reward, .example .item .when {position: relative;padding-left: 25px;}
.example .item .location:before, .example .item .reward:before, .example .item .when:before {content: '';position: absolute;left: 0;top: 3px;background-image: url(../image/pointer.svg);width: 17px;height: 17px;background-size: contain;background-repeat: no-repeat;}
.example .item .reward:before {background-image: url(../image/wallet.svg)}
.example .item .when:before {background-image: url(../image/clock.svg);width: 19px;height: 19px;top: 2px;}
.example .item .info {display: flex;justify-content: flex-start;align-items: flex-end;margin: 0;font-size: 14px;}
.example .item .info span {padding-right: 20px}
.example .item .btns {display: flex;align-items: center;}
.example .item .btns button {height: 34px;border-radius: 4px;}
.example .item .bottom {display: flex;align-items: flex-end;justify-content: space-between;flex-wrap: wrap;width: 100%;}
.example .item .bottom>span {font-size: 12px;}
.example .item .task-btns {display: flex;align-items: center;gap: 5px;}
.example .item .task-btns>a {height: 34px;display: flex;align-items:center;}
.login .btn-primary:not(.menu) {width: 74px}
.my-popup.active {display: flex;align-items:center;justify-content: center;width: 100%;}
.my-popup .rega-back {position: absolute;top: 0;left: 0;width: 100%;height: 100%;z-index: 11;}
.my-popup .modal-body {width: 100%;z-index: 12;max-width: 450px;position: relative;flex: unset;padding: 0;}
.my-popup .close-rega {position: absolute;width: 20px;height: 20px;right: 10px;top: 10px;padding: 0;}
.my-popup .close-rega:before {content: '';position: absolute;width: 100%;height: 2px;background: #e8e8e8;display: block;transform: rotate(45deg);}
.my-popup .close-rega:after {content: '';position: absolute;width: 100%;height: 2px;background: #e8e8e8;display: block;transform: rotate(-45deg);}
.my-popup .close-rega:hover:before, .my-popup .close-rega:hover:after {background: var(--blue);}
.my-popup .tabus.on {display: block;}
.my-popup .title {font-size: 22px;line-height: 1.2;font-weight: 700;margin: 0 0 5px;color: var(--dt);}
.my-popup .after-title {line-height: 1.3;font-size: 14px;}
.my-popup .tabus-switcher {display: flex;align-items: center;margin: 0 0 15px;justify-content: flex-start;}
.my-popup .tabus-switcher button {padding: 0 0 2px;margin: 0 20px 0 0;border-bottom: 2px solid rgba(222, 222, 222, 0.7);font-weight: 200;border-radius: 0;height: fit-content;min-width: unset;}
.dark .my-popup .tabus-switcher button {border-color: rgba(222, 222, 222, 0.3);}
.my-popup .tabus-switcher button.on {border-color: var(--blue);font-weight: 600;}
.dark .my-popup .tabus-switcher button.on {border-color: #007bffa1;}
.my-popup .modal-buttons {display: flex;margin: 20px 0 0;align-items: center;justify-content: flex-start;flex-wrap: wrap;}
.my-popup .modal-buttons button {min-width: unset;}
.my-popup .modal-buttons .forgotten, .my-popup .modal-buttons .remember {font-weight: 300;}
.my-popup .my-checkbox {cursor: pointer;width: 100%;margin: 0 0 20px;position: relative;padding-left: 30px;line-height: 1.3;font-size: 14px;}
.btn-primary.disabled, .btn-primary:disabled {opacity: .5}
.input.has-error {animation: horizontal-shaking 0.35s;}
.input.good:not(.has-error) .good-info {position: absolute;display: inline-flex;right: 10px;top: 12px;height: 18px;width: 18px;align-items: center;justify-content: center;}
.input.has-error .error-info {display: flex;align-items: center;position: relative;margin-bottom: -6px;}
.input.has-error .error-info img, .input.good .good-info img {width: 100%;position: absolute;left: 0;top: 0;background-color: #f9f9f9;}
.dark .input.has-error .error-info img, .dark .input.good .good-info img {background-color: #242424}
.input.has-error .error-info img {width: 18px;height: 18px;right: 10px;left: unset;top: -30px;}
.has-error .error-info-text {visibility: visible;color: #ff0000;border-radius: 0 0 4px 4px;padding: 0;position: relative;z-index: 1;opacity: 1;line-height: 1.3;font-size: 12px;width: 100%;display: flex;justify-content: flex-start;padding-top: 5px;}
.error-info:hover .error-info-text {visibility: visible;opacity: 1;}
.notification {position: fixed;top: 60px;z-index: 10;left: 0;width: 100%;overflow: hidden;display: flex;align-items: center;justify-content: flex-end;padding: 0;}
.notification .flex-row {display: flex;justify-content: flex-end;font-size: 14px;}
.notification .notification-item {margin: 15px 0 15px 15px;z-index: 20;border-radius: 4px;backdrop-filter: blur(12px);box-shadow: 0 3px 10px rgb(0 0 0 / 10%);opacity: 0;transition: .4s;position: relative;background-color: white;}
.dark .notification .notification-item {background: var(--black);}
.notification .notification-item.active {transition: .4s;opacity: 1;}
.notification .notification-item p {margin: 0;line-height: 1.3;}
.notification .notification-item>button {position: absolute;right: 3px;top: 17px;width: 12px;height: 12px;padding: 0;border-radius: 50px;z-index: 5;min-width: unset;}
.notification .notification-item>button:before {content: '';position: absolute;width: 10px;height: 1px;background: #d1d1d1;transform: rotate(45deg);left: 0;top: 5px;}
.notification .notification-item>button:after {content: '';position: absolute;width: 10px;height: 1px;background: #d1d1d1;transform: rotate(-45deg);left: 0;top: 5px;}
.notification .notification-item img {max-width: 25px;margin: 0 15px 0 0;}
.notification .notification-item>div {display: flex;align-items: center;justify-content: space-between;padding: 10px 30px 10px 15px;border-left: 2px solid var(--success);position: relative;border-radius: 4px;}
.notification .notification-item.error>div {border-color: var(--red);}
.breadcrumb {background: transparent;padding-left: 0;margin: 0;padding-right: 0;}
.breadcrumb a {padding: 0 15px 0 20px;position: relative;font-size: 14px;}
.breadcrumb li:nth-child(1) a {padding-left: 0}
.breadcrumb li+li>a:before {content: '';position: absolute;left: 0;top: 5px;width: 6px;height: 6px;border-bottom: 1px solid;border-right: 1px solid;transform: rotate(-45deg)}
.bottom-buttons {padding: 10px 0 0;}
.task-h3 {margin: 30px 0;font-size: 26px;font-weight: 500;color: var(--dt);}
.down-arrow {position: relative;padding-right: 16px;display: inline-flex;cursor: pointer;}
.down-arrow:after {content: '';transition: .2s;position: absolute;width: 10px;height: 10px;border-bottom: 2px solid var(--dt);border-right: 2px solid var(--dt);top: 12px;right: 0;transform: rotate(-45deg);}
.down-arrow.open:after {transition: .2s;transform: rotate(45deg);}
.task-heading {display: flex;align-items: center;justify-content: space-between;}
.task-heading button {width: fit-content;min-width: unset;padding: 0;}
.input-big {display: flex;flex-direction: column;margin: 0 0 25px;position: relative;}
.input-big.two {flex-direction: row;}
.input-big.two>div {display: flex;flex-direction: column;width: fit-content;margin: 0 25px 0 0;}
.input-big.two>div.phone input {padding-left: 60px!important;!importan;!importa;!import;!impor;!impo;!imp;!im;!i;!;}
.input-big.two>div+div {flex-direction: row;align-items: flex-end;}
.input-big.two>div+div label {font-weight: 200;position: relative;padding-left: 35px;cursor: pointer;}
.input-big.two>div+div label:before, .my-popup .my-checkbox:before {content: '';position: absolute;width: 22px;height: 22px;left: 0;top: 2px;border-radius: 4px;border: 1px solid #e0e0e038;background: var(--inp);}
.input-big.two>div+div input:checked + label:after, .my-popup .my-checkbox.active:after {content: '';position: absolute;left: 8px;top: 6px;width: 6px;height: 11px;border-bottom: 2px solid var(--green);display: block;border-right: 2px solid var(--green);transform: rotate(37deg);}
.input-big.two>div+div input:checked + label {font-weight: 500;}
.my-popup .my-checkbox:before {top: -3px;}
.my-popup .my-checkbox.active:after {top: 1px;}
.input-big.has-error .error-info {display: flex;position: absolute;right: 10px;top: 37px;}
.input-big label {font-weight: 600;margin: 0 0 2px;);}
.input-big label>span {color: var(--red);font-weight: normal;padding-left: 3px;}
.input-big input {border: 1px solid #e0e0e038;border-radius: 4px;padding: 5px 15px;height: 42px;background: var(--inp);color: var(--dt);width: 100%;}
.input-big input.iti__tel-input {padding-left: 60px}
.input-big input:focus, .input-big textarea:focus {background: var(--wt)}
.input-big.has-error input {border-left: 2px solid var(--red);animation: horizontal-shaking 0.7s;}
.input-big textarea {border: 1px solid #e0e0e038;border-radius: 4px;padding: 10px 15px;min-height: 250px;color: var(--dt);background: var(--inp);}
.input-big.has-error textarea {border-left: 2px solid var(--red);animation: horizontal-shaking 0.7s;}
.input-big input:focus, .input-big textarea:focus {border-color: var(--blue)}
.task-help {box-shadow: 0px 0px 15px -3px rgba(0,0,0,0.1);border-radius: 5px;padding: 25px;margin: 0 0 50px;background-color: rgba(59, 130, 246, 0.05);box-shadow: 0 0 3px rgba(30, 41, 59, 0.15);}
.dark .task-help {background: var(--dark);}
.task-help h4 {font-size: 16px;font-weight: 600;}
.task-help p + h4 {margin-top: 20px}
.task-help p>b {font-weight: 600;color: var(--blue)}
.task-help .note {background-color: #027cff40;padding: 15px;border-radius: 4px;margin: 0;font-size: 14px;}
.form-btns {margin: 0 0 30px;display: flex;justify-content: flex-end;}
.top-edit {position: relative;}
.input-big.first {width: 70%}
.edit-avatar {position: absolute;right: 25px;top: 8px;}
.edit-avatar .avatar {width: 65px;height: 65px;border-radius: 50%;display: inline-flex;align-items: center;justify-content: center;font-size: 22px;font-weight: 500;position: relative;margin: 0 10px 0 0;background: var(--inp);color: var(--dt);border: 1px solid #e0e0e038;}
.edit-avatar .avatar img {width: 65px;height: 65px;object-fit: cover;object-position: center;border-radius: 100px;}
.edit-avatar .avatar img.svg {background-size: auto;object-fit: contain;width: 40px;}
.edit-avatar .avatar a {display: inline-flex;cursor: pointer;position: absolute;right: -11px;top: 0;border-radius: 50px;background: #027cff;width: 24px;height: 24px;align-items: center;justify-content: center;}
.edit-avatar .avatar a:hover {color: #292929;}
.edit-avatar .avatar a>span {font-size: 18px;color: #fff;}
.slideshow img {max-width: 100%;width: 100%;border-radius: 5px;min-height: 88px;object-fit: cover;}
.header-avatar {display: flex;justify-content: flex-start;margin: 0 0 30px;flex-wrap: wrap;position: relative;align-items: center;}
.header-avatar h3 {width: 100%;margin: 0 0 30px;font-weight: 500;font-size: 20px;display: none;}
.header-avatar button {background: transparent;color: var(--dark);text-shadow: none;position: absolute;top: 3px;right: 0;padding: 0;}
.header-avatar .group {display: flex;flex-direction: column;position: relative;width: calc(100% - 85px);}
.header-avatar .group b {font-weight: 500;position: relative;display: flex;align-items: center;}
.header-avatar .group b>span {font-size: 18px;color: var(--blue);padding: 0 10px 4px 3px;}
.header-avatar .group b>span.no {color: var(--dt);}
.header-avatar .group p {opacity: .5;font-weight: 300;margin: 0;font-size: 14px;line-height: 1.3;}
.header-avatar .group button {left: 0;font-size: 14px;right: unset;padding: 0;min-width: unset;color: var(--blue);top: unset;height: fit-content;position: relative;width: fit-content;display: flex;align-items: center;}
.header-avatar ul {width: 100%;border-radius: 5px;margin: 25px 0;padding: 30px 30px 20px;background-color: rgba(59,130,246,0.05);box-shadow: 0 0 3px rgba(30,41,59,0.15);}
.dark .header-avatar ul {background-color: var(--dark)}
.header-avatar ul>li+li {margin: 15px 0 0;}
.header-avatar ul a {color: var(--dt);display: inline-flex;}
.header-avatar ul a>b.new {display: flex;width: 16px;height: 16px;background-color: darkorange;font-size: 9px;border-radius: 100px;align-items: center;justify-content: center;margin: 0 0 0 8px;font-weight: 400;color: white;}
.header-avatar ul a:hover {color: var(--blue-hover)}
.header-avatar ul a>span {padding-right: 10px;}
.header-avatar .user-logo {width: 60px;height: 60px;margin: 0 20px 0 0;}
.header-avatar .user-logo img {width: 100%;height: 100%;object-fit: cover;border-radius: 100px}
button.big {width: 100%;}
div.nice-select {background-color: var(--inp);border: 1px solid #e0e0e038;font-size: 16px;}
.cookie {position: fixed;bottom: 0;left: 0;width: 100%;display: flex;justify-content: center;opacity: 0;transition: .2s;z-index: -10;align-items: flex-end;}
.cookie.cookie-showed {opacity: 1;transition: .2s;z-index: 99;}
.cookie .cookie-wrapper {display: flex;width: auto;justify-content: center;align-items: center;padding: 1.25rem;border-radius: 5px;background-color: var(--dark);margin: 0 15px 6%;flex-wrap: wrap;gap: 15px;line-height: 1.35;}
.cookie p {margin: 0;color: var(--wt);}
.cookie p>a {color: var(--wt);text-decoration: underline;}
.dark .cookie .cookie-wrapper {background: var(--black)}
span.mark {display: inline-flex;width: 30px;height: 30px;color: #fff;background: #027cff;border-radius: 50px;align-items: center;justify-content: center;margin: 0 10px 0 0;}
.pagination-row {display: flex;align-items: center;margin: 50px 0;flex-direction: column;justify-content: center;}
.pagination-row p {margin: 0;font-size: 14px;text-align: center;opacity: .6}
.pagination-row button {margin: 0 0 25px;}
.pagination-row ul {display: flex;align-items: center;justify-content: center;}
.pagination-row ul>li>a, .pagination-row ul>li>span {display: flex;width: 30px;align-items: center;justify-content: center;font-size: 14px;}
.slideshow-pagination {display: flex;justify-content: center;align-items: center;padding: 15px 0;}
.slideshow-pagination span {width: 15px;height: 4px;}
.slideshow-pagination span {background: var(--dt);box-shadow: none;opacity: .5;}
.slideshow-pagination span.swiper-pagination-bullet-active {background: #027cff;opacity: 1;}
.more-btn {display: flex;margin: 50px 0;justify-content: center;}
.more-btn a {min-width: 240px}
.slideshow .swiper-slide {position: relative}
.slideshow .swiper-slide p {position: absolute;left: 0;top: 0;width: 100%;height: 100%;display: flex;z-index: 5;color: white;align-items: center;justify-content: center;font-size: 38px;}
.banner {background-color: var(--dark);position: relative;overflow: hidden;border-radius: 4px;}
.banner img {width: 70%;transition: 1s;}
.banner p {padding: 0;color: var(--wt);line-height: 1.3;margin: 0;position: absolute;left: 0;bot;top: 0;height: 100%;width: 100%;display: flex;flex-direction: column;align-items: center;justify-content: center;padding-left: 30%;}
.banner p>span {display: block;width: 150px;text-align: center;margin: 0 0 15px;}
.banner p>a {background: #04b70a;height: 34px;border-radius: 4px;width: fit-content;min-width: unset;font-size: 14px;display: inline-flex;align-items: center;justify-content: center;color: #fff;width: 150px;}
.btn-success {color: #fff;background-color: #04b70a;border-color: #04b70a;}
.btn-success:hover, .banner p>a:hover {color: #fff;background-color: #04a009;border-color: #04a009;}
.sidebar-list ul {display: flex;flex-direction: column;padding-top: 20px;}
.sidebar-list ul>li {margin: 0;}
.sidebar-list ul>li>a {border: 1px solid #e0e0e038;display: block;padding: 5px 20px;margin-top: -1px;color: var(--dt);}
.sidebar-list ul>li>a.active {border-color: #017cff}
.full-width {width: 100%;display: flex;justify-content: space-between;}
.one-side {width: 65%;}
.column-sidebar {width: 25%;}

@keyframes horizontal-shaking {
    0% {transform: translateX(0)}
    25% {transform: translateX(5px)}
    50% {transform: translateX(-5px)}
    75% {transform: translateX(5px)}
    100% {transform: translateX(0)}
}

@media screen and (max-width: 1199px) {
    .container {max-width: 1140px;width: 100%}
    #content {height: fit-content;}
}

@media screen and (max-width: 991px) {
    header .user-area .links, .task-heading button {display: none;}
    header .logo {width: 30%;}
    header .user-area {width: fit-content;justify-content: flex-end;}
    .notification .notification-item {width: 100%;margin-left: 0;margin-top: 10px;}
    .notification .notification-item>div {justify-content: flex-start}
    .notification .notification-item>button {right: 10px;}
    header .login button.btn-success {min-width: fit-content}
    .help-question {position: fixed;top: 130px;right: 10px;transition: .2s;display: flex;width: 45px;height: 45px;min-width: unset;padding: 0;background: transparent;color: #fff;border-radius: 50px;align-items: center;justify-content: center;z-index: 10;opacity: .8;animation: horizontal-shaking 3s infinite linear;}
    .scrolled .help-question {transition: .2s;top: 65px;}
    .help-question .material-symbols-rounded {font-size: 46px;color: #027cff;}
    .help-opened {overflow: hidden;}
    .help-opened .column-right {position: fixed;display: flex;top: 0;left: 0;z-index: 10;background: #fff;height: 100dvh;align-items: center;}
    .help-opened .help-question {top: 65px}
    .task-help {box-shadow: none;height: fit-content;margin: 0;border-radius: 0;overflow: auto;}
    .dark .task-help {background-color: var(--wbg)}
    .dark .languages .active .list, .languages .active .list {box-shadow: none!important;background: transparent;}
    .one-side {width: 65%;}
    .column-sidebar {width:30%;}
}

@media screen and (max-width: 768px) {
    .menu-opened {overflow: hidden}
    header .user-area .links, .hide-xs {display: none;}
    header .user-area {justify-content: flex-end}
    .error-info .error-info-text::after {left: 84%;}
    .edit-avatar {right: 0;}
    header .login>.languages {margin: 0 15px 0 0}
    footer {padding-bottom: 20px}
    .footer-flex {flex-direction: column;font-size: 85%;background-color: transparent;color: var(--dark);height: fit-content;}
    header .logo {width: 50%}
    .example .item .added {order: 1}
    .example .item .title {order: 2}
    .example .item .bottom {order: 3;}
    .example .item {flex-direction: column;}
    .more-btn {margin: 30px 0}
    .more-btn a {min-width: 100%;}
    .slideshow .swiper-slide p {font-size: 28px;}
    .full-width {flex-direction: column;}
    .one-side {width: 100%;}
    .column-sidebar {width: 100%;}
    .banner img {width: 150px;}
    .banner p {flex-direction: row;align-items: center;padding-left: 20%;}
    .banner p>span {width: fit-content;margin: 0 25px 0 0;}
}

@media screen and (max-width: 720px) {
    header .user-area .links {display: none;}
    header .user-area {justify-content: flex-end}
}

@media screen and (max-width: 575px) {
    body, div.nice-select {font-size: 14px;}
    header .login button i, .menu-opened .mobile-menu-closer, header .login>.languages, .languages .selected:after {display: none;}
    .login .btn-secondary {min-width: fit-content;}
    header .user-area {width: fit-content}
    header .logo {width: fit-content}
    header .logo img {width: 75px}
    .home-description h1 {font-size: 36px;}
    .task-h3 {font-size: 24px;margin: 20px 0;}
    .input-big.has-error:not(.textarea) .error-info {top: 34px;}
    .input-big.two>div+div label {margin: 0 0 10px}
    .breadcrumb a {padding-right: 5px;padding-left: 15px;}
    .example .item .title {max-width: 100%;width: 100%;margin: 5px 0 10px;padding: 0;}
    .example .item .bottom {align-items: flex-end;}
    .home-description {margin: 0 0 40px}
    .my-popup .modal-body {width: 100}
    .mobile-navigation {width: 100%;padding: 90px 15px 20px;}
    header .logo a {font-size: 20px;font-weight: 400;margin-left: -4px;}
    .header-avatar h3 {font-size: 22px}
    header .logo img.ex {margin: 0 5px 0 0}
    .mobile-navigation .links .languages {display: block;position: relative;}
    .languages .selected {padding: 0}
    .mobile-navigation .links>button {position: absolute;right: 80px;top: 10px}
    .languages .active .list {box-shadow: none;padding-right: 0;background: transparent;top: -110px;z-index: 15;}
    .languages .list button {padding: 0;justify-content: flex-end}
    .languages .selected img {margin-right: 10px}
    .cookie .cookie-wrapper {margin-bottom: 20px}
    .footer-flex p:nth-child(1) {margin-bottom: 5px;}
    .example .item.mine .info {flex-direction: column;align-items: flex-start;}
    .input-big.two.more {flex-wrap: wrap;}
    .input-big.two.more>div:nth-child(1) {width: 100%;}
    .input-big.two.more>div:nth-child(1) input {max-width: 50%;margin: 0 0 20px}
    .input-big.two.more>div {width: fit-content;}
    .form-btns button {width: 100%;}
    .slideshow .swiper-slide p {font-size: 22px;}
    .visible-xs {display: block;}
    .column-left .banner.response {display: none}
    .banner img {width: 30%}
    .banner p {flex-direction: column;}
    .banner p>span {width: 150px;margin: 0 0 15px;font-size: 17px;}
    h1 {font-size: 30px;margin: 0 0 25px}
}

@media screen and (max-width: 456px) {
    .banner p {right: 20%;bottom: 20%}
    .banner img {width: 40%}
}