/* Big Tablet to 1200px */
@media only screen and (max-width: 1200px) {

}

/* Small Tablet to Big Tablet: 768 to 1023px */
@media only screen and (max-width: 1023px) {
  h1 {
    font-size: 200%;
  }
  #card {
    margin-top: 8%;
    margin-bottom: 8%;
    width: 75%;
  }
  .links a span {
    visibility: visible;
    color: #333;
    background-color: transparent;
    font-size: 60%;
  }
}

/* Small Phone to Tablet: 481 to 767px(~iPad) */
@media only screen and (max-width: 767px) {
  * {
    font-size: 100%;
  }
  #card {
    width: 95%;
    margin-top: 10%;
  }
}

/* Small Phone: 0 to 480px */
@media only screen and (max-width: 480px) {
  #card {
    margin-top: 2%;
    margin-bottom: 15%;
  }
  #content {
    padding: 30px 20px;
  }
  #links {
    margin-top: 25px;
  }
}