@media screen and (max-width: 480px) {
    .m-login.m-login--2 .m-login__wrapper .m-login__container {
        max-width: 430px;
        min-width: auto;
    }
}

#antd .ant-picker-input > input {
    color: #575962;
}

#antd .ant-picker-large .ant-picker-input > input {
    font-size: 13px !important;
}

#antd, #antd button, #antd input, #antd optgroup, #antd select, #antd textarea {
    font-family: Poppins, sans-serif !important;
}

.no-image-block {
    height: 141px;
    display: flex;
    justify-content: center;
    background: #efefef;
    flex-direction: column;
    padding: 2rem;
    margin-bottom: 1rem;
}

.form-group > label.required, .form-group > label.required {
    position: relative;
}

.guest .form-group > label.required::before, .guest .form-group .col-form-label.required::before,
.guest .form-group > label.required::before, .guest .form-group .col-form-label.required::before {
    content: "*";
    display: inline-block;
    color: #ff0000;
    margin-right: 2px;
}

.guest .form-group .required-checkbox.required, .guest #company_edit .form-group .required-checkbox.required {
    position: relative;
    padding-right: 10px;
}

.guest .form-group .required-checkbox.required::before, .guest .form-group .required-checkbox.required::before {
    content: "*";
    display: inline-block;
    color: #ff0000;
    position: absolute;
    right: 0;
    top:0;
}

.logged-in .form-group > label.required::after, .logged-in .form-group .col-form-label.required::after,
.logged-in .form-group > label.required::after, .logged-in .form-group .col-form-label.required::after {
    content: "*";
    display: inline-block;
    color: #ff0000;
    margin-right: 2px;
}

.logged-in .form-group .required-checkbox.required, .logged-in #company_edit .form-group .required-checkbox.required {
    position: relative;
    padding-right: 10px;
}

.logged-in .form-group .required-checkbox.required::after, .logged-in .form-group .required-checkbox.required::after {
    content: "*";
    display: inline-block;
    color: #ff0000;
    position: absolute;
    right: 0;
    top:0;
}

.companies-table .company-email {
    display: block;
    max-width: 200px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* cropper - subscription image validation */
#validate_subscription_request_step2 .form-group .col-sm-2 {
    display: none;
}

#validate_subscription_request_step2 .form-group .col-sm-10 {
    width: 100%;
    flex: 0 0 100%;
    max-width: 100%;
}

#validate_subscription_request_step2 .form-group .cropper {
    display: flex;
    flex-flow: column wrap;
    text-align: center;
}

#validate_subscription_request_step2 .form-group .cropper .row {
    width: 100%;
    margin: 0 auto;
    order: 1;
}

#validate_subscription_request_step2 .form-group .cropper .cropper-local {
    width: 100%;
    max-width: 100%;
    flex: 0 0 100%;
}

#validate_subscription_request_step2 .form-group .cropper .cropper-canvas-container {
    min-height: 290px;
}

form[name="validate_subscription_request_step2"] .m-wizard__form .m--align-center {
    position: relative;
}

form[name="validate_subscription_request_step2"] .m-wizard__form .validate-subscription-img-wrapper a {
    font-weight: bold;
}

#validate_subscription_request_step2 .form-group .cropper .cropper-local .btn {
    display: flex;
    margin: 0 auto;
    font-size: 0;
}

form[name="validate_subscription_request_step2"] .m-wizard__form hr {
    display: none;
}

#validate_subscription_request_step2 > .form-group {
    border-bottom: 1px solid rgba(0,0,0,0.1);
    padding-bottom: 1rem;
    margin-bottom: 2rem;
}

.validate-subscription-img-wrapper .btn {
    margin: 0 auto;
}

#validate_subscription_request_step2 .form-group .cropper .cropper-local .btn::after {
    content: "Bewerk afbeelding";
    font-size: 1rem;
}

#validate_subscription_request_step2 .form-group .cropper .cropper-local .btn .fas {
    font-size: 1rem;
    margin-right: 5px;
}

#validate_subscription_request_step2 #validate_subscription_request_step2_subscription .form-group .cropper img, #validate_subscription_request_step2 #validate_subscription_request_step2_subscription .form-group .cropper canvas {
    width: 200px;
    height: 290px;
    padding: 5px;
    border: 1px solid #7b7e8a;
}

/* bulk edit price agreement */
.m-form[name="bulk_edit_price_agreements"] #bulk_edit_price_agreements .form-group:nth-child(odd) {
    margin-bottom: 44px;
}

/* notifications in header */
#m_header_nav .nav-notifications-wrap .bell {
    -webkit-animation: ring 4s .7s ease-in-out infinite;
    -webkit-transform-origin: 50% 4px;
    -moz-animation: ring 4s .7s ease-in-out infinite;
    -moz-transform-origin: 50% 4px;
    animation: ring 4s .7s ease-in-out infinite;
    transform-origin: 50% 4px;
}

#m_header_nav .nav-notifications-wrap {
    position: relative;
}

