@import url('https://fonts.googleapis.com/css2?family=Roboto+Slab:wght@100..900&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');
/* CSS */

* {
  margin: 0;
  padding: 0;
  font-family: "Roboto", serif;
  color: var(--verdeoscuro);
}
html{
  overflow-x: hidden;
  scroll-behavior: smooth;
}
:root {
  --verde: #06be63;
  --verdeoscuro: #003333;
  --gris: #898989;
  --blanco: #f4f4f4;
  --blancofff: #FFF;
  --grisclaro: #dddddd;
}

h1, h2, h3, h4,
h1 b, h2 b, h3 b, h4 b,
h1 span, h2 span, h3 span, h4 span{
  position: relative;
  font-family: "Roboto Slab", serif;
}
ul{
  list-style: none;
}
img{
  max-width: 100%;
}

.btn{
  padding: 0.5rem 1rem;
  border-radius: 6px;
  cursor: pointer;
}
  .btn-primary{
    background-color: var(--verde);
    color: var(--blanco);
    text-decoration: none;
    transition: all 200ms
  }
    .btn-primary:hover{
      background-color: #059c51;
    }

body {
  max-width: 100%;
  overflow-x: hidden;
  background-color: var(--blanco);
}

#header {
  position: fixed;
  width: calc(100% - 10em);
  top: 0;
  left: 0;
  padding: 1em 5em;
  padding-top: 5em;
  padding-bottom: 0;
  background-color: var(--blanco);
  z-index: 100;
  transition: all 500ms;
}
  #header.fixed{
    padding-top: 1em;
    /*padding: 1em 5em;
    width: calc(100% - 6em);
    padding-bottom: 0.75em;*/
  }
  #header:after {
    content: "";
    position: absolute;
    width: calc(100% + 10em);
    border-bottom: 1px solid var(--gris);
    height: 1px;
    left: -5em;
    bottom: 0;
    overflow-x: hidden;
  }

  #header .header{
    display: flex;
    justify-content: space-between;
    align-items: center;
    /*border-bottom: 1px solid var(--gris);*/
    padding-bottom: 10px;
  }

  #logo{
    width: 175px;
  }
  
  #menu{
    display: flex;
    list-style: none;
  }
    #menu li a{
      position: relative;
      font-size: 16px;
      color: var(--verdeoscuro);
      text-decoration: none;
      padding: 0.5rem 1rem;
    }
      #menu li a:hover, #menu li.active a{
        color: var(--verde);
      }
      /*#nav ul li a:after, #nav ul li.active a:after{
        content: "";
        position: absolute;
        height: 0.05em;
        width: 85%;
        left: 7.5%;
        bottom: 5px;
        background-color: var(--verde);
        transform: scale(0, 1);
        transition: all 300ms;
      }
        #nav ul li a:hover:after{
          transform: scale(1);
        }*/

.cls {
  fill: var(--verde);
  stroke-width: 0px;
}
.cls-arrow{
  fill: none;
  stroke: var(--gris);
  stroke-linecap: round;
  stroke-miterlimit: 10;
}

.country, ul.links{
  display: none;
  position: absolute;
  padding: 5px;
  right: 0;
  background-color: var(--blanco);
  box-shadow: 0 3px 4px 0 rgb(0 0 0 / 25%);
  min-width: 90px;
}
  ul.links{
    width: 90%;
    border-bottom: 3px solid var(--verde);
    right: 2%;
  }
  .options .country li a, ul.links li a{
    margin: 0.25rem 0;
    border: 0;
  }
    .options .country li a:hover, ul.links li a:hover{
      background-color: var(--verde);
      color: var(--blanco);
    }

.options{
  display: flex;
  align-items: center;
  gap: 10px;
}
  .options li{
    position: relative;
    z-index: 9;
  }
    .options li a{
      display: flex;
      align-items: center;
      padding: 0.1rem 0.5rem;
      /*border-right: 1px solid var(--gris);*/
      font-size: 0.8em;
      color: var(--gris);
      text-decoration: none;
    }
      .options .links li a{
        justify-content: center;
      }
      .options li a.btn{
        padding: 0.6rem 2rem;
        color: var(--blanco);
      }
      .options li:last-child a{
        border: 0
      }
      .options li a svg{
        width: 10px;
        margin-left: 2px;
      }

.container{
  padding: 0 5em;
  padding-top: 10em;
}

#presentation{
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
}
  #presentation .h2 b{
    color: var(--verde);
  }

.bg-shadow{
  position: absolute;
  width: 100%;
  left: 0;
  bottom: 0;
  z-index: 3;
}

.h2{
  font-size: 4.5em;
  color: var(--verde);
  text-align: center;
  display: flex;
  flex-direction: column;
  line-height: 1em;
  padding: 2em 0;
}
  .h2 span{
    color: var(--verdeoscuro);
  }
  /*.nuestras-plataformas .h2 span{
    color: var(--verde);
  }*/

.presentation{
  display: flex;
  align-items: flex-end;
  width: 100%;
  overflow: hidden;
}
  .presentation-left{
    position: relative;
    width: calc(40% - 50px);
    padding: 0 25px;
    z-index: 9;
  }
    .presentation-left::after{
      content: "";
      position: absolute;
      width: 100px;
      height: 100px;
      bottom: 10px;
      left: 0;
      background-color: var(--blanco);
    }
    #asesor{
      position: relative;
      z-index: 2;
    }
    #mensaje{
      position: absolute;
      left: 10px;
      top: 5.5em;
      z-index: 2;
    }
  .presentation-right{
    width: calc(60% - 50px);
    padding: 3em 25px;
    padding-bottom: 0;
  }
    .presentation-right h5{
      font-size: 1.5em;
      color: var(--verde);
      line-height: 1.25em;
      margin-bottom: 25px;
    }

    .presentation-right p{
      font-size: 1.2em;
      color: var(--verdeoscuro);
      margin-bottom: 25px;
      line-height: 1.4em;
    }
    .presentation-right p:last-child{
      margin-bottom: 0;
    }

#plataformas{
  position: relative;
  padding: 15em 5em;
  /*background-image: url('../img/lines-bg.svg');
  background-size: 100%;
  background-repeat: no-repeat;*/
}
  .cards{
    display: flex;
    gap: 8%;
    width: 100%;
    flex-direction: row;
    align-items: stretch;
    justify-content: center;
  }
    .card{
      position: relative;
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      width: calc(40% - 4%);
      padding: 2%;
      background-color: #FFF;
      background-image: url(../img/card-line.png);
      background-size: auto 90%;
      background-repeat: no-repeat;
      background-position: 10px center;
      border-radius: 12px;
      box-shadow: 20px 10px 30px 0px rgb(0 0 0 / 25%);

      /*transition: all 500ms;*/
    }
      .card.aos-animate{
        transition-delay: 0;
      }
      .card:hover{
        transform: scale(1.05) !important;
        box-shadow: 20px 15px 20px 0px rgb(0 0 0 / 25%);
      }
      .card h3{
        font-size: 1.75em;
        color: var(--verde);
        padding: 0 10px;
        padding-left: 15px;
      }
        @media (min-width: 1024px) {
          body#index.latam .card h3{
            height: 75px;
          }
        }
      .card p{
        font-size: 1em;
        color: var(--verdeoscuro);
        margin: 25px 0;
        padding: 0 10px;
        padding-left: 15px;
      }
      .card a{
        position: relative;
        font-size: 1em;
        color: var(--verde);
        text-decoration: none;
        padding: 0 10px;
        padding-left: 15px;
        margin-top: 20px;
      }
        .card a:after{
          content: "";
          position: absolute;
          height: 0.05em;
          width: 85%;
          left: 7.5%;
          bottom: 0;
          background-color: var(--verde);
          transform: scale(0, 1);
          transition: all 300ms;
        }
          .card a:hover:after{
            transform: scale(1);
          }

