﻿

.db_download, .db_link, .db_sharing
{
    height: 20px;
    width: 20px;
    vertical-align: middle;
}

.dropbox-left
{
    vertical-align: top;
    width: 0px;
    display: none;
}

.sidebarContainerDiv
{
    margin: 23px 28px 0 10px;
}

.sidebarContainer
{
    display: inline-block;
}

.dropbox-main
{
    vertical-align: top;
}

.dropbox-container
{
    width: 100%;
    position: relative;
    padding: 0px 40px;
    box-sizing: border-box;
    vertical-align: top;
}

.dn
{
    display: none;
}

category .add,
.category .edit
{
    text-decoration: none;
    display: inline-block;
    padding: 10px 30px;
}


.list-table
{
    border-collapse: collapse;
    border-spacing: 10px;
}

.list-table th,
.list-table td
{
    padding: 10px;
}

.list-table thead th
{
    font-weight: bold;
    text-align: left;
}

.list-table thead th:not(.nonsortablecolumn)
{
    cursor: pointer;
}

.list-table thead th i
{
    color: inherit;
}

.list-table
{
    width: 100%;
}

.list-table tbody tr
{
    padding: 10px;
    border-bottom: 1px solid rgba(100,100,100, 0.2);
    position: relative;
}

.list-table tr.file-header
{
    background-color: rgba(100,100,100, 0.2);
    padding: 10px;
}

.list-table .title a,
.list-table .title a:hover
{
    text-decoration: none;
}

.list-table tr.file-row
{
    -webkit-transition: background-color 1s; /* Safari */
    transition: background-color 1s;
}

/* this overwrites some masterpage stuff (commerce_overall, sparkle_5, goldcouncil_brandcentre_inner) */
.list-table .footer,
.list-table th.header,
.list-table th.nonsortablecolumn,
.list-table tbody tr.finderSelect_unselected:hover td,
.list-table tr.file-row.header th,
.list-table tbody tr.finderSelect_selected:hover td,
.list-table tbody tr.finderSelect_selected td,
.list-table tbody tr.finderSelect_selected td a
{
    background-color: transparent;
    color: inherit;
}

.list-table tr td
{
    line-height: inherit;
    border-bottom: none;
}

/* END this overwrites some masterpage stuff (commerce_overall, sparkle_5, goldcouncil_brandcentre_inner) */

.list-table tr.file-row.new-item
{
    background-color: rgba(113, 193, 116, 0.5);
}

.list-table tr.file-row[data-attachment-status="1"] .table-cell.checkbox input,
.list-table tr.file-row[data-attachment-status="1"] .table-cell.checkbox input + label,
.list-table tr.file-row[data-attachment-status="2"] .table-cell.checkbox input,
.list-table tr.file-row[data-attachment-status="2"] .table-cell.checkbox input + label {
    display: none;
}

.dropbox-container .tabs
{
    margin-bottom: 40px;
    display: flex;
    width: 100%;
}

.dropbox-container .tabs .tab
{
    display: flex;
    box-sizing: border-box;
    vertical-align: top;
    text-align: center;
    border-right: 1px solid transparent;
    align-items: center;
    width: 25%;
}

.dropbox-container .tabs .tab a
{
    padding: 15px 20px;
    background-color: rgba(100,100,100, 0.2);
    cursor: pointer;
    text-decoration: none;
    height: 100%;
    box-sizing: border-box;
    text-align: center;
    width: 100%;
}

.dropbox-container .tabs .tab.selected a
{
    background-color: rgba(200,200,200, 0.2);
}

.dropbox-container .tabs .tab a:hover
{
    background-color: rgba(100,100,100, 0.4);
}

.button01 i
{
    font-weight: normal;
    padding-right: 5px;
    color: inherit;
}

.form-row input,
.form-row textarea
{
    width: 100%;
}

