body {
    background: #f5f5f5;
    font-family: "Bergen Sans";
    padding: 0px;
    margin: 0px;
}

.card {
    cursor: pointer;
}

.vybor {
    position: relative;
}

.vybor:hover {
    background: #e0e0e0;
}

.vybor.active:after {
    background: #28a745;
    width: 40px;
    height: 40px;
    content: "\f00c";
    color: white;
    font-family: "Font Awesome 5 Free";
    position: absolute;
    right: 0;
    top: 0px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-weight: 900;
}

.time-flex, #calendar-staf-res {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
    margin-top: 30px;
}

.deact-service-step{
    opacity: 0.5;
}
.staf-list-desc > div{
    height: 54px;
    overflow: hidden;
    position: relative;
}
.staf-list-desc > div:after{
    content: '';
    position: absolute;
    bottom: 0px;
    left: 0px;
    height: 80px;
    background: linear-gradient(180deg, rgba(248, 248, 248, 0) 0%, #F8F8F8 100%);
    width: 100%;
}
.staf-list-desc{
    position: relative;
}
.staf-list-desc > span{
    position: absolute;
    bottom: -15px;
    left: 0px;
    width: 30px;
    height: 30px;
}

.staf-list-desc.active-d>span svg {
      transform: rotate(180deg);
}

.deact {
    opacity: 0.3;
}

.count-total, .total {
    font-size: 1.75rem;
}

.roud-index {
    border-radius: 40px 40px 0px 0px;
    background: #FFF;
    padding: 35px 20px 60px;
}

.city-row {
    cursor: pointer;
    border-radius: 21px;
    background: #F8F8F8;
    display: flex;
    padding: 20px;
    margin-bottom: 15px;
}

.city-row > div:first-child {
    flex: auto;
}

.city-row-name {
    color: #494949;

    font-family: "Bergen Sans";
    font-size: 22px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}

.city-row-desc {
    color: #B3B3B3;

    font-family: "Bergen Sans";
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

.city-title {
    color: #FFF;
    font-family: "Bergen Sans";
    font-size: 35px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    margin: 25px 20px;
}

.city-search {
    border-radius: 21px;
    background: #F8F8F8;
    padding: 22px 20px;
    display: flex;
    margin-bottom: 20px;
}

.city-search input {
    color: #B3B3B3;
    margin-left: 6px;
    font-family: "Bergen Sans";
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    border: unset;
    background: transparent;
    outline: none;
    width: 100%;
}

.city-search > div:first-child {
    flex: auto;
    display: flex;
    align-items: center;
}

.fil-search {
    border-radius: 21px;
    background: #F8F8F8;
    padding: 22px 20px;
    display: flex;
    margin-bottom: 20px;
}

.fil-search input {
    margin-left: 6px;
    color: #B3B3B3;

    font-family: "Bergen Sans";
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    border: unset;
    background: transparent;
    outline: none;
    width: 100%;
}

.fil-search > div:first-child {
    flex: auto;
    display: flex;
    align-items: center;
}

.panel-staf-name svg,.rec-fl-name svg{
    margin-left: 10px;
}

.fil-search-but{
    display: flex;
    align-items: center;
}

.rec-fl-img img{
    width: 100px;
}

.logo-poster{
    display: flex;
    justify-content: center;
}

.logo-poster img{
    width: 150px;
}

.poster {
    padding: 80px 15px 60px;
    background-repeat: no-repeat;
    position: relative;
}

.mini-w {
    width: 484px;
    padding: 0px;
}

.fils-title {
    color: #FFF;
    font-family: "Bergen Sans";
    font-size: 35px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    margin: 25px 20px;
}

.fils-city-but {
    border-radius: 12px;
    background: #F26210;
    padding: 10px 30px;
    margin-left: 20px;
    margin-bottom: 25px;
    display: inline-block;
}

.staf-list-time-date {
    margin-top: 13px;
    color: #B3B3B3;
    font-family: "Bergen Sans";
    font-size: 15px;
    font-style: normal;
    font-weight: 100;
    line-height: normal;
}

.fils-city-but span {
    color: #FFF;

    font-family: "Bergen Sans";
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

.fils-tabs {
    display: flex;
    margin-bottom: 30px;
}

.fils-tabs > div {
    width: 50%;
    text-align: center;
    padding-bottom: 9px;
    cursor: pointer;
}

.fils-tabs > div .fils-tabs-name {
    color: #B3B3B3;
    text-align: center;
    font-family: "Bergen Sans";
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

.fils-tabs-name.active {
    color: #494949;
    border-radius: 2px;
    font-weight: 600;
    border-bottom: 2px solid #F26210;
}

.add-services-n {
    cursor: pointer;
}

.show-text-help{
    padding: 0px 24px;
    overflow: hidden;
}

.box-fils {
    cursor: pointer;
    border-radius: 21px;
    background: #F8F8F8;
    margin-bottom: 15px;
    overflow: hidden;
}

.box-fils-desc {
    color: #B3B3B3;

    font-family: "Bergen Sans";
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

.box-fils-d >div:last-child{
    flex-shrink: 0;
}

.box-fils-name {
    color: #494949;

    font-family: "Bergen Sans";
    font-size: 18px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}

.box-fils img {
    width: 100%;
}

.box-fils-d {
    display: flex;
    padding: 20px;
}

.box-fils-d > div:first-child {
    flex: auto;
}

.serv-row {
    border-radius: 21px;
    background: #F8F8F8;
    display: flex;
    padding: 18px 24px;
    align-items: center;
    margin-bottom: 15px;
    cursor: pointer;
    flex-wrap: wrap;
}

.serv-row .serv-row-nm > div:first-child {
    width: 57px;
}

.serv-row-name {
    color: #494949;

    font-family: "Bergen Sans";
    font-size: 22px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    margin-left: 20px;
}

.rec-fl-name {
    color: #FFF;
    cursor: pointer;
    font-family: "Bergen Sans";
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}

.rec-fl-desc {
    color: #B3B3B3;

    font-family: "Bergen Sans";
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

.rec-fl {
    padding: 0px 20px;
    display: flex;
    justify-content: space-between;
    margin-bottom: 20px;
}

.acii {
    color: #494949;

    font-family: "Bergen Sans";
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    margin-top: 48px;
    margin-bottom: 30px;
}

.alert-help {
    display: flex;
    margin-bottom: 35px;
}

.alert-help > div:last-child {
    color: #B3B3B3;
    margin-left: 19px;

    font-family: "Bergen Sans";
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

.add-staf .zak {
    color: #FFF;
    font-family: "Bergen Sans";
    font-size: 36px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    margin: 42px 20px 28px;
}

.panel-staf-name {
    cursor: pointer;
    color: #FFF;
    font-family: "Bergen Sans";
    font-size: 22px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}

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

.panel-staf-w1 {
    width: 16px;
}

.panel-staf-w2 {
    width: 50px;
    margin: 0px 15px;
    flex-shrink: 0;
}

.panel-staf-w2 img {
    width: 100%;
}

.service-v-desc.active-d>span svg{
    transform: rotate(180deg);
}

.panel-staf-desc span {
    color: #B3B3B3;
    font-family: "Bergen Sans";
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

.staf-list-avatar {
    flex-shrink: 0;
    width: 63px;
    height: 63px;
    overflow: hidden;
    border-radius: 10px;
    background: #eaeaea;
}

.staf-list-avatar img {
    width: 100%;
}

.staf-list-name {
    color: #494949;
    font-family: "Bergen Sans";
    font-size: 22px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    margin-left: 17px;
}

.staf-list {
    border-radius: 21px;
    background: #F8F8F8;
    padding: 36px 20px;
    margin-bottom: 10px;
}

.staf-list-w1 {
    display: flex;
}

.staf-list-time {
    display: flex;
    margin-top: 13px;
    overflow-x: scroll;
    gap: 20px;
}
#calendar-staf-res .deactive-time {
    background: #ededed78 !important;
}
.staf-list-time > div {
    flex-shrink: 0;
    border-radius: 20.5px;
    border: 1px solid #F2F2F2;
    background: #FFF;
    color: #B3B3B3;
    text-align: center;
    font-family: "Bergen Sans";
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    padding: 11px 25px;
    margin-bottom: 4px;
}

.service-v {
    overflow: hidden;
    border-radius: 21px;
    background: #F8F8F8;
    padding-bottom: 36px;
    margin-bottom: 15px;

}

.service-v-w1 {
    display: flex;
    padding: 20px 24px;
}

.service-v-price {
    color: #F26210;
    font-family: "Bergen Sans";
    font-size: 18px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    padding: 0px 24px;
}

.service-v-w1 > div:first-child {
    flex: auto;
}

.service-v-desc {
    color: #B3B3B3;
    font-family: "Bergen Sans";
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    padding: 5px 0px;
    position: relative;
}

.add-services .zak, #auth .zak,#codeauth .zak{
    color: #FFF;
    font-family: "Bergen Sans";
    font-size: 35px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    padding: 48px 20px 15px;
}

#auth_lk .zak,#codeauth_lk .zak,#profile_account .zak{
    color: #FFF;
    font-family: "Bergen Sans";
    font-size: 35px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    padding: 48px 20px 15px;
}

.service-v-name {
    color: #494949;
    font-family: "Bergen Sans";
    font-size: 18px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}

.cat {
    display: flex;
    padding: 0px 20px 25px;
    overflow-x: scroll;
}

.cat > div {
    flex-shrink: 0;
    border-radius: 12px;
    background: #F2F2F2;
    padding: 10px 20px;
    color: #B3B3B3;
    font-family: "Bergen Sans";
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    margin-right: 10px;
}

.cat > div.active {
    background: #F26210;
    color: white;

}

.service-v-poster img {
    width: 100%;
}

.service-v-desc div {
    height: 54px;
    overflow: hidden;
    position: relative;
}

.service-v-desc div:after {
    content: '';
    position: absolute;
    background: linear-gradient(180deg, rgba(248, 248, 248, 0.00) 50%, #F8F8F8 100%);
    height: 100%;
    width: 100%;
    top: 0px;


}

.service-v-desc > span {
    position: absolute;
    bottom: -10px;
    left: 0px;
}

.alert-serv-w4 {
    margin-left: 10px;
}

.alert-serv-w3 {
    color: #494949;
    text-align: right;
    font-family: "Bergen Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}

.alert-serv-w2 {
    color: #B3B3B3;
    font-family: "Bergen Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    flex: auto;
}

.alert-serv-w1 {
    color: #494949;
    font-family: "Bergen Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    margin-right: 10px;
}

.alert-serv-d {
    display: flex;
    width: 100%;
    align-items: center;
}

.alert-serv {
    position: sticky;
    bottom: 30px;
    width: auto;
    padding: 25px 20px;
    border-radius: 30px 30px 0px 0px;
    border: 1px solid #F2F2F2;
    background: #F8F8F8;
}

.alert-serv-but {
    border-radius: var(--button-radius);
    background: var(--button-bg);
    box-shadow: var(--button-shadow);
    color: var(--button-color);
    padding: 19px 0px;
    text-align: center;
    margin-top: 18px;
    font-family: "Bergen Sans";
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    cursor: pointer;
}

.add-calendar .zak {
    color: #FFF;
    font-family: "Bergen Sans";
    font-size: 26px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    padding: 22px 20px;
}

.staf-active{
    flex-wrap: nowrap;
}

.staf-active .serv-row-ww22{
    flex-shrink: 0;
}

.add-calendar .air-datepicker-cell.-current-, .air-datepicker-cell.-current-.-focus- {
    color: black ;
}
.add-calendar .air-datepicker-cell.-my-current- {
     color: red !important;
     font-weight: 700;
}
.add-calendar .air-datepicker-cell.-selected- {
    border-radius: 16px;
    background: var(--datepicker-selected-bg) !important;
    color: var(--datepicker-selected-color) !important;
}

.add-calendar .air-datepicker-cell.-selected-.-focus- {
    background: var(--datepicker-selected-bg) !important;
    color: var(--datepicker-selected-color) !important;
}

.add-calendar .air-datepicker {
    width: 100%;
    border: unset;
}

.add-calendar .air-datepicker-nav {
    border: unset;
}

.add-calendar .air-datepicker-nav--action path {
    stroke: #F26210;
}

.add-calendar .air-datepicker-nav--action {
    background: #F8F8F8;
}


.staf-list.active {
    border: 2px solid var(--staf-list-active-color);
}

.calendar-staf-res {
    margin-top: 30px;
}

#calendar-staf-res > div {
    border-radius: 13px;
    border: 1px solid #F2F2F2;
    background: #F8F8F8;
    color: #B3B3B3;
    text-align: center;
    font-family: "Bergen Sans";
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    padding: 7px 0px;
    width: 100%;
    margin-bottom: 15px;
    display: flex;
    flex-wrap: wrap;
    padding: 0px 24px 36px;
    justify-content: space-around;
}

#calendar-staf-res > div > div[data-id] {
    border-radius: 20.5px;
    border: 1px solid #F2F2F2;
    background: #FFF;
    width: 32%;
    padding: 11px 0px;
    text-align: center;
    margin-bottom: 4px;
    cursor: pointer;
}

#calendar-staf-res > div > div.name {
    width: 100%;
    color: #494949;
    font-family: "Bergen Sans";
    font-size: 22px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    text-align: left;
    margin-top: 40px;
    margin-bottom: 15px;

}

.serv-row-close {
    border-radius: 6px;
    background: #F2F2F2;
    width: 27px;
    height: 27px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.serv-row-ww1 {
    flex: auto;
    margin-left: 13px;
}

.serv-row-ww1-name {
    color: #494949;

    font-family: "Bergen Sans";
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}

.serv-row-ww1-slog {
    color: #B3B3B3;

    font-family: "Bergen Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

.serv-row-ww22 {
    width: 57px;
    height: 57px;
    overflow: hidden;
    border-radius: 12px;
}

.serv-row-ww22 img {
    width: 100%;
}

#calendar-staf-res .active {
    background: var(--calendar-form-bg) !important;
    color: var(--calendar-form-color);
}

#services .active {
    border: 2px solid #f26210;
}

.step-serv-row-w1-time {
    color: #494949;
    font-family: "Bergen Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    margin-right: 10px;
}

.step-serv-row-w1 {
    display: flex;
}

.btn-go-to-fil{
    box-shadow: var(--button-shadow);
    border-radius: var(--button-radius);
    background: var(--button-bg);
    color: var(--button-color);
    outline: none;
    border: none;
    margin: 0px 3px 13px;
    padding: 3px 10px;
    cursor: pointer;
}

.step-serv-row-w1-price {
    color: #494949;
    font-family: "Bergen Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    margin-right: 10px;
}

.copir{
    text-align: center;
    color: var(--copir);
    margin-top: -35px;
    position: relative;
}

.step-serv-row {
    width: 100%;
    border-radius: 12px;
    background: #F2F2F2;
    height: 2px;
    margin: 10px 0px;
}

.step-serv-row-hh {
    width: 100%;
    display: flex;
}

.step-serv-row-hh > div:first-child {
    flex: auto;
}

.serv-service-list {
    width: 100%;
}

.serv-row-nm {
    width: 100%;
    display: flex;
}

.send-order {
    position: sticky;
    bottom: 30px;
    width: auto;
    left: 0px;
    border-radius: 30px 30px 0px 0px;
    border: 1px solid #F2F2F2;
    padding: 20px 20px;
    background: #F8F8F8;
    cursor: pointer;
}

.send-order div {
    box-shadow: var(--button-shadow);
    border-radius: var(--button-radius);
    background: var(--button-bg);
    color: var(--button-color);
    padding: 19px 0px;
    text-align: center;
    font-family: "Bergen Sans";
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}

.inform-send {
    color: #494949;
    font-family: "Bergen Sans";
    font-size: 26px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    margin: 40px 0px 15px;
}

.send-order-form .zak {
    color: #FFF;
    font-family: "Bergen Sans";
    font-size: 26px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    padding: 22px 20px;
}

.form-inp {
    border-radius: 15px;
    background: #F8F8F8;
    outline: unset;
    border: none;
    padding: 15px 18px;
    color: #B3B3B3;
    font-family: "Bergen Sans";
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    margin-bottom: 10px;
    flex: auto;
}

.inform-slog {
    color: #B3B3B3;
    font-family: "Bergen Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    margin-bottom: 10px;
}

.form-send input[type="submit"],.sendform_data {
    border-radius: var(--button-radius);
    background: var(--button-bg);
    box-shadow: var(--button-shadow);
    width: 100%;
    border: none;
    outline: unset;
    color: var(--button-color);
    text-align: center;
    font-family: "Bergen Sans";
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    padding: 19px 0px;
    margin-top: 20px;
    cursor: pointer;
}

.order-total {
    border-radius: 15px;
    background: #F8F8F8;
    display: flex;
    justify-content: space-between;
    margin-top: 30px;
    padding: 19px 18px;
}

.order-total > div {
    color: #494949;
    font-family: "Bergen Sans";
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}

.staf-empty, .time-empty, .serv-empty {
    flex-wrap: unset;
}

.rec-fl-name, .panel-staf-name {
    display: flex;
    align-items: center;
}

.active-d > div {
    height: auto;
}

.active-d div:after {
    background: none;
}

.sus-seans-rec-but {
    border-radius: var(--button-radius);
    background: var(--button-bg);
    box-shadow: var(--button-shadow);
    padding: 19px 0px;
    text-align: center;
    color: var(--button-color);
    margin-top: 18px;
    font-family: "Bergen Sans";
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    cursor: pointer;
}

.sus-seans-rec-img {
    display: flex;
    justify-content: center;
}

.sus-seans-rec-name {
    margin-top: 18px;
}

.sus-seans-rec .zak {
    color: #FFF;
    font-family: "Bergen Sans";
    font-size: 35px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    padding: 48px 20px 15px;
}

.user_auth {
    position: absolute;
    top: 29px;
    display: flex;
    align-items: center;
    gap: 10px;
    right: 25px;
    cursor: pointer;
}

.user_auth-b{
    font-family: 'Bergen Sans';
    font-style: normal;
    font-weight: 400;
    font-size: 12px;
    line-height: 16px;
    color: #B3B3B3;
}


@media (max-width: 768px) {
    .mini-w {
        width: 100%;
    }
}

.minus-serv {
    display: none;
}

.service-v.active .minus-serv {
    display: block;
}

.service-v.active .pls-serv {
    display: none;
}

.lk-title{
    font-family: 'Bergen Sans';
    font-style: normal;
    font-weight: 700;
    font-size: 26px;
    line-height: 35px;
    color: #FFFFFF;
    margin: 25px 20px;
}

.lk-but{
    font-family: 'Bergen Sans';
    font-style: normal;
    font-weight: 700;
    font-size: 16px;
    line-height: 21px;
    text-align: center;
    box-shadow: var(--button-shadow);
    color:var(--button-color);
    background: var(--button-bg);
    border-radius: var(--button-radius);
    height: 59px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 30px;
    cursor: pointer;
}

.lk-title-b{
    font-family: 'Bergen Sans';
    font-style: normal;
    font-weight: 400;
    font-size: 12px;
    line-height: 16px;
    color: #B3B3B3;
}
.lk-phone-row{
    display: flex;
}
.lk-phone-input{
    padding: 0px 20px;
    background: #F8F8F8;
    border-radius: 15px;
    border: none;
    outline: none;
    font-family: 'Bergen Sans';
    font-style: normal;
    font-weight: 400;
    font-size: 12px;
    line-height: 16px;
    color: #B3B3B3;
    height: 46px;
    margin-top: 10px;
    flex: auto;
}

.lk-policy{
    display: flex;
    margin-top: 10px;
    gap: 10px;
}

#map{
    width: 100%;
    height: 400px;
}

.lk-policy-text{
    font-family: 'Bergen Sans';
    font-style: normal;
    font-weight: 400;
    font-size: 12px;
    line-height: 16px;
    color: #B3B3B3;
}

.cat > div {
    cursor: pointer;
}

.form-inp-row{
    display: flex;
}

.codeinput{
           display: flex;
           flex-wrap: wrap;
           gap: 20px;
           justify-content: center;
margin-top: 25px;
margin-bottom: 30px;
       }

       .codeinput > div{
           height: 56px;
           width: 56px;
           border: 1px solid #ccc;
           border-radius: 10px;
           overflow: hidden;
       }

       .codeinput > div input{
        border: none;
        height: 100%;
        width: 100%;
        /* display: block; */
        text-align: center;
        font-size: 20px;
        border-radius: 10px;
        outline: none;
        -webkit-appearance: none;
        margin: 0px;
        padding: 0px;
       }

       .codeinput-slogan{
          margin-bottom: 20px;
       }

       .codeinput-title{
          font-size: 20px;
       }

       .roud-index .edit-a a{
          color: black;
       }

       .reapit-code{
        color: black;
       }

       #fountainG{
        position:relative;
        width:234px;
        height:28px;
        margin:auto;
    }
    
    .fountainG{
        position:absolute;
        top:0;
        background-color:var(--loader-color);
        width:28px;
        height:28px;
        animation-name:bounce_fountainG;
            -o-animation-name:bounce_fountainG;
            -ms-animation-name:bounce_fountainG;
            -webkit-animation-name:bounce_fountainG;
            -moz-animation-name:bounce_fountainG;
        animation-duration:1.5s;
            -o-animation-duration:1.5s;
            -ms-animation-duration:1.5s;
            -webkit-animation-duration:1.5s;
            -moz-animation-duration:1.5s;
        animation-iteration-count:infinite;
            -o-animation-iteration-count:infinite;
            -ms-animation-iteration-count:infinite;
            -webkit-animation-iteration-count:infinite;
            -moz-animation-iteration-count:infinite;
        animation-direction:normal;
            -o-animation-direction:normal;
            -ms-animation-direction:normal;
            -webkit-animation-direction:normal;
            -moz-animation-direction:normal;
        transform:scale(.3);
            -o-transform:scale(.3);
            -ms-transform:scale(.3);
            -webkit-transform:scale(.3);
            -moz-transform:scale(.3);
        border-radius:19px;
            -o-border-radius:19px;
            -ms-border-radius:19px;
            -webkit-border-radius:19px;
            -moz-border-radius:19px;
    }
    
    #fountainG_1{
        left:0;
        animation-delay:0.6s;
            -o-animation-delay:0.6s;
            -ms-animation-delay:0.6s;
            -webkit-animation-delay:0.6s;
            -moz-animation-delay:0.6s;
    }
    
    #fountainG_2{
        left:29px;
        animation-delay:0.75s;
            -o-animation-delay:0.75s;
            -ms-animation-delay:0.75s;
            -webkit-animation-delay:0.75s;
            -moz-animation-delay:0.75s;
    }
    
    #fountainG_3{
        left:58px;
        animation-delay:0.9s;
            -o-animation-delay:0.9s;
            -ms-animation-delay:0.9s;
            -webkit-animation-delay:0.9s;
            -moz-animation-delay:0.9s;
    }
    
    #fountainG_4{
        left:88px;
        animation-delay:1.05s;
            -o-animation-delay:1.05s;
            -ms-animation-delay:1.05s;
            -webkit-animation-delay:1.05s;
            -moz-animation-delay:1.05s;
    }
    
    #fountainG_5{
        left:117px;
        animation-delay:1.2s;
            -o-animation-delay:1.2s;
            -ms-animation-delay:1.2s;
            -webkit-animation-delay:1.2s;
            -moz-animation-delay:1.2s;
    }
    
    #fountainG_6{
        left:146px;
        animation-delay:1.35s;
            -o-animation-delay:1.35s;
            -ms-animation-delay:1.35s;
            -webkit-animation-delay:1.35s;
            -moz-animation-delay:1.35s;
    }
    
    #fountainG_7{
        left:175px;
        animation-delay:1.5s;
            -o-animation-delay:1.5s;
            -ms-animation-delay:1.5s;
            -webkit-animation-delay:1.5s;
            -moz-animation-delay:1.5s;
    }
    
    #fountainG_8{
        left:205px;
        animation-delay:1.64s;
            -o-animation-delay:1.64s;
            -ms-animation-delay:1.64s;
            -webkit-animation-delay:1.64s;
            -moz-animation-delay:1.64s;
    }
    
    
    
    @keyframes bounce_fountainG{
        0%{
        transform:scale(1);
            background-color:var(--loader-color);
        }
    
        100%{
        transform:scale(.3);
            background-color:rgb(255,255,255);
        }
    }
    
    @-o-keyframes bounce_fountainG{
        0%{
        -o-transform:scale(1);
            background-color:var(--loader-color);
        }
    
        100%{
        -o-transform:scale(.3);
            background-color:rgb(255,255,255);
        }
    }
    
    @-ms-keyframes bounce_fountainG{
        0%{
        -ms-transform:scale(1);
            background-color:var(--loader-color);
        }
    
        100%{
        -ms-transform:scale(.3);
            background-color:rgb(255,255,255);
        }
    }
    
    @-webkit-keyframes bounce_fountainG{
        0%{
        -webkit-transform:scale(1);
            background-color:var(--loader-color);
        }
    
        100%{
        -webkit-transform:scale(.3);
            background-color:rgb(255,255,255);
        }
    }
    
    @-moz-keyframes bounce_fountainG{
        0%{
        -moz-transform:scale(1);
            background-color:var(--loader-color);
        }
    
        100%{
        -moz-transform:scale(.3);
            background-color:rgb(255,255,255);
        }
    }

