body {
    max-width: 500px;
    margin: auto;
    background: url('http://thecodeplayer.com/uploads/media/wood_pattern.png') repeat;
    text-align: center;
}

.display {
    font-family: 'Audiowide', cursive;
    color: red;
    font-size: 60px;
}

.timer {
    padding: 10px;
    background: linear-gradient(top, #222, #444);
    background-color: black;
    overflow: hidden;
    display: none;
    border: 7px solid #efefef;
    border-radius: 5px;
    position: relative;
    width: 275px;
    height: 100px;
    box-shadow: inset 0 -2px 10px 1px rgba(0, 0, 0, 0.75),
    0 5px 20px -10px rgba(0, 0, 0, 1);
}

.blinking {
    animation: blinkingText 0.8s infinite;
}

@keyframes blinkingText {
    0% {
        color: red;
    }
    49% {
        color: transparent;
    }
    50% {
        color: transparent;
    }
    99% {
        color: transparent;
    }
    100% {
        color: red;
    }
}

.blinkingRight {
    animation: blinkingTextR 0.8s infinite;
}

@keyframes blinkingTextR {
    0% {
        color: Green;
    }
    49% {
        color: transparent;
    }
    50% {
        color: transparent;
    }
    99% {
        color: transparent;
    }
    100% {
        color: Green;
    }
}

.question {
    border: 5px solid royalblue;
    border-radius: 5px;
    display: none;
    background-color: navajowhite;
}

.answer {
    border: 3px solid lightskyblue;
    background-color: lightskyblue;
    border-radius: 5px;
}

.answer:hover {
    border: 3px solid green;
    background-color: green;
}