@font-face {
 font-family: GoboldRegular;
 src: url("../fonts/Gobold\ Regular.otf") format("opentype");
}

@font-face {
 font-family: GoboldLowPLus;
 src: url("../fonts/GOBOLD\ LOWPLUS.TTF") format("truetype");
}

@font-face {
 font-family: Camelia;
 src: url("../fonts/RNSCAMELIA-MEDIUM.OTF") format("opentype");
}

@font-face {
 font-family: Gnuolane_RG;
 src: url("../fonts/gnuolane_rg.ttf") format("truetype");
}

@import url("https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,400;0,700;1,300&display=swap");

/*GENERAL*/
:root {
 --dark-color: #141417;
 --menu-bg-color: #ff671b;
 --menu-txt-color: #ffffff;
 --menu-txt-color-active: #ffad91;

 --submenu-txt-color: #b5b5b5;
 /*Submenu Sticky*/
 --submenu-bg-color: #f2f2f2;
 /*Submenu Sticky*/
 --title-color: #ff671b;
 --subTitle-color: #ada5b0;
 --subTitle2-color: #ebebed;
 --body-txt-color: #7a747f;
 /* NUEVO */
 --border-color-sm: #c5c5c5;
 --btn-bg-sm-hv: #ff7827;
 --footer-bg-color: #2c2e2d;
 --footer-txt-color: #999999;
 --suscribir-bg-color: #ebeaef;
 --privacyPolicy-txt-color: #2b2c2e;
 --body-txt-drk-color: #000000;
 --card-bg-color: #fcfcfc;
 --submenu-stiky-txt-color: #ededed;

 --btn-Submit-subscribe: #b0b0b0;

 --btnRedColors: #db1629;
 --BtnRedColors2: #680e1e;
 --btnBlueColor: #05315b;
 --btnDarkRedColor: #a9535a;
 --btnCharcoalColor: #6c6c6c;
 --btnDenimColor: #5e80b9;
 --btnDutcheBlue: #3f6792;

 --txt-learnMore-Dark: #2f2f33;
 --menu-bg-color-education: #301741;
 --banner-bg-color-education: #36262f;

 --banner-bg-color-smarter: #141417;

 --bg-carrusel-light-smarter: #ececec;
 --bg-carrusel-medium-smarter: #2e2e32;
 --bg-carrusel-dark-smarter: #232128;
}

/*Pricipal*/
.bgDegradadoColor25 {
 background: linear-gradient(#e0e0e0, 25%, #f2f2f2);
}

/*Secundario*/
.bgDegradadoColor15 {
 background: linear-gradient(#e0e0e0, 15%, #f2f2f2);
}

#banner2 {
 background: url("../images/STM_Banner_Corporate_Education.jpg");
 background-size: cover;
}

.bgImgWhite {
 background: url("../images/Blanco.jpg");
 background-size: cover;
 z-index: -999;
}

.bgFakeDuxLaptop3 {
 width: 100%;
 height: 11.5%;
 position: absolute;
 z-index: -10;
}

.bgFakeDux {
 width: 100%;
 height: 20%;
 position: absolute;
 z-index: -10;
}

.Container_Overflow {
 position: relative;
 overflow-x: hidden;
}

body,
.row {
 margin: 0;
 padding: 0;
}

.BannerParallax {
 position: relative !important;
 background-position: center !important;
 background-repeat: no-repeat !important;
 background-size: cover !important;
}

.fidexSize {
 background-attachment: fixed !important;
}

.bgDegradado {
 /* background: url("../images/STMS_CORPORATE_ASSETS/Degradado.png"); */
 background: #f2f2f2;
 background-size: cover;
}

.bgDegradadoZIndex {
 z-index: -6;
 /*Ver si se debe aplicar aqui o crear clase nueva*/
 position: relative;
}

.bgSolidWhite {
 background-color: var(--menu-txt-color);
}

#formInquiries {
 display: grid;
 width: 80%;
 margin: auto;
}

#formInquiries label,
#formInquiries input,
#formInquiries textarea {
 font-family: "Open Sans", sans-serif;
 color: var(--body-txt-color);
 font-size: 1em;
}

#formInquiries input {
 margin-bottom: 10px;
 border: 1px solid var(--suscribir-bg-color);
 border-radius: 5px;
 padding: 5px;
 width: 100%;
}

#formInquiries textarea {
 min-height: 20%;
 border: 1px solid var(--suscribir-bg-color);
 border-radius: 5px;
}

.titleBannerReference {
 font-size: 2.5vw !important;
}

.txtDarkColor {
 color: #2f2f33 !important;
}

.txtLightColor {
 color: var(--menu-txt-color);
}

.txtOrange {
 color: var(--title-color);
}

.bgSolidARDark {
 background-color: var(--banner-bg-color-smarter);
}

