@import url('https://fonts.googleapis.com/css2?family=Balsamiq+Sans:ital@1&display=swap');
 * {
     margin: 0;
     padding: 0;
     border: 0;
}
 body {
     font-family: 'Balsamiq Sans', sans-serif;
}
 body {
     background-image: -o-linear-gradient(rgba(102, 101, 101, 0.7), rgba(102, 101, 101, 0.7)),url(../images/planet-earth.jpg);
     background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(102, 101, 101, 0.7)), to(rgba(102, 101, 101, 0.7))),url(../images/planet-earth.jpg);
     background-image: linear-gradient(rgba(102, 101, 101, 0.7), rgba(102, 101, 101, 0.7)),url(../images/planet-earth.jpg);
     background-size: cover;
     background-position: center;
     height: auto;
     background-attachment: fixed;
}
 ul {
     list-style-type: none;
}
 h1 {
     font-size: 7em;
}
 header a {
     color: #fffde7;
}
 header a:hover {
     color: #fffde7;
}
 #landing-page ul:hover{
     -webkit-transform: scale(1.2);
     -ms-transform: scale(1.2);
     transform: scale(1.2);
     -webkit-transition: -webkit-transform .2s;
     transition: -webkit-transform .2s;
     -o-transition: transform .2s;
     transition: transform .2s;
     transition: transform .2s, -webkit-transform .2s;
}
/***USED OFTEN***/
 h1, h2, h3 {
     color: #fffde7;
}
 .decoration {
     color: #fffde7;
     font-family: "Balsamiq Sans";
     letter-spacing: 4px;
}
/***BUTTONS***/
 .answer-btn {
     width: 60%;
     padding: 20px;
     border-radius: 20px;
     background-color:#90caf9;
     font-size: 1.25rem;
     line-height: 1.5;
     display: inline-block;
}
 .answer-btn:hover {
     cursor: pointer;
}
 .answer-btn:focus {
     outline: 0;
}
 #quit-button {
     padding: .5rem 1rem;
     font-size: 1.25rem;
     line-height: 1.5;
     border-radius: .3rem;
     color: #fff;
     background-color: #dc3545;
     border-color: #dc3545;
     display: inline-block;
     font-weight: 400;
     text-align: center;
     vertical-align: middle;
     -webkit-transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,-webkit-box-shadow .15s ease-in-out;
     transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,-webkit-box-shadow .15s ease-in-out;
     -o-transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
     transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
     transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out,-webkit-box-shadow .15s ease-in-out;
     overflow: visible;
     text-transform: none;
}
 #quit-button:hover {
     background-color: #ca0518;
     border-color: #ca0518;
}
 .green {
     background-color: green;
     color: black;
}
 .red {
     background-color: red;
     color: black;
}
/***QUIZ IMAGES***/
 .question .card img {
     height: 100%;
     width: 100%;
}
/***MEDIA QUERIES***/
 @media screen and (max-width: 992px) {
     #landing-page ul:hover{
         -webkit-transform: none;
         -ms-transform: none;
         transform: none;
    }
     h1 {
         font-size: 4em;
    }
}
 @media screen and (max-width: 1620px) {
     #start-button{
         margin-bottom: 2rem;
    }
}