/*
.home-hero {transition: opacity .25s;}
#hero-container {min-height: 600px;}
*/
#home-hero {
  padding-top: 70px;
  background: rgb(255,255,255);
  background: linear-gradient(180deg, rgba(255,255,255,1) 0%, rgba(246,250,252,1) 88%);
}
#home-hero .h1 div {
  position: relative;
  display: inline-block;
}
#home-hero .title .h1 div:after {
  height: 102%;
  width: 0%;
  animation: backBlock 2s forwards;
  content: "";
  left: 0;
  bottom: -5px;
  z-index: 0;
  position: absolute;
}
.title-01 .h1 div:after {
  background: rgb(105,141,75);
  background: -moz-linear-gradient(90deg, rgba(105,141,75,1) 0%, rgba(138,174,108,1) 100%);
  background: -webkit-linear-gradient(90deg, rgba(105,141,75,1) 0%, rgba(138,174,108,1) 100%);
  background: linear-gradient(90deg, rgba(105,141,75,1) 0%, rgba(138,174,108,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#698d4b",endColorstr="#8aae6c",GradientType=1);
}
.title-02 .h1 div:after {
  background: rgb(220,83,68);
  background: -moz-linear-gradient(90deg, rgba(220,83,68,1) 0%, rgba(217,78,63,1) 100%);
  background: -webkit-linear-gradient(90deg, rgba(220,83,68,1) 0%, rgba(217,78,63,1) 100%);
  background: linear-gradient(90deg, rgba(220,83,68,1) 0%, rgba(217,78,63,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#dc5344",endColorstr="#d94e3f",GradientType=1);
}

.title-03 .h1 div:after,
.title-04 .h1 div:after {
  background: rgb(163,140,199);
  background: -moz-linear-gradient(90deg, rgba(163,140,199,1) 0%, rgba(144,120,180,1) 100%);
  background: -webkit-linear-gradient(90deg, rgba(163,140,199,1) 0%, rgba(144,120,180,1) 100%);
  background: linear-gradient(90deg, rgba(163,140,199,1) 0%, rgba(144,120,180,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#a38cc7",endColorstr="#9078b4",GradientType=1);
}

#home-hero .h1 div span {
  position: relative;
  z-index: 2;
  animation: titleSpan 1s forwards;
  animation-delay: 1.2s;
  color: #fff;
}
@keyframes backBlock {
  0% {
    width: 0%;
    left: 0;
    height: 105%;
  }
  50% {
    width: 100%;
    height: 105%;
  }
  100% {
    width: 100%;
    height: 10px;
  }
}

@keyframes titleSpan {
  0% {
    color: var(--white);
  }
  100% {
    color: var(--black);
  }
}

@media (max-width: 576px) {
  #home-hero .btn-primary {width: 100%;}
}

#home-hero .title .h1 {line-height: 1.5;}

#home-hero .hero-container {position: relative; }

#home-hero .hero-container .floating {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
}

#home-hero .hero-container .floating .float {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
}

@media (min-width:768px) and (max-width:1400px) {
  #home-hero .animated-title > div.text-top,
  #home-hero .animated-title > div.text-top div {height: 80px;}
  #home-hero .animated-title {height: 135px;}
}

@media (max-width:767px) {
  #home-hero .animated-title > div.text-top div,
  #home-hero .animated-title > div.text-bottom div {left: 50%; transform: translate(50%, -100%);}
  #home-hero .animated-title > div.text-top,
  #home-hero .animated-title > div.text-top div {width: 100%;}
  @keyframes showBottomText {
    0% { transform: translate3d(-50%, -100%, 0); }
    100% { transform: translate3d(-50%, 0, 0); }
  }
  @keyframes showTopText {
    0% { transform: translate3d(-50%, 100%, 0); }
    100% { transform: translate3d(-50%, 0, 0); }
  }
}

@media (max-width: 500px) {
  #home-hero .animated-title {height: 135px;}
  #home-hero .animated-title > div.text-top,
  #home-hero .animated-title > div.text-top div {height: 80px;}
  #home-hero .animated-title > div.text-bottom div {width: 70%;}
}

@media (max-width: 380px) {
  #home-hero .animated-title > div.text-bottom div {width: 100%;}
}

@media (min-width: 991px) {
  #home-hero {padding-top: 90px;}
}

#section-3 .logos span {
  display: block;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  width: 80%;
  height: 65%;
  margin: auto;
}

/* Payment logos */
#section-3 .logos span.logo-stripe         {background-image: url("/images/logos/payment/stripe.svg");}
#section-3 .logos span.logo-mbway          {background-image: url("/images/logos/payment/mbway.svg");}
#section-3 .logos span.logo-webpay         {background-image: url("/images/logos/payment/webpay.svg");}
#section-3 .logos span.logo-mercadopago    {background-image: url("/images/logos/payment/mercadopago.svg");}
#section-3 .logos span.logo-wompi          {background-image: url("/images/logos/payment/wompi.svg");}
#section-3 .logos span.logo-pagaconrappi   {background-image: url("/images/logos/payment/pagaconrappi.svg");}
#section-3 .logos span.logo-conekta        {background-image: url("/images/logos/payment/conekta.svg");}
#section-3 .logos span.logo-paypal         {background-image: url("/images/logos/payment/paypal.svg");}
#section-3 .logos span.logo-multibanco     {background-image: url("/images/logos/payment/paypal.svg");}
#section-3 .logos span.logo-mb             {background-image: url("/images/logos/payment/multibanco.svg");}
#section-3 .logos span.logo-cielo          {background-image: url("/images/logos/payment/cielo.svg");}
#section-3 .logos span.logo-pagbank      {background-image: url("/images/logos/payment/pagbank.svg");}
#section-3 .logos span.logo-twocheckout    {background-image: url("/images/logos/payment/twocheckout.svg");}
#section-3 .logos span.logo-payu           {background-image: url("/images/logos/payment/payu.svg");}
#section-3 .logos span.logo-paytm          {background-image: url("/images/logos/payment/payu.svg");}
#section-3 .logos span.logo-bizum          {background-image: url("/images/logos/payment/bizum.svg");}

/* Shipping logos */
#section-3 .logos span.logo-ctt             {background-image: url("/images/logos/shipping/ctt.svg");}
#section-3 .logos span.logo-dpd             {background-image: url("/images/logos/shipping/dpd.svg");}
#section-3 .logos span.logo-dhl             {background-image: url("/images/logos/shipping/dhl.svg");}
#section-3 .logos span.logo-correosdechile  {background-image: url("/images/logos/shipping/correosdechile.svg");}
#section-3 .logos span.logo-chilexpress     {background-image: url("/images/logos/shipping/chilexpress.svg");}
#section-3 .logos span.logo-bluexpress      {background-image: url("/images/logos/shipping/bluexpress.svg");}
#section-3 .logos span.logo-envioclick      {background-image: url("/images/logos/shipping/envioclick.svg");}
#section-3 .logos span.logo-mipaquete       {background-image: url("/images/logos/shipping/mipaquete.svg");}
#section-3 .logos span.logo-addi            {background-image: url("/images/logos/payment/addi.svg"); height: 48%;}
#section-3 .logos span.logo-99-minutos      {background-image: url("/images/logos/shipping/99-minutos.svg");}
#section-3 .logos span.logo-nirex           {background-image: url("/images/logos/shipping/nirex.svg");}
#section-3 .logos span.logo-ups             {background-image: url("/images/logos/shipping/ups.svg");}
#section-3 .logos span.logo-pakke           {background-image: url("/images/logos/shipping/pakke.svg");}
#section-3 .logos span.logo-correios        {background-image: url("/images/logos/shipping/correios.svg");}
#section-3 .logos span.logo-shiptimize      {background-image: url("/images/logos/shipping/shiptimize.svg");}

#section-3 .logos span.logo-redsys      {background-image: url("/images/logos/payment/logo-redsys.png"); height: 80%;}
#section-3 .logos span.logo-mrw      {background-image: url("/images/shipping-methods/mrw.svg"); width: 70%;}

#section-3 .logos {
  position: absolute;
}

@media (min-width: 992px){
  #section-3 .logos {
    width: 35%;
    top: 0;
    left: 20%;
    height: 100%;
  }
  #section-3 .logo {
    width: 100%;
    height: 15%;
    position: absolute;
  }

  #section-3 .logo-1 {right: 50%; top: 15%;}
  #section-3 .logo-2 {right: 0; top: 35%;}
  #section-3 .logo-3 {right: 50%; top: 55%;}
  #section-3 .logo-4 {right: 0; top: 75%;}
  #section-3 .logo-5 {top: -3%;}
}
@media (min-width: 1401px){
  #section-3 .logos {
    position: absolute;
    left: 35%;
    width: 30%;
  }
}
@media (max-width: 991px) {
  #section-3 .logos {
  top: 0;
  position: absolute;
  left: 50%;
  height: 100%;
  transform: translateX(-50%);
  }

  #section-3 .logo {
    width: 55%;
    height: 15%;
    position: absolute;
  }



  #section-3 .logo-1 {left: -8%; top: 55%;}
  #section-3 .logo-2 {right: -8%; top: 55%;}
  #section-3 .logo-3 {left: -8%; top: 75%;}
  #section-3 .logo-4 {right: -8%; top: 75%;}
  #section-3 .logo-5 {  top: 35%; left: 23%; }
}

