:root {
    --tablet-width: 944px;
    --mobile-width: 440px;
    --container-bg: #F6F8FA;
    --green: #60C350;
    --pink: #FA7C9A;
    --light-pink: #FFEFF8;
    --blue: #3C92FE;
    --black: #393939;
    --dark-gray: #697076;
    --gray: #B4B8BB;
    --light-gray: #E0E0ED;
    --white: #FFFFFF;
    --loader-image: url('../img/oc-loader.gif');
}

.oc-modal-preloader .oc-modal-loader {
    width: 120px;
    height: 120px;
    background-image: var(--loader-image);
    border-radius: 22px;
}

.oc-modal-preloader {
    display: none;
    z-index: 9999;
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
}

.oc-modal-preloader:not(.-hidden) {
    display: flex !important;
}

.oc-modal-preloader.-hidden {
    display: none !important;
}

.oc-modal-backdrop {
    background: rgba(0, 0, 0, .4);
    z-index: 1;
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
}

.oc-modal-wrapper {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
}

.oc-modal-content {
    width: 100%;
    max-width: 510px;
    background-color: transparent;
    padding: 22px 18px 32px 18px;
    border-radius: 22px;
}

.oc-modal-loader {
    width: 120px;
    height: 120px;
    margin: 0 auto;
    border-radius: 22px;
    position: relative;
    background: rgba(255, 255, 255, 0.95);
    background-position: center;
    display: flex;
    align-items: center;
    justify-content: center;
}

.oc-modal-loader * {
    font-size: 62px;
}

.-upm_state_disabled {
    display: none !important;
}

.-upm_state_enabled {
    display: inherit !important;
}