OwlCyberSecurity - MANAGER

Edit File: style.scss

@keyframes dots {
    0% {
        opacity: 0;
    }
    25% {
        opacity: 0.5;
    }
    50% {
        opacity: 1;
    }
    75% {
        opacity: 0.5;
    }
    100% {
        opacity: 0;
    }
}

@keyframes scaleout {
    0% {
        transform: scale(0);
        -webkit-transform: scale(0);
    }
    100% {
        transform: scale(1);
        -webkit-transform: scale(1);
        opacity: 0;
    }
}

#toplevel_page_my-pearl .wp-menu-image img {
    max-width: 60%;
    height: auto;
    padding-top: 6px;
    opacity: 1;
}

.stm-admin-wrap.about-wrap .about-description {
    margin: 0 0 50px;
    font-size: 16px;
    line-height: 30px;
}

.stm-admin-wrap.about-wrap .stm_theme_info {
    position: relative;
    float: left;
    width: 184px;
    height: 46px;
    margin-top: 20px;
    margin-right: 20px;
    background: url('../img/logo.png') 0 0 no-repeat;
    background-size: contain;
}

.stm-about-text-wrap {
    display: block;
    position: relative;
    overflow: hidden;
}

.stm-admin-wrap.about-wrap .stm_theme_info .stm_theme_version {
    position: absolute;
    top: 0;
    right: 0;
    width: 41px;
    height: 15px;
    line-height: 15px;
    text-align: center;
    font-size: 10px;
    color: #000;
    font-weight: 700;
}

.stm-admin-wrap.about-wrap a:not(.button) {
    color: #0073aa;
}

.stm-admin-wrap.about-wrap .clearfix:after {
    content: '';
    display: block;
    clear: both;
}

.stm-admin-wrap.about-wrap .nav-tab-wrapper {
    padding-top: 0;
    margin: 50px 0;
    background-color: #23282d;
    float: none;
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-around;
}

.stm-admin-wrap.about-wrap .nav-tab-wrapper a {
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    margin-left: 0;
    padding: 16px 10px;
    background-color: transparent !important;
    border-color: transparent !important;
    text-transform: uppercase;
    outline: none !important;
    box-shadow: none !important;
    color: #fff;
    text-align: center;
    border-radius: 0 !important;
    font-size: 13px;
}

.stm-admin-wrap.about-wrap .nav-tab-wrapper.stm-patch-note a {
    padding: 17px 20px 15px;
}

.stm-admin-wrap.about-wrap .nav-tab-wrapper a:hover,
.stm-admin-wrap.about-wrap .nav-tab-wrapper a.nav-tab-active {
    background-color: #0073aa !important;
}

.stm-admin-wrap.about-wrap .nav-tab-wrapper a.nav-tab-active:after {
    display: none;
}

.stm-admin-wrap.about-wrap .stm_importer {
    padding: 0;
    margin: 0 0 20px 0;
    background: transparent;
}

.stm-admin-wrap.about-wrap .nav-tab-wrapper:after {
    content: '';
    clear: both;
    display: block;
}

.stm-admin-wrap.about-wrap h1 {
    margin-right: 0;
    margin-bottom: 30px;
    font-weight: 300;
    font-size: 42px;
}

.stm-admin-wrap.about-wrap .about-text {
    margin: -17px 0 40px 0;
    font-size: 16px;
    line-height: 30px;
    color: #32373c;
}

.stm-admin-wrap.about-wrap #stm_item_registration {
    max-width: 650px;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-align-items: flex-start;
    -ms-align-items: flex-start;
    align-items: flex-start;
}

.stm-admin-wrap.about-wrap #stm_item_registration .stm_item_registration_input {
    position: relative;
    width: 100%;
    margin-right: 15px;
}

.stm-admin-wrap.about-wrap #stm_item_registration .dashicons {
    display: block;
    position: absolute;
    right: 0;
    top: 0;
    font-size: 36px;
    margin: 5px 30px 0 0;
}

.stm-admin-wrap.about-wrap #stm_item_registration .dashicons-post-status {
    font-size: 30px;
    margin: 7px 20px 0 0;
    color: #23282d;
}

.stm-admin-wrap.about-wrap #stm_item_registration .dashicons-yes {
    color: green;
    margin: 5px 20px 0 0;
}

.stm-admin-wrap.about-wrap #stm_item_registration .dashicons-no {
    margin-top: 7px;
    font-size: 30px;
    color: red;
}