#m_header_nav .nav-notifications-wrap .unread {
    display: flex;
    width: 17px;
    height: 17px;
    flex-flow: column wrap;
    justify-content: center;
    align-items: center;
    font-size: 0.7rem;
    background: red;
    border-radius: 50%;
    color: #fff;
    font-weight: bold;
    position: absolute;
    right: 0;
    top: 0;
    margin-top: 7px;
    margin-right: -3px;
}

#m_header_nav .nav-notifications-wrap .bell.bell-darkened,
#m_header_nav .nav-notifications-wrap .bell:hover,
#m_header_nav .nav-notifications-wrap .bell:active,
#m_header_nav .nav-notifications-wrap .bell:focus,
#m_header_nav .nav-notifications-wrap .bell:focus-visible,
#m_header_nav .nav-notifications-wrap .bell:focus-within,
#m_header_nav .nav-notifications-wrap .bell:visited {
    animation: none;
}

#m_header_nav .nav-notifications-wrap .bell.bell-darkened::before {
    background: -webkit-gradient(linear, left top, left bottom, color-stop(25%, #ccc), color-stop(50%, #ccc), color-stop(75%, #ccc), to(#ccc));
    background: linear-gradient(180deg, #ccc 25%, #ccc 50%, #ccc 75%, #ccc 100%);
    background-clip: text;
    text-fill-color: transparent;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

@-webkit-keyframes ring {
    0% { -webkit-transform: rotateZ(0); }
    1% { -webkit-transform: rotateZ(30deg); }
    3% { -webkit-transform: rotateZ(-28deg); }
    5% { -webkit-transform: rotateZ(34deg); }
    7% { -webkit-transform: rotateZ(-32deg); }
    9% { -webkit-transform: rotateZ(30deg); }
    11% { -webkit-transform: rotateZ(-28deg); }
    13% { -webkit-transform: rotateZ(26deg); }
    15% { -webkit-transform: rotateZ(-24deg); }
    17% { -webkit-transform: rotateZ(22deg); }
    19% { -webkit-transform: rotateZ(-20deg); }
    21% { -webkit-transform: rotateZ(18deg); }
    23% { -webkit-transform: rotateZ(-16deg); }
    25% { -webkit-transform: rotateZ(14deg); }
    27% { -webkit-transform: rotateZ(-12deg); }
    29% { -webkit-transform: rotateZ(10deg); }
    31% { -webkit-transform: rotateZ(-8deg); }
    33% { -webkit-transform: rotateZ(6deg); }
    35% { -webkit-transform: rotateZ(-4deg); }
    37% { -webkit-transform: rotateZ(2deg); }
    39% { -webkit-transform: rotateZ(-1deg); }
    41% { -webkit-transform: rotateZ(1deg); }

    43% { -webkit-transform: rotateZ(0); }
    100% { -webkit-transform: rotateZ(0); }
}

@-moz-keyframes ring {
    0% { -moz-transform: rotate(0); }
    1% { -moz-transform: rotate(30deg); }
    3% { -moz-transform: rotate(-28deg); }
    5% { -moz-transform: rotate(34deg); }
    7% { -moz-transform: rotate(-32deg); }
    9% { -moz-transform: rotate(30deg); }
    11% { -moz-transform: rotate(-28deg); }
    13% { -moz-transform: rotate(26deg); }
    15% { -moz-transform: rotate(-24deg); }
    17% { -moz-transform: rotate(22deg); }
    19% { -moz-transform: rotate(-20deg); }
    21% { -moz-transform: rotate(18deg); }
    23% { -moz-transform: rotate(-16deg); }
    25% { -moz-transform: rotate(14deg); }
    27% { -moz-transform: rotate(-12deg); }
    29% { -moz-transform: rotate(10deg); }
    31% { -moz-transform: rotate(-8deg); }
    33% { -moz-transform: rotate(6deg); }
    35% { -moz-transform: rotate(-4deg); }
    37% { -moz-transform: rotate(2deg); }
    39% { -moz-transform: rotate(-1deg); }
    41% { -moz-transform: rotate(1deg); }

    43% { -moz-transform: rotate(0); }
    100% { -moz-transform: rotate(0); }
}

@keyframes ring {
    0% { transform: rotate(0); }
    1% { transform: rotate(30deg); }
    3% { transform: rotate(-28deg); }
    5% { transform: rotate(34deg); }
    7% { transform: rotate(-32deg); }
    9% { transform: rotate(30deg); }
    11% { transform: rotate(-28deg); }
    13% { transform: rotate(26deg); }
    15% { transform: rotate(-24deg); }
    17% { transform: rotate(22deg); }
    19% { transform: rotate(-20deg); }
    21% { transform: rotate(18deg); }
    23% { transform: rotate(-16deg); }
    25% { transform: rotate(14deg); }
    27% { transform: rotate(-12deg); }
    29% { transform: rotate(10deg); }
    31% { transform: rotate(-8deg); }
    33% { transform: rotate(6deg); }
    35% { transform: rotate(-4deg); }
    37% { transform: rotate(2deg); }
    39% { transform: rotate(-1deg); }
    41% { transform: rotate(1deg); }

    43% { transform: rotate(0); }
    100% { transform: rotate(0); }
}

.notification-wrapper .release-card {
    text-align: left;
    border-radius: 0;
}

.notification-wrapper .release-card.read-note {
    opacity: 0.6;
}

.notification-wrapper .release-card.read-note .card-title {
    font-weight: normal;
}

.notification-wrapper .release-card:not(:last-of-type) {
    margin-bottom: 0.5rem;
}

.notification-wrapper .release-card ul {
    padding-left: 1.5rem;
}

.notification-wrapper .release-card .card-title {
    font-size: 1.1rem;
    font-weight: bold;
    margin: 0;
}

.notification-wrapper .release-card .link-overlay {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
}

.notification-wrapper .release-card .card-title .fa-check {
    font-size: 0.9rem;
    vertical-align: middle;
}

.release-note-table .release-note {
    font-weight: bold;
}

.release-note-table .release-note.read-note {
    font-weight: normal;
}

/* action header  */
#m_header_nav .action-header .quick-action-header-bg {
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

#m_header_nav .quick-action-header-1 .m-dropdown__arrow  {
    color: #0db4d7;
}

#m_header_nav .quick-action-header-2 .m-dropdown__arrow {
    color: #fec736;
}

/* company data */
.company-data-text {
    color: #7b7e8a;
}

.company-data-text#empty-data-placeholder-color {
    color: #7b7e8a82;
}

