/* Media Queries
–––––––––––––––––––––––––––––––––––––––––––––––––– */

/* Smaller than mobile */
@media (min-width: 320px) {
  #text-form {
    display: none; }
  #info-contrasena {
    display: none; }
  .browsers {
    display: none; }

  .header {
      display: none; }
  .header-rsp {
      border-bottom: 1px dotted #ccc;
      text-align: center; }

    #pie {
    display: none; }

  .container {
    margin-top: -50px; }

  .content {
    padding: 0; }
  #content {
    background: none;
    border: none;
    width: 300px; }
  #content:after, #content:before {
    background: none;
    -webkit-transform: none;
       -moz-transform: none;
        -ms-transform: none;
         -o-transform: none;
            transform: none;
    border: none; }
  #content h1:before {
    background: none; }
  #content h1:after {
    background: none; }
  #content h1 {
      font: bold 25px 'Montserrat', sans-serif;
      line-height: 20px;
      margin: 20px 0 20px; }
    #text-form2 {
      font: 14px 'Montserrat', sans-serif;
      color: rgb(163, 163, 163);
      padding: 3px;
      margin-bottom: 20px; }
    #button-login {
      height: 40px;
      width: 120px; }
}

/* Larger than mobile */
@media (min-width: 400px) {
  #text-form {
    display: none; }
  #info-contrasena {
    display: none; }
  .browsers {
    display: none; }

  .header {
      display: none; }
  .header-rsp {
      border-bottom: 1px dotted #ccc;
      text-align: center; }

    #pie {
    display: none; }
  
  .content {
    padding: 0; }
  #content {
    background: none;
    border: none;
    width: 400px; }
  #content h1:before {
    background: none; }
  #content h1:after {
    background: none; }
  #content h1 {
      font: bold 25px 'Montserrat', sans-serif;
      line-height: 20px;
      margin: 20px 0 20px; }
    #text-form2 {
      font: 14px 'Montserrat', sans-serif;
      color: rgb(163, 163, 163);
      padding: 3px;
      margin-bottom: 20px; }
    #button-login {
      height: 40px;
      width: 120px; }
}

/* Larger than phablet (also point when grid becomes active) */
@media (min-width: 550px) {
  #text-form {
    display: none; }
  #info-contrasena {
    display: none; }
  .browsers {
    display: none; }

  .header-rsp {
      border-bottom: 1px dotted #ccc;
      text-align: center; }

  .container {
    margin-top: 35px; }  

    #content {
    background: none;
    border: none; }
  #content h1:before {
    background: none; }
  #content h1:after {
    background: none; }
  #content h1 {
      font: bold 25px 'Montserrat', sans-serif;
      line-height: 20px;
      margin: 20px 0 20px; }
    #text-form2 {
      font: 14px 'Montserrat', sans-serif;
      color: rgb(163, 163, 163);
      padding: 3px;
      margin-bottom: 20px; }
    #button-login {
      height: 40px;
      width: 120px; }
}

/* Larger than tablet */
@media (min-width: 750px) {
  #text-form {
    display: none; }
  #info-contrasena {
    display: none; }
  .browsers {
    display: none; }

  .header-rsp {
      border-bottom: 1px dotted #ccc;
      text-align: center; }

    #content {
    background: none;
    border: none; }
  #content h1:before {
    background: none; }
  #content h1:after {
    background: none; }
  #content h1 {
      font: bold 25px 'Montserrat', sans-serif;
      line-height: 20px;
      margin: 20px 0 20px; }
    #text-form2 {
      font: 14px 'Montserrat', sans-serif;
      color: rgb(163, 163, 163);
      padding: 3px;
      margin-bottom: 20px; }
    #button-login {
      height: 40px;
      width: 120px; }
}

/* Larger than desktop */
@media (min-width: 960px) {
  #text-form {
    display: block; }
  #text-form2 {
    display: none; }
  #info-contrasena {
    display: block; }
  .browsers {
    display: block; }

  .header {
      display: block; }
  .header-rsp{
    border: none; }
  #header-rsp {
      display: none; }

    #pie {
    display: block; }
  #footer p{
    margin: 0;
    padding: 0; }
  .footer-rsp {
    display: none; }

  #content {
    background: #f9f9f9; 
    border: 1px solid #c4c6ca; }
  #content h1:before {
    background: -webkit-linear-gradient(right, rgba(126,126,126,1) 0%,rgba(255,255,255,1) 100%);
    background: -o-linear-gradient(right, rgba(126,126,126,1) 0%,rgba(255,255,255,1) 100%);
        background: -ms-linear-gradient(right, rgba(126,126,126,1) 0%,rgba(255,255,255,1) 100%);
        background: linear-gradient(right, rgba(126,126,126,1) 0%,rgba(255,255,255,1) 100%); }
  #content h1:after {
    background: -webkit-linear-gradient(right, rgba(126,126,126,1) 0%,rgba(255,255,255,1) 100%);
    background: -o-linear-gradient(right, rgba(126,126,126,1) 0%,rgba(255,255,255,1) 100%);
        background: -ms-linear-gradient(right, rgba(126,126,126,1) 0%,rgba(255,255,255,1) 100%);
        background: linear-gradient(right, rgba(126,126,126,1) 0%,rgba(255,255,255,1) 100%); }
    #content h1 {
      font: bold 25px Helvetica, Arial, sans-serif;
      margin: 10px 0 30px; }
    #button-login {
      height: 40px;
      width: 120px; 
      margin-top: 10px;}
}

/* Larger than Desktop HD */
@media (min-width: 1200px) {
  #text-form {
    display: block; }
  #text-form2 {
    display: none }
  #info-contrasena {
    display: block; }
  .browsers {
    display: block; } 
}