/*
  ____  _   _ __  __ ____    ____   _    ____ _____ 
 |  _ \| | | |  \/  |  _ \  |  _ \ / \  / ___| ____|
 | | | | | | | |\/| | |_) | | |_) / _ \| |  _|  _|  
 | |_| | |_| | |  | |  __/  |  __/ ___ \ |_| | |___ 
 |____/ \___/|_|  |_|_|     |_| /_/   \_\____|_____|

 */

body#dump-page{
    font-size: 0.9em;
    font-family: 'Arial';
}

div.title{
    padding-left: 14px;
    padding-bottom: 5px;
}

div.content{
    width: 14%;
    margin: auto;
    height: 100%;
}

div#dump-zone{
    margin-top: 10px;
    overflow-y: hidden;
    overflow-x: hidden;
    width: auto;
    height: 100vh;
    display: inline-flex;
}

p.date{
    font-size: 0.8em;
    padding-left: 14px;
}

p#dump-august{
    width: 100%;
    color: #FF1493;
    padding-top: 4px;
}

p.dump-july{
    width: 100%;
    color: #696969;
    padding-top: 4px;
}

p#dump-april{
    width: 100%;
    color: #a04607;
    padding-top: 4px;
}

p#dump-march{
    width: 100%;
    color: #ffad04;
    padding-top: 4px;
}

p#dump-january{
    width: 100%;
    color: #fc6723;
    padding-top: 4px;
}

p#dump-november{
    width: 100%;
    color: #383838;
    padding-top: 4px;
}

p#dump-february{
    width: 100%;
    color: #A9A9A9;
    padding-top: 4px;
}

p#dump-october{
    width: 100%;
    color: #39aad6;
    padding-top: 4px;
}

p.dump-july-2{
    width: 100%;
    color: #696969;
    padding-top: 4px;
}

table {
    width: 200px;
    margin: auto;
    padding: 10px;
    padding-top: 4px;
    border-collapse: separate;
    border-spacing: 3px 0rem;
}

.image-table img {
  width: 100%;
  height: 100%;
  object-fit: fill;
}

table td {
  width: 55px;
  height: 55px;
}

div#color-chart-10{
    width: 86%;
    margin: auto;
    height: 4vh;
    margin-top: 10px;
    background: rgb(15,29,27);
    background: linear-gradient(90deg, rgba(8,50,27,1) 0%, rgba(19,180,26,1) 40%, rgba(6,50,22,1) 85%, rgba(19,42,13,1) 100%);
    filter: saturate(1.4);
}

div#color-chart-9{
    width: 86%;
    margin: auto;
    height: 4vh;
    margin-top: 10px;
    background: rgb(15,29,27);
    background: linear-gradient(90deg, rgba(15,29,27,1) 0%, rgba(219,88,26,1) 40%, rgba(106,50,22,1) 85%, rgba(19,42,143,1) 100%);
    filter: saturate(1.4);
}

div#color-chart-8{
    width: 86%;
    margin: auto;
    height: 4vh;
    margin-top: 10px;
    background: rgb(254,218,202);
    background: linear-gradient(90deg, rgba(254,218,202,1) 0%, rgba(186,86,141,1) 30%, rgba(112,12,26,1) 65%, rgba(177,53,100,1) 100%);
    filter: saturate(1.4);
}

div#color-chart-7{
    width: 86%;
    margin: auto;
    height: 4vh;
    margin-top: 10px;
    background: rgb(125,125,125);
    background: linear-gradient(90deg, rgba(125,125,125,1) 0%, rgba(33,33,33,1) 30%, rgba(153,153,153,1) 70%, rgba(46,46,46,1) 100%);
    filter: saturate(1.4);
}

div#color-chart-6{
    width: 86%;
    margin: auto;
    height: 4vh;
    margin-top: 10px;
    background: rgb(116,116,116);
    background: linear-gradient(90deg, rgba(116,116,116,1) 0%, rgba(153,153,153,1) 50%, rgba(85,85,85,1) 80%, rgba(33,33,33,1) 100%);
    filter: saturate(1.4);
}

div#color-chart-5{
    width: 86%;
    margin: auto;
    height: 4vh;
    margin-top: 10px;
    background: rgb(55,33,13);
    background: linear-gradient(90deg, rgba(55,33,13,1) 0%, rgba(235,192,119,1) 40%, rgba(135,86,35,1) 80%, rgba(73,72,15,1) 100%);
    filter: saturate(1.4);
}

div#color-chart-4{
    width: 86%;
    margin: auto;
    height: 4vh;
    margin-top: 10px;
    background: rgb(60,136,121);
    background: linear-gradient(90deg, rgba(60,136,121,1) 0%, rgba(214,144,28,1) 45%, rgba(144,147,103,1) 100%, rgba(144,147,103,1) 100%);
    filter: saturate(1.4);
}

div#color-chart-3{
    width: 86%;
    margin: auto;
    height: 4vh;
    margin-top: 10px;
    background: rgb(43,43,43);
    background: linear-gradient(90deg, rgba(43,43,43,1) 0%, rgba(193,193,193,1) 30%, rgba(103,103,103,1) 65%, rgba(238,238,238,1) 100%);
    filter: saturate(1.4);
}


div#color-chart-2{
    width: 86%;
    margin: auto;
    height: 4vh;
    margin-top: 10px;
    background: rgb(61,170,213);
    background: linear-gradient(90deg, rgba(61,170,213,1) 0%, rgba(155,131,5,1) 60%, rgba(120,98,48,1) 100%);
    filter: saturate(1.4);
}

div#color-chart-1{
    width: 86%;
    margin: auto;
    height: 4vh;
    margin-top: 10px;
    background: rgb(200,200,200);
    background: linear-gradient(90deg, rgba(200,200,200,1) 0%, rgba(27,27,27,1) 40%, rgba(92,92,92,1) 100%, rgba(93,93,93,1) 100%);
    filter: saturate(1.4);
}

div.message{
    display: none;
}

@media screen and (max-width: 768px){

    div.message{
        display: block;
        width: 100%;
        text-align: center;
        margin: 45vh auto;
        text-transform: none;
        font-family: 'Arial';
    }

    div#dump-zone{
        display: none;
    }

}