/*
 Copyright (C) 2016 Jan-Dirk van Dingenen
 
 This program is free software: you can redistribute it and/or modify
 it under the terms of the GNU General Public License as published by
 the Free Software Foundation, either version 3 of the License, or
 (at your option) any later version.
 
 This program is distributed in the hope that it will be useful,
 but WITHOUT ANY WARRANTY; without even the implied warranty of
 MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
 GNU General Public License for more details.
 
 You should have received a copy of the GNU General Public License
 along with this program.  If not, see <http://www.gnu.org/licenses/>.
*/

@import 'https://fonts.googleapis.com/css?family=Special+Elite|Fredericka+the+Great';

    html {
        background-color: #000;
        background-image: url(img/table.jpg);
        background-repeat: no-repeat;
        background-size: cover;
        background-attachment: fixed;        
    }

    div#scores {
        display: flex;
        margin-top: 160px;
    }

    .scoreTable {
        padding: 20px;
        height: 600px;
        background-image: url(img/dossier.png);
        background-size: 400px 600px;
        padding-top: 50px;
        display: grid;
        grid-template-columns: 30px 260px 30px;
        grid-column-gap: 10px;
        width: 400px;
        box-sizing: border-box;
        font-family: 'Special Elite', cursive;
        word-break: break-all;
    }

    .scoreDiv {
        margin: 0px 30px;
        position: relative;
    }

    .scoreHead {
        padding: 9px 15px;
        text-align: center;
        font-size: 200%;
        background-image: url(/iaz/img/sessionInfoBack.png);
        background-size: 406px 60px;
        position: absolute;
        top: 4px;
        right: 30px;
        transform: translate(0%,-50%);
        white-space: nowrap;
        font-family: 'Special Elite', cursive;
        line-height: 43px;
    }

    .who {
        overflow: hidden;
        width: 260px;
        height: 19px;
    }
    
    .scored {
        text-align: right;
    }

    h1 {
        color: rgba(0, 0, 0, 0.91);
        text-align: center;
        width: 100%;
        position: fixed;
        top: 0px;
        left: 0px;
        margin-left: 37px;
        font-size: 650%;
        margin-top: 0px;
        font-family: 'Fredericka the Great', cursive;
        text-shadow: 0 0 5px rgba(255, 255, 255, 0.82);
    }
    
    .underDiv {
        position: absolute;
        width: 380px;
        height: 560px;
        background: #fff;
        top: 29px;
        z-index: -1;
        left: 0px;
        overflow: hidden;
    }
    
    .underDiv img {
        filter: sepia(100%);
    }

    #other {
        position: fixed;
        top: 3px;
        right: 5px;        
    }

    #other a {
        font-family:  monospace;
        color:rgba(255,255,255,0.8);
    }

    #other a:hover {
        text-decoration: none;
    }

::-webkit-scrollbar {
    width: 9px;
    height: 17px;
}
 
::-webkit-scrollbar-track {
    box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
    background-color: rgb(68, 68, 68);
    background: linear-gradient(to bottom, rgba(0,0,0,1) 0%,rgba(149,149,149,1) 5%,rgba(13,13,13,1) 13%,rgba(1,1,1,1) 16%,rgba(10,10,10,1) 19%,rgba(10,10,10,1) 19%,rgba(78,78,78,1) 26%,rgba(56,56,56,1) 39%,rgba(27,27,27,1) 42%,rgba(27,27,27,1) 58%,rgba(56,56,56,1) 61%,rgba(78,78,78,1) 75%,rgba(10,10,10,1) 81%,rgba(1,1,1,1) 84%,rgba(13,13,13,1) 87%,rgba(149,149,149,1) 95%,rgba(0,0,0,1) 100%);
}
 
::-webkit-scrollbar-thumb {
    box-shadow: inset 0 0 6px #1a230c;
    background-color: rgba(146,141,171,1);
    background: linear-gradient(to bottom, rgba(31,28,44,1) 1%,rgba(146,141,171,1) 53%,rgba(31,28,44,1) 100%);
    background-image: linear-gradient(to right, transparent 5%, rgba(255, 255, 255, 0.2) 50%, transparent 95%),linear-gradient(to bottom, rgba(255,255,255,0.5) 0%, rgba(255,255,255,0.4) 4%, rgba(255,255,255,0.2) 7%, rgba(255,255,255,0.2) 14%, rgba(255,255,255,0.8) 14%, rgba(255,255,255,0.2) 40%, rgba(255,255,255,0) 41%, rgba(255,255,255,0) 80%, rgba(255,255,255,0.2) 80%, rgba(255,255,255,0.4) 86%, rgba(255,255,255,0.6) 90%, rgba(255,255,255,0.1) 92%, rgba(255,255,255,0.1) 95%, rgba(255,255,255,0.5) 98%);
    border-radius: 10px/30px;
    border-left: 2px solid rgba(255,255,255,0.2);
    border-right: 2px solid rgba(255,255,255,0.2);
}