.preload-roud{
    position: fixed;
    width: 484px;
    height: 100%;
    top: 0px;
    left: 0px;
    display: flex;
    align-items: center;
}    

#codeauth .roud-index{
    position: relative;
}

.profile_account-row1{
    gap: 20px;
    align-items: center;
    background: #F8F8F8;
border-radius: 15px;
padding: 21px 17px;
display: flex;
margin-bottom: 15px;
cursor: pointer;
}

.profile_account-col2-title{
    font-family: 'Bergen Sans';
font-style: normal;
font-weight: 600;
font-size: 22px;
line-height: 21px;
color: #494949;
margin-bottom: 5px;
}

.profile_account-col2-phone{
    font-family: 'Bergen Sans';
font-style: normal;
font-weight: 400;
font-size: 12px;
line-height: 16px;
color: #B3B3B3;
}

.profile_account-col1-avatar{
    position: relative;
    display: flex;
}

.profile_account-col1-avatar span{
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0px;
    display: flex
;
    justify-content: center;
    align-items: center;
    font-size: 22px;
    font-weight: bold;
}

.profile_account-row2-services{
    background: #F8F8F8;
border-radius: 15px;
padding: 21px 17px;
display: flex;
margin-bottom: 15px;
justify-content: space-between;
align-items: center;
gap: 20px;
cursor: pointer;
}


