/* Google fonts loading from one.com CDN */
/* open-sans-regular - latin */
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 400;
    src: local(''),
    url('https://fonts-static.cdn-one.com/fonts/google/open-sans/open-sans-regular.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
    url('https://fonts-static.cdn-one.com/fonts/google/open-sans/open-sans-regular.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* open-sans-600 - latin */
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 600;
    src: local(''),
    url('https://fonts-static.cdn-one.com/fonts/google/open-sans/open-sans-600.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
    url('https://fonts-static.cdn-one.com/fonts/google/open-sans/open-sans-600.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

/* montserrat-regular - latin */
@font-face {
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 400;
    src: local(''),
    url('https://fonts-static.cdn-one.com/fonts/google/montserrat/montserrat-regular.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
    url('https://fonts-static.cdn-one.com/fonts/google/montserrat/montserrat-regular.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* montserrat-500 - latin */
@font-face {
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 500;
    src: local(''),
    url('https://fonts-static.cdn-one.com/fonts/google/montserrat/montserrat-500.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
    url('https://fonts-static.cdn-one.com/fonts/google/montserrat/montserrat-500.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

/* montserrat-600 - latin */
@font-face {
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 600;
    src: local(''),
    url('https://fonts-static.cdn-one.com/fonts/google/montserrat/montserrat-600.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
    url('https://fonts-static.cdn-one.com/fonts/google/montserrat/montserrat-600.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

/* ******* General CSS ******* */

#proisp-wrap {
    color: #3c3c3c;
    font-family: 'Open Sans', sans-serif;
    margin: 27px 40px 40px 20px;
    -webkit-font-smoothing: antialiased; /* to match font weight exactly like figma in mac) */
}
#proisp-wrap,
#proisp-wrap p:not(.error.default-password-nag p),
#proisp-wrap .inner-wrap .oc-show-hide a {
    font-size: 16px;
    line-height: 24px;
}
#proisp-wrap p:last-child:not(.error.default-password-nag p) {
    margin-bottom: 0;
}
#proisp-wrap .page-description {
    margin-top: 16px;
    margin-bottom: 49px;
    padding: 0;
    max-width: 580px;
    font-weight: 400;
    line-height: 24px;
}
#proisp-wrap h1,
#proisp-wrap h2,
#proisp-wrap h3 {
    margin: 0;
    padding: 0;
    color: #3C3C3C;
}
#proisp-wrap h2 {
    font-size: 24px;
    line-height: 32px;
}
#proisp-wrap .oc-block {
    padding-bottom: 24px;
}
#proisp-wrap .oc-block:last-child {
    padding-bottom: 0;
}
#proisp-wrap .main-heading span {
    font-size: 12px;
    line-height: 20px;
    font-weight: 500;
    font-family: 'Montserrat', sans-serif;
    border: 1px solid #0078C8;
    border-radius: 4px;
    display: inline-block;
    color: #0078C8;
    vertical-align: top;
    padding: 1px 8px;
    background-color: #fff;
    margin-left: 12px;
    margin-top: 7px;
    letter-spacing: .2px;
}
#proisp-wrap .hide,
#proisp-wrap .inner-wrap .oc-show-hide a {
    display: none
}
#proisp-wrap .oc_sticky_footer {
    display: none
}
#proisp-wrap .inner-wrap a.oc-link,
#proisp-wrap .inner-wrap a.oc-link:focus {
    outline: none;
    text-decoration: none;
    box-shadow: none;
    color: #0078C8;
    font-size: 16px;
}
.one_wrap a:not(.error.default-password-nag p a) {
    border-bottom: 1px solid transparent;
    color: #0078C8;
}
#proisp-wrap .one-hr {
    margin-top: 2.5em;
}
.one_wrap,
.one-logo .textleft,
.wrap_inner .nav-tab {
    font-family: 'Open Sans', sans-serif;
}
.one-logo {
    padding: 0 !important;
    display: flex;
}