.slides-section{
  position: relative;
  display: flex;
  flex-direction: column;
  padding: 15em 5em;
  /*background-image: url('../img/li#nes-bg.png');
  background-size: 100%;
  background-repeat: no-repeat;*/
}
  body#index.latam #apertura-de-cuentas .slick-dots{
    display: none;
  }
  .slides-section h5{
    padding-left: 2.4em;
    margin-bottom: 5px;
    color: var(--verdeoscuro);
    font-size: 16px;
  }
  .slides-section h3{
    font-size: 26px;
    color: var(--verde);
    margin-bottom: 25px;
    padding-left: 1.25em;
  }
  .slider{
    background-color: transparent;
  }
    .slick-list{
      overflow: visible;
      z-index: 2;
    }
    .slick-initialized .slick-slide.slide, .slidernotslider .slide{
      display: flex;
      align-items: center;
      justify-content: center;
      flex-wrap: nowrap;
      flex-direction: row;

      padding: 2em 4em;
      background-color: #fff;
      border-radius: 20px;
      box-shadow: 20px 15px 30px 0px rgb(0 0 0 / 25%);
      margin: 0 2em;
    }
      body#index.latam .slick-initialized .slick-slide.slide{
        padding-top: 0em;
        padding-bottom: 3em;
      }
      .slide-text{
        width: calc(60% - 10em);
        padding: 0 5em;
      }
      .slide-text h4{
        font-size: 30px;
        color: var(--verdeoscuro);
      }
        .slide-text h4 span{
          color: var(--verde);
        }
      
      #apertura-de-cuentas .slide-text p{
        position: relative;
        padding-left: 12px;
        font-size: 18px;
        color: var(--verdeoscuro);
        margin: 25px 0;
      }
        #apertura-de-cuentas .slide-text p:before{
          content: "";
          position: absolute;
          width: 3px;
          height: 100%;
          top: 0;
          left: 2px;
          border-radius: 10px;
          background-color: var(--verde);
        }
      .slide-img{
        position: relative;
        display: flex;
        width: 40%;
        flex-wrap: nowrap;
        align-items: center;
        justify-content: center;
        flex-direction: row;
        height: 400px;
        /*overflow: hidden;*/
      }
        .slide.cuenta-personal .slide-img{
          align-items: flex-start;
        }
        #celu-apertura-01{
          margin-top: 35px;
        }
        #celu-apertura-02, #celu-apertura-03{
          position: absolute;
          margin-top: 35px;
        }
        
        .slides-section .slide.cuenta-personal.slick-slide img{
          max-height: 450px;
        }
.slick-dots{
  position: absolute;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  bottom: 10px;
  z-index: 2;
}
  .slick-dots li button{
    width: 12px;
    height: 12px;
    border: 0;
    padding: 0;
    background-color: var(--grisclaro);
    transition: all 300ms;
    border-radius: 100%;
    text-indent: -9999px;
    cursor: pointer;
  }
    .slick-dots li.slick-active button, .slick-dots li button:hover{
      background-color: var(--verde);
    }
.slick-arrow {
  position: absolute;
  width: 40px;
  height: 100%;
  padding: 0 10px;
  text-indent: 9999px;
  border: 0;
  background-color: transparent;
  background-image: url(../img/arrow-slide.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 30%;
  top: 0;
  opacity: 0.85;;
  cursor: pointer;
  z-index: 8;
  transition: all 300ms;
}
  .slick-arrow:hover{
    opacity: 1;
  }
  .slick-prev{
    left: 2.2em;
  }
  .slick-next{
    right: 2.2em;
    transform: rotate(180deg);
  }
    .slick-arrow.slick-disabled{
      opacity: 0;
    }

  #footer {
    box-sizing: border-box;
    padding: 0 5em;
    padding-top: 10em;
  }
  
  .footer-top {
    display: flex;
    justify-content: space-between;
    align-items: start;
    border-top: 1px solid #505d69;
    padding-top: 24px;
  }
  
  .link-list-footer {
    display: flex;
    gap: 50px;
  }
  
  .link-list-footer ul {
    display: flex;
    flex-direction: column;
    gap: 5px;
    list-style: none;
  }
  
  .logo-footer p,
  .link-list-footer ul li a{
    font-size: 13px;
    color: #606060;
    text-decoration: none;
  }
    .link-list-footer ul li a:hover{
      color: var(--gris);
    }
    .logo-footer p{
      font-size: 13px !important;
      color: #606060 !important;
      margin-top: 20px;
    }
  
  .redes-footer {
    display: flex;
    justify-content: end;
    /*margin-top: 24px;*/
    gap: 8px;
  }
  
  .arg-footer, .latam-footer {
    display: flex;
      justify-content: end;
      align-items: center;
      margin-top: 16px;
      gap: 10px;
  }
    .arg-footer img{
      margin-right: -10px;
    }
    .latam-footer img{
      height: 25px;
    }
  
  .footer-bottom {
    display: flex;
    flex-direction: row;
    gap: 40px;
    margin-top: 40px;
    margin-bottom: 24px;
    padding-bottom: 40px;
    border-bottom: 1px solid #505d69;
  }
  
  .footer-bottom-text {
    display: flex;
    flex-direction: column;
    gap: 16px;
    color: #606060;
    font-size: 12px;
    line-height: 16px;
  }
  
  .footer-data {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 16px;
    width: 250px;
  }
    .footer-data .aaip{
      height: 50px;
    }
    .footer-data a{
      height: 50px;
    }
      .footer-data a img{
        width: 100%;
        height: 100%;
        object-fit: cover;
      }
  
  .lf-footer {
    display: flex;
    margin: 0 auto;
    margin-bottom: 64px;
  }

.bg, .bg-hover{
  width: 400px;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0.4;
}
  .bg-hover{
    opacity: 1;
  }
  .bg.bottom, .bg-hover.bottom{
    right: 0;
    left: inherit;
    bottom: 0;
    top: inherit;
    transform: rotate(180deg) !important;
  }
    .bg.bottom.left, .bg-hover.bottom{
      right: inherit;
      left: 0;
      bottom: 10em;
      transform: rotate(270deg) !important;
    }

#bg02, #bg-hover-02{
  bottom: -15em;
}
  body#index #bg-hover-02, body#index #bg-hover-04{
    right: 0;
    left: inherit;
    transform: rotate(180deg) !important;
  }
    body#index #bg-hover-04{
      bottom: 0;
    }
.bg-cls{
  fill: none;
  stroke: #cecdcd;
  stroke-miterlimit: 10;
  stroke-width: 2px;
  stroke-miterlimit: 10;
  stroke-dasharray: 1000;
}
/*.bg-cls {
  fill: none;
  stroke: #cecdcd;
  stroke-width: 2px;
  stroke-miterlimit: 10;
  stroke-dasharray: 1000;
  /*stroke-dashoffset: 320;*/
  /*stroke-dashoffset: 1000;
  animation: dash 8s ease-in;
  animation-iteration-count: infinite;*/
  /*animation: all 2000ms;
}*/
.bg-hover .bg-cls{
  opacity: 0;
  stroke: var(--verde);
  animation: dash 3s ease-in;
  animation-iteration-count: infinite;
  stroke-dasharray: 0;
  -webkit-filter: drop-shadow(0px 0px 8px var(--verde));
  filter: drop-shadow(0px 0px 8px var(--verde));
}
  .bg-hover .bg-cls-2, .bg-hover .bg-cls-6{
    animation-delay: 1500ms;
  }
  .bg-hover .bg-cls-2, .bg-hover .bg-cls-6{
    animation-delay: 3000ms;
  }
  .bg-hover .bg-cls-3, .bg-hover .bg-cls-7{
    animation-delay: 4500ms;
  }
  .bg-hover .bg-cls-4, .bg-hover .bg-cls-8{
    animation-delay: 6000ms;
  }
  .bg-hover .bg-cls-5, .bg-hover .bg-cls-9{
    animation-delay: 7500ms;
  }
  /*.path {
    stroke-dasharray: 320;
    stroke-dashoffset: 0;
    animation: dash 2s ease-out;
  }*/

  #trigger2, #trigger4{
    position: absolute;
    left: 0;
    top: 0;
  }
  #trigger3{
    position: absolute;
    margin-top: 5em;
  }

  @keyframes dash {
    0% {
      opacity: 0;
      stroke-dashoffset: 1000;
    }
    35%{
      opacity: 0.1;
      stroke-dashoffset: 200;
    }
    70%{
      opacity: 0;
      stroke-dashoffset: 1000;
    }
    100%{
      opacity: 0;
      stroke-dashoffset: 1000;
    }
  }