.profile_account-row2-services-col2{
    flex: auto;
    font-family: 'Bergen Sans';
font-style: normal;
font-weight: 600;
font-size: 22px;
line-height: 21px;
color: #494949;
}

.profile_account-row2-services-col2-exit{
    color: var(--profile_account-exit-color);
}

.profile_account-row2-services.exit-user svg rect{
    fill:var(--profile_account-svg-color);
}

.line-bottom{
    margin-bottom: 50px;
}



.profile_account-row2-services-col1,.profile_account-row2-services-col3{
   display: flex;
}

.history_order-type{
    font-family: 'Bergen Sans';
    font-style: normal;
    font-weight: 400;
    font-size: 17px;
    line-height: 16px;
    color: #B3B3B3;
    margin-bottom: 15px;
}

#history_order .zak{
    color: #FFF;
    font-family: "Bergen Sans";
    font-size: 35px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    padding: 40px 20px 15px;
}

.res-now-oder-col1{
    background: #F8F8F8;
    border-radius: 15px;
    padding: 20px 15px;
}

.res-now-oder-col1-block1{
    display: flex ;
    gap: 20px;
    margin-bottom: 15px;
}

.res-now-oder-col1-block1-staf{
    font-family: 'Bergen Sans';
    font-style: normal;
    font-weight: 600;
    font-size: 17px;
    line-height: 21px;
    color: #494949;
}