/********  Starts: one.com common styles (re-design) ********/
#proisp-wrap .oc-page-header {
    margin-top: 27px;
}
#proisp-wrap .main-heading {
    font-family: 'Open Sans', sans-serif;
    font-size: 32px;
    font-style: normal;
    font-weight: 600;
    line-height: 40px;
    letter-spacing: -0.60px;
    text-align: left;
}
#proisp-wrap .inner-wrap {
    background-color: #ffffff;
    padding: 24px;
}
#proisp-wrap .inner-wrap .main-heading {
    margin-left: 18px;
}
#proisp-wrap .oc-btn,
#proisp-wrap .oc-btn:focus,
#proisp-wrap .oc-btn:active,
#proisp-wrap a.oc-btn {
    outline: none;
    box-shadow: none;
    border: none;
    display: inline-block;
    font-size: 14px;
    cursor: pointer;
    border-radius: 42px;
    vertical-align: middle;
    text-decoration: none;
    line-height: 32px;
    box-sizing: border-box;
}
#proisp-wrap .oc-btn-primary,
#proisp-wrap a.oc-btn-primary,
#proisp-wrap a.oc-btn-primary:active,
#proisp-wrap a.oc-btn-primary:hover,
#proisp-wrap a.oc-btn-primary:focus {
    background-color: #0078C8;
    padding: 4px 23px;
    color: #ffffff;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}
#proisp-wrap .oc-btn.oc-btn-secondary,
#proisp-wrap .oc-btn.oc-btn-secondary:hover,
#proisp-wrap .oc-btn.oc-btn-secondary:focus,
#proisp-wrap .oc-btn.oc-btn-secondary:active {
    background-color: #ffffff;
    padding: 3px 23px;
    color: #0078C8;
    border: 1px solid #0078C8;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
    font-family: 'Montserrat', sans-serif;
    font-weight: 500;
}
#proisp-wrap .oc-btn.oc-btn-primary:hover,
#proisp-wrap .oc-btn.oc-btn-secondary:hover {
    opacity: 0.7;
}
#proisp-wrap .oc-row {
    display: flex;
    flex-direction: row;
    width: 100%;
} 
#proisp-wrap .oc-column {
    flex-direction: column;
    flex: 0 0 50%;
}
#proisp-wrap .oc-pcache > .oc-left-column,
#proisp-wrap .oc-cdn > .oc-left-column {
    flex-grow: 2;
    flex-shrink: 1;
}
#proisp-wrap .oc-pcache > .oc-right-column {
    flex-basis: 354px;
    margin-left: 9%;
}
#proisp-wrap .oc-cdn > .oc-right-column {
    flex-basis: 368px;
    margin-left: 9%;
}
#proisp-wrap .oc-right-column .pc-settings {
    padding-right: 0;
}
#proisp-wrap .oc-flex {
    display: flex;
}
#proisp-wrap .oc-flex-center {
    display: flex;
    align-items: center;
}
#proisp-wrap .oc-flex-start {
    display: flex;
    align-items: flex-start;
}
#proisp-wrap .oc-flex-fields {
    display: flex;
    align-items: center;
}
#proisp-wrap .oc-flex-fields input,
#proisp-wrap .oc-flex-fields select {
    height: 48px;
}
#proisp-wrap .oc-flex-fields > div:first-child {
    margin-right: 24px;
}
#proisp-wrap .oc-form-footer {
    margin-top: 32px;
}
/* CDN page - hide save button by default, enable via JS accordingly */
#proisp-wrap .oc-cdn .oc-form-footer {
    display: none;
}
#proisp-wrap input,
#proisp-wrap textarea {
    max-width: 100%;
}
.oc-hide {
    display: none;
}
/********  Ends: one.com common styles (re-design) ********/