/* NUESTRAS PLATAFORMAS */
.cards-nuestras-plataformas{
  display: flex;
  gap: 5%;
  width: 100%;
  flex-direction: row;
  align-items: stretch;
  justify-content: center;
  margin-bottom: 50px;
}
  .card-np{
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 25px;
    width: calc(45% - 2.5%);
    padding: 2%;
    background-color: #FFF;
    border-radius: 12px;
    box-shadow: 20px 15px 30px 0px rgb(0 0 0 / 25%);
  }
    .card-np h4{
      font-size: 25px;
      font-family: "Roboto", serif;
      color: var(--verdeoscuro);
    }
      .card-np h4 b{
        font-family: "Roboto", serif;
        color: var(--verde);
      }
    .card-np-images {
      display: flex;
      flex-direction: row;
      flex-wrap: nowrap;
      justify-content: center;
      align-items: flex-end;
    }
      .card-np-images{
        max-width: 80%;
      }
      #np-celu{
        margin-left: -100px;
        margin-bottom: -25px;
        max-width: 150px;
      }
    .card-np-tags {
      display: flex;
      flex-direction: row;
      flex-wrap: wrap;
      align-items: center;
      justify-content: center;
      gap: 10px;
      margin: 25px;
    }
      .card-np-tags span {
        display: inline-block;
        padding: 10px 15px;
        font-size: 18px;
        color: var(--verdeoscuro);
        background-color: #e8e8e8;
        border-radius: 8px;
      }
    .arrow-card{
      position: absolute;
      width: 25px;
      bottom: 10px;
    }
    .slides-section .slide-text{
      display: flex;
      flex-direction: column;
      gap: 20px;
      width: calc(60% - 4em);
      padding: 0 2em;
    }
      .slides-section .slide-text.full{
        width: calc(100% - 10em);
        height: 100%;
      }
      .slides-section .slide-text img{
        max-width: 50px;
      }
      .slides-section .slide-text b{
        color: var(--verde);
      }
    .slides-section #celu-integracion-02{
      margin-left: -30%;
      margin-top: 50px;
    }

    #boton-transferir, #touch{
      position: absolute;
      top: 0;
      transform-origin: bottom center;
    }

    .slides-section .slick-slide img{
      max-height: 100%;
    }
      #pc-cuenta-empresa{
        max-width: inherit;
        max-height: 115%;
      }

    #movimientos-control, #search-control{
      position: absolute;
      top: 0;
    }

    .slides-section .mas-control .slide-text{
      width: calc(40% - 4em);
    }
    .slides-section .mas-control .slide-img{
      width: 60%;
    }

    #card-atencion-01, #card-atencion-02, #operacion-rapida, #card-operacion-rapida{
      position: absolute;
    }
    #app-plataforma-asesores.slides-section h3{
      padding-right: 15em;
    }
    #nuestras-plataformas .slide .slide-text {
      height: 300px;
      padding-top: 100px;
    }
      #nuestras-plataformas .slide .slide-text img{
        height: 50px; 
      }
body#nuestras-plataformas.latam .integracion-mercado-local{
  position: relative;
}
/* NUESTRAS PLATAFORMAS */
/* PRODUCTO FINANCIERO */
#donde-invertir{
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-bottom: 5em;
}
  #donde-invertir .h2{
    padding-top: 0.5em;
    padding-bottom: 10px;
  }
    #donde-invertir .h2 b{
      color: var(--verde);
    }
  #donde-invertir p{
    width: 55%;
    padding: 0 5em;
    font-size: 1.25em;
    font-weight: 500;
    color: var(--verdeoscuro);
    text-align: center;
  }

  #donde-invertir .donde-invertir{
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: center;
    flex-wrap: nowrap;
    flex-direction: row;
    margin-top: 25px;
  }
    #donde-invertir .donde-invertir .mercado{
      display: flex;
      flex-direction: column;
      gap: 30px;
      width: 33.33%;
    }
      #donde-invertir .donde-invertir .mercado-local{
        position: relative;
        align-items: flex-end;
        margin-right: -5%;
        z-index: 2;
      }
      #donde-invertir .donde-invertir .mercado-internacional{
        align-items: flex-start;
        margin-left: -5%;
        z-index: 2;
      }
      #donde-invertir .donde-invertir h4{
        font-family: "Roboto", serif;
        font-size: 23px;
        color: var(--verdeoscuro);
      }
      #donde-invertir .donde-invertir h5{
        background-color: var(--blancofff);
        color: var(--verde);
        padding: 8px 15px;
        box-shadow: 0 0 10px 0 rgb(0 0 0 / 25%);
        font-size: 23px;
        border-radius: 4px;
        transition: all 400ms;
        cursor: grab;
      }
        #donde-invertir .donde-invertir h5.ml-arrow{
          background-color: transparent;
          padding-top: 0;
          box-shadow: inherit;
          margin-top: -20px;
        }
          #donde-invertir .donde-invertir h5.ml-arrow span{
            opacity: 0;
          }
          #donde-invertir .donde-invertir h5.ml-arrow a{
            transition: all 300ms;
          }
            #donde-invertir .donde-invertir h5.ml-arrow a:hover{
              transform: scale(1.05);
            }
        #donde-invertir .donde-invertir h5:hover{
          transform: scale(1.05);
        }
        #donde-invertir .donde-invertir h5 small{
          font-family: "Roboto", serif;
          font-size: 15px;
          font-weight: 400;
          color: var(--verdeoscuro);
        }

        @property --num {
          syntax: '<integer>';
          initial-value: 0;
          inherits: false;
        }

        #donde-invertir .donde-invertir h5.aos-animate span{
          transition: --num 1500ms;
          counter-reset: num var(--num);
          color: var(--verde);
        }
          #donde-invertir .donde-invertir h5 span:after{
            content: counter(num);
          }
          #donde-invertir .donde-invertir h5.aos-animate span.ml-01{
            transition: --num 2000ms;
            --num: 15;
          }
          #donde-invertir .donde-invertir h5.aos-animate span.ml-02{
            --num: 2000;
          }

          #donde-invertir .donde-invertir h5.aos-animate span.mi-01{
            --num: 100;
          }
          #donde-invertir .donde-invertir h5.aos-animate span.mi-02{
            --num: 40000;
          }
        
        #donde-invertir .donde-invertir h5 .arrow-card{
          left: 50%;
          transform: translate(-50%, -50%) !important;
        }
          
        #donde-invertir .bg-shadow{
          bottom: 0;
        }
    #mercado-local-slides{
      padding: 8em 5em;
    }
    #laptop-web-inversor{
      max-width: 125%;
    }

    .celu-patrimonio-personal{
      margin-bottom: -2em;
    }
    #celu-mercado-internacional{
      margin-bottom: -7em;
    }

    .slide-cards ul{
      display: flex;
      flex-direction: row;
      flex-wrap: wrap;
      justify-content: flex-start;
      align-items: center;
      gap: 25px 40px;
      margin-top: 25px;
    }
      body#producto-financiero .slide.ampliar-opciones .slide-cards ul{
        gap: 40px 30px;
      }
      .slide-cards ul li{
        display: inline-block;
      }
      .slide-cards span{
        position: relative;
        display: inline-block;
        background-color: var(--blancofff);
        color: var(--verdeoscuro);
        padding: 10px 25px;
        box-shadow: -2px 2px 10px 0 rgb(0 0 0 / 20%);
        font-size: 18px;
        font-weight: 600;
        border-radius: 6px;
        transition: all 400ms;
        cursor: grab;
      }
        body#producto-financiero .slide.integracion-mercado-local .slide-cards span{
          font-size: 17px;
        }
        body#producto-financiero .slide.ampliar-opciones .slide-cards ul span{
          font-size: 16px;
        }
        .slide-cards span:hover{
          transform: scale(1.05);
        }
        .slide-cards span:before{
          content: "";
          position: absolute;
          width: 4px;
          height: 80%;
          top: 10%;
          left: 8px;
          background-color: var(--verdeoscuro);
          border-radius: 10px;
        }
          .slide-cards span.orange:before{background-color: #F45200;}
          .slide-cards span.orange2:before{background-color: #F4AB00;}
          .slide-cards span.violet:before{background-color: #6E00F4;}
          .slide-cards span.pink:before{background-color: #FB0058;}
          .slide-cards span.lila:before{background-color: #2C48D3;}
          .slide-cards span.yellow:before{background-color: #FAE355;}
          .slide-cards span.green:before{background-color: #06BE63;}
          .slide-cards span.greendark :before{background-color: #003333;}
          .slide-cards span.bluelight:before{background-color: #1474F8;}
          .slide-cards span.turquoise:before{background-color: #00F4D1;}
          .slide-cards span.gray:before{background-color: #558080;}
    
    .slides-section .slide-text.full .slide-cards ul{
      align-items: flex-start;
      padding-bottom: 10.5em;
    }
      .slides-section .slide-text.full .slide-cards ul li{
        width: 30%;
      }
        .slides-section .slide-text.full .slide-cards ul li span{
          margin-bottom: 25px;
        }

    .slidernotslider{
      position: relative;
      z-index: 2;
    }
    .slides-section .slide-text a{
      color: var(--verde);
      font-size: 18px;
      margin-top: 50px;
    }

    .ampliar-opciones .slide-img{
      padding: 0 5em;
    }


#popUpRedirect{
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background-color: rgba(0, 0, 0, 0.7);
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  z-index: 10;
  transition: opacity 500ms;
  opacity: 0;
  transform: scale(0) translate(-100%, -100%);
}
  #popUpRedirect.open{
    opacity: 1;
    transform: scale(1) translate(0);
  }
  .popUpRedirect{
    position: relative;
    background-color: var(--blanco);
    border-radius: 20px;
    padding: 50px;
    display: flex;
    flex-direction: column;
    text-align: center;
    gap: 20px;
    transition: all 500ms;
    opacity: 0;
    transform: scale(0.5);
    max-width: calc(90% - 100px);
  }
    .open .popUpRedirect{
      opacity: 1;
      transform: scale(1);
    }
    .popUpClose{
      position: absolute;
      top: 10px;
      right: 20px;
      font-size: 23px;
      color: var(--gris);
      text-decoration: none;
    }
      .popUpClose img{
        width: 15px;
      }
    .popUpButtons{
      margin-top: 25px;
    }

    .slides-section h3.h3-bny{
      color: var(--verdeoscuro);
      margin-bottom: 5px;
    }
    .slides-section p.text-bny{
      font-size: 12px;
      margin-bottom: 25px;
      color: #606060;
      padding-left: 3em;
    }
      .slides-section p.text-bny.absolute{
        position: absolute;
        width: 100%;
        bottom: 25px;
        left: 0;
        box-sizing: border-box;
      }
/* PRODUCTO FINANCIERO */

/* QUIENES SOMOS */
#quienes-somos{
  position: relative;
  padding-bottom: 5em;
}
  #quienes-somos .h2{
    position: relative;
    text-align: center;
  }
    #quienes-somos .h2 b{
      color: var(--verde);
    }
    #quienes-somos .h2 img{
      position: absolute;
      max-height: 140%;
      top: -20%;
      right: -15%;
    }
    #quienes-somos main p{
      font-size: 1.5em;
      line-height: 150%;
      color: var(--verdeoscuro);
      margin-bottom: 50px;
    }
    #quienes-somos .quienes-somos-text{
      display: flex;
      align-items: center;
    }
      #quienes-somos .quienes-somos-text .qstext{
        width: calc(70% - 75px);
        padding-right: 75px;
      }
      #quienes-somos .quienes-somos-text .qsiso{
        width: 32%;
        overflow: visible;
      }
      #inviu-iso{
        padding: 0;
      }
        body#lg-selector #inviu-iso{
          max-width: 70%;
        }
        body#quienes-somos #inviu-iso{
          filter: drop-shadow(6px 6px 12px rgba(0, 0,0,0.3));
        }
