/* This Source Code Form is subject to the terms of the Mozilla Public
 * License, v. 2.0. If a copy of the MPL was not distributed with this
 * file, You can obtain one at http://mozilla.org/MPL/2.0/. */

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

  #wrapper {
      min-width: 320px;
      width: 100%;
      margin: 0 auto;
  }

  header, footer {
    padding: 5px 20px;
  }

  header ul li:nth-child(2) {
      display: none;
  }

  button {
    height: 40px;
    font-size: 18px;
  }

  input[type=email],
  input[type=password] {
    font-size: 17px;
  }

  section {
    position: static;
    overflow: visible;
    display: none;
  }

  .inputs > li > label {
    font-size: 18px;
    margin-bottom: 10px;
  }

  .vertical > strong {
    font-size: 20px;
  }

  #signIn,
  #favicon {
      display: block;
      width: 100%;
      /* Changed this from relative to static to fix issue #1309 - tooltips
       * being partially cut off by the site URL bar
       */
      position: static;
  }

  #favicon {
    padding: 10px;
  }

  #signIn {
      padding: 0;
  }

  #signIn .container {
      width: 100%;
      padding: 20px;
  }

  #signIn form {
      padding: 0;
  }

  #favicon {
      border-bottom: 1px solid rgba(0,0,0,0.05);
      background-image: url('/i/bg.png');
      text-align: center;
      left: 0;
  }

  #favicon img {
      width: 32px;
      height: auto;
      display: inline;
      margin: 0;
      vertical-align: middle;
  }

  #favicon .vertical {
      height: auto;
      line-height: 20px;
  }

  #formWrap {
      background-color: transparent;
  }

  .waiting #wait, .delay #delay, #error #error {
      display: block;
  }

  .waiting #formWrap, .delay #formWrap, .error #formWrap, .delay #wait, .error #wait, .error #delay {
      display: none;
  }

  .arrow {
      display: none;
  }

  #checkemail p {
      height: 250px;
  }

  #signIn .vertical {
    padding: 10px;
  }

  #signIn .vertical ul li {
    margin-top: 20px;
  }

  #selectEmail > .inputs > li > label {
    margin: 0;
    padding: 15px 1px;
  }

  #signIn .submit {
    position: static;
    line-height: 1.6;
    margin-top: 25px;
  }

  #signIn .submit > p {
    font-size: 14px;
    display: block;
  }

  #signIn .submit > p:first-child {
    padding: 0;
    margin-bottom: 20px;
  }

  .form_section {
    margin-top: 20px;
  }

  #content, .form_section, .inputs, .vertical {
    height: auto;
    max-height: none;
    overflow: visible;
  }

  .submit #cancel, #signIn .submit #cancel {
    font-size: 18px;
    line-height: 40px;
  }

  #useNewEmail {
    margin-top: 18px;
  }

  #error {
    position: static;
  }

  #error .vertical, #delay .vertical, #wait .vertical {
    height: 250px;
  }

  #error .vertical {
    width: auto;
  }

  #error .vertical > div {
    display: block;
    height: auto;
    padding: 10px;
  }

  a.emphasize {
    font-size: 13px;
  }