/******* Performance Cache - All pages common css *******/
#proisp-wrap .oc_notice {
    margin-bottom: 32px;
}
#proisp-wrap .oc-mobile-view {
    display: none;
}
#proisp-wrap .oc-pcache p:not(:last-child),
#proisp-wrap .oc-cdn p:not(:last-child),
#proisp-wrap .oc-wp-rocket p:not(:last-child) {
    margin-bottom: 24px;
}
#proisp-wrap .oc-icon-box {
    margin-bottom: 28px;
}
/******** Starts: Checkbox switch **********/
.oc_cb_switch {
    position: relative;
    display: inline-block;
    width: 44px;
    height: 24px;
    margin-right: 16px;
}
.oc_cb_switch input {
    opacity: 0;
    width: 0;
    height: 0;
}
.oc_cb_slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #BBBBBB;
    border-radius: 100px;
    border: 1px solid #3C3C3C;
}
.oc_cb_slider:before {
    position: absolute;
    content: "";
    height: 16px;
    width: 16px;
    left: 4px;
    bottom: 3px;
    background-color: white;
    border-radius: 100px;
}
input:checked+.oc_cb_slider {
    background-color: #76B82A
}
input:checked+.oc_cb_slider.oc_warn {
    background-color: #F3A333;
    box-shadow: 0 0 1px #F3A333;
}
input:checked+.oc_cb_slider:before {
    transform: translateX(16px);
    left: 6px;
}
.oc-label {
    font-weight: 600;
}
.oc_cb_spinner {
    margin-top: 0px;
    margin-left: 24px;
}
/******** Ends: Checkbox switch **********/

/*** Tooltip - http://www.menucool.com/tooltip/css-tooltip ****/
.oc-tooltip {
    display:inline-block;
    position:relative;
    text-align:left;
    vertical-align: middle;
}
.oc-tooltip .tip-content {
    width:240px; 
    height: auto; 
    padding:8px 16px;
    color:#ffffff;
    background-color:#3C3C3C;
    font-size:12px;
    position:absolute;
    z-index:99999999;
    box-sizing:border-box;
    display:none;
    font-family: 'Montserrat', sans-serif;
    letter-spacing: 0.2px;
}
.oc-tooltip:hover .tip-content {
    display:block;
}
.oc-tooltip .tip-content i::after {
    content:'';
    position:absolute;
    width:12px;
    height:12px;
    transform:translate(50%,-50%) rotate(-45deg);
    background-color:#3C3C3C;
}
.oc-tooltip .right {
    top:50%;
    left:100%;
    margin-left:15px;
    transform:translate(0, -50%);
}
.oc-tooltip .right i {
    position:absolute;
    top:50%;
    right:100%;
    margin-top:-12px;
    width:12px;
    height:24px;
    overflow:hidden;
}
.oc-tooltip .right i::after {
    left:0;
    top:50%;
}
.oc-tooltip .top {
    width:300px; 
    top:-15px;
    left:50%;
    transform:translate(-30%,-100%);
}
.oc-tooltip .top i {
    position:absolute;
    top:100%;
    left:30%;
    margin-left:-15px;
    width:30px;
    height:15px;
    overflow:hidden;
}
.oc-tooltip .top i::after {
    left:50%;
    transform:translate(-50%,-50%) rotate(45deg);
}

.oc-tooltip .left {
    top:50%;
    right:100%;
    margin-left:15px;
    transform:translate(0, -50%);
}
.oc-tooltip .left i {
    position:absolute;
    top:50%;
    left:100%;
    margin-top:-12px;
    width:12px;
    height:24px;
    overflow:hidden;
}
.oc-tooltip .left i::after {
    left:0;
    top:50%;
    transform:translate(-50%,-50%) rotate(45deg);
}

