.wmax-700px {
    max-width: 700px !important;
}

.h-30 {
    height: 30px !important;
}

.wmax-1200px {
    max-width: 1200px !important;
}

.wmax-400px {
    max-width: 400px !important;
}

@media screen and (min-width: 576px) {
    .login-form {
        width: 25rem !important;
    }
}

.no-display {
    display: none !important;
}

@media screen and (min-width: 1000px) {
    .telegramAuthBlock {
        min-width: 700px !important;
    }

    .paymentsMethodBLock {
        min-width: 500px !important;
    }
}

body {
    font-family: 'Inter' !important;
}

.disabled {
    pointer-events: none;
    cursor: default;
    filter: grayscale(100);
}


.pulse {
    animation: pulse-animation 3s infinite ease-out;
}

@keyframes pulse-animation {
    0% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.2);
    }
    70% {
        transform: scale(0.8);
    }
    100% {
        transform: scale(1);
    }
}

.h-auto-flag {
    height: auto !important;
}


element.style {
}

.form-check:not(.form-check-inline):last-child {
    margin-bottom: 0;
}

.form-check:not(.form-check-inline) {
    margin-bottom: .5rem;
}

.form-check {
    position: relative;
    display: block;
    padding-left: 0rem;
}

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

.custom-switch .custom-control-input:checked ~ .custom-control-label::before, .custom-switch .custom-control-input:disabled:checked ~ .custom-control-label::before {
    background-color: #252b37;
}

.sidebar-content {
    overflow: auto !important;
}

.card-body-plan {
    min-height: 250px !important;
}

@media (max-width: 1000px) {
    .d-none-1000-max {
        display: none !important;
    }

    .pt-5-1000-max {
        padding-top: 5px !important;
    }

    .text-center-1000-max {
        text-align: center !important;
    }
}

@media (max-width: 360px) {
    .d-none-350-max {
        display: none !important;
    }
}

@media (max-width: 770px) {
    .d-none-770-max {
        display: none !important;
    }
}

@media (min-width: 1500px) {
    .col-xl-3-custom {
        -ms-flex: 0 0 25%;
        flex: 0 0 25%;
        max-width: 25%;
    }
}

.custom-control-secondary .custom-control-input:checked ~ .custom-control-label::before,
.custom-control-secondary .custom-control-input:disabled:checked ~ .custom-control-label::before {
    background-color: #45748a;
    border-color: #45748a;
}

.custom-control-dark .custom-control-input:checked ~ .custom-control-label::before,
.custom-control-dark .custom-control-input:disabled:checked ~ .custom-control-label::before {
    background-color: #252b36;
    border-color: #252b36;
}

.custom-control-success .custom-control-input:checked ~ .custom-control-label::before,
.custom-control-success .custom-control-input:disabled:checked ~ .custom-control-label::before {
    background-color: #25b372;
    border-color: #25b372;
}

.custom-control-danger .custom-control-input:checked ~ .custom-control-label::before,
.custom-control-danger .custom-control-input:disabled:checked ~ .custom-control-label::before {
    background-color: #ef5350;
    border-color: #ef5350;
}

.custom-control-warning .custom-control-input:checked ~ .custom-control-label::before,
.custom-control-warning .custom-control-input:disabled:checked ~ .custom-control-label::before {
    background-color: #f58646;
    border-color: #f58646;
}

.custom-control-info .custom-control-input:checked ~ .custom-control-label::before,
.custom-control-info .custom-control-input:disabled:checked ~ .custom-control-label::before {
    background-color: #2cbacc;
    border-color: #2cbacc;
}


.timeline-item {
    padding: 3em 2em 2em;
    position: relative;
    color: rgba(0, 0, 0, 0.7);
    border-left: 2px solid rgba(0, 0, 0, 0.3);
}

.timeline-item p {
    font-size: 1rem;
}

.timeline-item::before {
    content: attr(date-is);
    position: absolute;
    left: 2em;
    font-weight: bold;
    top: 1em;
    display: block;
    font-family: "Roboto", sans-serif;
    font-weight: 700;
    font-size: 0.785rem;
}

.timeline-item::after {
    width: 10px;
    height: 10px;
    display: block;
    top: 1em;
    position: absolute;
    left: -7px;
    border-radius: 10px;
    content: "";
    border: 2px solid rgba(0, 0, 0, 0.3);
    background: white;
}

.timeline-item:last-child {
    -o-border-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.3) 60%, rgba(0, 0, 0, 0)) 1 100%;
    border-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.3) 60%, rgba(0, 0, 0, 0)) 1 100%;
}

pre.sf-dump, pre.sf-dump .sf-dump-default {
    z-index: 1 !important;
}

.w-100-px {
    width: 100px !important;
}

