body {
    font-family: 'Open Sans', 'Helvetica', sans-serif;
    background-image:url('bg.png');
    background-position:center center;
    background-repeat: no-repeat;
    background-size: contain;
    background-color: #333333;
    padding:20px;
    min-height: 100%;
    cursor:default;
    text-align:center;
}
#gif {
    display:none;
    position:fixed;
    top:0px;
    left:0px;
    width:100%;
    height:100%;
    z-index:100;
    background-color:#000000;
    background-position:center center;
    background-repeat: no-repeat;
    background-size: contain;
}

#countdown {
    font-size: 8em;
    font-weight: bolder;
    color:#ff3737;
    text-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
    cursor:default;
    -webkit-text-stroke: 2px black;
}

#input {
    margin:150px 0px;
}
#passinput {
    padding:8px;
    font-size:3em;
    border-radius:100px;
    border: 3px solid #bbbbbb;
    background:#666666;
    color:#FFFFFF;
    text-align: center;
    letter-spacing: 1em;
    text-transform: uppercase;
    outline: none;
    font-family: 'VT323', monospace;
}
#passsubmit {
    padding:8px 20px;
    font-size:3em;
    border-radius:100px;
    border: 3px solid #bbbbbb;
    background:#ef3d3d;
    color:#FFFFFF;
    outline: none;
    margin-left: 20px;
    cursor:pointer;
}
#passsubmit[disabled] {
    opacity:0.4;
    cursor:not-allowed;
}
#passWrong {
    margin-bottom:60px;
}
#passGood>span, #passWrong>span {
    display:inline-block;
    padding:4px 10px;
    margin:10px;
    font-size:2em;
    color:#FFFFFF;
    border:2px solid #000000;
    border-radius:3px;
    letter-spacing: 15px;
    font-family: 'VT323', monospace;
    opacity:0.6;
    background:#666666;
}
#passGood>span[data-good] {
    opacity:1;
    background:green;
}
#passWrong>span[data-wrong] {
    opacity:1;
    background:red;
}
#nErrors {
    font-size:2.3em;
    color:#FFFFFF;
}