/****** performance cache page CSS *******/
#proisp-wrap .oc_vcache_ttl,
#proisp-wrap #dev_mode_duration {
    width: 165px;
}
#proisp-wrap .oc-vcache-ttl-select {
    width: 165px;
    background-position-x: 95%;
}
#proisp-wrap p:not(.error.default-password-nag p) {
    margin: 12px 0;
    padding: 0;
}
#proisp-wrap .oc-descripton-spacing {
    margin: 36px 0 40px 0;
}
/****** CDN page CSS *******/
#proisp-wrap .oc-cdn .mwp-promo,
#proisp-wrap .oc-cdn .mwp-promo a {
    font-size: 14px;
    line-height: 22px;
    margin-top: 8px;
}
#proisp-wrap .oc-cdn .mwp-promo span {
    margin-left: 8px;
}
#proisp-wrap .oc-cdn .oc_vcache_decription,
#proisp-wrap .oc-cdn .oc_vcache_ttl_label {
    max-width: 336px;
}

/****** WP Rocket *******/
#proisp-wrap .oc-wp-rocket .oc-left-column {
    flex: 1 1 auto;
}
#proisp-wrap .oc-wp-rocket .oc-right-column {
    flex: 0 0 342px;
}
#proisp-wrap .oc-wp-rocket .inner-left-column {
    margin-right: 40px;
}
#proisp-wrap .oc-wp-rocket h2 {
    margin-right: 40px;
    margin-left: 16px;
}
#proisp-wrap .oc-main-content {
    max-width: 702px;
}
#proisp-wrap .oc-wp-rocket p:not(.error.default-password-nag p) {
    margin: 16px 0
}
#proisp-wrap .wp-rocket-desc {
    margin-bottom: 26px;
}
#proisp-wrap .oc-wp-rocket .oc-discount-badge {
    font-family: 'Montserrat', sans-serif;
    background: #f56f46;
    color: #ffffff;
    overflow-wrap: break-word;
    padding: 5px 15px;
    text-decoration: none;
    height: 28px;
    font-size: 15px;
    letter-spacing: 0.1px;
}
#proisp-wrap .oc-wp-rocket ul li {
    background: url('../images/check-list.svg') no-repeat 4.75px 7.5px;
    padding-left: 40px;
    margin: 16px auto;
}
#proisp-wrap .oc-wp-rocket strong {
    font-weight: 700;
}
.toplevel_page_onecom-vcache-plugin > .wp-menu-image{
    display:flex !important;
    align-items: center;
    justify-content: center;
}

#proisp-wrap .oc-wp-rocket .wp-rocket-btn {
    margin-top: 40px;
}
#proisp-wrap .btn,
#proisp-wrap .btn:focus,
#proisp-wrap .btn:active {
    outline: none;
    box-shadow: none;
}
#proisp-wrap .btn.button_1,
#proisp-wrap .btn.button_3 {
    padding: 8px 32px;
    border-radius: 0;
    text-decoration: none;
    display: inline-block;
    font-size: 13px;
    font-weight: 400;
    border-width: 1px;
    border-style: solid;
    cursor: pointer;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}
#proisp-wrap .btn.button_1:hover,
#proisp-wrap .btn.button_3:hover {
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}
#proisp-wrap .btn.button_1 {
    background-color: #2386ea;
    color: #ffffff;
    margin: 0 15px 0 20px;
    border-color: #2386ea
}
#proisp-wrap .btn.button_1:hover {
    background-color: #2386ea;
    border-color: #2386ea;
}
#proisp-wrap .btn.button_3 {
    background-color: #fff;
    color: #396fc9;
    border-color: #396fc9;
}
#proisp-wrap .btn.button_3:hover {
    background-color: #396fc9;
    color: #fff;
}
#proisp-wrap .btn.btn_arrow {
    background-color: #ffffff;
    color: #666666;
    padding: 3px;
    cursor: pointer;
    display: inline-block;
    vertical-align: top;
    border: 1px solid #bdbdbd;
}

#proisp-wrap .btn.button_2 {
    background-color: #ffffff;
    color: #252525;
    padding: 15px 20px 9px 18px;
    margin: 23px 2px 0px 10px;
    cursor: pointer;
    vertical-align: bottom;
    display: inline-block;
    box-shadow: inset 0 0 0 #4d4d4d;
    font-size: 12px;
    font-weight: 300;
    border: 1px solid #ececec;
    min-width: 70px;
    text-align: center;
}