.mtopSectionARDark {
 margin-top: 3vw;
}

/*DEVICE COLORS*/
.colorLink {
 text-indent: -9999px;
 width: 100%;
 height: 100%;
 display: block;
 border-radius: 100%;
}

.btnColorRed {
 background-color: var(--btnRedColors);
 border: 2px solid var(--btnRedColors);
}

.btnColorRed2 {
 background-color: var(--BtnRedColors2);
 border: 2px solid var(--BtnRedColors2);
}

.btnColorBlack {
 background-color: var(--body-txt-drk-color);
 border: 2px solid var(--body-txt-drk-color);
}

.btnColorWhite {
 background-color: var(--menu-txt-color);
 border: 2px solid var(--menu-txt-color);
}

.btnColorGrayLoop {
 background-color: var(--btnCharcoalColor);
 border: 2px solid var(--btnCharcoalColor);
}

.btnColorBlue {
 background-color: var(--btnBlueColor);
 border: 2px solid var(--btnBlueColor);
}

.btnColorDarkRed {
 background-image: url("../images/STM_ATLAS/STMS_Color_Dark_Red.png");
 border: 2px solid var(--btnDarkRedColor);
}

.btnColorCharcoal {
 background-image: url("../images/STM_ATLAS/STMS_Color_Charcoal.png");
 border: 2px solid var(--btnCharcoalColor);
}

.btnColorDenim {
 background-image: url("../images/STM_ATLAS/STMS_Color_Denim.png");
 border: 2px solid var(--btnDenimColor);
}

.btnColorDutcheBlue {
 background-image: url("../images/STM_ATLAS/STMS_Color_Dutche_Blue.png");
 border: 2px solid var(--btnDutcheBlue);
}

.btnColorWindsor_Wine {
 background-image: url("../images/STMS_MYTH_18L/STMS_Color_Windsor_Wine.jpg");
}

.btnColorGranite_black {
 background-image: url("../images/STMS_MYTH_18L/STMS_Color_Granite_black.jpg");
}

.btnColorSlate_blue {
 background-image: url("../images/STMS_MYTH_18L/STMS_Color_Slate_blue.jpg");
}

/* Dux Backpack */
.btnColorBlackCamo {
 background-image: url("../images/STM_DUXBACKPACK/2.7/STMS_Color_Black_camo.jpg");
}

.btnColorBlackNight {
 background-image: url("../images/STM_DUXBACKPACK/2.7/STMS_Color_Black_night.jpg");
}

.btnColorBlueSea {
 background-image: url("../images/STM_DUXBACKPACK/2.7/STMS_Color_Blue_sea.jpg");
}

.btnColorGreyStorm {
 background-image: url("../images/STM_DUXBACKPACK/2.7/STMS_Color_Grey_storm.jpg");
}

.carousel-control-next-icon {
 background-image: url("../images/arrow-01.svg") !important;
}

.carousel-control-prev-icon {
 background-image: url("../images/arrow-02.svg") !important;
}

.mbListingIpad {
 margin-bottom: 0.5vw;
}

/*PowerBank*/
#divPowerBank1_Responsive {
 margin-top: 5vh;
}

/*CTA*/

.imgVW60 {
 width: 60vw;
}

.imgMagArmHLP {
 width: 60vw;
 position: relative;
 /* right: 35%; */
 right: 15vw;
}

#ulListBagHLP {
 columns: 2;
 -webkit-columns: 2;
 -moz-columns: 2;
 width: 57%;
 margin: auto;
}

.centerContent {
 margin: auto;
}

.divCenterVideos {
 display: flex;
 /* height: 100%; */
 height: 85%;

 /*align-items: center; */
 /* justify-content: center;*/
}


.no-uppercaseText{
    text-transform: initial;
}


.divTextBagHLP{
    width: 100%;
    position: absolute;
    z-index: 5;
}