.res-now-oder-col1-block1-staf-t{
    font-family: 'Bergen Sans';
    font-style: normal;
    font-weight: 400;
    font-size: 12px;
    line-height: 16px;
    color: #B3B3B3;
}

.res-now-oder-col1-block2{
    display: flex;
    gap: 20px;
    margin-bottom: 15px;
    align-items: center;
    padding-bottom: 15px;
    border-bottom: 2px solid #F2F2F2;
}

.res-now-oder-col1-block2-time{
    font-family: 'Bergen Sans';
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 16px;
    color: #494949;
    margin-bottom: 5px;
}

.res-now-oder-col1-block2-adr{
    font-family: 'Bergen Sans';
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 16px;
    color: #B3B3B3;
}

.res-now-oder-col1-block3{
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 15px;
}

.res-now-oder-col1-block3-name{
    font-family: 'Bergen Sans';
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 18px;
    color: #494949;
    margin-bottom: 5px;
    width: 100%;
}

.res-now-oder-col1-block3-price{
    font-family: 'Bergen Sans';
    font-style: normal;
    font-weight: 700;
    font-size: 16px;
    line-height: 19px;
    color: #494949;
    margin-right: 20px;
}

.res-now-oder-col1-block3-time{
    font-family: 'Bergen Sans';
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 18px;
    color: #B3B3B3;
}

