BossBey File Manager

Editing: style.css

/* General */
.wrap { margin: 30px 30px 0 12px }
.porto-patch-layout, .porto-setup-wizard { font: 400 14px/1.6 Poppins, 'Lucida Grande', sans-serif; color: #777; background: #fff }
.porto-setup-wizard *, .porto-setup-wizard *:before, .porto-setup-wizard *:after { box-sizing: border-box }
.porto-patch-layout h4, .porto-setup-wizard h2, .porto-setup-wizard h3, .porto-setup-wizard h4 { color: #32373c; margin: 0 0 .5em; letter-spacing: -.05em; font-weight: 700; line-height: 1.1 }
.porto-setup-wizard h5, .porto-setup-wizard h6 { margin: 0 0 .5em; font-weight: 400 }
.porto-setup-wizard label { color: #32373c; font-weight: 600 }
.porto-setup-wizard label.checkbox { cursor: pointer; }
.porto-setup-wizard h1 { font-size: 1.5rem }
.porto-setup-wizard h2 { font-size: 1.625rem }
.porto-patch-layout h4, .porto-setup-wizard h4 { font-size: 1rem }
.porto-setup-wizard h5 { font-size: .875rem; color: #32373c }
.porto-setup-wizard .btn:not(:last-child) { margin-right: .375rem }
.porto-setup-wizard .btn-borders { border: 1px solid #ccc; color: #23282d }
.porto-setup-wizard .btn-dark { background-color: #32373c; color: #fff }

a { color: #08c }
p { margin: 0 0 1.25rem; line-height: 1.8 }
.divider { border-top: 1px solid #e7e7e7; margin: 1.875rem 0; }
.me-2 { margin-right: .5rem }
.ms-2 { margin-left: .5rem }
.mb-0 { margin-bottom: 0 }
.mb-1 { margin-bottom: .25rem }
.mb-2 { margin-bottom: .5rem }
.mt-2 { margin-top: .5rem }
.w-50 { width: 50% !important }
.d-flex { display: flex; align-items: center }
.justify-between { justify-content: space-between }
.d-none, .porto-setup-wizard .plugins-used { display: none }
.light { color: #999 }
.color-dark { color: #32373c; }

.porto-setup-wizard em { color: #32373c; font-weight: 700; font-style: normal; }
.porto-setup-wizard input[type="text"] { border-color: #ccc; color: inherit }
.porto-setup-wizard input[type="checkbox"] { border-color: #ccc; width: 1.5rem; height: 1.5rem; margin-top: -.2rem; margin-left: 1px }
.porto-setup-wizard input[type="checkbox"]:checked:before { content: "\f00c"; font-family: var(--fa-style-family-classic, "Font Awesome 6 Free"); font-weight: 900; color: #08c; margin: 0; width: 1.4rem; height: 1.4rem; line-height: 1.4rem; }
.porto-setup-wizard a, .porto-setup-wizard button { outline: none !important; box-shadow: none }

.porto-setup-wizard section { 
    padding: 3rem 2.5rem 2.5rem;
}
.porto-setup-wizard .separator { border-top: 1px solid #e7e7e7; padding-top: 1.25rem; margin: 1.125rem 0 0 }

/* Header */
.porto-setup-wizard-header { background-color: #08c; padding: 20px 30px }
.porto-setup-wizard-header h2 { margin-bottom: .25rem; color: #fff; }
.porto-setup-wizard-header * { color: #fff }
.porto-setup-wizard-header h6 { color: #cbe0f1; font-size: 1em; margin-bottom: 0 }
.porto-setup-wizard-header .version { display: block; text-align: right; color: #cbe0f1; font-size: .75rem; font-weight: 500; margin-top: -1em; line-height: 1; letter-spacing: -.1em }

/* Steps */
.porto-setup-steps { background-color: #08c; border-top: 1px solid rgba(255, 255, 255, .1); margin: 0; list-style: none; display: flex; overflow: hidden; flex-wrap: wrap }
.porto-setup-steps a { display: block; color: rgba(255, 255, 255, .4); font-size: .8125rem; font-weight: 700; text-decoration: none; text-transform: uppercase; transition: color .25s; letter-spacing: -.05em; padding: 1.25rem 1.875rem; position: relative; }
.porto-setup-steps a:before { content: ''; position: absolute; right: 0; top: 0; bottom: 50%; border: 1px solid rgba(255, 255, 255, .15); transform: skew(30deg); }
.porto-setup-steps a:after { content: ''; position: absolute; right: 0; top: 50%; bottom: 0; border: 1px solid rgba(255, 255, 255, .15); transform: skew(-30deg); }
.porto-setup-steps li:last-child a:before, .porto-setup-steps li:last-child a:after { content: none }
.porto-setup-steps li { margin-bottom: 0 }
.porto-setup-steps a:not(.nolink):hover, .porto-setup-steps .active a { color: #fff; }
.porto-setup-steps .nolink { pointer-events: none }

/* Actions */
.porto-setup-actions { border-top: 1px solid #e7e7e7; margin-top: 1.875rem; padding-top: 1.875rem }
.button-load-plugins { color: #08c; text-decoration: none; font-size: .75rem }
.button-load-plugins b { display: inline-block; font-weight: 700; border-bottom: 2px solid #d4e5f3 }
.porto-setup-wizard-plugins li { position: relative; margin-bottom: 1rem }
.porto-setup-wizard-plugins li span { padding: 0 0 0 12px; font-size: 0.75rem; color: #08c; display: inline-block; position: relative; font-weight: 400; border-left: 2px solid #ccc; margin-left: 10px; line-height: 1.2 }
.porto-setup-wizard-plugins li.installing .spinner { visibility: visible; }
.porto-setup-wizard-plugins li .spinner { display: inline-block; position: absolute; margin-top: 1.5px }
.porto-speed-optimize-wizard .recompile { display: none; padding-left: 10px; }
.recompile.active { display: inline-block; }
input[name=merge_stylesheets].disable {
    opacity: 0.7;
}
/* Demo Installation */
.porto-install-demos td { vertical-align: top }
.demo-sort-filters { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; }
.demo-sort-filters li { margin-right: 1.8vw; }
.demo-sort-filters a { display: block; font-size: .8125rem; text-decoration: none; color: #222529; text-transform: uppercase; font-weight: 700; box-shadow: none; letter-spacing: -.025em; border-bottom: 4px solid transparent; transition: .25s; line-height: 1.8 }
.demo-sort-filters .active a, .demo-sort-filters a:hover { color: #08c; border-bottom-color: #08c }
.demo-sort-filters .search-form-wrap { position: relative; margin: 10px 0; }
.demo-sort-filters #demo-name { width: 300px; height: 38px; border: 1px solid #e1e1e1; padding: 0 8px 0 40px; }
.demo-sort-filters span { position: absolute; left: 15px; line-height: 1; font-size: 16px; color: #222; top: 50%; margin-top: -8px }
.demo-sort-filters #demo-name:focus { border-color: #08c; box-shadow: 0 0 0 1px #08c; }

#theme-install-demos { margin: -10px -20px 0; padding: 20px 10px 0; -webkit-overflow-scrolling: touch; }
#theme-install-demos .theme { float: left; padding: 0 10px; margin: 0 0 20px 0; width: calc(25% - 5px); cursor: default; border: none; box-shadow: none; box-sizing: border-box; cursor: pointer; }
#theme-install-demos .theme:hover .theme-name { color: #08c }
#theme-install-demos .theme img { display: block; width: 100%; height: auto; box-shadow: 0 0 20px rgba(0, 0, 0, .08); aspect-ratio: 500/ 370; }
#theme-install-demos .theme-name { font-size: .875rem; text-align: center; padding: 1rem .25rem; margin-bottom: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap }
#theme-install-demos .theme-name small { font-size: 80%; font-weight: 600 }
.porto-install-demo { font-size: .8125rem; background: #fff; padding: 1.25rem; max-width: 21rem; margin-left: auto; margin-right: auto; }
#porto-install-options label { display: block; margin-bottom: 8px; }
.porto-install-demo img { max-width: 100%; height: auto; }
.porto-install-demo .btn { width: 100% }
.porto-install-demo .porto-install-options-section { padding: 0.5em 0; }
.porto-install-demo .plugins-used { display: block; padding: 0; margin: 1rem 0 0; }
.porto-install-demo .active-plugin i.porto-ajax-loader { left: 10px; }
.porto-install-demo .plugins-used > li { display: table; width: 100%; }
.porto-install-demo .plugins-used > li > * { display: table-cell; vertical-align: top; }
.porto-install-demo .plugins-used .thumb { width: 40px; padding-right: 8px; }
.porto-install-demo .plugins-used h5 { font-size: .875rem; margin: 0 0 4px 0; }
.porto-install-demo .plugins-used p { margin: 0; font-size: 13px; }
.porto-install-demo .more-options { display: block; float: right; text-align: center; cursor: pointer; font-size: 11px; padding-right: 10px; text-transform: uppercase; position: relative; }
.porto-install-demo .more-options:after { content: ''; border-top: 4px solid #21293c; border-left: 3px solid transparent; border-right: 3px solid transparent; position: absolute; right: 0; top: 50%; margin-top: -2px; }
.porto-install-demo .more-options.opened:after { border-top: none; border-bottom: 4px solid #21293c; }

.porto-install-demo .btn { padding-top: .875em; padding-bottom: .8em }

.porto_page_porto-setup-wizard .mfp-bg { z-index: 9991 }
.porto_page_porto-setup-wizard .mfp-wrap { z-index: 9992 }

@-webkit-keyframes spin { 0% { transform: rotate(0deg); }
  100% { transform: rotate(359deg); } }
@keyframes spin { 0% { transform: rotate(0deg); }
  100% { transform: rotate(359deg); } }
#patcher-table i.porto-ajax-loader, #porto-install-options i.porto-ajax-loader, .porto-demo-install i.porto-ajax-loader { position: absolute; left: 0; top: 50%; margin-top: -11px; display: inline-block; border: 2px solid transparent; width: 20px; height: 20px; vertical-align: middle; border-radius: 20px; border-top-color: #08c !important; -webkit-animation: spin 0.75s infinite linear; animation: spin 0.75s infinite linear; }
#patcher-table i.porto-ajax-loader:before, #porto-install-options i.porto-ajax-loader:before, .porto-demo-install i.porto-ajax-loader:before { content: ''; position: absolute; left: -2px; top: -2px; width: inherit; height: inherit; border: inherit; border-radius: inherit; border-top-color: inherit; -webkit-animation: spin 1.5s infinite ease; animation: spin 1.5s infinite ease; }
.import-progress-bar { margin-top: 10px; background: #ccc; width: 100%; height: 20px }
.import-progress-bar div { background: #08c; height: 20px }
.pagebuilder-selector { margin-bottom: 12px }
#porto-install-options { padding-left: 0; }
#porto-install-options .active-plugin { position: relative; display: block; margin-left: auto; font-size: 14px; width: 40px; height: 20px; text-align: center; }
.message-section h5 { margin: 0 }
.message-section > div { padding: 4px 0; }
.message-section .d-flex > div { text-align: center }
#current-logo img { vertical-align: middle; max-height: 340px; max-width: 340px; padding: 1.5rem; margin-bottom: 0; margin-right: 15px; border: 1px solid #e3e3e3; background: #fafafa; border-radius: 4px; }

/* Remove demo contents */
.porto-remove-demo {
    font-size: .8125rem;
    background: #fff;
    padding: 1.5rem 1.25rem 1rem;
    max-width: 20rem;
    margin: 0 auto;
}
.porto-remove-demo label {
    display: inline-block;
    width: 49%;
    margin-bottom: .625rem;
}
.porto-remove-demo .btn {
    width: 100%;
    margin-top: .5rem
}

/* Others */
h5.system-status { font-weight: 700 }
h5.system-status strong { color: #5ca86f; font-weight: inherit }
h5.system-status.error strong { color: #c50707 }
.porto-setup-wizard .list { padding-left: 2.5rem }
.porto-setup-wizard .list li:before { content: '-'; margin-right: .5em }
.porto-setup-wizard .porto-setup-next-steps a { font-style: normal; }
.porto-setup-wizard .porto-setup-next-steps .status { color: #32373c }
.porto-notice { border: 1px solid #ccd0d4; border-left-width: 4px; border-left-color: #ffb900; box-shadow: 0 1px 1px rgba(0,0,0,.04); padding: 1px 12px }
.porto-table {
    width: 100%;
    text-align: left;
    border-spacing: 0
}
.porto-table th, .porto-table td {
    padding: 15px 20px;
    vertical-align: middle;
}
.porto-table th {
    color: #222529;
    border-bottom: 1px solid #e8e8e8
}
.porto-table p {
    margin-bottom: 0
}
.porto-table tr:nth-child(2n) td {
    background-color: #f6f7f9; 
}

.porto-table .btn {
    margin-bottom: 0
}

.has-badge .theme-screenshot {
    position: relative;
}
.has-badge .theme-screenshot:after {
    content: 'New';
    position: absolute;
    right: 10px;
    top: 10px;
    border-radius: 2px;
    line-height: 22px;
    font-size:  9px;
    font-weight: 600;
    text-transform: uppercase;
    padding: 0 .5rem;
    background: linear-gradient(135deg, #0088cc 0%, #0169fe 80%);
    color: #fff;
}
.badge-updated .theme-screenshot:after {
    content: 'Updated';
    background: #36c57a;
}
.badge-e-added .theme-screenshot:after {
    content: 'Elementor Added';
    background: #2baab1;
}
/* Responsive */
@media (max-width: 1199px) {
    #theme-install-demos .theme { width: calc(33.3333% - 6.6666px); }
    .porto-setup-steps a { padding-left: 1.5rem; padding-right: 1.5rem }
}
@media (max-width: 991px) {
    .porto-setup-wizard section { padding: 2rem 1.5rem 1.5rem }
    #theme-install-demos .theme { width: calc(50% - 10px) }
    .porto-setup-steps a:before, .porto-setup-steps a:after { content: none }
    .porto-setup-steps { padding: .5rem 0 }
    .porto-setup-steps a { padding: .5rem 1rem }
    .porto-setup-wizard .w-50 { width: 100% !important; }
}
@media (max-width: 575px) {
    html { font-size: 14px }
    .porto-setup-wizard aside { min-height: 300px }
    .porto-setup-wizard section,
    .porto-setup-wizard aside { flex: 0 0 100%; max-width: 100% }
    .porto-setup-wizard aside:before { background-size: auto 60% }
    #current-logo img { padding: .625rem }
    .porto-setup-wizard .btn { min-width: auto }
}

/* Notification */
@keyframes shake {
    10%, 90% {
        transform: translate3d(calc(-50% - 5px), -50%, 0);
    }

20%, 80% {
        transform: translate3d(calc(-50% + 5px), -50%, 0);
    }

30%, 50%, 70% {
        transform: translate3d(calc(-50% - 5px), -50%, 0);
    }

40%, 60% {
        transform: translate3d(calc(-50% + 5px), -50%, 0);
    }
}
.shake {
    animation: shake .8s linear both;
}
.porto-wizard-notification {
    position: fixed;
    top: -9999px;
    left: 50%;
    transform: translate(-50%, calc(-50% - 20px));
    padding: 2rem 1rem;
    max-width: 500px;
    background: #fff;
    box-shadow: 0 0 20px 0 rgb(0 0 0 / 20%);
    text-align: center;
    opacity: 0;
    transition: opacity .3s, transform .3s;
}
.show-pm-popup .porto-wizard-notification {
    top: 50%;
    opacity: 1;
    transform: translate(-50%, -50%);
}
.porto-wizard-notification p {
    font-family: Poppins;
    font-size: 13px;
}
.porto-wizard-notification b {
    display: block;
    font-size: 16px;
    font-weight: 800;
    color: #222;
}
.porto-wizard-notification button {
    padding: 8px 20px;
}
.porto-wizard-notification .btn-action {
    margin-right: 5px;
}

/* #porto-install-options .plugins-used .thumb > img,
#porto-install-options .plugins-used .thumb + div {
   vertical-align: middle;
} */

Cancel