.w-200-px {
    width: 200px !important;
}

.w-300-px {
    width: 300px !important;
}

.w-400-px {
    width: 400px !important;
}

.w-500-px {
    width: 500px !important;
}

.p-8-px {
    padding: 8px !important;
}

.fs-40-px {
    font-size: 40px !important;
}

.fs-30-px {
    font-size: 30px !important;
}

.fs-20-px {
    font-size: 20px !important;
}

.fs-15-px {
    font-size: 15px !important;
}

.fs-12-px {
    font-size: 12px !important;
}

.fs-11-px {
    font-size: 11px !important;
}

.line-through {
    text-decoration: line-through !important;
}

.mw-700-px {
    max-width: 700px !important;
}

.v-center-block {
    margin-top: auto;
    margin-bottom: auto;
}

.w-150-px {
    width: 150px !important;
}

.border-color-red {
    border-color: red !important;
}

.login-bg {
    background: url(/img/bg.jpg) repeat;
}

.border-b-5 {
    border-bottom: 5px black solid !important;
}

.border-t-5 {
    border-top: 5px black solid !important;
}

.cursor-disabled {
    cursor: no-drop !important;
}

.alert-href a {
    color: white;
    text-decoration: underline;
}

.grayscale {
    filter: grayscale(100%);
}

.height-500 {
    height: 500px !important;
}

.height-400 {
    height: 400px !important;
}

.height-300 {
    height: 300px !important;
}

.height-200 {
    height: 200px !important;
}

.height-150 {
    height: 150px !important;
}

.height-100 {
    height: 100px !important;
}

.color-plan-green {
    color: #4caf50 !important;
}

.color-plan-red {
    color: red !important;
}

.fs-25px {
    font-size: 25px !important;
}

/** select2 option custom button styles */
.option-button-ac {
    padding: 0;
    background-color: transparent;
    border: 0;
    appearance: none;
    opacity: .75;
    transition: color ease-in-out .15s, opacity ease-in-out .15s;
    font-size: 1.37506rem;
    font-weight: 400;
    line-height: 1;
    color: #333;
    text-shadow: none;
    text-align: right;
}

.option-body-st {
    clear: both;
    overflow: hidden;
}

.button-group-ac {
    display: inline-block;
    float: right;
}

/** end select2 */

/** стиль для рассылки */
.input-group > .select2-container--bootstrap {
    width: auto !important;
    flex: 1 1 auto;
}

#dialogsList_wrapper .toolbar {
    float: left;
}

/** */

/** стиль для парсинга telegram */
.input-group > .select2-container--bootstrap {
    width: auto !important;
    flex: 1 1 auto;
}

/** */

.pointer-events-disabled {
    pointer-events: none;
}

/** Метки */
.circle-tag {
    height: 20px;
    width: 20px;
    border-radius: 50%;
    text-align: center;
    vertical-align: middle;
    font-size: 500%;
    position: relative;
    display: inline-block;
    margin: 5%;
}

/** END */


.card-max-width-300px {
    max-width: 300px !important;
}

.card-max-width-400px {
    max-width: 400px !important;
}

.card-max-widht-1500px {
    max-width: 1500px !important;
}

.gray-off-block:after {
    width: 100%;
    height: 100%;
    content: '';
    background-color: #8080808a;
    position: absolute;
}

.container-row input {
    width: 20px;
    height: 20px;
    position: absolute;
    margin-top: .3rem;
}

.container-row label {
    color: black;
}

.container-row label:before {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    cursor: pointer;
    display: block;
    content: '';
}

.container-row img {
    width: 50%;
    margin-top: 30px;
}

.container-row .active img {
    opacity: .8
}

.select_month_active {
    background-color: #2196f34d !important;
}

.gradient-border {
    --border-width: 3px;
    position: relative;
    display: flex;
    border-radius: var(--border-width);
    padding: 10px;
    font-size: 14px;
}

.gradient-border::after {
    position: absolute;
    content: "";
    top: calc(-1 * var(--border-width));
    left: calc(-1 * var(--border-width));
    z-index: -1;
    width: calc(100% + var(--border-width) * 2);
    height: calc(100% + var(--border-width) * 2);
    background: linear-gradient(60deg, #5f86f2, #a65ff2, #f25fd0, #f25f61, #f2cb5f, #abf25f, #5ff281, #5ff2f0);
    background-size: 300% 300%;
    background-position: 0 50%;
    animation: moveGradient 4s alternate infinite;
}

@keyframes moveGradient {
    50% {
        background-position: 100% 50%;
    }
}

.center-block {
    display: block;
    margin: auto;
}

.dropdown-menu {
    box-shadow: 0 0.05rem 0.1rem rgb(0 0 0 / 10%);
}
