/* mobile only styles - 
 *  targeting small screens in landscape
 * --------------------------------------- */

@media only screen
and (max-width : 800px) 
and (max-height : 450px)
{
  body{
    position: relative;
  }
  
  h1#logo,
  body:not(.fp-viewing-section-home) h1#logo{
    top: 2px;
    left: 2px;
    transform: scale(.7,.7);
    transform-origin: 0 0;
  }
  .menu-button-wrapper{
    top: 2px;
  }
#menu li a,
#menu li.active a{
  padding: 5px 64px;
  display: block;
  text-align: center;
  font-size: 2.25rem;
  font-weight: 200;
  text-transform: uppercase;
  border: 5px solid transparent;
  border-width: 5px 0;
}
  
  #fp-nav.right ul li{
    margin: 7px 1px;
  }
  /* arrows */
  #moveUp{
    top: 3px;
    bottom: auto;
    transform: scale(.7,.7);
    transform-origin: 0 0;
  }
  #moveDown{
    top:auto;
    bottom: 3px;
    transform: scale(.7,.7);
    transform-origin: 0 100%; /* scale to left */
  }
  /* left/right arrows - slides */
  .fp-controlArrow.fp-prev {
    left: 12px;
  }
  .fp-controlArrow.fp-next {
    right: 12px;
  }
  
  /* shrinking the form */
  form{
  }
  .input-text input[type=email], .input-text input[type=password], .input-text input[type=search], .input-text input[type=text], .input-textarea textarea{
    margin-bottom: 1px;
  }
  .captcha-holder{
    height: 38px;
    overflow:hidden;
  }
  .g-recaptcha{
    width: 100%;
    text-align: left;
    display: block;
    transform:scale(0.5);
    -webkit-transform:scale(0.5);
    transform-origin:0 0;
    -webkit-transform-origin:0 0;
    position: relative;
    left: 22%;
  }



  
  
}

/* END  /\ 
 * @media 
 * (max-device-width : 800px) 
 * (max-device-height : 450px) 
 * (orientation : landscape)
 * --------------------------------------- */





/* mobile only styles - 
 *  targeting small screens in portrait
 * --------------------------------------- */

@media only screen
and (max-height : 800px) 
and (max-width : 450px)
{
  body{
    border: 1px solid green;
    position: relative;
  }
  
  h1#logo,
  body:not(.fp-viewing-section-home) h1#logo{
    top: 2px;
    left: 2px;
    transform: scale(.7,.7);
    transform-origin: 0 0;
  }
  /* left/right arrows - slides */
  .fp-controlArrow.fp-prev {
    left: 2px;
  }
  .fp-controlArrow.fp-next {
    right: 2px;
  }


/* END 
 * @media 
 * 
 * 
 * (orientation : portrait)
 * --------------------------------------- */
}