#mapa{
  position: relative;
  display: flex;
  padding-top: 0;
  align-items: center;
  justify-content: center;
  flex-direction: row;
  flex-wrap: wrap;
}
  .mapa-text{
    width: 50%;
  }
    .scalize{
      width: 680px !important;
      height: auto;
    }
    .mapa-text p{
      font-size: 1.5em;
      line-height: 150%;
      color: var(--verdeoscuro);
    }
      .mapa-text p b{
        color: var(--verde);
      }
  .mapa{
    position: relative;
    width: 50%;
  }

  .scalize .item-point{
    position: absolute;
    z-index: 2;
  }
    .scalize .item-point a{
      display: inline-block;
    }
    .popOver{
      position: absolute;
      /*top: 0;
      right: 0;*/
      opacity: 0;
      transform: scale(0) translate(50%, 0);
      transform-origin: right center;
      transition: all 300ms;
    }
    .popOver.big{
      background-color: #e8e8e8;
      border-radius: 4px;
      padding: 4px;
      max-width: 175px;
      box-shadow: 0 0 4px 0 rgb(0 0 0 / 50%);
    }
      .item-point:hover .popOver, .popOver.on{
        opacity: 1;
        transform: scale(1) translate(55%, 5px);
        z-index: 3;
      }
      .popOver.big.on{
        transform: scale(1) translate(40%, 0);
      }
      .popOver span{
        position: relative;
        display: inline-block;
        background-color: #E8E8E8;
        color: var(--verdeoscuro);
        padding: 10px 25px;
        box-shadow: -2px 2px 10px 0 rgb(0 0 0 / 20%);
        font-size: 18px;
        font-weight: 600;
        border-radius: 6px;
        transition: all 400ms;
      }
        .popOver span:hover{
          transform: scale(1.05);
        }
        .popOver span:before{
          content: "";
          position: absolute;
          width: 4px;
          height: 80%;
          top: 10%;
          left: 8px;
          background-color: var(--verdeoscuro);
          border-radius: 10px;
        }
    .popOver.big img{
      padding-bottom: 10px;
      border-bottom: 1px solid var(--verde);
    }
    .popOver.big h5{
      font-family: "Roboto", serif;
      color: var(--verde);
    }
    .popOver.big h3{
      font-family: "Roboto", serif;
      color: var(--verdeoscuro);
    }

#nuestro-equipo{
  position: relative;
  padding-bottom: 15em;
}
  #nuestro-equipo h2{
    font-size: 36px;
    margin-bottom: 50px;
    color: var(--verdeoscuro);
  }
  #nuestro-equipo #bg03, #nuestro-equipo #bg-hover-03{
    top: -2em;
  }
  #nuestro-equipo #bg-hover-04{
    right: 0;
    left: inherit;
    bottom: -15em;
    top: inherit;
    transform: rotate(180deg) !important;
  }
    #nuestro-equipo #bg04{
      bottom: -15em;
    }
  .team-line{
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: nowrap;
  }
    .team-line.team-line-two{
      justify-content: flex-start;
      gap: 20px;
    }

    .team-line:before{
      content: "";
      position: absolute;
      width: 100%;
      height: 3px;
      left: 0;
      bottom: calc(5em + 3px);
      background-color: var(--verde);
      z-index: 3;
    }
      .team-line.team-line-two:before{
        width: 66%;
      }
    .team{
      position: relative;
      padding: 0;
      padding-bottom: 5em;
    }
      .team-line.team-line-two .team{
        max-width: 15%;
      }
      .team-info {
        position: absolute;
        width: 100%;
        text-align: center;
        margin-top: 15px;
        left: 0;
      }
        .team-info h5{
          font-size: 1rem;
          color: var(--verdeoscuro);
        }
        .team-info h3{
          font-size: 1rem;
          font-weight: normal;
          color: var(--verde);
          margin-bottom: 5px;
        }
        .team-info h6{
          font-size: 1rem;
          font-weight: 400;
          color: var(--verdeoscuro);
        }

  #team-shadow{
    position: absolute;
    left: 0;
    bottom: 4.1em;
    z-index: 5;
    border-top: 2px solid var(--verde);
  }

  .team-lines{
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: nowrap;
    padding-top: 8em;
  }
    #nuestro-equipo h4{
      font-family: 'Roboto';
      font-size: 1.5rem;
      color: var(--verde);
    }

    .team-lines .team-line-two #team-shadow{
      bottom: 4em;
    }


#quienes-somos #bg-hover-02{
  right: 0;
  left: inherit;
  top: inherit;
  transform: rotate(180deg) !important;
}

#trabaja-en-inviu .slide-text{
  width: calc(50% - 2em);
  padding: 0 1em;
}
  #trabaja-en-inviu .slide-text h4{
    color: var(--verde);
    margin-bottom: 25px;
  }
  #trabaja-en-inviu .slide-text p{
    font-size: 1.1rem;
    color: var(--verdeoscuro);
  }
  #trabaja-en-inviu .slide-text a{
    font-size: 1.1rem;
    color: var(--verde);
    transition: all 300ms;
  }
    #trabaja-en-inviu .slide-text a:hover{
      color: var(--verdeoscuro);
    }

#trabaja-en-inviu{
  position: relative;
  padding-bottom: 10em;
}
  #trabaja-en-inviu .slide-img{
    width: 50%;
  }
  #trabaja-en-inviu #bg06, #trabaja-en-inviu #bg-hover-06{
    bottom: -5em;
  }
  #trabaja-en-inviu #bg-hover-06{
    right: 0;
    left: inherit;
    transform: rotate(180deg) !important;
  }
/* QUIENES SOMOS */