.res-now-oder-col1-block4{
    justify-content: flex-end;
    display: flex;
    gap: 20px;
}

.res-now-oder-col1-block4-reap{
    border-radius: 15px;
    background: #F26210;
    padding: 19px 0px;
    text-align: center;
    color: white;
    margin-top: 18px;
    font-family: "Bergen Sans";
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    cursor: pointer;
    width: 50%;
}

.res-now-oder-col1-block4-rev{
    border-radius: 15px;
    background: #494949;
    padding: 19px 0px;
    text-align: center;
    color: white;
    margin-top: 18px;
    font-family: "Bergen Sans";
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    cursor: pointer;
    width: 50%;
}
.res-now-oder-col1-block1-avatar{
    width: 57px;
    height: 57px;
    overflow: hidden;
    border-radius: 12px;
}
.res-now-oder-col1-block1-avatar img {
    width: 100%;
}


.air-datepicker-body--cells .air-datepicker-cell.active {
    color: var(--datepicker-cells-color);
}

.review_name_panel{
    margin-top: 25px;
display: flex;
justify-content: space-between;
margin-bottom: 20px;
margin-left: 20px;
margin-right: 20px;
align-items: center;
}

.review_name_panel-row1{
    font-family: 'Bergen Sans';
font-style: normal;
font-weight: 700;
font-size: 20px;
line-height: 27px;
color: #FFFFFF;
margin-bottom: 5px;
}
.review_name_panel-row2{
    font-family: 'Bergen Sans';
    font-style: normal;
    font-weight: 400;
    font-size: 12px;
    line-height: 16px;
    color: #B3B3B3;
    margin-bottom: 5px;
}

