html{
    height: 100%;
    background: radial-gradient(circle, #fcc3c3, #e7d3d3);
    background: -ms-radial-gradient(circle, #fcc3c3, #e7d3d3);
    background: -o-radial-gradient(circle, #fcc3c3, #e7d3d3);
    background: -webkit-radial-gradient(circle, #fcc3c3, #e7d3d3);
    background: -moz-radial-gradient(circle, #fcc3c3, #e7d3d3);
}

#container{
    height:500px;
    width: 500px;
    background: radial-gradient(#e1c5c5,#b46464 75%);
    background: -ms-radial-gradient(#e1c5c5,#b46464 75%);
    background: -o-radial-gradient(#e1c5c5,#b46464 75%);
    background: -moz-radial-gradient(#e1c5c5,#b46464 75%);
    background: -webkit-radial-gradient(#e1c5c5,#b46464 75%);
    margin: 130px auto;
    border-radius: 30px;
    padding: 20px;
    box-shadow: 5px 5px 15px 0px #827c7c;
    -moz-box-shadow: 5px 5px 15px 0px #827c7c;
    -webkit-box-shadow: 5px 5px 15px 0px #827c7c;
    position: relative;
}
#time{
    float:left;
    padding: 20px 10px 10px 10px;
    font-family: sans-serif;
    font-weight: 550;
    color: black;
/*    visibility: hidden;*/
    display:none;
}

#currentLevel{
    padding: 0px 13px 5px 10px;
    float: right;
    font-family: sans-serif;
    font-weight: 550;
    color: #565656;
    text-align: left;
    width: 85px;
}

#score{
    padding: 5px 13px 10px 10px;
    float: right;
    font-family: sans-serif;
    font-weight: 550;
    clear: right;
    text-align: left;
    width: 85px;
}

#correct{
    padding:20px;
    position:absolute;
    left: 215px;
/*    background-color: #9f7bc5;*/
    background:radial-gradient(white 2%,#9f7bc5);
    background:-ms-radial-gradient(white 2%,#9f7bc5);
    background:-o-radial-gradient(white 2%,#9f7bc5);
    background:-moz-radial-gradient(white 2%,#9f7bc5);
    background:-webkit-radial-gradient(white 2%,#9f7bc5);
    border-radius:20px;
    font-size: 20px;
    font-weight: 500;
    font-family: sans-serif;
    display:none;
}
#wrong{
    padding:20px;
    position:absolute;
    left: 210px;
/*    background-color: #9f7bc5;*/
    background:radial-gradient(white 2%,#ebda8d);
    background:-ms-radial-gradient(white 2%,#ebda8d);
    background:-o-radial-gradient(white 2%,#ebda8d);
    background:-moz-radial-gradient(white 2%,#ebda8d);
    background:-webkit-radial-gradient(white 2%,#ebda8d);
    border-radius:20px;
    font-size: 20px;
    font-weight: 500;
    font-family: sans-serif;
    display:none;
}
#question{
    background-color: #dcd5d5;
    border-radius: 3px;
    height: 200px;
    margin:70px 50px 10px 50px;
    padding: 0px;
    font-size: 7em;
    text-align: center;
    color: #4e4d4a;
    font-family:cursive, sans-serif;
    line-height: 200px;
}
#instructions{
    height: 50px;
    color: black;
    font-family:sans-serif;
    text-align: center;
    line-height: 50px;
    font-weight:500;
    margin: 0px 15px;
}
#answers{
/*    border:solid;*/
    height:100px;
    padding: 0px 20px;
    margin-top: 10px;
        
}
.ans{
    box-shadow: 2px 2px 5px 0px #3e3d3b;
    -moz-box-shadow: 2px 2px 5px 0px #3e3d3b;
    -webkit-box-shadow: 2px 2px 5px 0px #3e3d3b;
    float:left;
    height:90px;
    width:100px;
    border-radius: 2px;
    margin-left: 12px;
    background-color: #6f6e6b;
    color:white;
    font-family: cursive, sans-serif;
    font-size: 2em;
    text-align: center;
    line-height: 3;
    cursor: pointer;
    transition: all 1s ease;
    -o-transition: all 1s ease;
    -moz-transition: all 1s ease;
    -ms-transition: all 1s ease;
    -webkit-transition: all 1s ease;
}

.ans:active{
    border: 0.7px solid black;
    box-shadow:none;
    -webkit-box-shadow:none;
    -moz-box-shadow:none;
    background-color: #3a3a3a;
}
#start{
    padding: 10px;
    width: 70px;
    margin:10px auto;
    text-align:center;
    font-family: cursive, sans-serif;
    font-weight: 550;
    background-color:#e1c5c5;
    border-radius: 5px;
    border: 0.5px solid #727272;
    box-shadow: 2px 2px 5px 0px #727272;
    -webkit-box-shadow: 2px 2px 5px 0px #727272;
    -moz-box-shadow: 2px 2px 5px 0px #727272;
    cursor: pointer;
}

#start:active{
    background-color: #fcc3c3;
    border: 1px solid #727272;
}
#over{
    z-index: 1;
    background: linear-gradient(#5ac0e1,white,#5ac0e1);
    background: -moz-linear-gradient(#5ac0e1,white,#5ac0e1);
    background: -o-linear-gradient(#5ac0e1,white,#5ac0e1);
    background: -ms-linear-gradient(#5ac0e1,white,#5ac0e1);
    background: -webkit-linear-gradient(#5ac0e1,white,#5ac0e1);
    border-radius: 15px;
    border:1px solid #5ac0e1;
    font-family:sans-serif;
    font-size: 2em;
    font-weight: 550;
    padding:10px;
    text-align:center;
    position:absolute;
    top: 110px;
    left: 35px;
    height: 300px;
    width: 450px;
    line-height: 3.2;
    display: none;
}

#level{
    z-index: 1;
    background: linear-gradient(white,#16e36f);
    background: -moz-linear-gradient(white,#16e36f);
    background: -o-linear-gradient(white,#16e36f);
    background: -ms-linear-gradient(white,#16e36f);
    background: -webkit-linear-gradient(white,#16e36f);
    border-radius: 15px;
    border:0.5px solid #16e36f;
    font-family:sans-serif;
    font-size: 2em;
    font-weight: 550;
    padding:10px;
    text-align:center;
    position:absolute;
    top: 110px;
    left: 35px;
    height: 300px;
    width: 450px;
    line-height: 3.2;
    display: none;
}

#footer p{
    color: black;
    font-family: cursive;
    text-decoration: none;
    text-align: center;
    height: 90px;
    font-weight: normal;
}

#footertext a{
    color: black;
    font-family: cursive;
    text-decoration: none;
    font-weight: normal;
}

#footertext a:hover {
    color: #565656;
    font-family: sans-serif;
    text-decoration: none;
    font-weight: normal;
}

#footertext a:visted {
    color: black;
    font-family: sans-serif;
    text-decoration: none;
    font-weight: normal;
}