/*
File Name - site.scss
Purpose - Styles that can be reused site wide and are not bound to a specfic section of the site, like footer/header stylings or common classes.
*/
/*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*/
/*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;
}
/*Font Definitions*/
@font-face {
  font-family: myFirstFont;
  src: url(sansation_light.woff);
}
/*Identifiers*/
#versionInfo {
  color: #767676;
  font-size: 18px;
  position: relative;
  top: 15px;
  right: -1em;
}

#versionButton {
  padding: 0;
  border-radius: 50%;
  background-color: #e0f2ff;
  border-color: #e0f2ff;
  font-size: 0.75rem;
  line-height: 1.2;
  position: relative;
  bottom: 3px;
  color: #0098ff !important;
}

#cookie-banner-popup {
  position: fixed;
  z-index: 100;
  display: none;
  font-size: 15px;
  border-radius: 0px;
  top: 0;
  width: 100%;
}

#LLU-logo-nav-support {
  width: 170px;
  height: 35px;
  position: relative;
  background-image: url("../assets/images/logos/LLU-Logo.png");
  top: 11px;
  margin-left: 10px;
  z-index: 1;
}
#LLU-logo-nav-support:lang(ar) {
  background-image: url("../assets/images/logos/LLU-Logo-arabic.png");
  height: 45px;
  top: 5px;
}

#LLU-logo-foot {
  background-image: url("../assets/images/logos/LLU-Logo.png");
  height: 45px;
  margin-bottom: 20px;
  position: relative;
  right: 20px;
  width: 190px;
}
#LLU-logo-foot:lang(ar) {
  background-image: url("../assets/images/logos/LLU-Logo-arabic.png");
  left: 7px;
  right: auto;
}

#footerContentTop {
  padding-top: 30px;
  display: block;
  overflow: auto;
}
#footerContentTop .language-text {
  display: inline-block;
  position: relative;
  top: 1px;
}

#footerContentBottom {
  padding-top: 30px;
  padding-bottom: 10px;
  background-color: #101010;
  overflow: auto;
  display: block;
}
#footerContentBottom p {
  color: #767676;
  font-size: 12px;
  text-align: left;
  width: auto;
  margin: auto auto 10px auto;
}

#footerContentBottomSub {
  padding-bottom: 20px;
  background-color: #101010;
  overflow: auto;
  display: block;
}
#footerContentBottomSub p {
  color: #767676;
  font-size: 12px;
  text-align: left;
  width: auto;
  margin: auto auto 10px auto;
}

#navSupportTitle {
  color: rgb(232, 80, 34);
  font-family: "ClearSans-Light";
  font-size: 27px;
  display: inline-block;
}

#supportLinks {
  display: inline-block;
  height: 100%;
  margin-right: 15px;
  float: right;
}
#supportLinks .links {
  font-size: 16px;
  opacity: 0.7;
  margin-right: 15px;
  position: relative;
  top: 15px;
}

#marketingLinks {
  display: inline-block;
  font-size: 15px;
  float: right;
  font-family: "ClearSans-Light" !important;
}
#marketingLinks .links {
  color: #767676;
  margin: auto;
  position: relative;
  top: 15px;
  text-decoration: none;
  opacity: 0.75;
}
#marketingLinks .links:hover {
  opacity: 1;
}
#marketingLinks .header-link {
  color: #222222;
  /*padding: 20px;*/
  margin-right: 20px;
}
@media screen and (min-width: 1350px) {
  #marketingLinks:lang(es-mx), #marketingLinks:lang(ru) {
    margin-top: -29px;
  }
}

#languageText {
  cursor: pointer;
  margin-right: 15px;
}
#languageText:lang(ar), #languageText:lang(he) {
  margin-left: 15px;
  margin-right: 0;
}

#languageSelectWrapperHomeHeader {
  margin-top: 15px;
  width: auto;
  float: right;
  position: relative;
  max-width: 245px;
}
#languageSelectWrapperHomeHeader:lang(ar), #languageSelectWrapperHomeHeader:lang(he) {
  float: left;
  left: auto;
  right: 35px;
}

#countryFlag {
  width: 24px;
  height: 24px;
  position: relative;
  display: inline-block;
  margin-right: 5px;
}
#countryFlag:lang(ar), #countryFlag:lang(he) {
  margin-left: 5px;
  margin-right: 0;
}

/*#languageSelectWrapperSupportHeader {
    margin-top: 15px;
    width: auto;
    float: right;
    position: relative;
    left: 25px;
    font-size: 16px;
    max-width: 245px;
}

#languageSelectWrapperSupportHeader:lang(ar) {
    float: left;
    left: auto;
    right: 25px;
}*/
/*Classes*/
.headerText {
  font-family: "ClearSans-Regular";
  font-size: 16px;
}