@media (max-width: 991px) {
  #section-3 .logos {width: 50%;}
}

@media (max-width: 768px) {
  #section-3 .logos {width: 60%;}
}

@media (max-width: 460px) {
  #section-3 .logos {width: 80%;}
  #section-3 .logo-1 {left: -8%; top: 55%;}
  #section-3 .logo-2 {right: -8%; top: 55%;}
  #section-3 .logo-3 {left: -8%; top: 75%;}
  #section-3 .logo-4 {right: -8%; top: 75%;}
}


/* Hero v2 */
#home-hero-new {background-color: #f1f4e1; padding-top: 70px;}
.home-hero-new_title {font-family: 'Poppins', sans-serif;font-weight: 700;font-size: 2em;line-height: 1.25;}
.home-hero-new_button {width: 290px;font-size: 1.25em;line-height: 1;padding: 0.875em;}
.home-hero-new_images {position: relative;overflow: hidden;}
.home-hero-new_images-shape {position: absolute; width: 100%; height: 100%;}
.home-hero-new_images-center {margin: 0 auto; z-index: 1;}
.home-hero-new_images-center img {
  -webkit-box-shadow: 0px 0px 8px 1px rgba(154,163,133,0.35);
  -moz-box-shadow: 0px 0px 8px 1px rgba(154,163,133,0.35);
  box-shadow: 0px 0px 8px 1px rgba(154,163,133,0.35);
}
.home-hero-new_images-left,
.home-hero-new_images-right {position: absolute; z-index: 2;}
.home-hero-new_images-left-container,
.home-hero-new_images-right-container {
  background-color: white;
  border-radius: 5px;
  border: 1px solid #efefef;
  padding: 1em;
  width: 100%;
  height: 100%;
  -webkit-box-shadow: 0px 0px 8px 1px rgba(154,163,133,0.35);
  -moz-box-shadow: 0px 0px 8px 1px rgba(154,163,133,0.35);
  box-shadow: 0px 0px 8px 1px rgba(154,163,133,0.35);
}
.home-hero-new_images-left {color: #c3c6b0;}
.home-hero-new_images-left-product {overflow: hidden;border-radius: .25em;}
.home-hero-new_images-left-starts {color: #fca421;}
.home-hero-new_images-left-title {color: #6a7145;line-height: 1.25;margin-bottom: 0.25em;letter-spacing: -1px;}
.home-hero-new_images-left .small {font-size: 80%;}
.home-hero-new_images-left-qty {font-size: 65%;}

.home-hero-new_images-right .small {font-size: 70%}
.home-hero-new_images-right-title {font-weight: 700;}
.home-hero-new_images-right-type {letter-spacing: -0.02em;}
.home-hero-new_images-right-type span {width: 8px;height: 8px;background-color: #0c59a5;display: inline-block;border-radius: 50%;outline: 1px solid #8d8d8d;outline-offset: 2px;margin: 0 7px 0 2px;}
.home-hero-new_images-right-field {border-radius: .25rem;}
.home-hero-new_images-right-field div {border-color: #c3c6b0!important;}

.home-hero-new_images-button {text-transform: uppercase; display: block; padding: .75em 1em; color: #ffffff; background-color: #c3c6b0; text-align: center;}
.home-hero-new_images-right .home-hero-new_images-button {font-size: 120%;}

.home-hero-new_images-left {left: 1%;right: 1%;bottom: 3%;width: 80%; margin: 0 auto;}
.home-hero-new_images-center {max-width: 100%;}
.home-hero-new_images-right {display: none;}
@media (min-width: 440px){
  .home-hero-new_images-left {width: 70%;}
}
@media (min-width: 576px){
  .home-hero-new_title {font-size: 3em; line-height: 1.25;}
  .home-hero-new_images-left {left: 1%;bottom: 3%;width: 270px;margin: inherit;}
  .home-hero-new_images-left-container {padding: 1.5em;}
  .home-hero-new_images-center {max-width: 95%;}
}
@media (min-width: 768px) {
  .home-hero-new_images-left {left: 1%;bottom: 3%;width: 270px;}
  .home-hero-new_images-center {max-width: 95%;}
}

@media (min-width: 991px) {
  #home-hero-new {padding-top: 90px;}
  .home-hero-new_images-left {left: 1%;bottom: 7%;width: 270px;}
  .home-hero-new_images-right {right: 1%;bottom: 7%;width: 310px; display: block;}
  .home-hero-new_images-center {max-width: 90%;}
}

@media (min-width: 1200px) {
  .home-hero-new_images-left {left: 1%;bottom: 7%;width: 300px;}
  .home-hero-new_images-right {right: 1%;bottom: 7%;width: 350px;}
  .home-hero-new_images-center {max-width: 70%;}
  .home-hero-new_title {font-size: 3.5em; line-height: 1.5;}
}