#proisp-wrap .btn.button_2 .dashicons,
#proisp-wrap .dashicons-before:before {
    vertical-align: middle;
}

#proisp-wrap .btn.inactive {
    opacity: 0.6 !important;
    cursor: not-allowed !important;
}
#proisp-wrap .btn.button_1.inactive:hover {
    background-color: #396fc9 !important;
}
#proisp-wrap .btn.button_2.inactive:hover {
    background-color: #fff !important;
}

#proisp-wrap .no-top-margin {
    margin-top: 0 !important
}
#proisp-wrap .no-bottom-margin {
    margin-bottom: 0 !important
}
#proisp-wrap .no-left-margin {
    margin-left: 0 !important
}
#proisp-wrap .no-right-margin {
    margin-right: 0 !important
}

#proisp-wrap .text-center {
    text-align: center;
}

.wrap.onecom-varnish .form-table th {
    width: 100px
}

.wrap.onecom-varnish tr.hide-th th {
     display: none;
}

.wrap.onecom-varnish tr.hide-th td {
    padding-left: 0;
    width: 180px;
}

.wrap.onecom-varnish th {
    font-weight: normal;
    color: #444
}

.wrap.onecom-varnish p.submit {
    float: left;
    padding-top: 0;
    margin-right: 15px;
}
#pc_enable_settings span.oc-tooltip .dashicons,
#exclude_cdn_enable_settings span.oc-tooltip .dashicons,
#dev_mode_enable_settings span.oc-tooltip .dashicons {
    color: #ffffff;
    margin-left: 8px;
    background-color: #8A8989;
    border-radius: 50%;
    font-size: 14px;
    height: 14px;
    width: 14px;
    vertical-align: initial;
}
.oc_vcache_ttl_label {
    display: inline-block;
    margin-bottom: 8px;
}
.ab-top-menu #wp-admin-bar-proisp_purge-all-varnish-cache .ab-icon:before,
.ab-top-menu #wp-admin-bar-onecom-staging .ab-item .ab-icon:before{
    top: 2px;
}
.one-card-staging-content {
    width: calc(100% - 15em);
    margin-left: 24px;
}
input#oc_vcache_ttl.oc_error,
input#dev_mode_duration.oc_error,
textarea#exclude_cdn_data.oc_error
{
    border: 1px solid red;
}


@media screen and ( max-width: 782px ) {
    .one-logo {
        flex-direction: column-reverse;
        margin-bottom: 1em !important;
    }
    .one-logo .textleft,
    .one-logo .textright {
        text-align: center;
    }
    .wrap.onecom-varnish tr.hide-th td {
        width: auto;
    }
}

/* Workaround to avoid the vertical overflow of "Performance cache" in admin menu for mobile devices */
@media only screen and (max-width: 960px){.auto-fold #adminmenu a.menu-top.toplevel_page_onecom-vcache-plugin{height: 55px;}}

/* CDN CSS */
.wrap {
    margin: 10px 20px 0 2px;
}

.one_wrap,
.one-logo .textleft,
.wrap_inner .nav-tab,
.theme-overlay,
.image-filter,
.theme-filters,
#preview_box {
    font-family: 'Open Sans', sans-serif;
}

.one-logo {
    padding: 0 !important;
    display: flex;
    align-items: center;
}
.one-logo .textleft,
.one-logo .textright {
    flex: 1;
    line-height: initial;
}

.one-card {
    background: #fff;
    padding: 24px;
    padding-bottom: 0;
    box-shadow: 0 0 2px 3px #efefef;
    position: relative;
}