.stm-admin-wrap.about-wrap #stm_item_registration input[type="text"] {
    width: 100%;
    height: 40px;
    padding: 10px 70px 10px 15px;
    border: 0;
    box-shadow: none !important;
    background-color: #fff !important;
}

.stm-admin-wrap.about-wrap #stm_item_registration input[type="text"]:focus,
.stm-admin-wrap.about-wrap #stm_item_registration input[type="text"]:active {
    background-color: #fff !important;
}

.stm-admin-wrap.about-wrap #stm_item_registration p.submit {
    margin: 0;
    padding: 0;
}

.stm-admin-wrap.about-wrap .stm-admin-button.stm-admin-large-button {
    min-width: 130px;
    padding: 15px 20px !important;
    height: 40px !important;
    line-height: 9px !important;
    text-transform: uppercase;
    font-size: 16px;
    text-shadow: none !important;
}

.stm-admin-wrap.about-wrap .stm-admin-message {
    display: block;
    padding: 15px;
}

.about-wrap.stm-admin-wrap.stm-system-status table.widefat {
    margin-bottom: 40px;
}

.stm-admin-registration-steps span.dashicons {
    position: relative;
    top: -2px;
    margin-right: 15px;
    vertical-align: middle;
}

.stm-admin-registration-steps p {
    min-height: 105px;
}

.stm-admin-wrap.about-wrap .theme-browser .theme {
    width: 33.3333%;
}

.stm-admin-wrap.about-wrap .theme-browser .theme .theme-actions {
    opacity: 1;
}

.stm-admin-wrap.about-wrap .tgmpa.wrap {
    margin-right: 0;
}

.stm-admin-wrap.about-wrap .tgmpa .tablenav.top,
.stm-admin-wrap.about-wrap .tgmpa > h2 {
    display: none;
}

.about-wrap {
    overflow: hidden
}

.about-wrap .two-col {
    width: 100%
}

.about-wrap .two-col:after {
    content: '';
    display: block;
    clear: both;
}

.about-wrap .about-title {
    margin-right: 0
}

.about-wrap .about-title sup {
    background: #fff;
    color: #666;
    font-size: 33.333%;
    font-weight: 700;
    padding: 5px 10px;
    white-space: nowrap
}

.about-wrap .about-title + p {
    font-size: 1.2em
}

.about-wrap h2.nav-tab-wrapper {
    float: left;
    width: 100%;
    box-sizing: border-box;
    margin-bottom: 1em
}

.about-wrap h2.nav-tab-wrapper .nav-tab {
    float: left;
    font-weight: 400;
    margin-bottom: 0
}

.about-wrap h2.nav-tab-wrapper .nav-tab.hidden {
    display: none
}

.about-wrap h2.nav-tab-wrapper .nav-tab-active, .about-wrap h2.nav-tab-wrapper .nav-tab-active:hover {
    border-bottom: 0
}

.about-wrap h2.nav-tab-wrapper .nav-tab-active {
    position: relative
}

.about-wrap h2.nav-tab-wrapper .nav-tab-active:after {
    content: "";
    display: block;
    position: absolute;
    width: 100%;
    bottom: -1px;
    height: 1px;
    left: 0;
    background: #f1f1f1
}

.about-wrap .notice {
    float: left;
    display: block !important;
    margin-top: 15px;
    margin-bottom: 0;
    width: 100%;
    box-sizing: border-box
}

.about-wrap .last-feature {
    margin-right: 0 !important
}

.about-wrap .panel {
    border-bottom: none;
    width: 100%
}

.about-wrap .panel:first-child {
    display: block
}

.about-wrap .panel .submit {
    clear: both
}

.about-wrap .col {
    margin-bottom: 4.799999999%
}

.about-wrap .screenshot-image {
    text-align: right
}

.about-wrap .screenshot-image img {
    max-width: 100%;
    height: auto
}

.about-wrap .screenshot-image span {
    background: #0074a2;
    color: #fff;
    font-size: .618em;
    text-transform: uppercase;
    padding: .53em 1em;
    position: absolute;
    top: 0;
    right: 0
}

.about-wrap .plugin-card {
    width: 100%
}

.about-wrap .plugin-card .plugin-action-buttons {
    font-size: 13px
}

.about-wrap #envato-market-items {
    margin: 0;
    padding: 0
}

.about-wrap #envato-market-items li {
    background-color: #fff;
    border: 1px solid #dedede;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    min-height: 40px;
    padding: 10px 40px 10px 10px;
    position: relative
}

.about-wrap #envato-market-items li.not-authorized {
    border-color: #dc3232
}