.footerText {
  font-family: "ClearSans-Regular";
  color: #767676;
  font-size: 15px;
}
.footerText a {
  color: #767676;
  text-decoration: none;
  display: block;
  margin: 0 0 5px;
}
.footerText .extra-padding-bot {
  padding-bottom: 20px;
}

.image-bg {
  background-position: 100%;
  background-repeat: no-repeat;
  background-size: 100%;
}

.card-answer {
  display: none;
  width: 100%;
  padding: 10px 20px 5px;
  -webkit-align-self: flex-start;
  -ms-flex-item-align: start;
  align-self: flex-start;
  border-top: 2px solid rgba(71, 120, 141, 0.05);
  background-color: #fff;
  box-shadow: none;
  font-family: "ClearSans-Light";
  color: white;
  line-height: 20px;
}
.card-answer li {
  color: #444;
}

.w-input {
  display: block;
  width: 100%;
  height: 38px;
  padding: 8px 12px;
  margin-bottom: 10px;
  font-size: 14px;
  line-height: 1.42857143;
  color: #333333;
  vertical-align: middle;
  background-color: white;
  border: 1px solid #ccc;
}

.form {
  overflow: auto;
}

.form-field {
  width: 220px;
  resize: none;
}
.form-field.long {
  width: 300px;
}
.form-field.massive {
  width: 100%;
  height: 100px;
}

.form-block {
  margin-right: 20px;
  margin-bottom: 10px;
  margin-left: 2px;
  float: left;
}
.form-block:lang(ar), .form-block:lang(he) {
  float: right;
}

.form-label {
  display: inline-block;
  margin-bottom: 5px;
  font-family: "ClearSans-Regular";
  font-size: 14px;
  font-weight: 400;
}

.form.divider {
  margin-bottom: 20px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  overflow: auto;
}

.form-dropdown {
  width: 300px;
  margin-top: 20px;
  margin-bottom: 20px;
  display: block;
  height: 38px;
  padding: 8px 12px;
  font-size: 14px;
  line-height: 1.42857143;
  color: #333333;
  vertical-align: middle;
  background-color: white;
  border: 1px solid #ccc;
}

.form-submit {
  display: block;
  width: 100%;
  margin-top: 10px;
  margin-bottom: 0px;
  float: right;
  opacity: 0.75;
  text-align: center;
}

/*Regulatory page classes*/
.header-line {
  margin-top: 0px;
  margin-bottom: 10px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.12);
  background-image: none;
  box-shadow: none;
}

.qr-code {
  width: 140px;
  height: 140px;
  border-radius: 10px;
}

.reg-heading {
  display: inline-block;
  padding-right: 20px;
  float: left;
  font-family: "ClearSans-Thin";
  color: #e85022;
  font-size: 26px;
  line-height: 24px;
  letter-spacing: -0.5px;
}

.reg-icons {
  width: 140px;
  margin-top: 20px;
  float: left;
  display: inline-block;
}
.reg-icons:lang(ar), .reg-icons:lang(he) {
  float: right;
  margin-right: -105px;
}

.regulatory-columns {
  margin-bottom: 20px;
  margin-left: 140px;
  display: table;
}

.reg-icons-med {
  width: 140px;
  margin-top: 20px;
  float: left;
  display: inline-block;
}
.reg-icons-med:lang(ar), .reg-icons-med:lang(he) {
  float: right;
  margin-right: -105px;
}

.reg-icons-rep-ch {
  width: 9%;
  margin-left: -130px;
  margin-top: 12px;
  float: left;
  display: inline-block;
}
.reg-icons-rep-ch:lang(ar), .reg-icons-rep-ch:lang(he) {
  float: right;
  margin-right: -105px;
}

.reg-icons-ru {
  width: 140px;
  margin-top: 5px;
  float: left;
  display: inline-block;
}
.reg-icons-ru:lang(ar), .reg-icons-ru:lang(he) {
  float: right;
  margin-right: -105px;
}

.CE-table-labeling-symbols tr td:first-child {
  width: 3%;
  height: 70px;
}
.CE-table-labeling-symbols tr td:nth-child(2) {
  width: 40%;
}

.CE-regulatory-section-content {
  display: block;
  margin-right: auto;
  margin-left: auto;
  max-width: 980px;
}

.tw-qsg-text-width {
  max-width: 382px;
}

#importer {
  width: 7%;
  margin-left: -130px;
  margin-top: auto;
}
#importer:lang(ar), #importer:lang(he) {
  margin-right: -95px;
}

#CE-2797 {
  width: 7%;
  margin-left: -130px;
}
#CE-2797:lang(ar), #CE-2797:lang(he) {
  margin-right: -95px;
}

#manufacturer-icon {
  width: 6%;
  margin-left: -125px;
  bottom: 10px;
  margin-top: 40px;
}
#manufacturer-icon:lang(ar), #manufacturer-icon:lang(he) {
  margin-right: -95px;
}