/* SELECTOR DE PAIS */
#country-selection{
  display: flex;
  height: 100vh;
  width: 100%;
  overflow: hidden;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
  #country-selection #bg02, #country-selection #bg-hover-02{
    bottom: 0;
  }
  #country-selection .bg-hover.bottom{
    left: inherit;
    right: 0;
    transform: rotate(180deg) !important;
  }

  .site-selector {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 33%;
    margin-top: -10em;
  }
    .site-selector li {
      border-radius: 10px;
      overflow: hidden;
    }
      .site-selector li.first{
        display: block !important;
      }
      .site-selector li.site-options{
        position: absolute;
        width: 100%;
        margin-top: 30px;
        border-radius: 0px 0 10px 10px;
        transform: scale(1, 0);
        transform-origin: top center;
        transition: all 500ms;
      }
      .site-selector li.site-options.on{
        transform: scale(1);
      }
        .site-selector li a{
          background-color: #E8E8E8;
          width: calc(100% - 40px);
          padding: 10px 20px;
          display: flex;
          justify-content: flex-start;
          flex-direction: row;
          flex-wrap: nowrap;
          align-items: center;
          color: #606060;
          text-decoration: none;
          transition: all 400ms;
        }
        .site-selector li a:hover{
          background-color: #dfdfdf;
        }
        .site-selector li a img{
          position: absolute;
          right: 20px;
          height: 20px;
          transition: all 300ms;
        }
          .site-selector li a img.on{
            transform: rotate(90deg);
          }
/* SELECTOR DE PAIS*/
/* LATAM */
#card {
  position: absolute;
  left: 5em;
  top: -3em;
  z-index: 2;
  max-width: 225px;
}
  body.latam #card{
    top: 1em;
  }
  body.latam #card.aos-animate{
    top: -3em;
  }
body.latam .presentation{
  align-items: center;
  padding-bottom: 50px;
}
#interactive-brokers{
  position: absolute;
  left: 0;
}
body.latam #boton-transferir{
  top: inherit;
}
body.latam #donde-invertir .donde-invertir{
  flex-direction: column;
}
body.latam #donde-invertir .donde-invertir .mercado-local{
  display: flex;
  flex-direction: row;
  margin: 0;
  width: 100%;
  justify-content: center;
  margin-bottom: -5em;
  margin-top: 25px;
  gap: 100px;
}
  body.latam #donde-invertir .donde-invertir .mercado-logos{
    display: flex;
    flex-direction: row;
    margin: 0;
    width: 100%;
    justify-content: center;
    padding: 15px;
    margin-top: -10em;
    margin-bottom: 0;
    gap: 100px;
    align-items: flex-start;
    flex-wrap: nowrap;
  }
    body.latam #donde-invertir .donde-invertir .mercado-logos h5{
      padding: 15px;
      width: 20%;
    }
      body.latam #donde-invertir .donde-invertir h5 a{
        display: flex;
        flex-direction: column;
        gap: 10px;
        align-items: center;
      }
        body.latam #donde-invertir .donde-invertir h5 a img:not(.arrow-card) {
          height: 35px;
          width: auto;
          object-fit: contain;
        }
        body.latam #donde-invertir .donde-invertir .mercado-logos h5 #bny-pershing-text{
          height: 30px;
        }
        body.latam #donde-invertir .donde-invertir h5 .arrow-card{
          position: relative;
          left: inherit;
          bottom: inherit;
          transform: translate(0) !important;
        }

        body.latam #donde-invertir .donde-invertir h5.aos-animate span.ml-01{
          transition: --num 1500ms;
          --num: 100;
        }
        body.latam #donde-invertir .donde-invertir h5.aos-animate span.ml-02{
          transition: --num 1500ms;
          --num: 40000;
        }
  body.latam .slides-section .slide-text.full{
    width: 100%;
    padding: 0;
  }
    body.latam .slides-section .logos-card{
      display: flex;
      flex-direction: row;
      flex-wrap: wrap;
      align-items: center;
      justify-content: flex-start;
      gap: 30px 60px;
      margin: 50px 0;
    }
      body.latam .slides-section .logos-card img{
        height: 16px;
        width: auto;
        object-fit: contain;
        max-width: 200px;
      }
  #bny-pershing-slides, #interactive-brokers-slide, #cuenta-custodia-slide{
    scroll-margin-top: -125px;
  }
  body.latam .link-list-footer ul li.last{
    margin-top: 20px;
  }
    body.latam .logo-footer-link,
    body.latam .link-list-footer ul li.last p{
      font-size: 12px;
      color: #999999;
      text-decoration: none;
      max-width: 300px;
    }
      body.latam .link-list-footer ul li.last p{
        font-size: 9px;
        line-height: 12px;
      }
      body.latam#politicas-privacidad .link-list-footer ul li.last p{
        font-size: 9px;
        line-height: 12px;
      }
    body.latam #footer{
      position: relative;
    }
/* LATAM */
/* CMS */
.cms #bg02, .cms #bg-hover-02 {
  bottom: -5em;
  left: inherit;
  right: 0;
  transform: rotate(180deg) !important;
}
.cms{
  position: relative;
  padding-top: 12em;
  padding-bottom: 10em;
}
.h3{
  font-size: 25px;
  color: var(--verde);
  margin-bottom: 30px;
}
.h4{
  font-family: "Roboto", serif;
  font-size: 21px;
  margin-bottom: 20px;
}
  #politicas-privacidad .h4{
    margin-top: 20px;
  }
  .h4.green{
    color: var(--verde);
  }
  .h4.big{
    font-family: "Roboto Slab", serif;
    font-size: 25px;
  }
.personal-lists{
  display: flex;
  flex-direction: row;
  gap: 100px;
}
  .personal-lists ul{
    list-style-type: disc;
    margin: 0;
    padding: 0;
    margin-left: 15px;
  }
    .personal-lists ul li{
      padding: 8px 0;
      color: var(--verde);
    }
      .personal-lists ul li{
        font-size: 18px;
      }
.faqs{
  margin-top: 50px;
}
.faq{
  margin-bottom: 20px;
}
  .faq a.question{
    display: flex;
    font-size: 18px;
    font-weight: 500;
    gap: 6px;
    text-decoration: none;
    align-items: center;
  }
    .faq a.question:before{
      content: "";
      background-image: url(../img/arrow-faq.svg);
      width: 11px;
      height: 20px;
      transition: all 300ms;
      background-size: 100%;
      background-repeat: no-repeat;
      background-position: center;
    }
      .faq a.question.open:before{
        transform: rotate(90deg);
      }
    .faq .answer{
      display: none;
      width: 100%;
      padding-top: 10px;
      padding-left: 20px;
    }
      .faq .answer a{
        color: var(--verde);
      }
      .faq .answer span{
        color: var(--verde);
      }
    .faq p{
      font-size: 18px;
      line-height: 30px;
      color: #606060;
    }
      .faq p a{
        color: #606060;
      }
    .faq ul{
      list-style: disc;
      padding-left: 50px;
    }
      .faq ul li{
        font-size: 18px;
        line-height: 30px;
        color: #606060;
      }
#politicas-privacidad p{
  font-size: 15px;
  line-height: 25px;
  margin-bottom: 25px;
}
#politicas-privacidad .cms ul{
  list-style: disc;
  padding-left: 50px;
  margin-bottom: 25px;
}
#politicas-privacidad .cms ol{
  padding-left: 50px;
  margin-bottom: 25px;
}
  #politicas-privacidad .cms ul li, #politicas-privacidad .cms ol li{
    font-size: 15px;
    line-height: 25px;
  }