.about-wrap #envato-market-items .item-delete {
    background: 0 0;
    border: none;
    box-shadow: none;
    color: #b3b9be;
    cursor: pointer;
    padding: 0;
    position: absolute;
    right: 0;
    top: 0;
    width: 38px;
    height: 38px
}

.about-wrap #envato-market-items .item-delete:focus, .about-wrap #envato-market-items .item-delete:hover {
    color: #d61c00
}

.about-wrap #envato-market-items .item-delete:focus {
    -webkit-box-shadow: 0 0 0 1px #5b9dd9, 0 0 2px 1px rgba(30, 140, 190, .8);
    box-shadow: 0 0 0 1px #5b9dd9, 0 0 2px 1px rgba(30, 140, 190, .8)
}

#envato-market-dialog-form div.notice, #envato-market-dialog-remove div.notice {
    margin: 0 0 10px !important
}

.envato-card {
    background-color: #fff;
    border: 1px solid #dedede;
    box-sizing: border-box
}

.envato-card.active {
    border-color: #aaa
}

.envato-card .envato-card-top {
    min-height: 140px;
    padding: 20px;
    position: relative
}

.envato-card .envato-card-top .column-icon {
    height: 80px;
    left: 20px;
    margin: 0 20px 20px 0;
    position: absolute;
    top: 20px;
    width: 80px
}

.envato-card .envato-card-top .column-name {
    margin-left: 100px
}

.envato-card .envato-card-top .column-name h4 {
    font-size: 18px;
    line-height: 1.3;
    margin: 0 0 12px
}

.envato-card .envato-card-top .column-name h4 span {
    color: #999;
    display: inline-block;
    font-size: 13px;
    font-weight: 400;
    margin-left: 5px
}

.envato-card .envato-card-top .column-description {
    margin-left: 100px
}

.envato-card .envato-card-top .column-description .description {
    display: block;
    width: 100%
}

.envato-card .envato-card-top .column-description .description.closed {
    max-height: 45px;
    overflow: hidden
}

.envato-card .envato-card-top .column-description .description p:last-child {
    margin: 0
}

.envato-card .envato-card-top .column-description a.read-more {
    margin-top: .5em
}

.envato-card .envato-card-top .column-description a.read-more:active, .envato-card .envato-card-top .column-description a.read-more:focus {
    -webkit-box-shadow: none;
    box-shadow: none
}

.envato-card .envato-card-top .column-description .author {
    margin-bottom: 0
}

.envato-card .envato-card-top .column-update {
    background: #d54e21;
    background: rgba(213, 78, 33, .9);
    color: #fff;
    display: block;
    font-size: 13px;
    font-weight: 400;
    height: 48px;
    line-height: 48px;
    padding: 0 10px;
    position: absolute;
    bottom: 0;
    top: 0;
    left: 0;
    border-bottom: 1px solid rgba(0, 0, 0, .2);
    overflow: hidden;
    width: 100%;
    box-sizing: border-box
}

.envato-card .envato-card-top .column-update.update-complete {
    background: #79ba49;
    background: rgba(121, 186, 73, .9)
}

.envato-card .envato-card-top .column-update a {
    color: #fff;
    outline: 0;
    text-decoration: none
}

.envato-card .envato-card-top .column-update a:hover {
    text-decoration: underline
}

.envato-card .envato-card-top .column-update a:active, .envato-card .envato-card-top .column-update a:focus {
    outline: 0;
    box-shadow: none
}

.envato-card .envato-card-top .column-update .update-now {
    display: block;
    float: left
}

.envato-card .envato-card-top .column-update .update-now:before {
    color: #fff;
    content: '\f463';
    display: inline-block;
    font: 400 20px/1 dashicons;
    margin: 0 5px -1px 0;
    speak: none;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    vertical-align: text-bottom
}

.envato-card .envato-card-top .column-update .updating-message:before {
    content: '\f463';
    -webkit-animation: rotation 2s infinite linear;
    animation: rotation 2s infinite linear
}

.envato-card .envato-card-top .column-update .updated-message:before {
    content: '\f147'
}

.envato-card .envato-card-top .column-update .details {
    display: block;
    float: right
}

.envato-card .envato-card-bottom {
    background-color: #fafafa;
    border-top: 1px solid #dedede;
    clear: both;
    overflow: hidden;
    padding: 12px 20px
}

.envato-card .envato-card-bottom .column-rating {
    float: left;
    margin-top: 4px
}

.envato-card .envato-card-bottom .column-actions {
    float: right
}

.envato-card .envato-card-bottom .column-actions .button {
    margin-left: 10px;
    margin-bottom: 0 !important
}

