body {
    height: 100vh;
    background: url("../images/timer afbeelding 4.jpg") no-repeat center fixed;
    background-size: cover;
}

#timer-container {
    text-align: center;
    color: white;
    text-shadow: 0 0 2px #0f0f0f;
}

#timer-container #clock {
    font-size: 100px;
}

#input-container {
    margin: 8px 0;
    text-align: center;
}
#input-container .input-fake {
    margin: 3px;

    border: 2px solid rgba(51, 51, 51, 0.8);
    background: rgba(51, 51, 51, 0.5);

    color: white;
    text-shadow: 0 0 2px #0f0f0f;

    float:left;

    overflow: hidden;

    line-height: 100%;
}

#submit {
    margin: 8px 0;
}

#codeInput {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
}

.success {
	background: rgba(0, 0, 0, 0.85);
	position: absolute;
    top: 10px;
    width: 100%;
    text-align: center;
	display: none;	
	animation: 1s ease-out 0s 1 slideInFromLeft;
}

.success img {
	max-height:140vh;
	max-width: 90vw;
}

@keyframes slideInFromLeft {
    0% {
        transform: translateX(-100%);
    }
    100% {
        transform: translateX(0);
    }
}