/* CMS */
/* FORMULARIO */
  .formulario{
    display: flex;
    width: 80%;
    gap: 50px;
    margin-top: 25px;
  }
    .form-column{
      display: flex;
      flex-direction: column;
      width: 50%;
      gap: 50px;
    }
      .form-box{
        position: relative;
        z-index: 2;
        display: flex;
        flex-direction: column;
        gap: 10px;
      }
        .form-box input, .form-box select, .form-box textarea{
          background-color: #e2e2e2;
          border: 0;
          color: var(--gris);
          padding: 8px 15px;
          border-radius: 5px;
        }
          .form-box input.btn-primary{
            font-size: 18px;
            font-weight: 500;
            background-color: var(--verde);
            color: var(--blanco);
            text-decoration: none;
            transition: all 200ms
          }
            .form-box input.btn-primary:hover{
              background-color: #059c51;
            }
        .form-box textarea{
          height: 80px;
          margin-top: 10px;
        }
  .box-line{
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 20px;
  }
    .radios-box{
      display: flex;
      flex-direction: column;
      gap: 10px;
    }
      .radios-box label{
        display: flex;
        align-items: center;
        gap: 5px;
        position: relative;
        font-size: 14px;
      }
      .radios-box label input {
        position: absolute;
        opacity: 0;
        cursor: pointer;
        height: 0;
        width: 0;
      }
      .checkmark {
        height: 18px;
        width: 18px;
        background-color: #e2e2e2;
        display: inline-block;
        border-radius: 100%;
      }
      
      /* On mouse-over, add a grey background color */
      .radios-box label:hover input ~ .checkmark {
        background-color: #ccc;
      }
      
      /* When the checkbox is checked, add a blue background */
      .radios-box label input:checked ~ .checkmark {
        background-color: var(--verde);
      }
      
      /* Create the checkmark/indicator (hidden when not checked) */
      .checkmark:after {
        content: "";
        position: absolute;
        display: none;
      }
      
      /* Show the checkmark when checked */
      .radios-box label input:checked ~ .checkmark:after {
        display: block;
      }
      
      /* Style the checkmark/indicator */
      .radios-box label .checkmark:after {
        top: 4px;
        left: 4px;
        width: 10px;
        height: 10px;
        border-radius: 50%;
        background: white;
      }

      section.reclamo{
        position: relative;
      }
      #formulario-reclamo #bg-hover-02{
        transform: rotate(180deg) !important;
        left: inherit;
        right: 0;
      }
        #formulario-reclamo #bg02, #formulario-reclamo #bg-hover-02{
          bottom: -5em;
        }
  .form-box textarea.motivo-reclamo-arg{
    height: 200px;
    margin-bottom: 10px;
  }

  .formulario .alert {
    padding: 16px;
    margin: 8px;
    max-width: 90%;
  }
    .formulario .alert.success{
      border-left: 4px solid var(--verde);
    }
    .formulario .alert.danger{
      border-left: 4px solid red;
    }

  .alert-title {
    margin-top: 0;
    margin-bottom: 8px;
    font-size: 18px;
  }
    .formulario .alert.success .alert-title{
      color: var(--verde);
    }
    .formulario .alert.danger .alert-title{
      color: red;
    }
  
  .alert-content {
    margin: 0;
    font-size: 14px;
    color: #555555;
  }
  
/* FORMULARIO */
/* ASESORES */
#asesores-section{
  position: relative;
  padding-bottom: 5em;
}
  #asesores-section .bg-shadow{
    width: calc(100% + 10em);
    max-width: calc(100% + 10em);
    left: -5em;
  }
  #asesores-section .h2{
    font-size: 4.2em;
    padding: 0.5em 0;
  }
    #asesores-section .h2 b{
      color: var(--verde);
    }
    #asesores-section .p-asesores{
      font-size: 1.5em;
      text-align: center;
    }

    .boxes-asesores{
      display: flex;
      flex-direction: row;
      flex-wrap: wrap;
      align-items: stretch;
      justify-content: center;
      gap: 25px;
    }
      .box-asesores{
        /*width: calc(290px - 30px);*/
        width: calc(25% - 50px);
        display: flex;
        flex-direction: column;
        background-color: #FFF;
        border-radius: 9px;
        transition: all 500ms;
        padding: 50px 15px;
        box-shadow: -6px 6px 30px 2px rgba(0, 0, 0, 0.25);
        margin: 50px 0;
        align-items: center;
        justify-content: center;
        text-align: center;
        gap: 20px;
      }
        .box-asesores:hover{
          transform: scale(1.05);
        }
        .box-asesores h3{
          font-size: 21px;
          color: var(--gris);
          line-height: 23px;
          height: 50px;
          display: flex;
          align-items: center;
          transition: all 500ms;
        }
          .box-asesores:hover h3{
            color: var(--verde);
          }
        .box-asesores span{
          width: 100%;
          height: 6px;
          background-color: var(--gris);
          border-radius: 4px;
          box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.5);
          transition: all 500ms;
        }
          .box-asesores:hover span{
            background-color: var(--verde);
          }
        #asesores-section .box-asesores p{
          font-size: 15px;
          color: var(--verdeoscuro);
          line-height: 18px;
        }

#plataforma-asesores{
  position: relative;
}
  .plataforma-asesores{
    display: flex;
    gap: 75px;
    position: relative;
  }
    .box-plataforma-asesores{
      display: flex;
      flex-direction: column;
      width: 50%;
      background-color: #FFF;
      border-radius: 18px;
      padding:  25px 50px;
      box-shadow: -6px 6px 30px 2px rgba(0, 0, 0, 0.25);
      text-align: center;
    }
      .box-plataforma-asesores h4{
        font-family: "Roboto", serif;
        font-size: 25px;
      }
        .box-plataforma-asesores h4 b{
          font-family: "Roboto", serif;
          color: var(--verde);
        }
      .box-plataforma-asesores p{
        font-size: 18px;
        color: var(--verdeoscuro);
        text-align: left;
        margin: 25px 0;
        line-height: 23px;
      }
      .box-plataforma-asesores img{
        width: 70%;
        margin: 0 15%;
      }
      .box-plataforma-asesores a{
        color: var(--verde);
      }

      .box-plataforma-asesores-img{
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
        align-items: center;
        margin: 35px 0;
        gap: 20px;
      }
        .box-plataforma-asesores-img img{
          margin: 0;
          width: 60%;
        }
        .box-plataforma-asesores-img-p{
          display: flex;
          flex-direction: column;
          gap: 40px;
          text-align: left;
        }
          .box-plataforma-asesores-img-p h5{
            font-size: 23px;
            font-family: "Roboto Slab", serif;
            color: var(--verde);
            line-height: 12px;
          }
            .box-plataforma-asesores-img-p h5.aos-animate span {
              transition: --num 1500ms;
              counter-reset: num var(--num);
              color: var(--verde);
            }
              .box-plataforma-asesores-img-p h5.aos-animate span{
                transition: --num 1500ms;
              }
                .box-plataforma-asesores-img-p h5 span:after{
                  content: counter(num);
                }
              .box-plataforma-asesores-img-p h5.aos-animate span.mi-01 {
                transition: --num 2000ms;
                --num: 100;
              }
              .box-plataforma-asesores-img-p h5.aos-animate span.mi-02 {
                --num: 40000;
              }
              .box-plataforma-asesores-img-p h5 small {
                font-family: "Roboto", serif;
                font-size: 13px;
                font-weight: 400;
                color: var(--verdeoscuro);
             }
  .box-plataforma-asesores .card-np-tags{
    margin-top: 0;
  }
    .box-plataforma-asesores .card-np-tags span{
      font-size: 16px;
    }

body#asesores #bg-hover-02{
  right: 0;
  left: inherit;
  transform: rotate(180deg) !important;
}

body#asesores #asesores-form{
  padding-top: 15em;
}
  body#asesores #asesores-form h3, body#asesores #asesores-alianzas h3{
    font-size: 30px;
    color: var(--verde);
    margin-bottom: 50px;
  }
  body#asesores #asesores-form h4{
    font-family: "Roboto Slab", serif;
    margin-top: 50px;
  }
  body#asesores #asesores-alianzas .asesores-carrousel, body#index .asesores-carrousel{
    padding: 2em 0em;
    background-color: #fff;
    border-radius: 20px;
    box-shadow: 20px 15px 30px 0px rgb(0 0 0 / 25%);
  }
    body#asesores #asesores-alianzas .asesores-carrousel .slick-track, body#index .asesores-carrousel .slick-track{
      display: flex;
      align-items: center;
    }
    body#asesores #asesores-alianzas .slick-list{
      overflow: hidden;
    }
    body#asesores #asesores-alianzas .slick-prev{
      left: 0;
    }
    body#asesores #asesores-alianzas .slick-next{
      right: 0;
    }
    body#asesores #asesores-alianzas .asesores-carrousel li, body#index .asesores-carrousel li{
      display: flex;
      flex-direction: row;
      align-items: center;
      justify-content: center;
      padding: 10px 25px
    }
      body#asesores #asesores-alianzas .asesores-carrousel li img, body#index .asesores-carrousel li img{
        opacity: 0.6;
        height: 30px;
        filter: grayscale(100%);
        transition: all 500ms;
        max-width: 175px;
      }
      body#index .asesores-carrousel li img{
        height: 25px;
      }
      body#index .asesores-carrousel li img.big{
        height: 40px;
      }
      body#asesores #asesores-alianzas .asesores-carrousel li img.big{
        height: 45px;
      }
      body#index .asesores-carrousel li img.small{
        height: 20px;
      }
      body#asesores #asesores-alianzas .asesores-carrousel li img.small{
        height: 25px;
      }
        body#asesores #asesores-alianzas .asesores-carrousel li img:hover, body#index .asesores-carrousel li img:hover{
          opacity: 1;
          filter: grayscale(0);
          transform: scale(1.05);
        }
        
  body#asesores .formulario{
    flex-wrap: wrap;
    gap: 10px 50px;
  }
    body#asesores .formulario .form-column{
      width: calc(50% - 25px);
    }