.upload-new-container
{
    border: 3px dashed rgba(100,100,100, 0.2);
    text-align: center;
    -webkit-transition: border 1s, background-color 1s; /* Safari */
    transition: border 1s, background-color 1s;
}

.dropbox-container .upload-area *
{
    pointer-events: none;
}

.dropbox-container .upload-area.dragover
{
    border: dashed 3px #009bda;
    background-color: rgba(0, 155, 218, 0.2);
}

.dropbox-container .upload-area.file-dropped
{
    border: dashed 3px #2ab27b;
    background-color: rgba(42,178,123, 0.2);
}

.upload-new-container-inner
{
    width: 40%;
    margin: 0 auto;
    min-width: 300px;
    padding: 20px;
}

.upload-new-container .left,
.upload-new-container .right
{
    width: 50%;
    display: inline-block;
    box-sizing: border-box;
    vertical-align: middle;
    text-align: center;
}

.upload-new-container .browse-files-button
{
    display: inline-block;
}

/* Upload/share */
.dropboxFileInfoDefault.storeandshare
{
}

.top-controls,
.bottom-controls
{
    margin: 20px 0px;
    text-align: right;
}

.top-controls .left,
.top-controls .right,
.bottom-controls .left,
.bottom-controls .right
{
    display: inline-block;
    vertical-align: top;
    box-sizing: border-box;
}

.top-controls .left,
.bottom-controls .left
{
    text-align: left;
    width: 30%;
}

.top-controls .right,
.bottom-controls .right
{
    width: 70%;
}

.top-controls a,
.bottom-controls a
{
    display: inline-block;
}

.ButtonUploadNew span
{
    font-size: x-large;
}

.fileSizeLimitLabel
{
    display: inline-block;
    line-height: initial;
    padding: 0px 20px;
    text-align: left;
    vertical-align: middle;
}

.dropbox-container .delete
{
    margin-right: 30px;
}

.emailpicker-container
{
    background-color: rgba(100,100,100, 0.2);
    padding: 20px;
}

.emailpicker-container > div
{
    padding-bottom: 10px;
}

.emailpicker-container div.and-or
{
    padding: 5px 0px 15px;
    font-weight: bold;
    font-size: 20px;
}

.emailpicker-container > div:last-child
{
    opacity: 0.6;
    padding-top: 10px;
    padding-bottom: 00px;
}

.dropbox thead .nonsortablecolumn
{
    width: 5%;
}

.dropbox thead .size
{
    width: 10%;
}

.dropbox thead .dateuploaded,
.dropbox thead .category
{
    width: 14%;
}

.dropbox .size,
.dropbox .dateuploaded,
.dropbox .category
{
    text-align: center;
}

.dropbox.list-table .checkbox
{
    width: 55px;
    min-width: 55px;
    box-sizing: border-box;
}

.dropbox.list-table .checkbox
{
    width: 55px;
    min-width: 55px;
    box-sizing: border-box;
}

.dropbox.list-table .checkbox
{
    width: 55px;
    min-width: 55px;
    box-sizing: border-box;
}


.dropbox td i
{
    font-size: 18px;
}

.ShareFilesContainer
{
    margin-top: 50px;
    max-width: 700px;
}

.ShareFilesContainer label
{
    display: inline-block;
    width: 10%;
}

.ShareFilesContainer h1,
.ShareFilesContainer h2
{
    font-weight: bold;
}

.ShareFilesContainer .form-row
{
    margin-bottom: 20px;
}

/* Received */
.received.intro-text
{
    margin: 20px 0px 10px 0px;
}

.custom-checkbox.received
{
    display: block;
    margin-bottom: 20px;
    text-align: right;
}

.received-files
{
    width: 100%;
}

.received-files thead .nonsortablecolumn
{
    font-weight: bold;
    width: 4%;
}

.received-files thead .sharedby
{
    font-weight: bold;
    width: 12%;
}

.received-files thead .datereceived
{
    font-weight: bold;
    width: 7%;
}

.received-files thead .status
{
    font-weight: bold;
    width: 7%;
}