.one-card-cdn {
    margin-top: 40px;
    padding-bottom: 0;
}
.textright {
    text-align: right;
}
.one-card-inline-block {
    display: inline-block;
    vertical-align: top;
}
.one-card .one-card-staging-create-icon {
    width: 10em;
    float: left;
    vertical-align: top;
    margin-right: 3em;
}
.no-top-margin {
    margin-top: 0 !important;
}
a.help_link {
    font-size: 13px;
    display: inline-block;
    border: none;
    text-decoration: none;
}
.one-card-action {
    margin-top: 2em;
}
.btn.button_1,
.btn.button_3 {
    padding: 8px 32px;
    border: 0;
    border-radius: 0;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    font-weight: 400;
    border-width: 1px;
    border-style: solid;
    cursor: pointer;
    line-height: 24px;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}
.btn.button_1 {
    background-color: #2386ea;
    color: #ffffff;
    margin: 0 15px 0 20px;
    border-color: #2386ea;
}
.no-left-margin {
    margin-left: 0 !important;
}
.one-button.one-button-create-staging {
    margin-right: 10px !important;
}
.one-button.one-button-create-staging {
    vertical-align: middle;
}
input.oc_vcache_ttl{
    border-radius: 0;
}
.btn.button_1.oc_vcache_btn,
.btn.button_1.oc_dev_mode_btn,
.btn.button_1.oc_cdn_exclude_btn
{
    margin-left: 7px;
    vertical-align: middle;
    border-radius: 8px;
}
.btn.button_1.oc_vcache_btn:hover,
.btn.button_1.oc_dev_mode_btn:hover,
.btn.button_1.oc_cdn_exclude_btn:hover
{
    border: 1px solid #284f90;
}
.btn.button_1.oc_cdn_exclude_btn
{
    margin-left: 0;
    margin-top: 12px;
}
.oc_cb_spinner {
    float: none;
    width: 18px;
    height: 18px;
    background-size: 18px 18px;
}
.spinner.oc_cb_spinner.is_active{
    visibility: visible;
}
.spinner.oc_cb_spinner.success:not(.is-active) {
    background-image: url(../images/ok-icon.svg);
    visibility: visible;
    animation: 0s linear 2.3s forwards delayedHide;
}
@keyframes delayedHide {
  to {
    visibility: hidden;
  }
}
#oc_vcache_ttl,
#dev_mode_duration,
#exclude_cdn_data
{
    border: 1px solid #ccc;
    box-shadow: none !important;
    line-height: 26px;
    font-size: 16px;
    vertical-align: 0;
    padding: 8px 12px;
    border-radius: 8px;
    box-sizing: border-box;
    vertical-align: bottom;
}
.oc_cdn_data_save_spinner {
    vertical-align: inherit;
    vertical-align: middle;
}
#pc_enable_settings select {
    border: 1px solid #ccc;
    line-height: 24px;
    width: 165px;
    vertical-align: bottom;
    line-height: 24px;
    font-size: 16px;
    padding: 8px 12px;
    border-radius: 8px;
    box-sizing: border-box;
}
#pc_enable_settings select:hover {
    color: initial;
}
#proisp-wrap #exclude_cdn_data {
    width: 368px;
    height: 93px;
    margin-top: 10px;
    font-size: 16px;
    line-height: 26px;
}
#proisp-wrap #exclude_cdn_data::placeholder {
    font-size: 12px;
    line-height: 18px;
}
#dev_mode_enable_settings,
#exclude_cdn_enable_settings {
    margin-top: 20px;
}

