#sheet_margins{
    display: inline-block;
    background-color: #ffffff;
    padding: 20px;
}

#sheet_borders{
    display: inline-block;
    border-left: 1px solid black;
    border-top: 1px solid black;
}

#canvas{
    background-color: white;
}

#template_info{
    display: none;
}

#sheet_background{
    margin: 0;
    padding: 0;
    width: 100%;
    overflow-x: auto;
    background-color: #656565;
}

#file_path_bar{
    background: #f5f5f5;
    border-bottom: 1px solid #ddd;
    padding: 4px 12px;
    font-size: 12px;
    color: #555;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}

#sheet_sub_background{
    margin: 0;
    padding: 0;
    width: 100%;
    display: table;
}



#file_share_container{
    display: table-cell;
    width: 300px;
    border-right: 1px solid #545454;
    background-color: #545454;
    vertical-align: top;
    padding: 0;
}

#file_share_container_tab{
    display: table-cell;
    vertical-align: top;
}


#file_share_container_tab div.image, #file_share_container_tab div img, #file_share_container_tab .top_taper, #file_share_container_tab .bottom_taper{
    height: 24px;
    width: 24px
}

#file_share_container_tab div.image{
    background-color: #101010;
    border-right: 2px solid gray;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #999;
}

#file_share_container_tab div.image svg{
    width: 18px;
    height: 18px;
}

#file_share_container_tab .top_taper .filler, #file_share_container_tab .bottom_taper .filler{
    background-color: #101010;
}

#file_share_container_tab .top_taper{
    margin-top: 25px;
}

#file_share_container_tab .top_taper, #file_share_container_tab .bottom_taper{
    overflow: hidden;
}

#file_share_container_tab .top_taper .filler, #file_share_container_tab .bottom_taper .filler{
    height: 100px;
    width: 100px;
}

#file_share_container_tab .top_taper .filler{
    transform: rotate(45deg) translate(-50px,49px);
    border-top: 2px solid gray;
}

#file_share_container_tab .bottom_taper .filler{
    transform: rotate(-45deg) translate(0,-103px);
    border-bottom: 2px solid #313131;
}

.file_share_search {
    padding: 6px 8px;
    background: #292b2d;
    border-bottom: 1px solid #444;
}
.file_share_search_wrap {
    display: flex;
    align-items: stretch;
    border: 1px solid #555;
    border-radius: 3px;
    background: #3a3c3e;
    overflow: hidden;
}
.file_share_search_wrap input {
    flex: 1;
    min-width: 0;
    margin: 0;
    padding: 6px 8px;
    border: none;
    background: transparent;
    color: #e0e0e0;
    font-size: 12px;
    line-height: normal;
    outline: none;
    -webkit-appearance: none;
    appearance: none;
}
.file_share_search_wrap input::placeholder {
    color: #888;
}
.file_share_search_wrap:focus-within {
    border-color: #6a9fd6;
    background: #444;
}
.file_share_search_wrap button {
    padding: 0 8px;
    border: none;
    border-left: 1px solid #555;
    background: #4a4c4e;
    color: #ccc;
    cursor: pointer;
    font-size: 13px;
    line-height: 1;
    display: flex;
    align-items: center;
}
.file_share_search_wrap button svg {
    width: 14px;
    height: 14px;
}
.file_share_search_wrap button:hover {
    background: #5a5c5e;
    color: #fff;
}
.fs-search-loading {
    padding: 20px 10px;
    text-align: center;
    color: #888;
    font-size: 12px;
}
.fs-search-loading .spinner {
    display: inline-block;
    width: 16px;
    height: 16px;
    border: 2px solid #ccc;
    border-top-color: #666;
    border-radius: 50%;
    animation: fs-spin 0.6s linear infinite;
    vertical-align: middle;
    margin-right: 6px;
}
@keyframes fs-spin {
    to { transform: rotate(360deg); }
}

/* Search results list */
.fs-search-results {
    list-style: none;
    margin: 0;
    padding: 0;
}
.fs-search-result {
    border-bottom: 1px solid #e0e0e0;
}
.fs-search-result a {
    display: block;
    padding: 6px 10px;
    color: #333;
    text-decoration: none;
    font-size: 12px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.fs-search-result a:hover {
    background: #dbeafe;
}

.file_share_header{
    overflow: hidden;
    color: #acadb1;
    font-weight: bolder;
    text-align: center;
    padding: 5px;
    background-color: #1a1a1a;
}

.file_share{
    background-color: #F5F5F5;
    border-right:1px solid silver;
    overflow:auto;
    padding:0;
    width: 300px;
    min-height: 150px;
}
.file_share .folder { background:url('../img/plugins/jstree/file_sprite.png') right bottom no-repeat !important; }
.file_share .file { background:url('../img/plugins/jstree/file_sprite.png') 0 0 no-repeat !important; }
.file_share .file-pdf { background-position: -32px 0 !important}
.file_share .file-as { background-position: -36px 0 !important}
.file_share .file-c { background-position: -72px -0px !important}
.file_share .file-iso { background-position: -108px -0px !important}
.file_share .file-htm, .file_share .file-html, .file_share .file-xml, .file_share .file-xsl { background-position: -126px -0px !important}
.file_share .file-cf { background-position: -162px -0px !important}
.file_share .file-cpp { background-position: -216px -0px !important}
.file_share .file-cs { background-position: -236px -0px !important}
.file_share .file-sql { background-position: -272px -0px !important}
.file_share .file-xls, .file_share .file-xlsx { background-position: -362px -0px !important}
.file_share .file-h { background-position: -488px -0px !important}
.file_share .file-crt, .file_share .file-pem, .file_share .file-cer { background-position: -452px -18px !important}
.file_share .file-php { background-position: -108px -18px !important}
.file_share .file-jpg, .file_share .file-jpeg, .file_share .file-png, .file_share .file-gif, .file_share .file-bmp { background-position: -126px -18px !important}
.file_share .file-ppt, .file_share .file-pptx { background-position: -144px -18px !important}
.file_share .file-rb { background-position: -180px -18px !important}
.file_share .file-text, .file_share .file-txt, .file_share .file-md, .file_share .file-log, .file_share .file-htaccess { background-position: -254px -18px !important}
.file_share .file-doc, .file_share .file-docx { background-position: -362px -18px !important}
.file_share .file-zip, .file_share .file-gz, .file_share .file-tar, .file_share .file-rar { background-position: -416px -18px !important}
.file_share .file-js { background-position: -434px -18px !important}
.file_share .file-css { background-position: -144px -0px !important}
.file_share .file-fla { background-position: -398px -0px !important}

#sheet_container{
    display: table-cell;
    text-align: center;
}

