@media only all and (max-width: 720px) {
    /* for 700px or less */
    body {
      -ms-hyphens: auto;
      -webkit-hyphens: auto;
      hyphens: auto;
    }
    .frame-outer {
      margin: 0 auto;
      border: none;
      width: 100%;
    }
    .content {
      padding: 1.25rem 1rem;
    }
    .footer {
      padding: 1rem;
    }
    .left, .right {
      width: 100%;
    }
    h1{
      font-size: 1.8em;
    }
    p{
      text-align: left;
    }
}
@media only all and (max-width: 640px) {
  .title{
    background: linear-gradient(to right,#5a7e92,#698da1,#799db1,#89adc1,#99bdd1);
   -webkit-background: linear-gradient(to right,#5a7e92,#698da1,#799db1,#89adc1,#99bdd1);
   -moz-background: linear-gradient(to right,#5a7e92,#698da1,#799db1,#89adc1,#99bdd1);
   -ms-background: linear-gradient(to right,#5a7e92,#698da1,#799db1,#89adc1,#99bdd1);
  }
}
@media only all and (max-width: 528px) {
  .box{
    margin-top: 1rem;
  }
}

.refnr {}

.apply {}