@media only screen and (min-width: 768px) {
 .divSubmit input[type="text"] {
  padding-right: 50px;
  grid-column: 2/10;
  grid-row: 1;
  width: 100%;
  justify-self: center;
  font-size: 0.85vw !important;
 }

 .divSubmit input[type="submit"] {
  background: var(--btn-Submit-subscribe);
  color: var(--submenu-bg-color);
  border: 0;
  -webkit-appearance: none;

  grid-column: 9/10;
  grid-row: 1;
  margin: auto auto auto auto;
  align-self: center;
  justify-self: center;
  width: 3.5vw;
  height: 2vw;
  font-size: 0.85vw !important;
  padding: 0px;
 }

 .divSubmit {
  width: 40vw;
  margin: auto;
  text-align: center;
  position: relative;

  display: grid;
  grid-template-columns: repeat(10, 4vw);
  grid-template-rows: 1fr;
 }

 .imgDuxBackpackBoldly {
  width: 50vw;
 }

 .heightRowVideo {
  height: 100vh;
 }

 /*Dux BackPack*/

 #divGridDuxBackpack1 {
  display: grid;
  grid-template-columns: repeat(25, 3vw);
  grid-template-rows: repeat(30, 2vw);
  margin: auto;
  z-index: 1;
 }

 #divGridDuxBackpack1 h2 {
  color: #ff671b;
 }

 #divGridDuxBackpack1Responsive h2 a.watchVideo {
  line-height: 1;
 }

 #divGridDuxBackpack1Responsive h2 {
  color: #ff671b;
 }

 #divImgGridBackpack1 {
  margin: auto;
  grid-column: 5/21;
  grid-row: 1/30;
  z-index: -1;
  height: 100%;
 }

 .imgGridBackpack1 {
  width: 50vw;
 }

 .imgAbsGridBackpack {
  left: 0;
  top: -7px;
  top: 0px;
  width: 50vw;
 }

 .imgAbsGridBackpack2 {
  left: 0;
  width: 50vw;
  top: 0;
 }

 #divTxt1GridBackpack1 {
  grid-column: 4/12;
  grid-row: 4/8;
 }

 #divTxt2GridBackpack1 {
  grid-column: 18/25;
  grid-row: 2/6;
 }

 #divTxt3GridBackpack1 {
  grid-column: 4/12;
  grid-row: 23/27;
 }

 #divTxt4GridBackpack1 {
  grid-column: 16/24;
  grid-row: 24/30;
 }

 #divTxt4GridBackpack1 h2 a.watchVideo {
  line-height: 1;
 }

 #divGridDuxBackpack2 {
  display: grid;
  grid-template-columns: repeat(25, 3vw);
  grid-template-columns: repeat(30, 2.5vw);
  grid-template-rows: repeat(25, 2vw);
  margin: auto;
  z-index: 1;
 }

 #divImgGridBackpack2 {
  margin: auto;
  grid-column: 6/21;
  grid-column: 7/27;
  grid-row: 1/23;
  grid-row: 4/26;
  z-index: -1;
  height: 100%;
 }

 .imgGridDuxBackpack2 {
  width: 50vw;
 }

 #divTxt1GridBackpack2 {
  grid-column: 3/11;
  grid-column: 4/12;
  grid-row: 11/17;
 }

 #divTxt2GridBackpack2 {
  grid-column: 23/31;
  grid-row: 5/11;
 }

 .imgDuxBackpackBoldlyAbs {
  top: 0;
  left: 0;
 }

 .videoSectionsDuxBackPack {
  width: 50vw;
 }

 /*Dux Backpack end*/

 .divTextBagHLP{
    width: 100%;
    position: absolute;
}

}

@media only screen and (max-width: 767px) {
 .divSubmit input[type="text"] {
  padding-right: 50px;
  grid-column: 3/9;
  grid-row: 1;
  width: 100%;
  justify-self: center;
  font-size: 1.085vw !important;
  width: 100%;
 }

 .divSubmit input[type="submit"] {
  background: var(--btn-Submit-subscribe);
  color: var(--submenu-bg-color);
  border: 0;
  -webkit-appearance: none;

  grid-column: 8/9;
  grid-row: 1;
  margin: auto auto auto auto;
  align-self: center;
  justify-self: center;
  width: 6vw;
  height: 3vw;
  font-size: 1.085vw !important;
  padding: 0px;
 }

 .divSubmit {
  width: 70vw;
  margin: auto;
  text-align: center;
  position: relative;

  display: grid !important;
  grid-template-columns: repeat(10, 7vw) !important;
  grid-template-rows: 1fr !important;
 }

 .imgVW60 {
  width: 80vw;
 }

 .imgMagArmHLP {
  width: 95vw;
  position: relative;
  right: 0%;
 }

 .imgDuxBackpackBoldly {
  width: 90vw;
 }

 .imgAbsGridBackpack,
 .imgAbsGridBackpack2 {
  right: 6vw;
 }

 .imgLeftRight {
  right: 0;
  left: 0;
 }

 .imgDuxBackpackBoldlyAbs {
  top: 0;
  left: 0;
 }


 .divTextBagHLP{
    width: 100%;
    position: relative;
}


}

.subMenuSticky.dark {
 background: rgba(0, 0, 0, 0.85) !important;
 border-bottom: 1px solid #333 !important;
}

.dark {
 background-color: var(--dark-color);
}

.bgOrangeDuxBackpack {
 background: var(--btn-bg-sm-hv);
 position: relative;
 z-index: 0;
}

.txtWhiteDuxBackpack {
 color: #ffff !important;
}

.bannerSolutionsProductsGridContainer .learnMoreBanner,
.template-bxl-hlp .learnMoreBanner,
.template-bxl-hlp .learnMoreBannerCharge,
.home .learnMoreBannerCharge {
 display: inline !important;
}