.envato-card .envato-card-bottom .column-actions .button:first-child {
    margin-left: 0
}

.envato-card .envato-card-bottom .star-rating {
    display: inline;
    font-family: dashicons !important;

}

.envato-card .envato-card-bottom .num-ratings {
    font-size: 13px;
    line-height: 23px
}

.envato-card.active .envato-card-bottom {
    border-top-color: #aaa
}

.envato-card .button-delete {
    color: #a00;
    padding: 0 5px;
    line-height: 2;
    text-decoration: none
}

.envato-card .button-delete:hover {
    color: red;
    border: none
}

@-webkit-keyframes rotation {
    0% {
        -webkit-transform: rotate(0);
        transform: rotate(0)
    }
    100% {
        -webkit-transform: rotate(359deg);
        transform: rotate(359deg)
    }
}

@keyframes rotation {
    0% {
        -webkit-transform: rotate(0);
        transform: rotate(0)
    }
    100% {
        -webkit-transform: rotate(359deg);
        transform: rotate(359deg)
    }
}

@media screen and (min-width: 783px) and (max-width: 1030px) {
    .envato-card .envato-card-bottom .num-ratings {
        display: none
    }
}

@media screen and (min-width: 783px) {
    .about-wrap h2.nav-tab-wrapper .nav-tab-active {
        box-shadow: none
    }

.about-wrap .col {
        float: left
    }

.about-wrap #settings .form-table td, .about-wrap #settings .form-table th {
        float: left;
        display: block;
        width: 100%
    }

.about-wrap #settings .form-table th {
        padding-bottom: 0
    }

.about-wrap #settings .form-table td {
        padding-left: 0;
        padding-right: 0
    }

.about-wrap #plugins .col-1, .about-wrap #plugins .col-2, .about-wrap #settings .col-1, .about-wrap #settings .col-2, .about-wrap #themes .col-1, .about-wrap #themes .col-2 {
        margin-bottom: 4.8%
    }

.about-wrap #plugins .col-1, .about-wrap #settings .col-1, .about-wrap #themes .col-1 {
        clear: both
    }

.about-wrap #plugins, .about-wrap #themes {
        margin-top: 1.618em
    }

.about-wrap p.submit {
        margin-top: 0;
        padding-top: 0
    }
}

@media screen and (max-width: 782px) {
    .about-wrap h2.nav-tab-wrapper {
        border: none;
        padding: 0
    }

.about-wrap h2.nav-tab-wrapper .nav-tab {
        border-bottom: 1px solid #ccc;
        text-align: center;
        margin: 0 0 1%;
        padding: 2%;
        width: 100%;
        box-sizing: border-box
    }

.about-wrap h2.nav-tab-wrapper .nav-tab-active, .about-wrap h2.nav-tab-wrapper .nav-tab-active:hover {
        background: #fff;
        border-bottom: 1px solid #ccc
    }

.about-wrap h2.nav-tab-wrapper .nav-tab-active:after, .about-wrap h2.nav-tab-wrapper .nav-tab-active:hover:after {
        display: none
    }

.about-wrap .col {
        width: 100% !important;
        margin-right: 0 !important
    }

.about-wrap #plugins > div:first-child, .about-wrap #themes > div:first-child {
        margin-top: 0 !important
    }

.about-wrap p.submit {
        float: left;
        margin-top: 1.25em;
        width: 100%
    }

.about-wrap .screenshot-image {
        text-align: left
    }

.about-wrap .screenshot-image img {
        max-width: 100%
    }

.about-wrap .button-delete {
        font-size: 15px
    }

.about-wrap .column-description .description {
        max-height: none !important;
        overflow: visible !important
    }

.about-wrap .column-description a.read-more {
        display: none !important
    }
}

.envato-card .envato-card-top .column-update {
    top: -48px;
    left: -1px;
    right: -1px;
    width: auto;
    border-bottom: 0 !important;
}

/*Styling admin*/
body.motors_page_stm-admin-support,
body.motors_page_stm-admin-plugins,
body.motors_page_stm-admin-demos,
body.motors_page_stm-admin-system-status,
body.toplevel_page_my-pearl {
    height: auto;
    background-color: #ffffff;
}

.stm-admin-message {
    margin: 30px 0 0;
    background-color: red;
    color: #fff;
    font-size: 16px;
    line-height: 30px;
    a {
        color: #fff !important;
        outline: none !important;
    }
}

.stm-admin-wrap.about-wrap h3 {
    font-size: 30px;
    font-weight: 300;
    letter-spacing: -0.2px;
}