/* Premium features restrictions */
.oc-non-premium input[readonly],
.oc-non-premium button:disabled,
.oc-non-premium textarea:disabled {
	cursor: not-allowed;
}
.oc-non-premium button:disabled {
    opacity: 0.6;
}
@media only screen and (max-width: 1024px){
    #proisp-wrap {
        margin-left: 10px;
        margin-right: 20px;
    }
}
@media(max-width:630px){
    #proisp-wrap .one-card{
        padding: 24px;
        padding-bottom: 0;
    }
    #proisp-wrap .one-staging-entry.staging-entry{
        display: block;
    }
    #proisp-wrap .onecom-staging-logo{
        float: none;
        width:auto;
        display: block;
        text-align: center;
    }
    #proisp-wrap .onecom-staging-logo #oc-performance-icon,
    #proisp-wrap .onecom-staging-logo #oc-performance-icon-active,
    #proisp-wrap .onecom-staging-logo #oc-cdn-icon,
    #proisp-wrap .onecom-staging-logo #oc-cdn-icon-active{
        float: none;
        margin:0 0 20px 0;
        max-width: 100%;
    }
    #proisp-wrap .entry-name{
        text-align: center;
    }
    #proisp-wrap .one-card-staging-content{
        width:auto;
        margin: auto;
    }
    #proisp-wrap .entry-link p{
        margin: 0;
        padding: 10px 0;
        word-break: break-all;
    }
    #proisp-wrap .entry-link p br{
        display: none;
    }
    #proisp-wrap .entry-link p a{border:none;}
    .one-logo .textleft{margin-right:0;}
    .btn.button_1.oc_vcache_btn{
    	margin:10px 0 4px;
    }
    .oc_vcache_ttl{
    	margin: 0;
    }
}

/*** Responsive style ***/
@media screen and (max-width: 1200px) {
    #proisp-wrap .oc-pcache > .oc-right-column {
        margin-left: 5%;
    }
    #proisp-wrap .oc-content-column {
        flex-direction: row;
        flex: 100%;
        flex-wrap: wrap;
        align-items: flex-start;
    }
}

@media screen and ( max-width: 959px ) {
    #proisp-wrap .oc-page-header {
        margin-top: 45px;
    }
    #proisp-wrap .page-description {
        margin-bottom: 34px;
    }
    #proisp-wrap .oc-right-column .pc-settings {
        padding: 0;
    }
    #proisp-wrap .oc-pcache > .oc-right-column,
    #proisp-wrap .oc-cdn > .oc-right-column {
        margin: 40px 0 0 0;
        max-width: 100%;
    }
    #proisp-wrap .oc-row {
        flex-wrap: wrap;
    }
    #proisp-wrap .oc-column {
        flex-direction: row;
        flex: 100%;
    }
    #exclude_cdn_data {
        width: 365px;
    }
    #proisp-wrap .oc-wp-rocket .inner-left-column img,
    #proisp-wrap .oc-wp-rocket .inner-right-column img {
        width: 76px;
        height: 76px;
    }
}

