/* RESPONSIVE CSS
-------------------------------------------------- */

@media screen and (max-width: 1500px) {
  #question .row { transform: scale(.9); }
}

@media screen and (max-width: 1300px) {
  #question .row { transform: scale(.75); }
}

@media screen and (max-width: 1023px) {
  .mobile-hide { display: none; }
  .mobile-show { display: block; }
  svg { width: 90%; height: auto; }
  #question .row { transform: scale(1); }
  /*#start h1 { padding: 0 30px; }*/
}

@media screen and (max-width: 991px) {
  #question button { font-size: 18px; line-height: 22px; width: 100%; height: 90px; margin: 10px 0; }
}

@media screen and (max-width: 768px) {
  #start h1 { font-size: 20px; line-height: 28px; }
  #question h1 { font-size: 60px; line-height: 65px; }
  #incorrect .content, #correct .content { padding: 0; }
  #incorrect h1, #correct h1 { font-size: 65px; }
  #incorrect p, #correct p { font-size: 18px; padding: 0 30px; }
  #incorrect button { font-size: 18px; line-height: 30px; height: 44px; }
  #congratulations h1 { font-size: 18px; line-height: 24px; }
  #congratulations button { font-size: 16px; line-height: 20px; width: 85%; }
}

@media screen and (max-width: 767px) {
}

@media screen and (max-width: 550px) {
  #question h1 { font-size: 33px; }
}

@media screen and (max-width: 414px) {
}

@media screen and (max-width: 375px) {
}

@media screen and (max-width: 320px) {
  #incorrect p, #correct p { line-height: 22px }
}