body {
   background-color: #121211;
   color: #ddddd1;
   font-family: 'Comic Sans MS';
   font-weight: bold;
   font-size: 10pt;
}

a, a:link, a:visited, a:active {
   text-decoration: none;
   color: #22dd22;
}

.header {
   font-size: 24pt;
   font-weight: bold;
   font-family: 'Comic Sans MS';
   text-align: center;
   margin-left: 20px;
   margin-right: 20px;
   border-bottom: 2px solid #ddddd1;
}

.listcontainer {
   margin-top: 10px;
   text-align: center;
   width: 100%;
/*
   margin-left: auto;
   margin-right: auto;
   overflow: auto;
   width: -moz-fit-content;
   width: -webkit-fit-content;
   width: fit-content;
*/
}

.list {
   width: 100%;
   margin: 10px auto auto auto;
   position: relative;
   display: flex;
   flex-wrap: wrap;
   justify-content: center;
   text-align: center;
/*
   text-align: center;
   margin-left: auto;
   margin-right: auto;
   margin: 0 auto 0 auto;
   width: 1190px;
*/
}

.item {
   cursor: pointer;
   width: 220px;
   height: 330px;
   margin: 5px;
   border: 2px solid #ddddd1;
   padding: 2px;
   display: inline-block;
/*
   float: left;
*/
   overflow: hidden;
}

.readborder {
   border-color: green !important;
}

.debug {
   position: absolute;
   top: 0px;
   left: 0px;
   z-index: 42;
}

div.sorter {
   position: absolute;
   float: left;
   top: 0px;
   left: 0px;
   z-index: 10;
   font-size: 24pt;
   font-weight: bold;
   font-family: 'Comic Sans MS';
}
div.name {
   position: absolute;
   float: right;
   top: 0px;
   right: 5px;
   z-index: 20;
   font-size: 24pt;
   font-weight: bold;
   font-family: 'Comic Sans MS';
}