/* user card */
#m_header_topbar .m-dropdown__inner .m-dropdown__header .m-card-user {
    width: 100%;
}

#m_header_topbar .m-dropdown__inner .m-dropdown__header .m-card-user .m-card-user__details .m-card-user__email,
#m_header_topbar .m-dropdown__inner .m-dropdown__header .m-card-user .m-card-user__details .m-card-user__name{
    overflow: hidden;
    white-space: nowrap;
    width: 100%;
    display: inline-block;
    max-width: 100%;
    text-overflow: ellipsis;
}

/* price agreements bulk edit form */
form[name='bulk_edit_price_agreements'] #bulk_edit_price_agreements_price:not([disabled])::placeholder {
    color: #575962;
}

form[name='bulk_edit_price_agreements'] input[type='date'][disabled] {
    color: #a7aab1;
}

form[name='bulk_edit_price_agreements'] label[for^="bulk_edit_price_agreements_active"] + .col-sm-10 {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    width: 100%;
}

form[name='bulk_edit_price_agreements'] label[for^="bulk_edit_price_agreements_active"] + .col-sm-10::before {
    content: "\f133";
    font-family: "Font Awesome 5 Pro";
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: .85rem 1.15rem;
    margin-bottom: 0;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.25;
    color: #575962;
    text-align: center;
    white-space: nowrap;
    background-color: #f4f5f8;
    border: 1px solid #ebedf2;
    border-right: none;
    border-radius: 0.25rem 0 0 0.25rem;
}

form[name='bulk_edit_price_agreements'] label[for^="bulk_edit_price_agreements_active"] + .col-sm-10 .form-control {
    position: relative;
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    width: 1%;
    margin-bottom: 0;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

/* order edit form */
form .ant-picker {
    border-color: #ebedf2 !important;
}

form .ant-picker:hover, .m-portlet__body form .ant-picker-focused {
    border-color: #05B1D5 !important;
}

form[action="#"] .row .col-12.col-md-auto.center-content {
    display: flex;
    flex-flow: row wrap;
    justify-content: center;
    align-items: center;
    column-gap: 8px;
}

/* form notice */
.form-required-notice {
    text-align: left;
    color: #AAA;
}

.form-required-notice .star {
    color: #ff0000;
}

/* register form */
#register_step1_product label:not([for])::after, #register_step2_customer .form-group label::before {
    content: "*";
    color: #ff0000;
}

/* color */
.mvs-blue {
    color: #06caf3;
}

.m-topbar .m-topbar__nav.m-nav>.m-nav__item>.m-nav__link .m-nav__link-icon>i:before {
    background: linear-gradient(180deg, #06caf3 25%, #06caf3 50%, #06caf3 75%, #06caf3 100%);
    background-clip: text;
}

/* overflow text */
.text-ellipsis {
    display: block;
    width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* wrapper */
#login-wrapper {
    width: 100%;
}

@media screen and (min-width: 768px) {
    #login-wrapper {
        min-width: 500px;
        max-width: 500px;
    }
}

@media screen and (max-width: 767px) {
    #button-steps-wrapper {
        display: flex;
        flex-flow: row wrap;
        justify-content: center;
        width: 100%;
        max-width: 194px;
        margin: 0 auto;
    }

    .step-4 #button-steps-wrapper {
        max-width: 229px;
    }
}

.form-control {
    font-family: inherit;
}