body#asesores.latam .slide-cards ul{
  width: 80%;
  align-items: stretch;
}
  body#asesores.latam .slide-cards ul li{
    width: 30%;
  }
    body#asesores.latam .slide-cards ul li span{
      display: flex;
      align-items: center;
      width: calc(100% - 50px);
      height: calc(100% - 20px);
      min-height: 40px;
    }
/* ASESORES */

#menu-toggle{
  display: none;
}

body#index .asesores-carrousel{
  background-color: transparent;
  box-shadow: inherit;
  padding: 2em 0;
  padding-bottom: 3em;
}
body#index #presentation .h2{
  padding: 1em 0;
}

  @media (max-width: 1024px) {
    html{
      overflow-x: hidden;
    }
    #menu-toggle{
      display: block;
    }
    #menu-toggle img{
      width: 25px;
    }
      #nav, #options{
        position: absolute;
        left: 0;
        top: 60px;
        width: 100%;
        padding: 10px 5px;
        width: calc(100% - 10px);
        background-color: var(--blanco);
        box-shadow: 0 6px 8px 0 rgb(0 0 0 / 25%);
      }
      #options{
        top: 220px;
        padding: 20px;
        width: calc(100% - 40px);
      }
        ul#menu{
          flex-direction: column;
          gap: 15px;
          text-align: right;
        }
          #menu li a{
            font-size: 21px;
          }
        .options{
          justify-content: flex-end;
        }
    #header, #header.fixed{
      display: flex;
      width: calc(100% - 2em);
      padding: 1em 1em;
      padding-bottom: 0;
      box-shadow: 0 0 12px 0 rgb(0 0 0 / 25%);
    }
      #header .header{
        width: 100%;
      }
    #nav, #options{
      display: none;
    }
    .container{
      padding: 0 2em;
      padding-top: 4em;
    }
    .presentation{
      flex-direction: column;
    }
    .presentation-left{
      display: flex;
      justify-content: center;
      width: 100%;
      padding: 0;
    }
    .presentation-right{
      width: calc(100% - 50px);
    }
    .footer-top{
      flex-direction: column;
      gap: 20px;
      align-items: center;
    }
    .h2{
      font-size: 1.75em;
      padding: 1em 0;
    }
    .presentation-right p:last-child{
      margin-bottom: 50px;
    }
    .bg, .bg-hover{
      width: 50%;
    }
    .cards{
      flex-direction: column;
    }
      .cards .card{
        width: 100%;
        margin-bottom: 50px;
        box-sizing: border-box;
        padding-bottom: 2em;
      }
    .slick-initialized .slick-slide.slide{
      flex-direction: column;
      padding: 2em;
      margin: 0 1em;
      height: 525px;
    }
    .slides-section .slide-text, .slides-section .mas-control .slide-text{
      width: 100%;
    }
    .slides-section .slide-img, .slides-section .mas-control .slide-img{
      width: 100%;
      height: 200px;
      margin-top: 25px;
    }
      #nuestras-plataformas .slide .slide-text{
        padding-top: 0;
      }
      .slide.integracion-mercado-local .slide-img{
        align-items: flex-start;
      }
      .slides-section #celu-integracion-01, .slides-section #celu-integracion-02{
        max-height: 80%;
      }
      .slides-section .slide-img img{
        max-height: 100%;
      }
    .slides-section, #plataformas{
      padding: 5em 2em;
    }

    .card h3 {
      font-size: 1.5em;
      padding: 10px 35px;
    }

    .card p{
      margin: 25px;
    }
    .card a{
      padding: 0 35px;
    }

    .options li a.btn {
      padding: 0.4rem 0.5rem;
    }

    #mensaje{
      left: inherit;
      top: 4em;
    }

    .slick-arrow{
      display: none !important;
    }
    .slide-text h4{
      font-size: 23px;
    }

    #apertura-de-cuentas.slides-section .slick-slide #celu-apertura-01, #apertura-de-cuentas.slides-section .slick-slide #celu-apertura-02, #apertura-de-cuentas.slides-section .slick-slide #celu-apertura-03{
      max-height: 225px;
    }

    @keyframes dash {
      0% {
        opacity: 0;
        stroke-dashoffset: 1000;
      }
      35%{
        opacity: 0.4;
        stroke-dashoffset: 200;
      }
      70%{
        opacity: 0;
        stroke-dashoffset: 1000;
      }
      100%{
        opacity: 0;
        stroke-dashoffset: 1000;
      }
    }

    .card-np h4{
      font-size: 18px;
      text-align: center;
    }
    #np-celu{
      max-height: 75px;
      margin-left: -50px;
    }
    .card-np-tags{
      margin: 10px;
      margin-bottom: 30px;
    }
      .card-np-tags span{
        padding: 5px;
        font-size: 11px;
        text-align: center;
      }
    .slides-section h3{
      font-size: 23px;
    }
    .slides-section h5{
      padding-left: 1.75em;
      margin-bottom: 10px;
    }
    #app-plataforma-asesores.slides-section h3{
      padding-right: 1em;
    }

    #quienes-somos .h2{
      font-size: 1.8em;
    }
    #quienes-somos p{
      font-size: 1.2em;
    }

    #quienes-somos .quienes-somos-text{
      flex-direction: column;
    }
      #quienes-somos .quienes-somos-text .qstext{
        width: 100%;
        padding: 0;
      }
      #quienes-somos main p{
        font-size: 1.1em;
      }
      #quienes-somos .quienes-somos-text .qsiso{
        width: 80%;
      }

    #mapa{
      flex-direction: column;
      padding: 2em 1em;
    }
      .mapa-text{
        width: 100%;
      }
      .mapa{
        width: 100%;
      }
      .scalize{
        /*position: relative;*/
        transform: translate(-22%, 0px);
      }
        body.ios .scalize .target{
          margin-top: -100px;
          margin-left: -100px;
        }
        /*.scalize-points{
          position: absolute;
          top: 0;
          left: 0;
          height: 100%;
          width: 100%;
        }*/
    #nuestro-equipo h2{
      font-size: 30px;
    }
    .team-line, .team-lines{
      flex-direction: column;
    }
    .team-line.team-line-two{
      gap: 0;
    }
      .team-line.team-line-two .team{
        max-width: 100%;
      }
    #team-shadow{
      display: none;
    }
    .team-lines{
      padding-top: 0;
    }
      .team-lines .team-line{
        padding-top: 8em;
      }
      .team-line:before{
        display: none;
      }
    #nuestro-equipo{
      padding-bottom: 0;
    }
    #trabaja-en-inviu{
      padding: 1em;
    }
      #trabaja-en-inviu .slide{
        flex-direction: column;
        padding: 2em 1em;
      }
        #trabaja-en-inviu .slide-text{
          width: calc(100% - 2em);
        }
        #trabaja-en-inviu .slide-img{
          width: 100%;
          height: auto;
          padding: 3em 0;
        }
    #donde-invertir p{
      width: 100%;
    }
    #donde-invertir .donde-invertir .mercado-local,
    #donde-invertir .donde-invertir .mercado-internacional{
      width: 50%;
      margin: 0;
      align-items: center;
      padding: 10px;
    }
    #donde-invertir .mercado.mercado-world{
      width: 100%;
      position: absolute;
    }
    #donde-invertir .donde-invertir h4{
      text-align: center;
    }
    #donde-invertir .donde-invertir h5{
      text-align: center;
      line-height: 15px;
    }
    #mercado-local-slides {
      padding: 2em;
    }
    .slide-cards ul{
      gap: 15px;
    }
    #mercado-local-slides .slick-initialized .slick-slide.slide{
      height: auto;
    }
    #mercado-local-slides .slide-text h4 {
      font-size: 20px;
    }
    #mercado-local-slides.slides-section .slide-text.full {
      width: 100%;
    }
    #mercado-local-slides .slide-cards ul{
      /*flex-direction: column;
      align-items: flex-start;*/
    }
      #mercado-local-slides.slides-section .slide-text.full .slide-cards ul li {
        width: 100%;
      }
        #mercado-local-slides .slide-cards ul li span{
          font-size: 16px;
          padding: 6px 20px;
        }
    #mercado-local-slides.slides-section .slide-text.full .slide-cards ul{
      padding-bottom: 9em;
    }
    #mercado-local-slides.slick-dots{
      bottom: 7em;
    }
    #mercado-internacional .slidernotslider .slide{
      flex-direction: column;
      padding: 2em;
      margin: 0 1em;
    }
    .popOver.big.on, .item-point:hover .popOver, .popOver.on{  
      transform: scale(1) translate(-10%, 50px);
    }
      #uruguay.popOver.big.on{
        transform: scale(1) translate(-35%, 50px);
      }
    body.ios .popOver.big.on, body.ios .item-point:hover .popOver{
      transform: scale(1) translate(0, 0);
      margin-top: -100px;
      margin-left: -10px;
    }
      body.ios .popOver.on{
        transform: scale(1) translate(0, 0);
        margin-top: -75px;
        margin-left: -50px;
      }
    .footer-bottom{
      flex-direction: column;
    }
      .footer-data img{
        max-height: 50px;
      }
    .site-selector{
      width: 75%;
      margin-top: -7em;
    }

    body#lg-selector #inviu-iso{
      max-width: 150%;
    }

    #footer{
      padding: 0 1em;
    }
    /* LATAM */
    #card{
      left: 2em;
      top: -1em;
      max-width: 150px;
    }
    body.latam .input-redes{
      display: flex;
      align-items: center;
      gap: 10px;
    }
      body.latam .input-redes .latam-footer{
        margin: 0;
      }
    body.latam #donde-invertir .donde-invertir .mercado-local,
    body.latam #donde-invertir .donde-invertir .mercado-logos{
      flex-direction: column;
      gap: 10px;
      margin: 0;
      align-items: center;
    }
    body.latam #donde-invertir .donde-invertir .mercado-logos h5{
      padding: 10px;
      width: auto;
      max-width: 100%;
    }
      body.latam #donde-invertir .donde-invertir .mercado-logos h5 a{
        gap: 15px;
        flex-direction: row;
        display: flex;
        align-items: center;
        justify-content: center;
      }
      body.latam #donde-invertir .donde-invertir h5 a img:not(.arrow-card){
        height: 20px;
      }
      body.latam #donde-invertir .donde-invertir h5{
        font-size: 21px;
      }
      body.latam .slides-section .logos-card{
        gap: 15px;
        margin: 10px 0;
      }
      body.latam .slide-cards span{
        padding: 8px 20px;
        font-size: 13px;
      }
    /* LATAM */
    /* CMS */
    .personal-lists{
      flex-direction: column;
      gap: 10px;
    }
    /* CMS */
    /* FORMULARIO */
    .formulario{
      flex-direction: column;
      width: 100%;
    }
      .form-column{
        width: 100%;
      }
    /* FORMULARIO */
    #celu-mercado-internacional{
      margin-bottom: -4em;
    }
    .slides-section p.text-bny{
      font-size: 9px;
    }
    .slides-section p.text-bny.absolute{
      position: relative;
      padding: 0;
      margin-top: 15px;
      text-align: justify;
    }
    /* ASESORES */
    #asesores-section .h2{
      font-size: 2em;
    }
    #asesores-section .p-asesores{
      margin-bottom: 20px;
    }
    .box-asesores{
      width: calc(100% - 50px);
      margin: 10px 0 ;
    }
      .plataforma-asesores{
        flex-direction: column;
      }
        .box-plataforma-asesores{
          width: calc(100% - 50px);
          padding: 25px;
        }
    body#asesores #asesores-alianzas .asesores-carrousel{
      padding: 2em;
      margin-bottom: 100px;
    }
    body#asesores .formulario .form-column{
      width: calc(100% - 25px);
    }
    body#asesores.latam .slide-cards ul{
      width: 100%;
    }
      body#asesores.latam .slide-cards ul li {
        width: calc(50% - 20px);
      }
    body#asesores.latam #asesores-form{
      margin-bottom: 100px;
    }
  }

  @media (orientation: landscape) and (min-width: 1024px) and (max-width: 1200px){
    .slide.cuenta-personal .slide-img {
      align-items: center;
    }
    .slide-cards ul{
      gap: 15px;
    }
    .slides-section .slide-text.full .slide-cards ul{
      gap: 25px;
      padding-bottom: 7em;
    }
    .slide-cards span{
      font-size: 16px;
    }
  }
  
  @media (min-width: 768px) and (max-width: 1024px) {
    .scalize{
      transform: translate(0, 0);
    }
    #quienes-somos .h2 img{
      right: -5px;
    }
    /* LATAM */
    #card{
      left: 6em;
      top: -1em;
      max-width: 225px;
    }
    /* LATAM */
    /* ASESORES */
    #asesores-section .h2 {
      font-size: 3em;
    }
    .box-asesores {
      width: calc(50% - 50px);
    }
    .plataforma-asesores {
      flex-direction: row;
      gap: 40px;
    }
      .box-plataforma-asesores {
        width: calc(50% - 50px);
      }
    body#asesores .formulario .form-column{
      width: calc(50% - 25px);
    }
    body#asesores .formulario{
      flex-direction: row;
      gap: 10px;
    }
    /* ASESORES */
    #quienes-somos .h2 {
      font-size: 3.8em;
    }
    #quienes-somos .quienes-somos-text {
      flex-direction: row;
    }
    #quienes-somos .quienes-somos-text .qstext {
      padding-right: 25px;
    }
    
  }
  @media (min-width: 1024px) and (max-width: 1200px) {
    #apertura-de-cuentas.slides-section .slick-slide img{
      max-height: 200%;
    }
    #apertura-de-cuentas.slides-section .slick-slide #celu-apertura-01{
      max-height: 260px;
      margin-left: 0;
    }
    #apertura-de-cuentas.slides-section .slick-slide #celu-apertura-02, #apertura-de-cuentas.slides-section .slick-slide #celu-apertura-03{
      max-height: 300px;
      margin-left: 0;
    }
    .scalize{
      transform: translate(0, 0);
    }
    #quienes-somos .h2{
      font-size: 4em;
    }
      #quienes-somos .h2 img{
        max-height: 50%;
        top: 24%;
        right: -10%;
      }
    .popOver.big.on, .item-point:hover .popOver, .popOver.on{  
      transform: scale(1) translate(-10%, 50px);
    }
      #uruguay.popOver.big.on{
        transform: scale(1) translate(-35%, 50px);
      }
    #menu li a{
      font-size: 14px;
    }
      .options li a.btn{
        padding: 0.6rem 0.75rem;
      }

    #team-shadow{
      bottom: 4.3em;
    }
    .team-lines .team-line-one #team-shadow{
      bottom: 4.35em;
    }
    .team-lines .team-line-two #team-shadow{
      bottom: 4.3em;
    }
    /* LATAM */
    #card{
      left: 9em;
      max-width: 300px;
    }
    /* LATAM */
  }

  @media (min-width: 1200px) and (max-width: 1400px) {
    #quienes-somos .h2 img {
      max-height: 80%;
      top: 10%;
    }
  }

  @media (min-width: 1400px){
    #quienes-somos .h2 img{
      max-height: 120%;
      top: -10%;
    }
  }



  @media (max-width: 370px) {
    #logo {
      width: 150px;
    }
    #quienes-somos .h2 img {
      position: absolute;
      max-height: 100%;
      top: 0%;
    }
    .scalize {
      transform: translate(-30%, 0px);
    }
  }

  @media (min-width: 1425px) {
    #plataformas, .container{
      max-width: calc(1400px - 10em);
      margin: 0 auto;
    }
    .slides-section{
      max-width: calc(1400px - 10em);
      margin: 0 auto;
    }
    #header{
      max-width: calc(100% - 10em);
      right: 0;
      display: flex;
      justify-content: center;
    }
      #header .header{
        width: calc(1400px - 10em);
      }
    #footer{
      padding: 0 5em;
      padding-top: 10em;
      box-sizing: content-box;
    }
  }

  @media (min-width: 1200px) and (max-width: 1260px) {
    #team-shadow{
      bottom: 4.3em;
    }
    .team-lines .team-line-one #team-shadow{
      bottom: 4.05em;
    }
  }

  @media (min-width: 991px) and (max-width: 1024px) {
    .site-selector {
      width: 55%;
    }
  }