@media only screen and (max-width: 1050px){
  html {font-size: 14px}
}

@media only screen and (max-width: 920px){
  html {font-size: 12px}
}

@media only screen and (max-width: 880px){
  .header-nav #navigation ul li {background: none; padding: 0 0 0 0; margin: 0 20px 0 0}
}

@media only screen and (max-width: 820px){
  html {font-size: 14px}
}

@media only screen and (max-width: 700px){
  .sections > .section {float: none; width: 100%; margin: 0 0 30px 0;}

  .banner .banner-inner ul li .banner-caption {bottom: 20px; right: 20px; padding: 10px; font-size: 1.5rem}
  #testimonials {display: none}
}

@media only screen and (max-width: 730px){
  .pre-header {padding: 10px 0;}
    .pre-header .sign-up {float: none; margin-bottom: 15px;}
      .pre-header .sign-up form {text-align: center}
    .pre-header .social {float: none}
      .pre-header .social ul li {margin-right: 15px;}
        .pre-header .social ul li a {width: 20px; height: 20px; background-size: 20px 20px !important}

    #footer-social .social ul li {margin-right: 25px}
            #footer-social .social ul li a {width: 20px; height: 20px; background-size: 20px 20px !important}
}

@media only screen and (max-width: 420px){
  .pre-header .sign-up form label {display: none !important}
}

@media only screen and (max-width: 402px){
  .pre-header .sign-up form label {display: block !important; float: none; text-align: center; line-height: 1; margin: 0 0 5px 0;}

  .banner .banner-inner ul li .banner-caption {display: none}
}