@media screen and (max-width: 575px) {
    #proisp-wrap,
    #proisp-wrap p:not(.error.default-password-nag p),
    #proisp-wrap .inner-wrap .oc-show-hide a,
    #proisp-wrap .inner-wrap a.oc-link {
        font-size: 18px;
        line-height: 24px;
    }
    #proisp-wrap .oc-btn,
    #proisp-wrap .oc-btn:focus,
    #proisp-wrap .oc-btn:active,
    #proisp-wrap a.oc-btn {
        font-size: 16px;
    }
    .toplevel_page_onecom-vcache-plugin #wpbody-content,
    ._page_onecom-cdn #wpbody-content {
        padding-bottom: 60px;
    }
    #proisp-wrap .oc-page-header {
        margin-top: 38px;
    }
    #proisp-wrap .page-description {
        margin-bottom: 40px;
    }
    #proisp-wrap .inner-wrap .oc-icon-box {
        /* flex-wrap: wrap; */
        flex-direction: column;
        align-items: flex-start;
        margin-bottom: 8px;
    }
    #proisp-wrap .oc-wp-rocket .oc-icon-box {
        /* flex-wrap: wrap; */
        flex-direction: row;
        align-items: flex-start;
        margin-bottom: 8px;
    }
    #proisp-wrap .oc-wp-rocket .oc-icon-box > div {
        flex-direction: column;
        align-items: flex-start;
    }

    #proisp-wrap .inner-wrap .main-heading {
        margin-left: 0;
        margin-top: 10px;
    }
    #proisp-wrap .oc-descripton-spacing {
        margin-top: 24px;
    }
    #proisp-wrap .oc-tooltip .tip-content {
        width: 240px;
    }
    #proisp-wrap .oc-desktop-view,
    #proisp-wrap .oc-tooltip,
    #proisp-wrap .oc-hidden-content {
        display: none;
    }
    #proisp-wrap .oc-mobile-view,
    #proisp-wrap .inner-wrap .oc-show-hide a {
        display: block;
    }
    #proisp-wrap .oc-wp-rocket .inner-right-column .oc-flex-center {
        flex-wrap: wrap;
    }
    #proisp-wrap .oc-wp-rocket .inner-right-column .oc-flex-center a {
        flex: 1 1 100%;
    }
    #proisp-wrap .oc-wp-rocket .oc-flex > .inner-left-column {
        display: none;
    }
    #proisp-wrap .oc-wp-rocket .inner-right-column .oc-hide {
        display: flex;
    }
    #proisp-wrap .oc-wp-rocket .inner-left-column {
        margin-right: 20px;
    }
    #proisp-wrap .oc-wp-rocket h2 {
        margin-right: 0;
    }
    #proisp-wrap .oc-wp-rocket .inner-right-column .oc-hide {
        margin-right: 20px;
    }
    #proisp-wrap .oc-wp-rocket .inner-right-column .oc-discount-badge {
        margin-top: 20px;
    }
    #proisp-wrap .oc-cdn .mwp-promo span {
        margin-left: 4px;
    }
    .oc_notice div .inline_icon, .oc_notice span {
        width: 224px;
    }
    #proisp-wrap .page-description {
        width: 288px;
    }
    #proisp-wrap .save-box {
        flex-flow: column-reverse;
        flex-wrap: wrap;
        text-align: center;
        justify-content: space-around;
    }
    /* Mobile sticky footer with submit button */
	#proisp-wrap .oc_sticky_footer {
		display: block;
		position: fixed;
		bottom: 0;
		padding: 0 24px 24px 24px;
		left: 0;
		background: #FFF;
		right: 0;
		text-align: center;
		z-index: 200;
        margin: 0 20px;
	}
	#proisp-wrap .oc_sticky_footer .oc-btn-primary {
		margin-top: 0;
	}
	/* showing sticky footer submit instead of regular submit */
	#proisp-wrap .oc-desktop-view {
		display: none !important;
	}
    #pc_enable_settings .oc-flex-fields {
        flex-wrap: wrap;
        align-items: flex-start;
        flex-direction: column;
    }
    #proisp-wrap .oc-flex-fields > div:first-child {
        margin-bottom: 24px;
    }
    #proisp-wrap .oc-form-footer {
        margin-top: 0;
    }
    #pc_enable_settings .oc-flex-fields > div,
    #proisp-wrap .oc_vcache_ttl,
    #proisp-wrap .oc-vcache-ttl-select,
    #proisp-wrap #dev_mode_duration,
    #proisp-wrap #exclude_cdn_data {
        width: 100%;
        max-width: 100%;
    }
    #proisp-wrap .save-box .oc_cb_spinner {
        margin: 16px 0;
    }
    #proisp-wrap .oc-wp-rocket .oc-right-column {
        flex: 0 0 100%;
    }
    #proisp-wrap .oc-btn,
    #proisp-wrap .oc-btn.oc-btn.oc-btn-secondary,
    #proisp-wrap .oc-btn:focus,
    #proisp-wrap .oc-btn:active {
        width: 100%;
        text-align: center;
        padding: 8px 23px;
    }
    /* #proisp-wrap .oc-cdn-feature-box .oc-block {
        padding-bottom: 20px;
    } */
}
/* CDN CSS END */

@media screen and (max-width: 390px) {
    #proisp-wrap .oc-wp-rocket .oc-icon-box > div {
        margin-bottom: 16px;
    }
    #proisp-wrap .oc-wp-rocket .oc-icon-box {
        flex-wrap: wrap;
    }
    #proisp-wrap #oc_dev_mode_switch_spinner {
        margin-left: 12px;
    }
}