.stm-admin-wrap.about-wrap ol {
    margin-left: 15px;
    color: #808080;
    font-size: 14px;
    line-height: 24px;
}

.stm-admin-wrap.about-wrap ol li {
    margin-bottom: 30px;
}

.stm-admin-wrap.about-wrap ol li strong {
    color: #23282d;
}

.stm-admin-row {
    margin: 0 -15px;
}

.stm-admin-row:after {
    content: '';
    clear: both;
    display: block;
}

.stm-admin-two-third {
    float: left;
    padding: 0 15px;
    width: 62%;
}

.stm-admin-one-third {
    float: right;
    padding: 0 15px;
    width: 30%;
    text-align: right;
}

.stm-admin-important-notice .button {
    margin-bottom: 60px;
}

.stm-admin-one-half {
    float: left;
    width: 50%;
}

.stm-admin-one-half-inner {
    padding: 0 15px;
}

.stm-admin-one-half-inner h3 {
    margin-top: 0;
}

.stm-admin-one-half-inner h3 img {

}

.stm-admin-one-half-inner h3 span {
    display: inline-block;
    vertical-align: top;
    min-width: 52px;
}

.stm-admin-one-half-inner {
    margin-bottom: 40px;
}

.stm-admin-one-half-inner p {
    padding-left: 56px;
}

.stm-admin-one-half-inner a {
    margin-left: 56px;
}

.stm-admin-wrap.about-wrap .subsubsub {
    margin-bottom: 15px;
}

.stm-admin-wrap.about-wrap .stm_importer .stm_importer_note strong {
    display: block;
    margin-bottom: 30px;
    font-size: 16px;
    line-height: 30px;
}

.stm-admin-wrap.about-wrap .stm_importer .stm_importer_note p {
    margin-bottom: 30px;
    color: #808080;
}

.stm-admin-demos-screen .stm_importer_options label {
    display: inline-block;
    vertical-align: top;
    margin-right: 20px;
}

.stm-admin-demos-screen .stm_importer_options label span {
    display: block;
    margin-top: 20px;
}

.stm-admin-demos-screen .stm_importer_options label:last-child {
    margin-right: 0;
}

.stm-admin-wrap.about-wrap .stm_importer .stm_importer_options p > strong {
    font-size: 24px !important;
    font-weight: 300 !important;
    letter-spacing: -0.2px !important;
}

.stm-admin-demos-screen {
    overflow: visible;
}

.stm_demo_import_choices {
    display: flex;
    flex-wrap: wrap;
    margin: 0 -15px;
    label {
        display: block;
        position: relative;
        width: 24%;
        margin: 0 0 50px;
        border-radius: 5px;
        cursor: default;
        .inner {
            padding: 0 15px;
        }
        .stm_layout__label {
            display: block;
            font-size: 16px;
            text-align: center;
            padding-top: 30px;
            transition: all 0.3s ease;
        }
        &:after {
            content: '';
            display: block;
            position: absolute;
            top: 0;
            left: 15px;
            right: 15px;
            bottom: 46px;
            background: rgba(0,0,0,0.5);
            opacity: 0;
            border-radius: 5px;
            visibility: hidden;
            transition: all 0.3s ease;
        }
        &.active {
            &:after {
                background: rgba(255,255,255,0.5);
            }
        }
        &.active,
        &:hover {
            .installed,
            .install,
            &:after {
                opacity: 1;
                visibility: visible;
            }
            .stm_layout__label {
                color: #0073aa;
            }
        }
    }
    img {
        width: 100%;
        transform: translateZ(0);
        box-shadow: 0 5px 10px rgba(0, 0, 0, 0.17);
        transition: all 0.3s ease;
        border-radius: 5px;
    }
    .stm_choice_radio_button {
        margin-top: 25px;
        text-align: center;
    }
    .installed,
    .install {
        position: absolute;
        top: 50%;
        left: 50%;
        padding: 15px 30px;
        margin: -48px 0 0 -56px;
        background-color: #fff;
        color: #23282d;
        font-weight: 700;
        font-size: 13px;
        text-transform: uppercase;
        border-radius: 3px;
        z-index: 20;
        opacity: 0;
        cursor: pointer !important;
        visibility: hidden;
        transition: all 0.3s ease;
        &:active,
        &:focus,
        &:hover {
            background: #23b12a;
            color: #fff;
        }
    }
    .installed {
        background: #23b12a;
        color: #fff;
        cursor: default !important;
    }

}