.review_name_panel-row3 span{
    font-family: 'Bergen Sans';
    font-style: normal;
    font-weight: 400;
    font-size: 12px;
    line-height: 16px;
    color: #B3B3B3;
}

.review_name_panel-row3-desc{
    font-family: 'Bergen Sans';
    font-style: normal;
    font-size: 14px;
    line-height: 19px;
    color: #494949;
    margin-bottom: 25px;
}

.review_name_panel-row4-h1{
    font-family: 'Bergen Sans';
    font-style: normal;
    font-weight: 700;
    font-size: 20px;
    line-height: 27px;
    margin-bottom: 20px;
    color: #494949;
    margin-top: 50px;
}

.review_name_panel-row4-br-row1{
    display: flex;
    gap: 15px;
    align-items: center;
    margin-bottom: 15px;
}

.review_name_panel-row4-br-row1-name{
    font-family: 'Bergen Sans';
    font-style: normal;
    font-weight: 600;
    font-size: 16px;
    line-height: 21px;
    color: #494949;
}

.review_name_panel-row4-br-row1-time-slg{
    font-family: 'Bergen Sans';
    font-style: normal;
    font-weight: 400;
    font-size: 12px;
    line-height: 16px;
    color: #B3B3B3;
}

.review_name_panel-row4-br-row1-time{
    display: flex;
    align-items: center;
    gap: 10px;
}