.received-files thead .size
{
    font-weight: bold;
    width: 5%;
}



/* Sent */
.sent.intro-text
{
    margin: 20px 0px 10px 0px;
}

.custom-checkbox.sent
{
    display: block;
    margin-bottom: 20px;
    text-align: right;
}

.buttons.bottom
{
    margin-top: 20px;
    text-align: right;
}

.sent-files thead .nonsortablecolumn
{
    width: 5%;
}

.sent-files thead .sent
{
    width: 7%;
}

.sent-files thead .email
{
    width: 20%;
}

.sent-files thead .status
{
    width: 8%;
}

.sent-files thead .size
{
    width: 7%;
}

.form-row h2 span
{
    font-size: 14px;
    color: #646463;
}
/* About */
.about-content
{
    display: block;
    margin-top: 20px;
}


.list-table .file-row:not([data-attachment-status="6"]) .complete-only
{
    opacity: 0;
}

.list-table .error-container,
.list-table .processing-container
{
    display: none;
    align-items: center;
    position: absolute;
    width: 175px;
    right: 0px;
    padding: 20px 0px;
}

.list-table .error .error-container,
.list-table .processing .processing-container
{
    display: flex;
}

.list-table .error-container
{
    color: #E17572;
}

.list-table .error-container i
{
    color: inherit;
}

.list-table .processing .processing-container .processing-bar
{
    margin: 0px;
}
.list-table .processing .processing-container .processing-text
{
    position: absolute;
    width: 90%;
    text-align: center;
    padding-left: 0px;
    font-size: 14px;
}

.list-table .processing[data-attachment-status="2"] .processing-container .processing-bar
{
    border: 1px solid #009bda;
    background-image: repeating-linear-gradient( -45deg, #009bda, #009bda 11px, #00668e 10px, #00668e 20px);
}

.list-table .error-container .error-text,
.list-table .processing-container .processing-text
{
    display: inline-block;
    padding-left: 10px;
}

.delete-selected-attachments,
.share-selected-attachments
{
    display: inline-block;
    margin-left: 10px;
    margin-top: 10px;
}

.clone
{
    display: none !important;
}

.dropbox-header
{
    margin-top: 0px;
}

.TabMainTable
{
    display: none;
}

@media (max-width:768px) {
    .dropbox-container
    {
        padding: 0px 5px;
    }

    /* Store and share files */

    .list-table
    {
        display: block
    }

    .list-table tr
    {
        display: block;
    }

    .list-table td,
    .list-table th
    {
        display: inline-block;
        box-sizing: border-box;
    }

    .list-table thead .title,
    .list-table tbody .title,
    .list-table thead .filename
    {
        width: calc((100% - 55px - 20px) / 2);
    }

    .list-table thead .size,
    .list-table thead .dateuploaded,
    .list-table tbody .size,
    .list-table tbody .dateuploaded,
    .list-table thead .sharedby,
    .list-table thead .datereceived,
    .list-table tbody .sharedby,
    .list-table tbody .received
    {
        width: calc((100% - 55px - 20px) / 4);
    }

    .list-table.sent-files thead .filename,
    .list-table.sent-files tbody .title,
    .list-table.sent-files thead .email,
    .list-table.sent-files tbody .email
    {
        width: calc((100% - 55px - 20px) * 2 / 5);
    }

    .list-table.sent-files thead .sent,
    .list-table.sent-files tbody .datesend
    {
        width: calc((100% - 55px - 20px) / 5);
    }

    .list-table tbody .download-icon,
    .list-table tbody .status
    {
        padding-left: 65px;
    }

    .dropbox-desktop-only
    {
        display: none !important;
    }

    .list-table .title a,
    .list-table .title,
    .list-table .email
    {
        word-break: break-all;
    }

    .list-table .error-container, .list-table .processing-container
    {
        bottom: 0px;
    }

    .list-table tbody
    {
        font-size: 14px;
    }
}

