@import url('https://fonts.googleapis.com/css2?family=Roboto&display=swap');

body, html {
    background-color: #f4f6ff!important;
    color: #1c1c1c!important;
    font-family: 'Roboto', Arial, Helvetica, sans-serif!important;
}

body > div.tableContainer > table {
    background-color: #aeaeae!important;
}

body:not([is-loading]) > div.tableContainer > table tbody tr:not(.parent):hover {
    background-color: rgba(238, 238, 238, 0.55)!important;
}

body[optimize] > div.tableContainer > table tbody > tr {
    background-color: #fff!important;
}

html > body > div.tableContainer > table > thead > tr {
    background-color: #fff;
    border-bottom: 2px solid #f4f4f4;
}

html > body .readmeContainer summary
{
    background-color: #fff!important;
    border-bottom: none!important;
}

html > body .readmeContainer[open] summary
{
    border-bottom: 1px solid #eaebff!important;
}

body.compact > div.path {
    margin: 20px 8px 16px 8px!important;
    padding: 6px 10px 7px 10px!important;
    background-color: #fff!important;
    color: #6f6f6f!important;
    border-radius: 6px!important;
    border: 1px solid #e1e1e1!important;
    text-align: center!important;
}

body > div.path a {
    color: #76b2ff!important;
    font-weight: normal!important;
}

.topBar {
    background-color: rgba(255, 255, 255, 0.40)!important;
    border-bottom: 1px solid hsla(0, 0%, 81.6%, 0.52)!important;
    box-shadow: 0 0 3px #cecece!important;
    color: #717171!important;
}

.topBar > div.extend:hover {
    background-color: hsla(0, 0%, 0%, 0.03)!important;
    color: #222!important;
}

.topBar > .directoryInfo > div:not(.quickPath) {
    border-right: 2px solid hsla(0, 0%, 91%, 0.52)!important;
}

.topBar > div.extend {
    border-left: 2px solid hsla(0, 0%, 91%, 0.52)!important;
}

div.topBar > div.directoryInfo > div.quickPath a {
    color: #5ab2ff!important;
}

body > div.tableContainer > table thead tr > th {
    color: #404040!important;
}

body > div.tableContainer {
    border-top: 1px solid #dfdfdf!important;
    background-color: #fff!important;
}

body > div.tableContainer > table {
    background-color: #fff!important;
}

body > div.bottom {
    border-top: 1px solid #dfdfdf!important;
}

body > div.tableContainer > table tr.file a.preview, body > div.tableContainer > table tr.file a.preview:hover {
    color: #418bff!important;
}

body > div.tableContainer > table tr.file td.download a {
    color: #7dadf9!important;
}

body > div.tableContainer > table tr.file td.download a:visited {
    color: #9da8d2!important;
}

body > div.tableContainer > table tr.parent a {
    color: #b03cff!important;
}

body > div.tableContainer > table tr.directory a {
    color: #ce5858!important;
}

.preview-container video, .preview-container img {
    -webkit-box-shadow: 0px 0px 3px 0px #00000042!important; 
    box-shadow: 0px 0px 3px 0px #00000042!important;
    overflow: hidden!important;
}

.menu {
    border: 1px solid #fff!important;
    background-color: rgba(255, 255, 255, 0.15)!important;
    color: #484848!important;
    -webkit-box-shadow: 0px 0px 3px 0px #00000042!important;
    box-shadow: 0px 0px 3px 0px #00000042!important;
}

.menu > div:hover {
    background-color: #e0f3ff!important;
    border-left: 3px solid #c8d3ff!important;
    color: #000!important;
}

.settingsContainer {
    background-color: rgba(255, 255, 255, 0.94)!important;
    border: 1px solid #f0f0f0!important;
    border-radius: 3px!important;
    box-shadow: 0px 0 5px #0d0d0d52!important;
}

.settingsContainer > .wrapper > div.section > div.header {
    background-color: #fff!important;
    border-bottom: 1px solid #e1e1e1!important;
    border-top: 1px solid #e1e1e1!important;
    box-shadow: none!important;
    color: #9d9d9d!important;
}

select:not(.default) {
    background-color: #fff!important;
    border: 1px solid #cecece!important;
    box-shadow: 0 1px 0 1px rgba(0,0,0,.1)!important;
    color: #4c4c4c!important;
}

select:not(.default):focus, select:not(.default):hover {
    background-color: #e6f1ff!important;
    border: 1px solid #a8a8a8!important;
}

.settingsContainer > div.bottom {
    background-color: #fff!important;
    border-top: 1px solid #c3c3c3!important;
}

.settingsContainer > div.bottom > div:not(:last-child) {
    border-right: 1px solid #dbdbdb!important;
}

.settingsContainer > div.bottom > div:hover {
    background-color: #e3f7ff!important;
}

