body{
    font-size: 20px;
    font-family: monospace;
    background-color: lightgrey;
    text-align: center;
  }
  
  #container{
    margin : 20px auto;
    background-color: grey;
    height: 300px;
    width : 700px;
    border-radius: 5px;
    position: relative;
  }

  #start{
    font-size: 1.5em;
    font-weight: bolder;
    word-break: break-all;
    width:150px;
    height:50px;
    border : 2px solid blue;
    text-align: center;
    cursor: pointer;
    position: relative;
    left:300px;
    top:50px;
    color : blue;
  }
  #start:hover{
    border: 3px solid lightseagreen;
    color : lightseagreen;
  }
  

  
  #question{
    width:600px;
    height : 100px;
    position: relative;
    text-align: center;
    top:0;
    background-color: dodgerblue;
    border : 1px solid grey;
    margin: 0px 0px 0px 20px;

  }
  #question p{
    padding : 5px;
    font-size: 1.25em;
  }
  
  #answers{
    width : 480px;
    position: absolute;
    top : 125px;
    padding : 15px;
    flex-direction: column;

  }
  .answer{
    display: inline-block;
    width : 600px;
    border : 1px solid grey;
    background-color: dodgerblue;
    border-radius: 5px;
    cursor: pointer;
    padding : 5px;
    flex-direction: column;
    justify-content: flex-start;
  }
  .answer:hover{
    border : 2px solid grey;
    font-weight: bold;
  }
  
  #timer{
    position: absolute;
    height : 100px;
    width : 200px;
    bottom : 0px;
    text-align: center;
  }
  #counter{
    font-size: 3em;
  }

  #scoreContainer{
    margin : 20px auto;
    opacity: 0.8;
    height: 300px;
    width : 700px;
    border-radius: 5px;
    box-shadow: 0px 5px 15px 0px;
    position: relative;
    display: none;
    background-color: dodgerblue;

  }
 
  #scoreContainer p{
    position: absolute;
    display: block;
    width : 600px;
    height :100px;
    top:0px;
    left:50px;
    font-size: 1.5em;
    font-weight: bold;
    justify-content: flex-start;
  }
  
  label{
    position: absolute;
    display: block;
    width : 500px;
    height :100px;
    top:100px;
    left:25px;
    font-size: 1em;
    justify-content: flex-start;
  }

  input{
    position: absolute;
    display: block;
    width : 150px;
    height :25px;
    top:100px;
    left:200px;
    justify-content: center;
  }

  button{
    position: absolute;
    display: block;
    width : 100px;
    height :30px;
    top:150px;
    left:25px;
    font-size: 1em;
    justify-content: flex-start;
  }


  .submit{
    display: inline-block;
    width : 200px;
    background-color: dodgerblue;
    border-radius: 5px;
    cursor: pointer;
    padding : 5px;
    flex-direction: column;
    justify-content: flex-start;
  }

  .highest:hover{
    border : 2px solid grey;
    font-weight: bold;
  }

  #highscoreContainer{
    margin : 20px auto;
    opacity: 0.8;
    height: 300px;
    width : 700px;
    border-radius: 5px;
    box-shadow: 0px 5px 15px 0px;
    position: relative;
    display: none;
    background-color: dodgerblue;

  }

  .restart{
    display: inline-block;
    width : 200px;
    background-color: green;
    text-align: center;
    border-radius: 5px;
    cursor: pointer;
    padding : 5px;
    flex-direction: column;
    justify-content: flex-start;
  }

  #cover{
    margin : 20px auto;
    opacity: 0.8;
    height: 300px;
    width : 700px;
    border-radius: 5px;
    box-shadow: 0px 5px 15px 0px;
    position: relative;
    display: none;
    background-color: dodgerblue;

  }