.review_name_panel-row4-br{
    background: #F8F8F8;
    border-radius: 15px;
    padding: 20px 20px;
    margin-bottom: 20px;
}

#review_order .roud-index{
    min-height: 300px;
}

#result-reviews{
    margin-bottom: 30px;
}

.review_name_panel-row3-avatar{
    width: 80px;
    height: 80px;
    overflow: hidden;
    border-radius: 50%;
    position: relative;
}

.review_name_panel-row3-avatar img{
    position: absolute;
    max-width: 100%;
    display: block;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    margin: auto;
}
.review_add_h1{
    font-family: 'Bergen Sans';
    font-style: normal;
    font-weight: 600;
    font-size: 14px;
    line-height: 19px;
    text-align: center;
    color: #494949;
    margin-bottom: 20px;
}
.review_add_star_no{
    display: flex;
    gap: 10px;
    justify-content: center;
}

.review_add_star-rows{
    margin-bottom: 40px;
}

.roud-index_podlev2_form-inp-row{
    display: flex ;
}

.roud-index_podlev2_form-inp-row-form-inp{
    border-radius: 15px;
    background: #F8F8F8;
    outline: unset;
    border: none;
    padding: 15px 18px;
    color: #B3B3B3;
    font-family: "Bergen Sans";
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    margin-bottom: 10px;
    flex: auto;
}

.roud-index_podlev2_form-inp-row-form-text{
    border-radius: 15px;
    background: rgb(248, 248, 248);
    outline: unset;
    border: none;
    padding: 15px 18px;
    color: rgb(179, 179, 179);
    font-family: "Bergen Sans";
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    margin-bottom: 10px;
    flex: 1 1 auto;
    height: 107px;
}

.roud-index_podlev2_form-symbol{
    font-family: 'Bergen Sans';
    font-style: normal;
    font-weight: 400;
    font-size: 12px;
    line-height: 16px;
    color: #B3B3B3;
    margin-left: 10px;
    margin-bottom: 50px;
}

.review_add_star_no svg.active path {
    fill: #FFC107; /* Золотой цвет */
  }
  
.review_add_star_no svg path {
    transition: fill 0.2s ease;
}

#result-reviews .review_name_img_bl1{
    width: 42px;
    height: 42px;
    background: #eeeeee;
    border-radius: 7px;
    font-size: 22px;
    display: flex;
    justify-content: center;
    align-items: center;
}