.stm-admin-wrap {
    max-width: 100%;
    margin-left: 0;
    &__envato {
        .two-col {
            .col {
                margin-bottom: 50px;
            }
        }
    }
    &.stm-admin-start-screen {
        .stm-notice {
            .about-description {
                margin-bottom: 30px;
                max-width: 800px;
            }
        }
    }
    .stm-about-text-wrap {
        //max-width: 970px;
        h1 {
            margin: 25px 0;
        }
    }
    &.stm-admin-support-screen {
        .stm-admin-row {
            max-width: 1050px;
        }
    }
}

.stm-admin-wrap.about-wrap .notice {
    display: none !important;
}

.stm-admin-wrap.about-wrap .theme-browser .theme .theme-screenshot {
    padding: 20px;
    max-height: 300px;
}

.stm-admin-wrap.about-wrap .theme-browser .theme .theme-screenshot img {
    position: static;
    max-width: 100%;
    margin-top: 30px;
    max-height: 250px;
    border: 0;
}

.stm-admin-wrap.about-wrap h2 {
    text-align: left;
    font-size: 25px;
}

.stm-admin-wrap.about-wrap .tgmpa.wrap p > a {
    display: none;
}

@media (max-width: 1340px) {
    .stm-admin-one-half {
        width: 100%;
    }

.stm_demo_import_choices {
        label {
            width: 32%;
        }
    }
}

@media (max-width: 878px) {
    .stm-admin-one-third {
        float: left;
        width: 100%;
        text-align: left;
    }

.stm-admin-wrap.about-wrap .nav-tab-wrapper a {
        padding: 15px;
    }
}

@media (max-width: 767px) {
    .stm-about-text-wrap {
        float: left;
        width: 100%;
    }
}

.envato-card .envato-card-bottom .column-actions .load-customize,
.envato-card .envato-card-top .column-update .thickbox.details {
    display: none;
}

.envato-card .envato-card-bottom .column-actions {

}

.vc_license-activation-notice,
.envato-market-notice {
    display: none;
}

.stm-admin-wrap.about-wrap .tgmpa.wrap h2 {
    font-size: 16px;
    line-height: 18px;
    margin: 10px 0;
}

.about-wrap .stm_message img {
    border: 0;
}

.stm-custom-select label {
    display: block;
    margin-bottom: 10px;
}

.stm-custom-select .description {
    display: block;
    margin-top: 10px;
}

.stm-admin-wrap.about-wrap img {
    border: 0;
}

#stm_start_price_patch button {
    margin-bottom: 0;
}

.stm-patch-price-stat {
    display: none;
}

@-webkit-keyframes Gradient {
    0% {
        background-position: 0% 50%
    }
    50% {
        background-position: 100% 50%
    }
    100% {
        background-position: 0% 50%
    }
}

@-moz-keyframes Gradient {
    0% {
        background-position: 0 50%
    }
    50% {
        background-position: 100% 50%
    }
    100% {
        background-position: 0 50%
    }
}

@keyframes Gradient {
    0% {
        background-position: 0 50%
    }
    50% {
        background-position: 100% 50%
    }
    100% {
        background-position: 0 50%
    }
}