::-webkit-scrollbar {
    background-color:#fbfbfb!important;
    width:10px
}
::-webkit-scrollbar-thumb {
    background-color:#d1d1d1!important;
}
::-webkit-scrollbar-thumb:hover {
    background-color:#b8b8b8!important;
}

.rootGallery {
    background-color: rgba(165, 183, 255, 0.30)!important;
}

.rootGallery div.galleryContent .list {
    background-color: rgba(255, 255, 255, 0.94)!important;
}

.rootGallery div.galleryContent .list table tr {
    color: #313131!important;
}

.rootGallery div.galleryContent .list, html {
    scrollbar-color: #d1d1d1 #fff!important;
}

.rootGallery div.galleryContent .list table tr:not(.selected) td:hover {
    background-color: rgba(140, 171, 255, 0.2)!important;
}

.rootGallery div.galleryContent .list table tr.selected td:hover {
    background-color: #ceefff!important;
}

.rootGallery div.galleryContent .list table tr.selected td {
    background-color: #d8f2ff!important;
    border-left: 5px solid #a0e4ff!important;
    color: #373737!important;
}

.rootGallery div.galleryContent .list > div.drag {
    border-left: 2px solid hsla(211.2, 100%, 85.3%, 0.55)!important;
}

.rootGallery div.galleryContent .media > div.item-info-static {
    background-color: #ffffff69!important;
}

.rootGallery div.galleryBar {
    background-color: rgba(255, 255, 255, 0.84)!important;
    border-bottom: 2px solid hsla(211.2, 100%, 85.3%, 0.55)!important;
    color: #404040!important;
}

.rootGallery div.galleryBar .galleryBar__left a {
    color: #71bcff!important;
}

.rootGallery div.galleryContent .media .wrapper .cover .reverse a {
    background-color: #ffffffb3!important;
    color: #404040!important;
    transition: none!important;
    -moz-transition: none!important;
    -webkit-transition: none!important;
}

.rootGallery div.galleryContent .list {
    border-top: 1px solid hsla(0, 0%, 76.9%, 0.72)!important;
}

.rootGallery div.galleryContent .media .wrapper .cover .reverse a:not(:last-child) {
    border-right: 1px solid #d0d0d0!important;
}

.rootGallery div.galleryContent .media .wrapper .cover .reverse a:hover {
    background-color: rgba(255, 255, 255, 1)!important;
    color: #393939!important;
}

.filterContainer {
    box-shadow: none!important;
}

.filterContainer > input[type="text"] {
    background-color: rgba(255, 255, 255, 0.94)!important;
    border-top: 2px solid hsla(211.2, 100%, 85.3%, 0.55)!important;
    color: #151515!important;
}

@media only screen and (max-width:640px) {
    body > div.tableContainer > table tr.directory a,
    body > div.tableContainer > table tr.parent a,
    body > div.tableContainer > table tr.file td.download a,
    body > div.tableContainer > table tr > td:nth-child(2), body > div.tableContainer > table tr > td:nth-child(3),
    body > div.tableContainer > table tr.file a.preview, body > div.tableContainer > table tr.file a.preview:hover {
        font-size: 12px!important;
    }

    .rootGallery div.galleryContent .screen-navigate {
        background-color: rgba(255, 255, 255, 0.12)!important;
    }

    .rootGallery div.galleryContent .screen-navigate.left > span::after,
    .rootGallery div.galleryContent .screen-navigate.right > span::after {
        color: white!important;
    }
}

@media only screen and (min-width: 640px) {
    body.compact {

        border: 1px solid #eaeaea!important;
    }

    body > div.tableContainer > table tr.directory a,
    body > div.tableContainer > table tr.parent a,
    body > div.tableContainer > table tr.file td.download a,
    body > div.tableContainer > table tr > td:nth-child(2), body > div.tableContainer > table tr > td:nth-child(3),
    body > div.tableContainer > table tr.file a.preview, body > div.tableContainer > table tr.file a.preview:hover {
        font-size: 14px!important;
    }

    .topBar > .directoryInfo {
        font-size: 13px!important;
    }
}

.readmeContainer {
    overflow: hidden!important;
    margin: 0px 10px 12px 10px!important;
    border-radius: 4px!important;
    background-color: #fbfbfb!important;
    color: #484848!important;
    border-top: none!important;
    border-bottom: none!important;

    -webkit-box-shadow: 0px 0px 3px 0px #00000042!important; 
    box-shadow: 0px 0px 3px 0px #00000042!important;
}

.readmeContainer::before {
    border-radius: 4px 4px 0px 0px!important;
    background-color: #fff!important;
    padding: 6px 10px 6px 6px!important;
    color: #939498!important;
    border-bottom: 1px solid #dfdfdf!important;
}