#sheet_sub_container_container{
    position: relative;
    display: block;
    margin: 0;
    padding: 30px;
    height: 100%;
    width: 100%;
}

#sheet_sub_container{
    position: relative;
    display: inline-block;
    margin: 0;
    padding: 0;
}

#control_list{
    position: absolute;
    top:50px;
    left:50px;
    min-width:100px;
    min-height: 20px;
    display:none;
    background-color: rgb(255,255,255);
    padding:2px;
    z-index: 99999;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

#control_list.bottom{
    box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.7);
    border-top : 1px solid #C4C4C4;
    border-left : 1px solid #C4C4C4;
}

#control_list.top{
    box-shadow: -2px -2px 4px rgba(0, 0, 0, 0.7);
    border-bottom : 1px solid #C4C4C4;
    border-right : 1px solid #C4C4C4;
}

#control_list ul li{
    text-align : left;
    cursor: pointer;
    padding:2px;
}

#control_list ul li:hover{
    background-color: #e8eff7;
    -moz-box-shadow: 0 0 2px #0a6aa1;
    -webkit-box-shadow: 0 0 2px #0a6aa1;
    box-shadow: 0 0 2px #0a6aa1;
}

#control_list ul li.selected{
    background-color : rgba(23,23,23,.3);
}

#control_list ul li.standard{
    background-color : rgba(255, 255, 0, 0.70);
}

#drop_zone{
    position: absolute;
    display: none;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background-color: rgba(36,36,36,0.5);
    z-index: 2;
    font-size: 72px;
    color: #CCC;
    border: 5px dashed #CCC;
}

#drop_zone .prompt_top{
    position: absolute;
    top: 10px;
    left: 50%;
    transform: translate(-50%, 0);
}

#drop_zone .prompt_mid{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

#drop_zone .prompt_bottom{
    position: absolute;
    bottom: 10px;
    left: 50%;
    transform: translate(-50%, 0);
}

#down_arrow{
    position: absolute;
    top:0;
    left:0;
    display: none;
    z-index: 50;
    width: 18px;
    height: 18px;
    cursor: pointer;
}

#down_arrow div{
    width: 100%;
    height: 100%;
    color: white;
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
    padding: 1px;
    box-shadow: 2px 2px 4px rgba(0,0,0,0.5);
    background-color: #1a1a1a;
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
}

#down_arrow div svg{
    width: 14px;
    height: 14px;
    transform: rotate(90deg);
}

#down_arrow div img{
    transform: rotate(90deg);
}



/*#down_arrow img{*/
    /*height:auto;*/
    /*width: 20px;*/
/*}*/

#date_picker{
    position: absolute;
    top:0;
    left:0;
    display: none;
    height:19px;
    width:12px;
    z-index: 9999;
}

#date_picker img{
    height:19px;
    width: 20px;
}

#date_picker input[type="text"]{
    width: 0;
    height: 0;
    padding: 0;
    border: 0;
}

#num_spinner{
    position:absolute;
    top:0;
    left:0;
    display:none;
    height:32px;
    width:16px;
    z-index: 10;
    padding-left: 1px;
}

#num_spinner div{
    margin:0;
    position: relative;
    width:16px;
    height:13px;
    cursor: pointer;
    background-color: #000000;
    box-shadow: 2px 2px 4px rgba(0,0,0,0.5);
}

#num_spinner div:hover{
    background-color: #9aa1a9;
    -moz-box-shadow: 0 0 2px #0a6aa1;
    -webkit-box-shadow: 0 0 2px #0a6aa1;
    box-shadow: 0 0 2px #0a6aa1;
}


#num_spinner div:active{
    background-color: rgba(0, 0, 0, 0.2);
}


#spinner_down{
    border-bottom-right-radius: 3px;
    padding: 0 0 2px 0;
}

#spinner_up{
    border-top-right-radius: 3px;
    padding: 2px 0 0 0;
}

#spinner_down img{
    top: -4px;
    position: absolute;
    left: 0;
}

#contextMenu{
    position: absolute !important;
    top:0;
    left:0;
}