a.toplevel_page_my-pearl {
    background: linear-gradient(-45deg, #EE7752,#E73C7E,#23A6D5,#23D5AB) !important;
    -webkit-animation: Gradient 15s ease infinite;
    animation: Gradient 15s ease infinite;
    background-size: 400% 400% !important;
    color: #fff !important;
}

.stm_install__demo_popup {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    opacity: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    visibility: hidden;
    transition: .3s ease;
    z-index: 9999;
    &.active {
        opacity: 1;
        visibility: visible;
    }
    &_close {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: rgba(0,0,0,0.5);
        z-index: 10;
    }
    .inner {
        position: relative;
        max-width: 720px;
        height: auto;
        max-height: 85vh;
        padding: 5px 5px 5px;
        background: #fff;
        text-align: center;
        overflow-y: auto;
        border-radius: 5px;
        z-index: 100;
        .stm_install__demo_popup_close {
            background: transparent;
            width: 60px;
            height: 60px;
            left: auto;
            cursor: pointer;
            &:before,
            &:after {
                content: '';
                display: block;
                position: absolute;
                top: 50%;
                left: 50%;
                margin: -1px 0 0 -10px;
                width: 20px;
                height: 2px;
                background: #fff;
                border-radius: 55px;
                transform: rotate(45deg);
            }
            &:after {
                transform: rotate(-45deg);
            }
        }
        h4 {
            padding: 20px 0;
            margin: -5px -5px 15px;
            background-color: #0073aa;
            color: #fff;
            font-size: 18px;
        }
        .stm_content_status,
        .stm_single_plugin_info {
            padding: 15px 0;
            text-align: left;
            display: flex;
            align-items: center;
            border-top: 1px solid #ccc;
            .installed,
            &.installed {
                .status {
                    color: #03d56b;
                    font-weight: 400;
                }
            }
            .installing,
            &.installing {
                .status {
                    position: relative;
                    padding-right: 20px;
                    color: #444;
                    .loading-dots {
                        opacity: 1;
                        visibility: visible;
                    }
                }
            }
            &:first-child {
                border-top: 0;
            }
            .image {
                max-width: 30px;
                margin-right: 15px;
                img {
                    transform: translateZ(0);
                }
            }
            .title {

}
            .status {
                color: #aaa;
                font-size: 13px;
                margin-left: auto;
                transition: .3s ease;
                .loading-dots {
                    position: absolute;
                    right: 0;
                    top: 3px;
                    width: 15px;
                    height: 15px;
                    border-radius: 50%;
                    box-shadow: none;
                    background-color: #444;
                    opacity: 0;
                    visibility: hidden;
                    animation: scaleout 1.0s infinite ease-in-out;
                    transition: all 0.5s ease-in-out;
                }
            }
        }
        .stm_install_demo_to,
        .stm_install__demo_start {
            display: inline-block;
            margin: 0 15px 25px;
            padding: 14px 30px 16px;
            background: #03d56b;
            color: #fff !important;
            text-decoration: none !important;
            cursor: pointer;
            &.installing {
                background-color: #ccc;
                cursor: not-allowed;
            }
        }
        .stm_install_demo_to {
            background-color: #0073aa;
        }

/* Privacy Policy */
        .privacy_policy {
	        .stm_plugins_status {
			    max-height: 400px;
			    overflow-y: scroll;
			    padding-right: 10px;
                padding-left: 15px;
			}
	        h5 {
			    font-size: 1em;
			    margin: 1em auto;
			}
	        p {
			    text-align: left;
			    margin: 5px 0;
			}
			ul li {
			    text-align: left;
			    margin: 0 0 15px 15px;
			}
			.privacy_policy_button {
			    display: inline-block;
			    margin: 15px 15px 25px;
			    padding: 14px 30px 16px;
			    background: #03d56b;
			    color: #fff !important;
			    text-decoration: none !important;
			    cursor: pointer;
			    &.decline {
				    background: #ececec;
					color: #555 !important;
			    }
			}
        }
    }
}

.stm_demo_import__notice {
    background-color: #fff;
    display: inline-block;
    padding: 10px 30px;
    margin-bottom: 20px;
    border-radius: 4px;
    position: relative;
    top: -16px;
    h4 {
        margin: 5px 0;
        font-size: 15px;
        i {
            color: #23b12a;
            margin-right: 4px;
        }
    }
    p {
        margin: 0;
        font-size: 13px;
        span {
            font-weight: 700;
            text-transform: uppercase;
        }
    }
}

/*Grid CSS*/
.stm_install__demo_popup .inner {
    .stm_content_status,
    .stm_plugins_status {
        display: flex;
        flex-wrap: wrap;
        flex-direction: row;
        & > div {
            display: block;
            width: 25%;
            border: 0;
            text-align: center;
            > * {
                width: 100%;
            }
            .image {
                margin: 0 auto 15px;
            }
            .status {
                display: inline;
            }
        }
    }
    .stm_content_status {
        border: 0;
        margin-bottom: 50px;
        > * {
            width: 100% !important;
            &.image {
                margin: 0 auto 15px;
            }
            &.status {
                display: inline;
                width: auto !important;
                margin: 0 auto;
            }
        }
    }
}
div [class^="stm-admin-wrap"], div [class*=" stm-admin-wrap"],
div [class^="stm-admin-wrap"] div, div [class*=" stm-admin-wrap"] div {
    font-family: inherit !important;
}

#toplevel_page_stm-admin {
    .wp-menu-image {
        img {
            max-width: 22px !important;
            opacity: 1 !important;
        }
    }
}

#adminmenu {
    #toplevel_page_stm-admin {
        .wp-menu-image {
            margin-left: 8px;
            margin-right: 5px;
            max-width: 22px;
            img {
                display: block !important;
                max-width: 100% !important;
                height: auto !important;
                opacity: 1 !important;
            }
        }
    }
}

