body {
    background-color:#ffffff;
    font-family:courier;
    font-size:13px;
    padding:25px 100px;
}

h1 {
    font-size:200%;
    letter-spacing:5px;
    margin:15px auto;
}

h1, div.header {
    max-width:800px;
}

table {
    width:100%;
    max-width:800px;
    margin:0 auto;
    padding:20px;
    border-spacing:0;
    border:1px solid #c0c0c0;
    background-color:#f4f4f4;
    border-radius:15px;
    box-shadow:6px 12px 10px #808080;
}

thead th {
    border-bottom:2px solid #e0e0e0;
    letter-spacing:1px;
}
thead th.timestamp {
    width:200px;
}
thead th.size {
    width:140px;
}

tbody td {
    border-bottom:1px solid #e0e0e0;
    padding:2px 15px;
}
tbody tr:hover td {
    background-color:#ffffc0;
    cursor:pointer;
}
tbody tr:nth-child(even) {
    background-color:#e8e8f0;
}
tbody tr:nth-child(odd) {
    background-color:#f0f0f8;
}
tbody td.size {
    text-align:right;
}
tbody td.dir a {
    color:#0000ff;
}
tbody td.file a {
    color:#4080ff;
}

tfoot td {
    padding:20px 15px 0 15px;
}
tfoot td.totalsize {
    text-align:right;
}

a {
    text-decoration:none;
}

div.powered {
    margin-top:40px;
    text-align:center;
    color:#808080;
}
div.powered a {
    color:#80b0c0;
}

@media (max-width:767px) {
    body {
        padding:25px;
    }

    h1 {
        font-size:160%;
        letter-spacing:3px;
    }

    tbody td {
        padding:5px 15px;
    }
}

@media (max-width:511px) {
    h1 {
        font-size:130%;
        letter-spacing:1px;
    }

    table th:nth-child(2),
    table td:nth-child(2) {
        display:none;
    }
}

div.header { 
    background-image: url(/ImGs/logomirror.png);
    background-repeat: no-repeat;
    color: #176caf;
    height: 90px; 
    font-weight: bold; 
    text-align: center; 
    padding-top: 21px; 
    padding-left: 200px;
    margin:0px auto;
}

div.htitle { 
    font-size: 20px; 
    padding-bottom: 10px; 
}

div.stitle { 
    font-size: 26px;
}