#manufacturer-iconTW {
  width: 6%;
  margin-left: -125px;
  margin-top: 7px;
}
#manufacturer-iconTW:lang(ar), #manufacturer-iconTW:lang(he) {
  margin-right: -95px;
}

#ManufactureHead {
  margin-top: 45px;
}

#ManufactureHeadCH {
  margin-top: 21px;
}

#MDIcon {
  width: 10%;
  bottom: 25px;
  top: -15px;
  margin-left: -140px;
}
#MDIcon:lang(ar), #MDIcon:lang(he) {
  margin-right: -110px;
}

#ECREP {
  width: 10%;
  bottom: 25px;
  top: -15px;
  margin-left: -140px;
}
#ECREP:lang(ar), #ECREP:lang(he) {
  margin-right: -110px;
}

.HPIndia {
  max-width: 260px;
}

#country-head-eu {
  margin-bottom: 2.5em;
  margin-top: -0.3em;
}

.country-head {
  text-transform: uppercase;
}

.pull-right-nav {
  float: right;
}

/*Bootstrap overwrites*/
.navbar {
  min-height: 55px;
  height: auto;
}

.navbar-inverse {
  background-color: #ffffff;
  border-color: #ffffff;
  box-shadow: 0 0 5px 1px rgba(153, 153, 153, 0.71);
}

.navbar-fixed-top, .navbar-fixed-bottom {
  z-index: 99;
}

.footer {
  position: relative;
  bottom: 0;
  right: 0;
  left: 0;
  width: 100%;
  /* Set the fixed height of the footer here */
  height: auto;
  background-color: #262A2D;
}

a:focus, a:active, a:hover {
  outline: 0;
  text-decoration: none;
}

.carousel-control.right {
  background-image: none;
  background-image: none;
  background-image: none;
  background-image: none;
  filter: none;
}

.carousel-control.left {
  background-image: none;
  background-image: none;
  background-image: none;
  background-image: none;
  filter: none;
}

.btn {
  border: 1px solid transparent;
  border-radius: 4px;
  cursor: pointer;
  font-size: 14px;
  font-weight: normal;
  line-height: 1.42857;
  margin-bottom: 0;
  padding: 6px 12px;
  text-align: center;
  touch-action: manipulation;
  user-select: none;
  vertical-align: middle;
  white-space: nowrap;
}

.responsive-title {
  display: none;
  position: relative;
  color: #0096d7;
  font-family: "ClearSans-Thin";
}

.responsive-wrap {
  display: none;
}

.lv-hamburger-wrapper {
  display: none;
}

.lv-hamburger {
  position: relative;
  float: right;
  padding: 18px;
  font-size: 20px;
  color: rgb(232, 80, 34);
  display: none;
  cursor: pointer;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  tap-highlight-color: rgba(0, 0, 0, 0);
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  z-index: 1;
}

.lv-dropdown {
  width: 100%;
  box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.12), 6px 6px 8px 0 rgba(0, 0, 0, 0.24);
  transform: translateY(0px) translateX(0px);
  -moz-transition: transform 400ms ease 0s;
  -webkit-transition: transform 400ms ease 0s;
  -o-transition: transform 400ms ease 0s;
  -ms-transition: transform 400ms ease 0s;
  transition: transform 400ms ease 0s;
}

.responsive-lv-nav-links a {
  opacity: 0.75;
  font-family: "ClearSans-Light";
  font-size: 18px;
  color: rgb(232, 80, 34) !important;
  padding-bottom: 15px !important;
}
.responsive-lv-nav-links a:hover {
  opacity: 1;
  /*background-color: $LLLightOrange !important;*/
}

.hamburger-nav-links {
  cursor: pointer;
}
.hamburger-nav-links a {
  text-align: center;
}

.topic-dropdown-title {
  font-size: 18px;
  font-family: "ClearSans-Thin";
  color: rgb(232, 80, 34);
}

.lv-caret {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  margin-right: 20px;
  color: rgb(242, 151, 121);
}

#topicDropdown {
  width: 100%;
  text-align: left;
}

#topicDropdown:hover {
  box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.12), 0 8px 8px 0 rgba(0, 0, 0, 0.24);
}

@media screen and (max-width: 1350px) {
  .pull-right-nav:lang(es-MX), .pull-right-nav:lang(ru) {
    float: left;
    margin-left: -10em;
  }
}
/*Default Styling*/
body {
  padding-top: 50px;
  /*padding-bottom: 20px;*/
  position: relative;
  line-height: 1.5;
  font-family: "ClearSans-Regular";
}

/* Wrapping element */
/* Set some basic padding to keep content from hitting the edges */
/* Set widths on the form inputs since otherwise they're 100% wide */
/*input, select, textarea {
    max-width: 280px;
}*/