html body.toplevel_page_stm-admin [class^="stm-"], html body.toplevel_page_stm-admin [class*=" stm-"],
html body.consulting-child-theme_page_stm-admin-plugins [class^="stm-"], html body.consulting-child-theme_page_stm-admin-plugins [class*=" stm-"],
html body.consulting-child-theme_page_stm-admin-demos [class^="stm-"], html body.consulting-child-theme_page_stm-admin-demos [class*=" stm-"],
html body.consulting-child-theme_page_stm-admin-system-status [class^="stm-"], html body.consulting-child-theme_page_stm-admin-system-status [class*=" stm-"],
html body.consulting-child-theme_page_stm-admin-support [class^="stm-"], html body.consulting-child-theme_page_stm-admin-support [class*=" stm-"]

{
    font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif !important;
}

a.enter_site_key_js.button-primary {
    color: #fff !important;
}

//TGM notification
.stm_update_notice {
    background-color: #ffffff;
    padding: 15px;
    font-size: 14px;
    text-align: left;
    margin: 25px 20px 0 2px;
    border-left: 5px solid #71C674
}
.stm_needs_install {
    display: none;
}
.stm_needs_install.notice-visible {
    display: block;
    box-shadow: 0 0 5px rgba(0,0,0,.05);
}
body.appearance_page_tgmpa-install-plugins .stm_needs_install,body.pearl_page_my-pearl-demos .stm_needs_install,body.toplevel_page_my-pearl .stm_needs_install {
    display: none;
}
.stm_update_notice__update {
    position: relative;
    padding-right: 120px;
}
.stm_update_notice__update .button {
    position: absolute;
    top: 9px;
    right: 9px;
}

//Other themes
.other-themes {
    &__wrap_box {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        margin: 0 -15px;
    }
    &__box {
        position: relative;
        width: 33.333333%;
        padding: 0 15px;
        margin: 0 0 30px;
        box-sizing: border-box;
        float: none;
        @media screen and (max-width: 1199px) {
            width: 50%;
        }
        @media screen and (max-width: 640px) {
            width: 100%;
        }
    }
    &__theme {
        position: relative;
        background-color: #fff;
        box-shadow: 0 0 16px #ccc;
        border-radius: 4px;
        img {
            display: block;
            max-width: 100%;
            height: auto;
            border-radius: 4px 4px 0 0;
        }
    }
    &__content {
        padding: 15px 15px 1px;
        div {
            padding: 2px 0;
        }
    }
    &__title {
        font-size: 16px;
        font-weight: 600;
        min-height: 66px;
        text-overflow: ellipsis;
        a {
            text-decoration: none;
            transition: all 0.3s;
            color: #4d4d4d !important;
            &:hover {
                text-decoration: underline;
            }
        }
    }
    &__author {
        font-size: 12px;
        line-height: 18px;
        margin-bottom: 8px;
        color: #999999;
        a {
            font-weight: 700;
            position: relative;
            color: #999999 !important;
            text-decoration: none;
            &:after {
                background-color: #999;
                content: "";
                height: 1px;
                left: 0;
                opacity: 0;
                pointer-events: none;
                position: absolute;
                bottom: -3px;
                transform: translateY(1px);
                transition: all .15s cubic-bezier(.39,.575,.565,1);
                transition-property: opacity,transform;
                width: 100%;
            }
            &:hover {
                text-decoration: none;
                &:after {
                    opacity: 1;
                    transition-delay: .2s;
                    transition-duration: .15s;
                    transform: translateY(-3px) translateZ(0);
                }
            }
        }
    }
    &__price {
        line-height: 18px;
        color: #4d4d4d;
        font-size: 20px;
        font-weight: 700;
    }
    &__sales {
        display: block;
        margin: 4px auto auto 0;
        line-height: 16px;
        font-size: 12px;
        color: #666;
    }
    &__buttons {
        display: flex;
        align-items: center;
        justify-content: flex-end;
        padding: 0 15px 20px;
        a {
            display: flex;
            height: 40px;
            align-items: center;
            justify-content: center;
            padding: 0 20px;
            margin: 0 10px 0 0;
            border-width: 1px;
            border-style: solid;
            border-radius: 2px;
            font-weight: 500;
            transition: all 0.3s;
            text-decoration: none !important;
            font-size: 14px;
            cursor: pointer;
            &.btn_preview {
                border-color: #79b530;
                color: #79b530 !important;
                &:hover {
                    background-color: #79b530;
                    color: #ffffff !important;
                }
            }
            &.btn_purchase {
                border-color: #ccc;
                color: #ccc !important;
                &:hover {
                    background-color: #ccc;
                    color: #ffffff !important;
                }
            }
        }
    }
}