/*
File Name - responsive.scss
Purpose - Contains styles for making the site mobile friendly, all responsive design classes for existing elements;
Defines device breakpoints:
    Small - 0-599px
    Medium - 600-899px
    Large - 900-1535px
*/
/*Imports*/
/*
File Name - variables.scss
Purpose - All variables for fonts and colors are found here, this file is imported into all SASS style sheets for the site
*/
/*Color Variables*/
/*Font Variables*/
/*Values*/
/*Font Setup*/
@font-face {
  font-family: 'ClearSans-Regular';
  src: url("../assets/fonts/ClearSans-Regular.woff") format("woff"), url("../assets/fonts/ClearSans-Regular.ttf") format("truetype"), url("../assets/fonts/ClearSans-Regular.eot") format("eot"), url("../assets/fonts/ClearSans-Regular.svg") format("svg");
  font-weight: normal;
  font-style: normal; }

@font-face {
  font-family: 'ClearSans-Bold';
  src: url("../assets/fonts/ClearSans-Bold.woff") format("woff"), url("../assets/fonts/ClearSans-Bold.ttf") format("truetype"), url("../assets/fonts/ClearSans-Bold.eot") format("eot"), url("../assets/fonts/ClearSans-Bold.svg") format("svg");
  font-weight: normal;
  font-style: normal; }

@font-face {
  font-family: 'ClearSans-Light';
  src: url("../assets/fonts/ClearSans-Light.woff") format("woff"), url("../assets/fonts/ClearSans-Light.ttf") format("truetype"), url("../assets/fonts/ClearSans-Light.eot") format("eot"), url("../assets/fonts/ClearSans-Light.svg") format("svg");
  font-weight: normal;
  font-style: normal; }

@font-face {
  font-family: 'ClearSans-Thin';
  src: url("../assets/fonts/ClearSans-Thin.woff") format("woff"), url("../assets/fonts/ClearSans-Thin.ttf") format("truetype"), url("../assets/fonts/ClearSans-Thin.eot") format("eot"), url("../assets/fonts/ClearSans-Thin.svg") format("svg");
  font-weight: normal;
  font-style: normal; }

@media screen and (max-width: 599px) {
  #footerContentTop {
    padding: 25px; }
  #LV-logo {
    left: 20px;
    padding-left: 20px;
    top: 0;
    left: 20px; }
  #supportHeader {
    height: 65px;
    box-shadow: 0 3px 4px 0 rgba(3, 29, 70, 0.18); }
  #viewAll2 {
    margin-top: 0; }
  .responsive-wrap {
    display: block; }
  .topic-button-home {
    display: none; }
  .qsg-link {
    width: 100%; }
  .lv-caret:lang(ar), .lv-caret:lang(he) {
    right: 10px; }
  .all-button {
    float: left; }
  .intro:lang(ar), .intro:lang(he) {
    padding-left: 20px;
    padding-right: 0; }
  .page-heading {
    font-size: 24px;
    padding-right: 0;
    padding-left: 15px; }
  .article-header {
    padding: 15px; }
  .help-container {
    padding: 15px; }
  .help-box {
    display: block; }
  .help-text {
    margin-bottom: 30px; }
  .section {
    padding: 15px;
    margin-bottom: 0; }
  .lv-hamburger-wrapper {
    display: block;
    margin-right: 20px; }
  .lv-hamburger-wrapper:lang(ar), .lv-hamburger-wrapper:lang(he) {
    margin-right: 0;
    margin-left: 20px; }
  .lv-hamburger {
    display: block; }
  .footerWrap {
    left: 0;
    padding-top: 15px;
    margin-right: 0;
    max-width: 100%;
    width: 100%; }
  .footerWrap:lang(ar), .footerWrap:lang(he) {
    right: 0;
    margin-left: 0; }
  .about-footer-img {
    right: 30px;
    top: 20px;
    width: 100%;
    background-size: 120%; }
  .video-title {
    font-size: 19px; } }

@media screen and (min-width: 600px) and (max-width: 899px) {
  #footerContentTop {
    padding: 25px; }
  #LV-logo {
    position: relative;
    padding-left: 20px;
    top: 0;
    left: 20px; }
  #supportHeader {
    height: 65px;
    box-shadow: 0 3px 4px 0 rgba(3, 29, 70, 0.18); }
  #viewAll2 {
    margin-top: 0; }
  .responsive-wrap {
    display: block; }
  .topic-button-home {
    display: none; }
  .qsg-link {
    width: 100%; }
  .page-heading {
    font-size: 24px;
    padding-right: 0; }
  .article-header {
    padding: 15px; }
  .help-container {
    padding: 15px; }
  .help-box {
    display: block; }
  .help-text {
    margin-bottom: 30px; }
  .section {
    padding: 15px;
    margin-bottom: 0; }
  .lv-hamburger-wrapper {
    display: block;
    margin-right: 20px; }
  .lv-hamburger {
    display: block; }
  .footerWrap {
    left: 0;
    padding-top: 15px;
    margin-right: 0;
    max-width: 100%;
    width: 100%; }
  .footerWrap:lang(ar), .footerWrap:lang(he) {
    right: 0;
    margin-left: 0; }
  .about-footer-img {
    right: 0;
    top: 20px;
    width: 100%; }
  .video-title {
    font-size: 19px; } }

@media screen and (min-width: 600px) and (max-width: 899px) and (min-width: 768px) and (max-width: 899px) {
  #supportHeader {
    display: none; }
  #supportTitle {
    display: inline-block; }
  #marketingLinks {
    margin-right: 35px; }
  #languageText {
    font-size: 14px; }
  #languageText:lang(es-mx) {
    font-size: 12px; }
  .subheader:lang(en-GB) {
    font-size: 19px;
    padding-top: 2.5px; }
  .subheader:lang(es) {
    font-size: 18px;
    padding-top: 2.5px; }
  .subheader:lang(fr) {
    font-size: 16px;
    padding-top: 2.5px; }
  #languageSelectWrapperSupportHeader:lang(fr) {
    margin-top: 18px; }
  .subheader:lang(de) {
    font-size: 20px;
    padding-top: 2.5px; }
  .subheader:lang(it) {
    font-size: 14px; }
  .nav-links:lang(it) {
    font-size: 13px; }
  #languageSelectWrapperSupportHeader:lang(it) {
    margin-top: 15px; }
  .subheader:lang(nl) {
    font-size: 15px;
    padding-top: 2.5px; }
  .nav-links:lang(nl) {
    font-size: 14px; }
  #languageSelectWrapperSupportHeader:lang(nl) {
    margin-top: 18px; } }

@media screen and (min-width: 900px) and (max-width: 1280px) and (min-width: 900px) and (max-width: 990px) {
  .footerWrap {
    left: 0;
    margin-right: 0;
    max-width: 100%;
    width: 100%; }
  .footerWrap:lang(ar), .footerWrap:lang(he) {
    right: 0;
    margin-left: 0; }
  #supportHeader {
    display: none; }
  #supportTitle {
    display: inline-block; }
  .responsive-wrap {
    display: block; }
  .topic-button-home {
    display: none; } }

@media screen and (min-width: 900px) and (max-width: 1280px) and (max-width: 1024px) {
  .subheader:lang(it) {
    font-size: 18px; }
  .nav-links:lang(it) {
    font-size: 16px; } }

@media screen and (max-width: 990px) {
  #background-banner {
    height: initial;
    min-width: 0px; } }