* {margin: 0;padding: 0;font-family: sans-serif;overflow-x: hidden;}
 
html, body{ -ms-text-size-adjust: 100%;-webkit-text-size-adjust: 100%;}
.section-one h1{top: 70px;position: relative;font-size: 40px;}
body {margin: 0;padding: 0;  overflow: hidden;font-family: sans-serif;}

.sectionss{
    background-image: url('../imagenes/black-section-bg.png');
    width: full;
    height: auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap:20px;
}
.sectionss .img-container{
    width: 50%;
}

.img-container img{
    max-width: 85%;
    height: auto;
}

.sectionss .text-container{
    width: 50%;
    display: flex;
    flex-direction: column;
    padding: 2rem;
    color: white;
    gap: 15px;
    height: 100%;
}

.text-container h1{
    font-size: 65px;
    margin-bottom: 1rem;
}
.text-container p{
    font-size: 20px;
    margin-bottom: 1rem;
}

/* estilos de seccion de blackfriday */
/* ===== BLACK FRIDAY OVERLAY ===== */
.bf-overlay {
    position: fixed;
    inset: 0;
    z-index: 9999;
    background: rgba(0, 0, 0, 0.8);
    /* oscurece la página */
    display: flex;
    align-items: center;
    justify-content: center;
}

.bf-modal {
    position: relative;
    width: min(1100px, 95vw);
    min-height: 260px;
    background: #000;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.8);
    /* fondo tipo banner */
    background-image: url("../imagenes/black-friday-bg.png");
    /* <-- fondo general (opcional) */
    background-size: cover;
    background-position: center;
}

/* Botón cerrar */
.bf-close {
    position: absolute;
    top: 12px;
    right: 16px;
    border: none;
    background: rgba(0, 0, 0, 0.6);
    color: #fff;
    font-size: 24px;
    cursor: pointer;
    width: 32px;
    height: 32px;
    border-radius: 999px;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Contenido interno (2 columnas) */
.bf-content {
    display: flex;
    gap: 24px;
    padding: 32px 20px;
    align-items: center;
}

/* LEFT */
.bf-left {
    flex: 1;
    display: flex;
    justify-content: center;
}

.bf-main-image {
    max-width: 80%;
    height: auto;
    display: block;
}

/* RIGHT */
.bf-right {
    flex: 1;
    color: #fff;
    text-align: center;
    padding-block: 13px;
}

.bf-title {
    font-size: 53px;
    font-weight: 800;
    margin-bottom: 0.75rem;
    padding-inline: 2px;
    text-shadow: 0 0 16px rgba(254, 254, 254, 0.7);
    overflow: visible;
    overflow-y: visible;
    overflow-x: visible;
}

.bf-subtitle {
    margin-bottom: 1rem;
    font-size: 1rem;
    opacity: 0.85;
}

/* Contador */
.bf-countdown {
    display: flex;
    justify-content: center;
    gap: 8px;
    margin-bottom: 1.5rem;
}

.bf-time-box {
    background: rgba(0, 0, 0, 0.75);
    background: linear-gradient(180deg, rgb(65, 65, 65) 45%, rgb(36, 36, 36) 55%);
    border-left: 3px solid gray;
    border-right: 3px solid gray;
    border-radius: 8px;
    padding: 8px 10px;
    text-align: center;
    min-width: 60px;
}

.bf-time-box span {
    display: block;
    font-size: 1.4rem;
    font-weight: 700;
    letter-spacing: 1px;
}

.bf-time-box small {
    font-size: 0.75rem;
    text-transform: uppercase;
    opacity: 0.8;
}

/* Botón CTA */
.bf-cta {
    display: inline-block;
    padding: 10px 24px;
    border-radius: 999px;
    background: #704ae2;
    background: linear-gradient(90deg, rgba(0, 0, 0, 1) 0%, rgba(53, 17, 125, 1) 52%, rgba(110, 68, 194, 1) 100%);
    color: #fff;
    font-weight: 600;
    text-decoration: none;
    width: fit-content;
    font-size: 0.95rem;
    box-shadow: 0 1px 15px rgba(112, 74, 226, 0.6);
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.bf-cta:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 15px rgba(112, 74, 226, 0.8);
}

/* Responsive */
@media (max-width: 768px) {
    .bf-content {
        flex-direction: column;
        padding: 24px 16px 28px;
    }

    .bf-right {
        text-align: center;
    }

    .bf-title {
        font-size: 1.6rem;
    }

    .bf-countdown {
        justify-content: center;
    }
}

/* fin seccion blackFriday */

footer{width: 100%;padding: 20px 0px;background: black;background-size: cover;z-index: 100;}
footer h1{font-size:1.5rem;width: 90%;margin: 0 auto 0;z-index: 100;}

.container__foot4r{display: flex;flex-wrap: wrap;justify-content: space-between;max-width: 1200px;margin: auto;margin-top: 0px;z-index: 100;}

.box__footer{display: flex;padding: 50px;justify-content: space-between;color: white; z-index: 100; }
.box__footer .logo img{width:90%; float: left; position: relative;}
.box__footer .terms{max-width: 350px;margin-top: 20px;font-weight: 500;color: white;font-size: 18px;}
.box__footer h2{ margin-bottom: 30px;color: black;font-weight: 700;}
.box__footer a{margin-top: 10px;color: white;font-weight: 600;}
.box__footer a:hover{color: black;}
.box__footer a .fab{font-size: 20px;}
.box__copyright{max-width: 1200px;margin: auto;text-align: center;padding: 0px 40px;}
.box__copyright p{margin-top: 20px;color: white;}
.box__copyright hr{border: none;height: 1px;background-color: #7a7a7a;}
 .titulos p{margin: 0 auto 5%;font-size: 1.2em; width: 80%;text-align: left;}




@media (min-width: 1200px) {
.form-group {margin-bottom: 15px; width: 100%;justify-content: center;}
.form-row {margin-bottom: 15px;}
.form-control { width: 98%;padding: 10px;font-size: 16px;border-radius: 5px;border: 1px solid #ccc;}
.form-control:focus {outline: none;border-color: #80bdff;box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);}
.btnj { display: inline-block;padding: 10px 20px;width: 100%;font-size: 18px;font-weight: 600; text-align: center;vertical-align: middle;cursor: pointer;border: none;border-radius: 5px;margin: 0 auto;background-color: #704ae2}

.btn-dark {color: #fff; background-color: #343a40;margin: 0 auto;}
.formu{width: 90%;margin: 0 auto;}
  .titulos{display: grid; align-items: center;}
.titulos h2{ text-align: left; margin: 5% auto 2.5%;font-size: 2.5em;width: 80%;}
 .titulos p{margin: 0 auto 5%;font-size: 1.2em; width: 80%;text-align: left;}

  
.columna4{padding: 50px 0px 0px 0px;width: 100%;height: auto;text-align: center}

.columna4 img{
  margin-top:80px;}

.columna5{padding-top: 80px;padding-bottom: 100px;background-color: aliceblue;
  display: grid;}

.columna5 .h1{text-align: center;}

.columna5 .p{text-align: center;margin: 2% auto 0%;}
.caracteristicas3{position: relative; width: 100%;display: flex;justify-content: space-evenly;}
.caracteristicas3 div{position: relative; display: grid;grid-template-columns: 2fr; place-items: center; text-align: left;height: 500px;}
.caracteristicas{position: relative;width: 100%;display: flex; flex-direction: row-reverse;margin: 5% auto 2%;text-align: center;justify-content: center;gap: 8.5%;}

.caracteristicas div{ text-align: center;width: 16%;}
.caracteristicas p{text-align: center;font-weight: bold;color: rgb(2, 2, 152);}

.recuadros{ width: 238px; position: relative;border-radius: 10px; text-align: left;background: white;display: grid;}
.recuadros div{width:138px;height: 100px; text-align: left;display: grid;justify-content: left;padding: 20px;}
.recuadros div p{text-align: left;}

.columna6{position: relative;padding: 90px 0px 0px 0px;background: white;width: 80%;margin: 0 auto 0;}
  .columna2{justify-content: center; width: 100%; position:relative;display: block;height:70px;}
  .columna2 h1{ justify-content: center;display: flex;}
  .columna2 p{justify-content: center; display: flex;top: 20px; position: relative;font-size: 11px;}
  
.carta{justify-content: center;display: flex;    justify-content: space-evenly; height: 300px;}
.carta img{height: 70%;margin: 2% auto 0%;cursor: pointer;width: 20%;background: white;border-radius: 20px;}
  
.columna3{ background-color: aliceblue;padding-top: 50px;padding-bottom:  00px;height: auto;}
.columna3 h1{ justify-content: center;display: flex;}
  .btn{position: relative;  background: #704ae2;color: white; cursor: pointer; padding: 20px 60px;font-size: 20px;border-radius: 100px;transition: 1s;}
  .btn:hover { background-color: rgb(105, 90, 148);}
  
  .sectiones{margin-top: 0%;width: 100%;display: flex;padding: 0%;margin: 0 auto 0;justify-content: center;}
  .sectiones2{margin-top: 0%; width: 30em;display: grid;padding: 5%;margin: 0 auto 0;}
  .sectiones2 div{margin: 0 auto 0;width: 100%;display: grid;text-align: left;}
      .sectiones2 div img{width: 500px;margin-left:0;}   
      .sectiones2 div h1{left: 0;width: 100%;margin: 10% auto 5%; position: relative; } 
      .sectiones2 div h4{ left: 0; margin-top: 5% ; } 

  .section3{padding: 80px;}
.section3 p{line-height:2;text-align: center;font-size: 14px;}
  .trading{margin: 0% auto 2%; width:80%;justify-content:center; align-content: center; display:flex;}
  .trading2{margin: 0% auto 2%;   width:80%;justify-content:center; align-content: center;display:block;}
  #tradi2{width: 50%;margin-left:5% ; display:none;justify-content:center; align-content: center;}
 
  .tradingview-widget-container{width: 100%; margin: 5% auto  ; display:block;position: relative;justify-content:center; align-content: center;}
  .seguridad{margin: 2% auto 2%;font-size: 1.2em;width: 80%;text-align: left; }
  .card {width:80%;border-width: 1px;border-color: rgba(219, 234, 254, 1);border-radius: 1rem;padding: 1rem;margin: 1em auto 6%;height:600px;float: left;background-color: white;display: grid;display: inline-block;    overflow-y:hidden; box-shadow: -3.009px 3.993px 10px rgb(0 0 0 / 14%);}
 
 .header {display: grid;align-items: center;grid-gap: 1rem;gap: 1rem;}
 .cards{ background-color: aliceblue; height:auto;width: 100%;display: flex;}
.postcartas{text-align: center;padding: 0px;position: relative;font-size: 300px; margin: 0% auto 0%;align-items: center;display: inline-block;width: 100%;}

.postcartas h3{text-align: center;padding: 50px;font-size: 2rem;margin: 1% auto 0%;}
.oculto3{margin-top:2%;float: left; width: 100%; height: 43px; display: inline-block; position: relative;}

.caja1-1 h3{text-align: center;width: 100%;position: relative;font-size: 17px;}
.caja1{ position: relative;width:200px;text-align: center;left: 0px;top: 0px;background: aliceblue;line-height: 3;border-radius: 20px;box-shadow: 0 3px 10px rgb(0 0 0 / 0.2);display: grid;}
.caja{max-width: 80%;height: auto;display: flex;margin: 0 auto 0;justify-content: space-evenly;align-items: left;}
.caja1 h4{position: relative;font-size: 15px;margin: 10% auto 20%;}

.subtitulos{ position: relative;width: 200px;text-align:left;left: 0px;top: 0px;display: grid;}
.subtitulos h4{position: relative;font-size: 16px;margin: 23% auto 25%;}
.oculto2{margin-top:  -18%;float: left;width: 100%;height:37px;display: inline-block;position: relative;}
.oculto{margin-top:2%;float: left;width: 100%;height: 43px;display: inline-block;position: relative;}

  .table{ width: 100%; }
  tr td{ padding-top: 1%;padding-bottom: 1%;margin: 0 auto 0;width: 10%; }
  thead tr th{ padding-left: 0%; padding-top: 1%; padding-bottom: 1%; margin: 0 auto 0; width: 10%;  }
 
  .precios {display:flex;gap: 0%;width:95%;text-align: center;justify-content: left;margin-top: -7% ;font-size: 10px;}
  .precios h1{display:flex;gap: 0%;width:100%;text-align: center;justify-content:center;font-size: 13px;}

  .caracteristicas2{position: relative;width: 20%;padding: 1%;gap: 3%;text-align: left;display: grid;}
  .caracteristicas2 div{ position: relative;display: grid;grid-template-columns: 2fr;place-items: center;text-align: left;height: 500px;}
  .caracteristicas2 p{font-size: 12px;padding: 0% auto 50%;}
 
  .tituloysub h1{width: 80%; font-size: 40px;margin: 4% auto 0%;text-align: center;} 
  .tituloysub p{ text-align: left;font-size: 18px;width: 80%; margin: 2% auto 5%;}
    
  .ubicacion{align-items: center;text-align: center;height: 200px;width: 100%;position:absolute;display: grid;margin: 0% auto 0%;color: white;}
  .ubicacion-div{display: flex;justify-content: center;align-items: center;color: white;margin-top:4%;}
  .ubicacion-div a{color: white;}
  .ubicacion h1{color: white;margin: 0% auto 0%;font-size: 2.5em;}

  .imagenespot{ width: 101%; height: 600px;}

  #login-menu2{display: none;}

  #logo2{display: none;}

  .cuadros{display: flex;justify-content: space-evenly;}
  
  /* BOTONES */
  .whatsapp {position:fixed; width:60px;height:60px;bottom: 52px;left: 26px;background-color:#25d366;color:#FFF;border-radius:50px;text-align:center;
  font-size:30px;z-index:100;}
  .whatsapp-icon {margin-top:13px;}
   
  .abrir-menu,
  .cerrar-menu{display: none;}

  .container{width: 100%;justify-content: center;}
  /*HEADER*/
  a{text-decoration: none;}

  header{width: 100%;min-height: auto;display: flex;justify-content: center;background: rgb(0, 0, 0);align-items: center;padding-top:.5%;
    padding-bottom:.5%;}
  header  a{display: flex;justify-content:center;align-items:center;}
  header img{width: 150px;
  }

  .nav{display: flex;z-index: 1000;justify-content:space-around;width: 100%;
  }

  .menu-horizontal{ display: flex;list-style: none;justify-content:center;gap: 2rem;}
  .menu-horizontal > li > a{ display: inline-block; width:100%;font-size:90%;padding-top: 3vh;padding-bottom: 3vh;color: white;text-decoration: none;
  margin: 0 auto 0;}

  .menu-vertical{margin-top: .1%;position: absolute;display: none;list-style: none;width: auto;background-color: rgb(108 70 222);}
  .menu-horizontal li:hover .menu-vertical{display: block;}
  .menu-vertical li:hover{background-color: black;}
  .menu-vertical li a{display: block;color: white;padding: 15px 15px 15px 20px;text-decoration: none;
  }

  .login-menu{display: flex;justify-content:center;align-items:center;}
  .login,
  .regist {display: flex;justify-content:center;align-items:center;background-color: #704ae2;border-radius: 50%;border-radius: 10px;padding:.5em;
  height: 25px;width: 130px;font-size: 13px;margin: 0 auto 0;text-align: center;}
  .regist a{color: white;}
  .login a{color: white;}
  .login:hover{background-color: rgb(100, 100, 100);}
  .regist:hover{background-color: rgb(100, 100, 100);}

  .campo1 h1{position: absolute;padding: 70px 100px;width: 400px;font-size: 50px;color: rgb(0, 0, 0); }
  .campo1 .letra1{position: absolute;padding: 300px 100px; width: 490px;font-size: 20px;color: rgb(136, 135, 135);}
 
  .botonr{position: absolute;top: 500px;left: -100%;}
  
  .botonr2{position: absolute;top: 500px;left: 100px;background: #704ae2;color: white;text-decoration: none;padding: 20px 60px;font-size: 20px;
  border-radius: 100px;transition: 1s;border:none;}
  .botonr2:hover {background: #5023d6; color: white;}
  
  .campo1 .img2{position: absolute;top: 50px;right: 10px;width: 650px;}
    /* CAMPO2 */

  .campo2{background: aliceblue;height: auto;padding: 2%; display: flex;width: 100%;overflow-y: hidden;justify-content: center;}
  .campo2 h1{width: 80%;color: black;text-align: center;position: relative;font-size:2.6em;margin: 7% auto 20px;}
  .campo2 span{color: #704ae2;}
  .campo2 .letra2{font-size: 18px;letter-spacing: 0px; color: #000000;font-weight: 300;max-width: 65%;margin: 1% auto 5%;
   text-align:left;position: relative;}
   
  .lineaa{display: flex; width: 95%;  justify-content: space-between;  gap: 2px;}
  .linea1{width:15%;text-align: center;position: relative;border-radius: 10px;filter: drop-shadow(0px 5px 2px rgba(0, 0, 0, 0.1));
   background-color: #ffffff;}
  .linea1 p{font-size: 12px;padding-top: 1px;padding-bottom: 1px;}

  .cuadro-izq{position: relative;bottom: 0%;opacity: 0;width:100%;border-color: rgb(0, 96, 221);display: flex;justify-content: center;
    align-items: center;height: 10vh;}
  .cuadro-izqi{position: relative;display: inline-block;width: 100%;display: flex;
      justify-content: center;align-items: center;height:auto;transition: 1.5s;}
  
  .iframe{width: 700px;border:none;height: 800px;position: relative;display: inline-block;}
  
  .oper{left:-100%;opacity: 0;position: absolute;width:100%;display: flex;height: 100vh;}
  
  .opere{position: absolute;left:0%;width:100%;border-color: rgb(0, 96, 221);display: flex;justify-content: left;height: 100vh;transition: .5s;}
  
  .oper2{left:0%;opacity: 0;position: absolute;width:100%;display: flex;height: 100vh;}
 
  .opere2{position: absolute;left:0%;width:100%;border-color: rgb(0, 96, 221);display: flex;justify-content: left;height: 100vh;transition: .5s;}
  
  .video-background{width:100%;height:38em;overflow-y: hidden;filter: brightness(0.4);z-index: -1;overflow-y: hidden;position:relative;}
  
  .cartascolum{width:100%;border-color: rgb(0, 96, 221);display: flex;justify-content: center;align-items: center;height: 100vh;}

  .imagen-centro{width: 35rem;float: left;right: 200px;margin-top: 10%;margin-right: 10%;}
  
  .nueva-imagen{display: flex;padding-top: 4%;}
  
  .nueva-seccion{width: 50%;display: flex;}
  .nueva-seccion div span{width:600px;}
  .nueva-seccion div img{width:30%;top:0px;display: flex;float: left;}
  .nueva-seccion div h1{text-align: left;width: 100%;font-size: 50px;}
  
  .para-boton{padding-left: 12%;margin-bottom: 10%;}
  
  main{margin-bottom: 10%;}

.imagen-derecha{position:absolute;width: 600px;float:right;right: 0;top: 0;margin: 6%;}
.section-one{}

  /* CAMPO DIVIDO POR CARTAS */
.card {width:30%;border-width: 1px;border-color: rgba(219, 234, 254, 1);border-radius: 1rem;padding: 1rem;margin: 3%;height: auto;display: inline-block;box-shadow: -3.009px 3.993px 10px rgb(0 0 0 / 14%);}

.icon {flex-shrink: 0;display: flex;align-items: center;justify-content: center;border-radius: 9999px;background-color: rgba(96, 165, 250, 1);padding: 0.5rem;color: rgba(255, 255, 255, 1);}
.icon2 {flex-shrink: 0;display: flex;align-items: center;justify-content: center;border-radius:0;padding: 0.5rem;color: rgba(255, 255, 255, 1);}
.icon svg {height: 1rem;width: 1rem;}

.alert {font-weight: 600;font-size: 1.5em !important;color: rgb(11, 11, 12) !important;}

.message {margin-top: 1rem !important;color: rgb(3, 3, 3) !important;}

.actions {display: inline-block;position: relative;width: 100%;}
.actions a {text-decoration: none;width: 96%;flex-shrink: 0;display: flex;align-items: center;justify-content: center;background-color: rgb(108 70 222);
    padding: 4%;color: rgba(255, 255, 255, 1);}
 
.mark-as-read, .read {display: inline-block;border-radius: 0.5rem;width: 100%;padding: 0.75rem 1.25rem;text-align: center;font-size: 0.875rem;
    line-height: 1.25rem;font-weight: 600;}
  
.read {background-color: rgb(108 70 222);width: 246px;border-radius: 0;left: 50px;position: relative;}

.mark-as-read {}
.mark-as-read:hover {background-color: rgb(105, 90, 148);}

.imagen .bandera1{width: 100%;margin:1.1em auto 1.1em;border-radius: 3%;align-items: center; position: relative;z-index: 0;
  }

.campo3{background: url(../imagenes/fondo.jpg);background-position: inherit;background-size: cover;height: auto;width: 100%;overflow-y: hidden;
  padding-top:5% ;padding-bottom: 5%;text-align: center;align-items: center;}
.campo3 h1{ text-align: center;font-size: 5em;}
.campo3 span{color: #704ae2;}
.campo3 p{text-align: left;font-size: 20px;width:64%;display: inline-block;margin: 1% 0% 5% 0%;}
.campo3-3{background: url(../imagenes/fondo.jpg);background-position: inherit;background-size: cover;height: 800px;width: 100%;overflow-y: hidden;
  padding-top:5% ;padding-bottom: 2%;text-align: center;align-items: center;}
.campo3-3 h1{ text-align: center;font-size: 5em;}
.campo3-3 span{color: #704ae2;}
.campo3-3 p{text-align: left;font-size: 20px;width:64%;display: inline-block;margin: 1% 0% 5% 0%;}
  
.campo4{   width: 100%;text-align: center;align-items: center;}
.campo4 h1{color: black; font-weight: 600;font-size: 40px;line-height: 55px; margin:8% auto 2%; width:75%;text-align: center;font-size: 3em;}
.campo4 .texto2{color: #505050;font-weight: 600;line-height: 25px;margin:2% auto 2%;width:85%;text-align: left;float: left;display: block;}
.campo4 span{color: #333;width: 40%;display: block;text-align: left;margin: 4% auto 0px;}
.campo4 .img{position: absolute;left: 630px;top: 268%;}


.spano{color: #704ae2;}

.campo-boton{width: 75%;display:flex;text-align: center;justify-content: center;}
.campo-boton a{ background: #704ae2;color: white;border-radius: 10px;font-size: 20px;padding:1em;justify-content: center;margin: 10% auto 0;}

.campo5{background-color: #f3f2f6;}

.boton-activo{color: white;}
.boton-activo1{color: dodgerblue;}
  
  /*Aquí debajo va el FOOTER*/
  
.menu-horizontal{justify-content:end;display: flex;flex-direction: row;align-items: end;}

.nav.visible{opacity: 1;visibility: visible;display: flex;}
.nav-list{gap: 1rem;display: flex;flex-direction: row;}
.nav-list li a{color:white}
 /*plataformas*/
.image-container {display: flex;flex-direction: column;align-items: flex-start;margin-left: 80px;}
/*tamaños*/
.container_fs {display: flex;flex-wrap: wrap;justify-content: center;}
.row_fs {width: calc(50% - 20px);max-width: 300px;margin: 10px;padding: 10px;background-color: #f5f5f5;border-radius: 5px;text-align: center;}
.box2 {display: flex;flex-direction: column;align-items: center;text-decoration: none;color: #333;}
.box2 img {width: 80px;height: 80px;margin-bottom: 10px;}
.box2 span {font-size: 16px;text-decoration: underline;}
}


  @media (max-width: 1200px) {
    .form-group {margin-bottom: 15px; width: 100%;justify-content: center;}
.form-row {margin-bottom: 15px;}
.form-control { width: 96%;padding: 10px;font-size: 16px;border-radius: 5px;border: 1px solid #ccc;}
.form-control:focus {outline: none;border-color: #80bdff;box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);}
.btnj { display: inline-block;padding: 10px 20px;width: 98%;font-size: 18px;font-weight: 600; text-align: center;vertical-align: middle;cursor: pointer;border: none;border-radius: 5px;margin: 0 auto 0;background-color: #704ae2}

.btn-dark {color: #fff; background-color: #343a40;margin: 0 auto;}
.formu{width: 90%;margin: 0 auto;}
    .titulos{display: grid; align-items: center;}
    .titulos h2{ text-align: left; margin: 5% auto 2.5%;font-size: 2.5em;width: 80%;}
     .titulos p{margin: 0 auto 20%;font-size: 1.2em; width: 80%;text-align: left;}
    
      
    .columna4{padding: 50px 0px 0px 0px;width: 100%;height: auto;text-align: center}

    .columna4 img{
      margin-top:80px;}
    
    .columna5{padding-top: 80px;padding-bottom: 100px;background-color: aliceblue;
      display: grid;}
    
    .columna5 .h1{text-align: center;}
    
    .columna5 .p{text-align: center;margin: 2% auto 0%;}
    .caracteristicas3{position: relative; width: 100%;display: flex;justify-content: space-evenly;}
    .caracteristicas3 div{position: relative; display: grid;grid-template-columns: 2fr; place-items: center; text-align: left;height: 500px;}
    .caracteristicas{position: relative;width: 100%;display: flex; flex-direction: row-reverse;margin: 5% auto 2%;text-align: center;justify-content: center;gap: 8.5%;}
    
    .caracteristicas div{ text-align: center;width: 16%;}
    .caracteristicas p{text-align: center;font-weight: bold;color: rgb(2, 2, 152);}
    
    .recuadros{ width: 238px; position: relative;border-radius: 10px; text-align: left;background: white;display: grid;}
    .recuadros div{width:138px;height: 100px; text-align: left;display: grid;justify-content: left;padding: 20px;}
    .recuadros div p{text-align: left;}
    
    .columna6{position: relative;padding: 90px 0px 0px 0px;background: white;width: 80%;margin: 0 auto 0;}
      .columna2{justify-content: center; width: 100%; position:relative;display: block;height:70px;}
      .columna2 h1{ justify-content: center;display: flex;}
      
      .columna2 p{justify-content: center; display: flex;top: 20px; position: relative;font-size: 11px;}
      
    .carta{justify-content: center;display: flex;    justify-content: space-evenly; height: 300px;}
    
    .carta img{height: 70%;margin: 2% auto 0%;cursor: pointer;width: 20%;background: white;border-radius: 20px;}
      
    .columna3{ background-color: aliceblue;padding-top: 50px;padding-bottom:  00px;height: auto;}
    
    .columna3 h1{ justify-content: center;display: flex;}
  .btn{position: relative;background: #704ae2;color: white; cursor: pointer;padding: 20px 60px; font-size: 20px; border-radius: 100px; transition: 1s; }
  .btn:hover {background-color: rgb(105, 90, 148);}
  
  .sectiones{margin-top: 0%;width: 100%;display: flex;padding: 0%;margin: 0 auto 0;justify-content: center;}
  .sectiones2{margin-top: 0%;width: 30em;display: grid;padding: 5%;margin: 0 auto 0;}

  .sectiones2 div{margin: 0 auto 0; width: 100%;display: grid;text-align: left;}
      .sectiones2 div img{ width: 100%;margin-left:0; }   
      .sectiones2 div h1{left: 0;width: 100%;margin: 10% auto 5%;position: relative;} 
      .sectiones2 div h4{ left: 0; margin-top: 5% ;} 
    .section3{padding: 80px;}
  
  .section3 p{text-align: center;font-size: 14px;line-height:2;}
    #tradi2{ width: 50%; margin-left:5% ; display:none;justify-content:center; align-content: center;}
   
    .tradingview-widget-container{ width: 50%; margin: 5% auto  ; display:block;justify-content:center; align-content: center;}
    .trading{margin: 0% auto 4%; width:80%;justify-content:center; align-content: center; display:flex;}
    .trading2{ margin: 0% auto 8%;   width:80%;justify-content:center; align-content: center;display:block;}
    .seguridad{margin: 2% auto 2%;font-size: 1.2em;width: 80%;text-align: left; }

    .card {width:80%;border-width: 1px;border-color: rgba(219, 234, 254, 1);border-radius: 1rem;padding: 1rem;margin: 1em auto 6%;height:400px;float: left;   background-color: white; display: grid;display: inline-block;    overflow-y:hidden;box-shadow: -3.009px 3.993px 10px rgb(0 0 0 / 14%);}
   
   .header { display: grid; align-items: center;grid-gap: 1rem;gap: 1rem;}
   .cards{ background-color: aliceblue; height:auto;width: 100%;display: flex;}
  
    .postcartas{text-align: center;padding: 0px;position: relative;font-size: 300px;margin: 0% auto 0%;align-items: center;display: inline-block; width: 100%;}
  
  .postcartas h3{ text-align: center;padding: 50px; font-size: 2rem;margin: 1% auto 0%;}
    .oculto2{margin-top:  2%;float: left;width: 100%;height:37px;display: inline-block;position: relative;}
    .oculto3{margin-top:2%;float: left; width: 100%; height: 43px; display: inline-block; position: relative;}
    .oculto{margin: 30px;float: left;width: 100%;height: 803px;   }

    .caja1-1 h3{text-align: center;width: 90%;position: relative;font-size: 15px;}
    .caja1{ position: relative;width:170px;text-align: center;left: 0px;top: 0px;background: aliceblue;line-height: 3;border-radius: 20px;box-shadow: 0 3px 10px rgb(0 0 0 / 0.2);display: grid;}
    .caja{max-width: 100%;height: auto;display: flex;margin: 0 auto 0;justify-content: space-evenly;align-items: left;}
    .caja1 h4{position: relative;font-size: 13px;margin: 12%;}
    
    .subtitulos{ position: relative;width: 200px;text-align:left;left: 0px;top: 0px;display: grid;}
    .subtitulos h4{position: relative;font-size: 16px;margin: 27% auto 7%;}
     
     
    .table-responsive-xl{  width: 80%; margin: 0 auto 0; }
    .table{ width: 100%; }
     tr td{ padding-top: 1%; padding-bottom: 1%; margin: 0 auto 0; width: 10%; }
    thead tr th{ padding-left: 0%; padding-top: 1%; padding-bottom: 1%; margin: 0 auto 0; width: 10%; }
   
  .precios {display:flex;gap: 0%;width:95%;text-align: center;justify-content: left;margin-top: -7%;font-size: 10px;}
  .precios h1{display:flex;gap: 0%;width:100%;text-align: center;justify-content:center;font-size: 13px;}
  
  .caracteristicas2{position: relative;width: 20%;padding: 1%;gap: 2%;text-align: left;display: grid;}
  .caracteristicas2 div{position: relative;display: grid;grid-template-columns: 2fr;text-align: left;height: 500px;}
  .caracteristicas2 h2{font-size: 15px;margin-bottom: 20%;}
  .caracteristicas2 p{font-size: 12px;padding: 0% auto 50%;}
  
  .tituloysub h1{width: 85%; font-size: 40px;margin: 4% auto 0%;text-align: center;} 
  .tituloysub p{ text-align: left;font-size: 18px;width: 80%; margin: 2% auto 5%;}
      
  .ubicacion{align-items: center;text-align: center;height: 200px;width: 100%;position:absolute;display: grid;margin: 0% auto 0%;color: white;}
  .ubicacion-div{display: flex;justify-content: center;align-items: center;color: white;margin-top:4%;}
  .ubicacion-div a{color: white;}
  .ubicacion h1{color: white;margin: 0% auto 0%;font-size: 2.5em;}

 .imagenespot{ width: 101%; height: 600px;}

 #login-menu2{display: none;}

 #logo2{display: none;}

.cuadros{display: flex;justify-content: space-evenly;}
 
  /* BOTONES */

.whatsapp {position:fixed; width:60px;height:60px;bottom: 52px;left: 26px;background-color:#25d366;color:#FFF;border-radius:50px;text-align:center;
  font-size:30px;z-index:100;}
.whatsapp-icon {margin-top:13px;}
 
  /* NAVEGADOR COPIAR Y PEGAR EN TODOS LOS CSS DE TODAS LAS WEBS */
 
  .abrir-menu,
  .cerrar-menu{display: none;}

  .container{width: 100%;justify-content: center;}
  /*HEADER*/
  a{text-decoration: none;}
 

  header{width: 100%;min-height: auto;display: flex;justify-content: center;background: rgb(0, 0, 0);align-items: center;padding-top:.5%;
    padding-bottom:.5%;}
  header  a{display: flex;justify-content:center;align-items:center;}
  header img{width: 150px;
  }

  .nav{display: flex;z-index: 1000;justify-content:space-around;width: 100%;
  }
  .menu-horizontal{ display: flex;list-style: none;justify-content:center;gap: 2rem;}
  .menu-horizontal > li > a{ display: inline-block; width:100%;font-size:90%;padding-top: 3vh;padding-bottom: 3vh;color: white;text-decoration: none;
  margin: 0 auto 0;}

  .menu-vertical{margin-top: .1%;position: absolute;display: none;list-style: none;width: auto;background-color: rgb(108 70 222);}
  .menu-horizontal li:hover .menu-vertical{display: block;}
  .menu-vertical li:hover{background-color: black;}
  .menu-vertical li a{display: block;color: white;padding: 15px 15px 15px 20px;text-decoration: none;
  }
 
  .login-menu{display: flex;justify-content:center;align-items:center;}
  .login,
  .regist {display: flex;justify-content:center;align-items:center;background-color: #704ae2;border-radius: 50%;border-radius: 10px;padding:.5em;
  height: 25px;width: 130px;font-size: 13px;margin: 0 auto 0;text-align: center;}
  .regist a{color: white;}
  .login a{color: white;}
  .login:hover{background-color: rgb(100, 100, 100);}
  .regist:hover{background-color: rgb(100, 100, 100);}
 
 
  .campo1 h1{position: absolute;padding: 70px 100px;width: 400px;font-size: 50px;color: rgb(0, 0, 0); }
  .campo1 .letra1{position: absolute;padding: 300px 100px; width: 490px;font-size: 20px;color: rgb(136, 135, 135);}
  
  .botonr{position: absolute;top: 500px;left: -100%;}
  
  .botonr2{border:none;position: absolute;top: 500px;left: 100px;background: #704ae2;color: white;text-decoration: none;padding: 20px 60px;font-size: 20px;
  border-radius: 100px;transition: 1s;}
  
  .campo1 .img2{position: absolute;top: 50px;right: 10px;width: 650px;}
    /* CAMPO2 */

  .campo2{background: aliceblue;height: auto;padding: 2%; display: flex;width: 100%;overflow-y: hidden;justify-content: center;}
  .campo2 h1{width: 80%;color: black;text-align: center;position: relative;font-size:2.6em;margin: 7% auto 20px;}
  .campo2 span{color: #704ae2;}
  .campo2 .letra2{font-size: 18px;letter-spacing: 0px; color: #000000;font-weight: 300;max-width: 65%;margin: 1% auto 5%;
   text-align:left;position: relative;}
   
  .lineaa{display: flex; width: 95%;  justify-content: space-between;  gap: 2px;}
  .linea1{width:15%;text-align: center;position: relative;border-radius: 10px;filter: drop-shadow(0px 5px 2px rgba(0, 0, 0, 0.1));
   background-color: #ffffff;}
  .linea1 p{font-size: 12px;padding-top: 1px;padding-bottom: 1px;}

  .cuadro-izq{position: relative;bottom: 0%;opacity: 0;width:100%;border-color: rgb(0, 96, 221);display: flex;justify-content: center;
    align-items: center;height: 10vh;}
  .cuadro-izqi{position: relative; margin-top: -10%;display: inline-block;width: 100%;height: auto;  width:100%;border-color: rgb(0, 96, 221);display: flex;
      justify-content: center;align-items: center;height: 70vh;transition: 1.5s;}

      .iframe{width: 700px;border:none;height: 800px;position: relative;display: inline-block;}
  
      .oper{left:-100%;opacity: 0;position: absolute;width:100%;display: flex;height: 100vh;}
      
      .opere{position: absolute;left:0%;width:100%;border-color: rgb(0, 96, 221);display: flex;justify-content: left;height: 100vh;transition: .5s;}
  
      .oper2{left:0%;opacity: 0;position: absolute;width:100%;display: flex;height: 100vh;}
      .opere2{position: absolute;left:0%;width:100%;border-color: rgb(0, 96, 221);display: flex;justify-content: left;height: 100vh;transition: .5s;}
      
      .video-background{width:100%;height:38em;overflow-y: hidden;filter: brightness(0.4);z-index: -1;overflow-y: hidden;position:relative;}
      
      .cartascolum{width:100%;border-color: rgb(0, 96, 221);display: flex;justify-content: center;align-items: center;height: 100vh;}
    
      .imagen-centro{width: 35rem;float: left;right: 200px;margin-top: 10%;}
      
      .nueva-imagen{display: flex;padding-top: 5%;}
  
 
      .nueva-seccion{width: 50%;display: flex;}
      .nueva-seccion div span{width:600px;}
      .nueva-seccion div img{width:30%;top:0px;display: flex;float: left;}
      .nueva-seccion div h1{text-align: left;width: 100%;font-size: 50px;}
      
      .para-boton{padding-left: 12%;margin-bottom: 10%;}
      
      main{margin-bottom: 10%;}
    
    .imagen-derecha{position:absolute;width: 500px;float:right;right: 0;top: 10em;margin: 0%;}
    .section-one{}
    
      /* CAMPO DIVIDO POR CARTAS */
    .card {width:28%;border-width: 1px;border-color: rgb(15, 86, 178);border-radius: 1rem;padding: 1rem; margin-top:5%;height: auto;display: inline-block;box-shadow: -3.009px 3.993px 10px rgb(0 0 0 / 14%);}
    
    .icon {flex-shrink: 0;display: flex;align-items: center;justify-content: center;border-radius: 9999px;background-color: rgba(96, 165, 250, 1);padding: 0.5rem;color: rgba(255, 255, 255, 1);}
    .icon2 {flex-shrink: 0;display: flex;align-items: center;justify-content: center;border-radius:0;padding: 0.5rem;color: rgba(255, 255, 255, 1);}
    .icon svg {height: 1rem;width: 1rem;}
    
    .alert {font-weight: 600;font-size: 1.5em !important;color: rgb(11, 11, 12) !important;}
    
    .message {margin-top: 1rem !important;color: rgb(3, 3, 3) !important;}
 
 
  /* CAMPO DIVIDO POR CARTAS3 */
 
  
.actions {display: inline-block;position: relative;width: 100%;}
.actions a {text-decoration: none;width: 96%;flex-shrink: 0;display: flex;align-items: center;justify-content: center;background-color: rgb(108 70 222);
    padding: 4%;color: rgba(255, 255, 255, 1);}
 
.mark-as-read, .read {display: inline-block;border-radius: 0.5rem;width: 100%;padding: 0.75rem 1.25rem;text-align: center;font-size: 0.875rem;
    line-height: 1.25rem;font-weight: 600;}
  
.read {background-color: rgb(108 70 222);width: 246px;border-radius: 0;left: 50px;position: relative;}

.mark-as-read {}
.mark-as-read:hover {background-color: rgb(105, 90, 148);}

.imagen .bandera1{width: 100%;margin:1.1em auto 1.1em;border-radius: 3%;align-items: center; position: relative;z-index: 0;
}

 

  
.campo3{background: url(../imagenes/fondo.jpg);background-position: inherit;background-size: cover;height:auto;width: 100%;overflow-y: hidden;
  padding-top:5% ;padding-bottom: 5%;text-align: center;align-items: center;}
.campo3 h1{ text-align: center;font-size: 5em;}
.campo3 span{color: #704ae2;}
.campo3 p{text-align: left;font-size: 20px;width:64%;display: inline-block;margin: 1% 0% 5% 0%;}
  
.campo3-3{background: url(../imagenes/fondo.jpg);background-position: inherit;background-size: cover;height:800px;width: 100%;overflow-y: hidden;
  padding-top:5% ;padding-bottom: 2%;text-align: center;align-items: center;}
.campo3-3 h1{ text-align: center;font-size: 3em; width: 100%;}
.campo3-3 span{color: #704ae2;}
.campo3-3 p{text-align: left;font-size: 20px;width:64%;display: inline-block;margin: 1% 0% 5% 0%;}
  
.campo4{ background-color: white; width: 100%;text-align: center;align-items: center;}
.campo4 h1{color: black; font-weight: 600;font-size: 40px;line-height: 55px; margin:8% auto 2%; width:75%;text-align: center;font-size: 3em;}
.campo4 .texto2{color: #505050;font-weight: 600;line-height: 25px;margin:5% auto 8%;width:95%;text-align: left;float: left;display: block;}
.campo4 span{    color: black;width: 40%;display: block;text-align: left;margin: 4% auto 0px;}
.campo4 .img{position: absolute;left: 630px;top: 268%;}
.campo4 a{background: green;color: white;border-radius: 10px;font-size: 20px;margin: 5% auto 0px;float:left;}

.spano{color: #704ae2;}

.campo-boton{width: 75%;display:flex;text-align: center;justify-content: center;}
.campo-boton a{ background: #704ae2;color: white;border-radius: 10px;font-size: 20px;padding:1em;justify-content: center;margin: 10% auto 0;}
.campo-boton a:hover{background: #5023d6;}
.campo5{background-color: #f3f2f6;}

.boton-activo{color: white;}
.boton-activo1{color: dodgerblue;}
  
  /*Aquí debajo va el FOOTER*/
  
.menu-horizontal{justify-content:end;display: flex;flex-direction: row;align-items: end;}

.nav.visible{opacity: 1;visibility: visible;display: flex;}
.nav-list{gap: 1rem;display: flex;flex-direction: row;}
.nav-list li a{color:white}
 /*plataformas*/
 .image-container {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  margin-left: 80px;
}
/*tamaños*/
.container_fs {display: flex;flex-wrap: wrap;justify-content: center;}
.row_fs {width: calc(50% - 20px);max-width: 300px;margin: 10px;padding: 10px;background-color: #f5f5f5;border-radius: 5px;text-align: center;}
.box2 {display: flex;flex-direction: column;align-items: center;text-decoration: none;color: #333;}
.box2 img {width: 80px;height: 80px;margin-bottom: 10px;}
.box2 span {font-size: 16px;text-decoration: underline;}
}
  
   





@media only screen and (max-width: 1070px) {
  .columna3{ background-color: aliceblue;padding-top: 50px;padding-bottom:  50px;height: auto;}
    
  .columna3 h1{ justify-content: center;display: flex;}
  .columna3 .carta img{justify-content: center;display:grid;top: 40px; position: relative;font-size: 12px;}
  .carta{justify-content: center;display: flex;    justify-content: space-evenly; height: 300px;}

.carta img{height: 70%;margin: 2% auto 0%;cursor: pointer;width: 20%;background: white;border-radius: 20px;}
  
.columna2{justify-content: center; width: 100%; position:relative;display: block;height:0px;}
.columna2 h1{ justify-content: center;display: flex;}

.columna2 p{justify-content: center; display: flex;top: 20px; position: relative;font-size: 11px;}

  .columna4{padding: 50px 0px 50px 0px;width: 100%;height: auto; overflow-y:hidden;align:center;}
  .columna4 .carta { width:100%;height: auto;}
  .columna4 .carta img{ background: white;padding: 30px 80px;width:auto;border-radius: 20px;justify-content: center; display: flex;font-size: 10px;margin: 0% auto 0%;}
  .columna4 h1{justify-content: center;width: 80%;margin: 0 auto 5%;font-size: 2em;}
  
  .columna5{padding-top: 80px; padding-bottom: 100px;background-color: aliceblue;display: grid;}
  .columna5 .h1{text-align: center;}
  .columna5 .p{text-align: center;margin: 2% auto 0%;}
  .caracteristicas3{position: relative; width: 100%;display: flex;justify-content: space-evenly;}
  .caracteristicas3 div{position: relative; display: grid;grid-template-columns: 2fr; place-items: center; text-align: center;height: 500px;}
  .caracteristicas{position: relative;width: 100%;display: flex; flex-direction: row-reverse;margin: 5% auto 2%;text-align: center;justify-content: center;gap: 8.5%;}
  
  .caracteristicas{position: relative;width: 100%; display: flex; flex-direction: row-reverse;margin: 15% auto 2%;text-align: center;justify-content: center;gap: 7%;}
  .caracteristicas div{ text-align: center;width: 20%;}
  .caracteristicas p{text-align: center;font-weight: bold;color: rgb(2, 2, 152);}
  
  .recuadros{width: 15em;position: relative;border-radius: 10px; text-align: left;background: white;display: grid;margin: 2%;}
  .recuadros div{ width:100%;height: 100px;text-align: left;display: grid; justify-content: left; padding: 5px;}
  .recuadros div p{text-align: left;width: 50%;margin-left: -90px; display: grid;}
  .btn{
    position: relative;
    background: #704ae2;
    color: white;
    cursor: pointer;
    padding: 20px 60px;
    font-size: 20px;
    border-radius: 100px;
    transition: 1s;
  }
    
  .cards{ background-color: aliceblue; height:auto;width: 100%;display: flex;}

  .section2{position: relative;width: 100%;margin: 0 auto 5%;}

  .section2 h2{text-align: center;font-size: 40px;width: 700px;left: 230px;position: relative;}
  
  .section2 p{text-align: center;width: 840px;font-size: 20px;left: 160px;position: relative;display: flex;}
  .oculto{margin-top:2%;float: left;width: 100%;height: 43px;display: inline-block;position: relative;}
    
  .tituloysub h1{width: 80%; font-size: 40px;margin: 4% auto 0%;} 
  .tituloysub p{ text-align: left;font-size: 18px;width: 80%; margin: 2% auto 5%;}
  .precios {display:flex;gap: 5%;width:100%;text-align:left;justify-content:stretch;margin-top: -7% ;}
  .precios h1{display:flex;gap: 0%;width:90%;text-align: left;justify-content:left;font-size: 13px;}
 
  .caracteristicas2{position: relative;width: 20%;padding: 1%;gap: 2%;text-align: left;display: grid;}
  .caracteristicas2 div{position: relative;display: grid;grid-template-columns: 2fr;text-align: left;height: 500px;}
  .caracteristicas2 h2{font-size: 15px;margin-bottom: 20%;}
  .caracteristicas2 p{font-size: 12px;padding: 0% auto 50%;}
  
  .ubicacion{align-items: center;text-align: center;height: 200px;width: 100%;position:absolute;display: grid;margin: 0% auto 0%;color: white;}
  .ubicacion-div{display: flex;justify-content: center;align-items: center;color: white;margin-top:4%;}
  .ubicacion-div a{color: white;}
  .ubicacion h1{color: white;margin: -5% auto 0%;font-size: 2.5em;}

 .imagenespot{ width: 101%; height: 600px;}

 #login-menu2{display: none;}

 #logo2{display: none;}

.cuadros{display: flex;justify-content: space-evenly;}
 
     
.imagen-derecha{position:absolute;width: 50%;float:right;right: 0;top: 15%; }
.imagen-centro{width: 30em;float: left;right: 200px;margin-top: 10%;margin-right: 10%;}

   /* BOTONES */
   .whatsapp {position:fixed; width:60px;height:60px;bottom: 52px;left: 26px;background-color:#25d366;color:#FFF;border-radius:50px;text-align:center;
    font-size:30px;z-index:100;}
    .whatsapp-icon {margin-top:13px;}
     
 
    .container{width: 100%;justify-content: center;}
    /*HEADER*/
    a{text-decoration: none;}
  
    header{width: 100%;min-height: auto;display: flex;justify-content: center;background: rgb(0, 0, 0);align-items: center;padding-top:.5%;
      padding-bottom:.5%;}
    header  a{display: flex;justify-content:center;align-items:center;}
    header img{width: 150px;
    }
  
    .nav{display: flex;z-index: 1000;justify-content:space-around;width: 100%;
    }
  
    .menu-horizontal{ display: flex;list-style: none;justify-content:center;gap: 1.5rem;}
    .menu-horizontal > li > a{ display: inline-block; width:100%;font-size:70%;padding-top: 3vh;padding-bottom: 3vh;color: white;text-decoration: none;
    margin: 0 auto 0;}
 
 
    .menu-vertical{margin-top: .1%;position: absolute;display: none;list-style: none;width: auto;background-color: rgb(108 70 222);}
    .menu-horizontal li:hover .menu-vertical{display: block;}
    .menu-vertical li:hover{background-color: black;}
    .menu-vertical li a{display: block;color: white;padding: 15px 15px 15px 20px;text-decoration: none;
    }
  
    .login-menu{display: flex;justify-content:center;align-items:center;}
    .login,
    .regist {display: flex;justify-content:center;align-items:center;background-color: #704ae2;border-radius: 50%;border-radius: 10px;padding:.5em;
    height: 25px;width: 100px;font-size: 13px;margin: 0 auto 0;text-align: center;}
    .regist a{color: white;}
    .login a{color: white;}
    .login:hover{background-color: rgb(100, 100, 100);}
    .regist:hover{background-color: rgb(100, 100, 100);}
 
    .campo1 h1{position: absolute;padding: 70px 100px;width: 400px;font-size: 50px;color: rgb(0, 0, 0); }
    .campo1 .letra1{position: absolute;padding: 300px 100px; width: 390px;font-size: 20px;color: rgb(136, 135, 135);}
    
    .botonr{position: absolute;top: 500px;left: -100%;}
    
    .botonr2{position: absolute;top: 500px;left: 100px;background: #704ae2;color: white;text-decoration: none;padding: 20px 60px;font-size: 20px;
    border-radius: 100px;transition: 1s;}
    
    .campo1 .img2{position: absolute;top: 50px;right: 10px;width: 650px;}
      /* CAMPO2 */
    .campo2 h1{width: 80%;color: black;text-align: center;position: relative;font-size:2.5em;margin: 7% auto 5%;}
    .campo2 span{color: #704ae2;}
    .campo2 .letra2{font-size: 18px;letter-spacing: 0px; color: #000000;font-weight: 300;max-width: 65%;margin: 1% auto 5%;
     text-align:left;position: relative;}
     
    .lineaa{display: flex; width: 95%;  justify-content: space-between;  gap: 2px;}
    .linea1{width:15%;text-align: center;position: relative;border-radius: 10px;filter: drop-shadow(0px 5px 2px rgba(0, 0, 0, 0.1));
     background-color: #ffffff;}
    .linea1 p{font-size: 12px;padding-top: 1px;padding-bottom: 1px;}
 
 
 
    .cuadro-izq{position: relative;bottom: 0%;opacity: 0;width:100%;border-color: rgb(0, 96, 221);display: flex;justify-content: center;
      align-items: center;height: 10vh;margin-top: 10%;    }
    .cuadro-izqi{position: relative;display: inline-block;width: 100%;height: auto;  width:100%;border-color: rgb(0, 96, 221);display: flex;
        justify-content: center;align-items: center;height: 80vh;transition: 1.5s;}
    
    .iframe{width: 700px;border:none;height: 800px;position: relative;display: inline-block;}
    
    .oper{left:-100%;opacity: 0;position: absolute;width:100%;display: flex;height: 100vh;}
    
    .opere{position: absolute;left:0%;width:100%;border-color: rgb(0, 96, 221);display: flex;justify-content: left;height: 100vh;transition: .5s;}
    
    .oper2{left:0%;opacity: 0;position: absolute;width:100%;display: flex;height: 100vh;}
   
    .opere2{position: absolute;left:0%;width:100%;border-color: rgb(0, 96, 221);display: flex;justify-content: left;height: 100vh;transition: .5s;}
    
    .video-background{width:100%;height:38em;overflow-y: hidden;filter: brightness(0.4);z-index: -1;overflow-y: hidden;position:relative;}
    
    .cartascolum{width:100%;border-color: rgb(0, 96, 221);display: flex;justify-content: center;align-items: center;height: 100vh;}
 
 


  /* CAMPO DIVIDO POR CARTAS */
  .card {width:28%;border-width: 1px;border-color: rgb(15, 86, 178);border-radius: 1rem;padding: 1rem; margin-top:5%;height: auto;display: inline-block;box-shadow: -3.009px 3.993px 10px rgb(0 0 0 / 14%);}

  .icon {flex-shrink: 0;display: flex;align-items: center;justify-content: center;border-radius: 9999px;background-color: rgba(96, 165, 250, 1);padding: 0.5rem;color: rgba(255, 255, 255, 1);}
  .icon2 {flex-shrink: 0;display: flex;align-items: center;justify-content: center;border-radius:0;padding: 0.5rem;color: rgba(255, 255, 255, 1);}
  .icon svg {height: 1rem;width: 1rem;}
  
  .alert {font-weight: 600;font-size: 1.5em !important;color: rgb(11, 11, 12) !important;}
  
  .message {margin-top: 1rem !important;  color: rgba(107, 114, 128, 1)  !important;  font-size: 1em;  }
  
  .actions {display: inline-block;position: relative;width: 100%;}
  .actions a {text-decoration: none;width: 96%;flex-shrink: 0;display: flex;align-items: center;justify-content: center;background-color: rgb(108 70 222);
      padding: 4%;color: rgba(255, 255, 255, 1);}
   
  .mark-as-read, .read {display: inline-block;border-radius: 0.5rem;width: 100%;padding: 0.75rem 1.25rem;text-align: center;font-size: 0.875rem;
      line-height: 1.25rem;font-weight: 600;}
    
  .read {background-color: rgb(108 70 222);width: 246px;border-radius: 0;left: 50px;position: relative;}


  .mark-as-read {}
  .mark-as-read:hover {background-color: rgb(105, 90, 148);}
  
  .imagen .bandera1{width: 100%;margin:1.1em auto 1.1em;border-radius: 3%;align-items: center; position: relative;z-index: 0;
  }

  
  
  .campo3{background: url(../imagenes/fondo.jpg);background-position: inherit;background-size: cover;height:auto;width: 100%;overflow-y: hidden;
    padding-top:5% ;padding-bottom: 5%;text-align: center;align-items: center;}
  .campo3 h1{ text-align: center;font-size: 4em;width: 80%; margin: 0 auto;  }
  .campo3 span{color: #704ae2;}
  .campo3 p{text-align: left;font-size: 20px;width:64%;display: inline-block;margin: 5% 0% 5% 0%;}
    
  .campo4{ background-color: white; width: 100%;text-align: center;align-items: center;}
  .campo4 h1{color: black; font-weight: 600;font-size: 40px;line-height: 55px; margin:8% auto 2%; width:80%;text-align: center;font-size: 3.5em;height: auto;
    overflow-y: hidden;}
  .campo4 .texto2{color: #505050;font-weight: 600; margin:5% auto 5%;width:90%;text-align: left;float: left;}
  .campo4 span{color: #333;width: 40%;display: block;text-align: left;margin: 4% auto 0px;}
  .campo4 .img{position: absolute;left: 630px;top: 268%;}
  .campo4 a{background: green;color: white;border-radius: 10px;font-size: 20px;margin: 5% auto 0px;float:left;}
  
  .spano{color: #704ae2;}
  
  .campo-boton{width: 75%;display:flex;text-align: center;justify-content: center;}
  .campo-boton a{ background: #704ae2;color: white;border-radius: 10px;font-size: 15px;padding:1em;justify-content: center;margin: 10% auto 0;}
  
  .campo5{background-color: #f3f2f6;}
  
  .boton-activo{color: white;}
  .boton-activo1{color: dodgerblue;}
    
  .menu-horizontal{justify-content:end;display: flex;flex-direction: row;align-items: end;}
  
  .nav.visible{opacity: 1;visibility: visible;display: flex;}
  .nav-list{gap: 1rem;display: flex;flex-direction: row;}
  .nav-list li a{color:white}


}
 

@media only screen and (max-width: 879px) {
      .form-control {
        width: 100%;
        display: grid;
        justify-content: center;
    }
    .row_fs {
      width: calc(33.33% - 20px);
  }
 
.form-row {margin-bottom: 15px; width: 100%;}
.form-control { margin: 0 auto; padding: 10px;font-size: 16px;border-radius: 5px;border: 1px solid #ccc;width: 93%;}
.form-control:focus {outline: none;border-color: #80bdff;box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);}
.btnj { padding: 10px 20px;width: 100%;font-size: 18px;font-weight: 600; text-align: center; cursor: pointer;border: none;border-radius: 5px;margin: 0 auto 0;background-color: #704ae2}
  .section2{position: relative;width: 100%;margin: 0 auto 5%;}

  .section2 h2{text-align: center;font-size: 40px;width: 700px;left: 230px;position: relative;}
  
  .section2 p{text-align: center;width: 840px;font-size: 20px;left: 160px;position: relative;display: flex;}
  .oculto{margin-top:2%;float: left;width: 100%;height: 43px;display: inline-block;position: relative;}
    
  .ubicacion{padding: 20px;align-items: center;text-align: center;height: 200px;width: 100%;position:absolute;display: grid;margin: 0% auto 0%;color: white;}
  .ubicacion-div{display: flex;justify-content: center;align-items: center;color: white;}
  .ubicacion-div a{color: white;}
  .ubicacion h1{color: white; margin: -5% auto 0%;font-size: 2.5em;}

  .imagenespot{ width: 101%; height: 600px;}

  #login-menu2{display: none;}
  
  #logo2{display: none;}
  
  .cuadros{display: flex;justify-content: space-evenly;}
   
  
  .cuadro-izq{position: relative;bottom: 0%;opacity: 0;width:100%;border-color: rgb(0, 96, 221);display: grid;justify-content: center;
    align-items: center;height: 100vh }
  .cuadro-izqi{position: relative;display: inline-block;width: 100%;height: auto;  width:100%;border-color: rgb(0, 96, 221);display: flex;
      justify-content: center;align-items: center;height: 80vh;transition: 1.5s}
       
  
  .imagen-centro{width: 35rem;float: left;right: 200px;margin-top: 10%}
  
  .nueva-imagen{display: flex;padding-top: 5%}
  
  .nueva-seccion{width: 100%;display: flex;text-align: left}
  .nueva-seccion div span{width:90%;}
  .nueva-seccion div img{width:30%;top:0px;display: flex;float: left}
  .nueva-seccion div h1{text-align: left;width: 100%;font-size: 50px}

.para-boton{padding-left: 12%;margin-bottom: 10%;}

 main{margin-bottom: 10%;}
 
.imagen-centro{display: none;}

 .imagen-centro2{width: 30%;margin: 30% auto 0% ;display: flex;position: absolute;z-index: 100;float: right;right: 7%;}

 
.imagen-derecha{position:absolute;width: 40%;align-items: center; top: 10%;margin: 0% auto 0%;}
 
  /* BOTONES */
  .whatsapp {position:fixed; width:60px;height:60px;bottom: 52px;left: 26px;background-color:#25d366;color:#FFF;border-radius:50px;text-align:center;
    font-size:30px;z-index:100;}
    .whatsapp-icon {margin-top:13px;}
  
    .container{width: 100%;justify-content: center;}
    /*HEADER*/
    a{text-decoration: none;}
  
    header{width: 100%;min-height: auto;display: flex;justify-content: center;background: rgb(0, 0, 0);align-items: center;padding-top:.5%;
      padding-bottom:.5%;}
    header  a{display: flex;justify-content:center;align-items:center;}
    header img{width: 100px;}

  .nav{display: flex;z-index: 1000;justify-content:space-around;width: 100%;}

  .menu-horizontal{ display: flex;list-style: none;justify-content:center;gap: 1rem;}
  .menu-horizontal > li > a{ display: inline-block; width:100%;font-size:70%;padding-top: 3vh;padding-bottom: 3vh;color: white;text-decoration: none;
  margin: 0 auto 0;}

  .menu-vertical{margin-top: .1%;position: absolute;display: none;list-style: none;width: auto;background-color: rgb(108 70 222);}
  .menu-horizontal li:hover .menu-vertical{display: block;}
  .menu-vertical li:hover{background-color: black;}
  .menu-vertical li a{display: block;color: white;padding: 15px 15px 15px 20px;text-decoration: none;
  }
 

  .login-menu{display: flex;justify-content:center;align-items:center;}
  .login,
  .regist {display: flex;justify-content:center;align-items:center;background-color: #704ae2;border-radius: 50%;border-radius: 10px;padding:.4em;
  height: 25px;width: 80px;font-size: 13px;margin: 0 auto 0;text-align: center;}
  .regist a{color: white;}
  .login a{color: white;}
  .login:hover{background-color: rgb(100, 100, 100);}
  .regist:hover{background-color: rgb(100, 100, 100);}

  .campo1 h1{position: absolute;padding: 70px 100px;width: 400px;font-size: 50px;color: rgb(0, 0, 0); }
  .campo1 .letra1{position: absolute;padding: 300px 100px; width: 490px;font-size: 20px;color: rgb(136, 135, 135);}
  
  .botonr{position: absolute;top: 500px;left: -100%;}
  
  .botonr2{position: absolute;top: 500px;left: 100px;background: #704ae2;color: white;text-decoration: none;padding: 20px 60px;font-size: 20px;
  border-radius: 100px;transition: 1s;}
  
  .campo1 .img2{position: absolute;top: 50px;right: 10px;width: 650px;}

  .campo2 h1{width: 90%;color: black;text-align: center;position: relative;font-size:2.5em;margin: 7% auto 5%;}
  .campo2 span{color: #704ae2;}
  .campo2 .letra2{font-size: 18px;letter-spacing: 0px; color: #000000;font-weight: 300;max-width: 50%;margin: 1% auto 5%;
   text-align:left;position: relative;}
   
  .lineaa{display: flex; width: 95%;  justify-content: space-between;  gap: 2px;}
  .linea1{width:15%;text-align: center;position: relative;border-radius: 10px;filter: drop-shadow(0px 5px 2px rgba(0, 0, 0, 0.1));
   background-color: #ffffff;}
  .linea1 p{font-size: 12px;padding-top: 1px;padding-bottom: 1px;}

  .cuadro-izq{position: relative;bottom: 0%;opacity: 0;width:100%;border-color: rgb(0, 96, 221);display: flex;justify-content: center;
    align-items: center;height: 100vh; opacity: 0;  }
  .cuadro-izqi{position: relative;display: inline-block;width: 100%;height: auto; border-color: rgb(0, 96, 221);display: flex;
      justify-content: center;align-items: center;height: auto;transition: 1.5s;}


      .iframe{width: 700px;border:none;height: 800px;position: relative;display: inline-block;}
  
      .oper{left:-100%;opacity: 0;position: absolute;width:100%;display: flex;height: 100vh;}
      .opere{position: absolute;left:0%;width:100%;border-color: rgb(0, 96, 221);display: flex;justify-content: left;height: 100vh;transition: .5s;}
      .oper2{left:0%;opacity: 0;position: absolute;width:100%;display: flex;height: 100vh;}
      .opere2{position: absolute;left:0%;width:100%;border-color: rgb(0, 96, 221);display: flex;justify-content: left;height: 100vh;transition: .5s;}
      
      .video-background{width:100%;height:38em;overflow-y: hidden;filter: brightness(0.4);z-index: -1;overflow-y: hidden;position:relative;}
      
      .cartascolum{width:100%;border-color: rgb(0, 96, 221);display: flex;justify-content: center;align-items: center;height: 100vh;}


/* CAMPO DIVIDO POR CARTAS */

  /* CAMPO DIVIDO POR CARTAS */
  .card {width:28%;border-width: 1px;border-color: rgb(15, 86, 178);border-radius: 1rem;padding: 1rem; margin-top:5%;height: auto;display: inline-block;box-shadow: -3.009px 3.993px 10px rgb(0 0 0 / 14%);}

  .icon {flex-shrink: 0;display: flex;align-items: center;justify-content: center;border-radius: 9999px;background-color: rgba(96, 165, 250, 1);padding: 0.5rem;color: rgba(255, 255, 255, 1);}
  .icon2 {flex-shrink: 0;display: flex;align-items: center;justify-content: center;border-radius:0;padding: 0.5rem;color: rgba(255, 255, 255, 1);}
  .icon svg {height: 1rem;width: 1rem;}
  
  .alert {font-weight: 600;font-size: 1.5em !important;color: rgb(11, 11, 12) !important;}
  
  .message {margin-top: 1rem;color: rgba(107, 114, 128, 1);font-size: 1em;}
  
  .actions {display: inline-block;position: relative;width: 100%;}
  .actions a {text-decoration: none;width: 96%;flex-shrink: 0;display: flex;align-items: center;justify-content: center;background-color: rgb(108 70 222);
      padding: 4%;color: rgba(255, 255, 255, 1);}

      
.mark-as-read, .read {display: inline-block;border-radius: 0.5rem;width: 100%;padding: 0.75rem 1.25rem;text-align: center;font-size: 0.875rem;
  line-height: 1.25rem;font-weight: 600;}

.read {background-color: rgb(108 70 222);width: 246px;border-radius: 0;left: 50px;position: relative;}

.mark-as-read {}
.mark-as-read:hover {background-color: rgb(105, 90, 148);}
.imagen .bandera1{width: 100%;margin:1.1em auto 1.1em;border-radius: 3%;align-items: center; position: relative;z-index: 0;
}


  
.campo3{background: url(../imagenes/fondo.jpg);background-position: inherit;background-size: cover;height: auto;width: 100%;overflow-y: hidden;
  padding-top:5% ;padding-bottom: 5%;text-align: center;align-items: center;}
.campo3 h1{ text-align: center;font-size: 3em;width: 90%;margin: 0 auto;}
.campo3 span{color: #704ae2;}
.campo3 p{text-align: left;font-size: 20px;width:64%;display: inline-block;margin: 5% 0% 5% 0%;}

.campo4{ background-color: white; width: 100%;text-align: center;align-items: center;}
.campo4 h1{color: black; font-weight: 600;font-size: 3.5em;line-height: 55px; margin:8% auto 2%; width:80%;text-align: center;}
.campo4 .texto2{color: #505050;font-weight: 600;margin:5% auto 5%;width:90%;text-align: left;}
.campo4 span{color: black;width: 40%;display: block;text-align: left;margin: 4% auto 0px;}
.campo4 .img{position: absolute;left: 630px;top: 268%;}
.campo4 a{background: green;color: white;border-radius: 10px;font-size: 20px;margin: 5% auto 0px;float:left;}

.spano{color: #704ae2;}

.campo-boton{width: 90%;display:flex;text-align: left;justify-content: left;}
.campo-boton a{ background: #704ae2;color: white;border-radius: 10px;font-size: 18px;padding:1em;justify-content: center;margin: 10% auto 0;}

.campo5{background-color: #f3f2f6;}

.boton-activo{color: white;}
.boton-activo1{color: dodgerblue;}
  /*plataformas*/
.image-container {
  display: flex;
  flex-direction: column;
  align-items: flex-start;

}
 
}

/* medium devices (landscape tablets, 760px and up) */
@media screen and (max-width: 751px){
 
    .form-control {
        width: 100%;
        display: grid;
        justify-content: center;
    }
    .row_fs {
      width: calc(100% - 20px);
      max-width: none;
  }
 
.form-row {margin-bottom: 15px; width: 100%;}
.form-control { margin: 0 auto; padding: 10px;font-size: 16px;border-radius: 5px;border: 1px solid #ccc;width: 93%;}
.form-control:focus {outline: none;border-color: #80bdff;box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);}
.btnj { padding: 10px 20px;width: 100%;font-size: 18px;font-weight: 600; text-align: center; cursor: pointer;border: none;border-radius: 5px;margin: 0 auto 0;background-color: #704ae2}

.btn-dark {color: #fff; background-color: #343a40;margin: 0 auto;}
.formu{width: 90%;margin: 0 auto;}
  .iframe{width: 700px;border:none;height: 800px;position: relative;display: inline-block;}

  .section3{padding: 25px;}

.section3 p{ line-height:2;text-align: left;font-size: 14px;}
  .campo3{background: url(../imagenes/fondo.jpg);background-position: inherit;background-size: cover;height:auto;width: 100%;overflow-y: hidden;
    padding-top:10% ;padding-bottom: 4em;text-align: center;align-items: center;}
  .campo3 h1{text-align: center;font-size: 30px;width:80%;display: inline-block;margin: 5% 0% 5% 0%;}
  .campo3 span{color: #704ae2;}
  .campo3 p{text-align: left;font-size: 22px;width:80%;display: inline-block;margin: 5% 0% 5% 0%;}
  
  .box__footer{display: grid;padding: 50px;justify-content:center;color: white;  }
  .box__footer .logo img{width:100%; float: left; position: relative;margin:0 auto 0;width:100px; }
  
  .nueva-seccion{width: 100%;display: flex;display:grid;align-items: center;align-content: center;padding: 8%;}
  .nueva-seccion div span{width:90%;text-align: left;}
  .nueva-seccion div img{width:30%;top:0px;display: flex;}
  .nueva-seccion div h1{text-align: left;width: 100%;font-size: 50px;}
  
  .para-boton{padding-left: 0%;margin-bottom: 10%;}
  .para-boton h1{width: 10px;}


  #login-menu{ display: none;}
  #logo3{display: none;}
  
  
  .cuadro-izq{position: relative;bottom: 0%;opacity: 0;width:100%;border-color: rgb(0, 96, 221);display: flex;justify-content: center;
    align-items: center;height: 100vh;}
  .cuadro-izqi{margin-top:0%;display: grid;position: relative; width: 100%;height: auto; align-items: center;transition: 1.5s;padding-top: 5%;padding-bottom: 2%;}
 
    
   .campo2 h1{width: 80%;color: black;text-align: center;position: relative;font-size:2.5em;margin: 7% auto 5%;}
   .campo2 .letra2{font-size: 18px;letter-spacing: 0px; color: #000000;font-weight: 300;max-width: 80%;margin: 1% auto 5%;
   text-align:left;position: relative;}
   
   .imagen-derecha{align-items: center;position:relative;width: 90%;  margin: 0% auto 0%;   }


   .campo1 h1{position: absolute;width: 100%;font-size: 5vh;color: white; margin: 0 auto 0;}
   .campo1 .letra1{position: relative;padding:0 ;width: 90%;font-size:1.3em;color: rgb(136, 135, 135);margin: -37vh auto 0;}
   .campo1 .letra2{position: relative;padding:0 ;width: 90%;   color: black;font-size:2.5em;margin: 3vh auto 0;text-align: center;}

   .campo1 {text-align: center;display: grid;padding: 0%;margin-bottom:2em ;justify-content: center;text-align: center;height: auto;}
   .campo1 a{ top:0%;position: relative;left: 0;background: #704ae2;color: white;text-decoration: none;padding: 10px 90px;font-size: 20px;text-align: center;border-radius: 100px;transition: 1s;margin: 80% auto 0;}
  
   .botonr2{margin:0 auto 0;position:relative; top: 0px; background:  #704ae2;color: white;text-decoration: none;padding: 20px 60px;font-size: 20px;border-radius: 100px;transition: 1s; outline:none;border: none;width:9em; }
   .botonr{position: absolute;top: 0px;left: -100%;}

   .campo1 .img2{position: absolute;top: 50px;right: 10px;width: 650px;}
     /* CAMPO2 */
 
     
     .oper{left:-100%;opacity: 0;position: absolute;width:100%;display:grid;height: 100vh;}
     .opere{position: absolute;left:0%;width:100%;border-color: rgb(0, 96, 221);display:grid;justify-content: left;height: 100vh;transition: .5s;}
     .oper2{left:0%;opacity: 0;position: absolute;width:100%;display: grid;height: 100vh;}
     .opere2{position: absolute;left:0%;width:100%;border-color: rgb(0, 96, 221);display: flex;justify-content: left;height: 100vh;transition: .5s;}
     
   .campo2{background: aliceblue;height: auto;padding: 2%; display: flex;width: 100%;overflow-y: hidden;justify-content: center;}
   .campo2 h1{width: 80%;color: black;text-align: center;position: relative;font-size:2.6em;margin: 7% auto 20px;}
   .campo2 span{color: #704ae2;}
   .campo2 .letra2{font-size: 18px;letter-spacing: 0px; color: #000000;font-weight: 300;max-width: 65%;margin: 1% auto 5%;
    text-align:left;position: relative;}

  .imagenespot{width: 100%;height: 0px;}
  
  #login-menu2{display: inline;}

  #logo2{display: inline;margin-left: 6%;}
 
  .cuadros{ display: block;}
  
  .uno{background: aliceblue;padding-top: 100px;padding-bottom: 100px;text-align: center;width: 90%;margin: 5% auto 5%;display: block;border-radius: 20px;}
  .uno img{filter: drop-shadow(2px 4px 6px black);}
  .uno img:hover{filter: invert();}
  .uno:hover{background-color: #704ae2;color: white;}
  
  .tituloysub h1{width: 80%; font-size: 40px;margin: 8% auto 0%;text-align: left;} 
  .tituloysub p{ font-size: 18px;width: 80%; margin: 2% auto 5%; text-align: left;}
    
  
  .precios {display:flex;gap: 0%;width:100%;text-align: center;justify-content: left;margin-top: 0% ;}
  .precios h1{display:flex;gap: 0%;width:100%;text-align: center;justify-content:center;font-size: 13px;}

  .lineaa{display: flex; width: 98%;  justify-content: space-between;  gap: 2px;}
  .linea1{width:20%;text-align: center;position: relative;border-radius: 10px;filter: drop-shadow(0px 5px 2px rgba(0, 0, 0, 0.1));
   background-color: #ffffff;}

  .section-two{text-align: center;width: 90%;}

  .section-two p{font-size: 1.5em;line-height: 1.5;text-align: left;width: 80%;font-family:'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;}

   main{width: 100%; display: grid;margin: 5% auto 20% ;}

  .grafico{display: grid;align-items: center;justify-content: center;max-width: 500px;height: auto; margin: 0 auto 0;}

  #tradi2{ width: 100%; margin-left:0% ; display:block;justify-content:center; align-content: center;display: none;}
 
  .tradingview-widget-container{width: 100%;margin: 5% auto ; display:block;justify-content:center; align-content: center; }

  .trading{ margin: 0% auto -10%; width:100%;justify-content:center; align-content: center; display:flex;}
  .trading2{margin: 0% auto 0%;   width:100%;justify-content:center; align-content: center;display:block;}

  .table-responsive-xl{ width: 100%;margin: 0 auto 0;}
  .table{ width: 100%; }

  tr td{padding-left: 0%;padding-top: 1%; padding-bottom: 1%;margin: 0 auto 0;width: 10%;font-size: 10px;}
  tr th{padding-left: 0%;padding-top: 1%; padding-bottom: 1%;margin: 0 auto 0;width: 10%; font-size: 10px;}

  thead tr th{font-size: 10px; padding-left: 0%;padding-top: 1%;padding-bottom: 1%;margin: 0 auto 0;width: 10%;}
  .sectiones{width: 100%;display: grid;margin: 0 auto 0;justify-content: center;}
  .sectiones2{padding-top: 10%;padding-bottom: 10%;width:80%;display: grid; margin: 0 auto 0;}

  .sectiones2 div{margin: 0 auto 0;width: 100%;display: grid;text-align: left;}
  .sectiones2 div img{ width: 100%;margin-left:0;}   
  .sectiones2 div h1{left: 0;width: 100%;margin: 10% auto 5%;position: relative;} 
  .sectiones2 div h4{ left: 0;margin-top: 5%;} 

.section1{margin-top: 0%;width: 100%;display: grid;padding-top: 10%;padding-bottom: 10%;margin: 0 auto 0;}

.section1 div{ margin: 0 auto 0;width: 50%; display: grid;text-align: left;}

.section1 div h1{left: 0;width: 50%;position: relative;}

.section1 div img{left: 0;width: 40%;position: relative;}

.columna2{justify-content: center;width: 100%; position:relative;display: block;height:auto;}
.columna2 h1{justify-content: center;display: flex;font-size: 25px;}
.columna2 p{justify-content: center;display: flex;margin-top: 30px;position: relative; text-align:left;font-size: 1.5em;width: 80%; height:auto; margin: 0 auto 5%;}

.columna3 .carta img{justify-content: center;display:grid;top: 40px; position: relative;font-size: 12px;}
.columna3{background-color: aliceblue;padding:0%;height: auto;padding-bottom: 50px;overflow-y:hidden;}
.columna3 h1{justify-content: center;text-align: left;font-size: 2.5em; width: 80%;margin: 10% auto 0;}

.carta{justify-content: center;display: grid;justify-content: space-evenly;width:100%;height:auto;}
.carta img{height: 20em;margin: 10% auto 5%;cursor: pointer; width: 100%;background: white;border-radius: 20px;}
  
.columna4{padding: 50px 0px 50px 0px;width: 100%;height: auto; overflow-y:hidden;align:center;}
.columna4 .carta { width:100%;height: auto;}
.columna4 .carta img{ background: white;padding: 30px 80px;width:auto;border-radius: 20px;justify-content: center; display: flex;font-size: 10px;margin: 15% auto 15%;}
.columna4 h1{justify-content: center;width: 80%;margin: 0 auto 5%;font-size: 2em;}

.columna5{padding-top: 80px; padding-bottom: 100px;background-color: aliceblue;display: grid;}
.columna5 .h1{text-align: center;}
.columna5 .p{text-align: center;margin: 2% auto 0%;}

.caracteristicas2{ position: relative; width: 25%;margin-top: 0%;margin-right: 1%; gap: 1%;text-align: left; display: grid;}
.caracteristicas2 div{position: relative;display: grid;grid-template-columns: 2fr;place-items: center;text-align: left;height: 500px;}
.caracteristicas2 p{width: 80px; font-size: 8px;height: 40px;}
.caracteristicas2 h2{font-size: 9px;height: 30px;}

.caracteristicas{position: relative;width: 100%; display: flex; flex-direction: row-reverse;margin: 15% auto 2%;text-align: center;justify-content: center;gap: 7%;}
.caracteristicas h1{font-size: 18px; margin: 2%;}
.caracteristicas div{ text-align: center; width: 21%;}
.caracteristicas p{text-align:left;font-size: 14px;color: rgb(2, 2, 152);}

.recuadros{width: 15em;position: relative;border-radius: 10px; background: white;display: grid;margin: 2%;}
.recuadros div{ width:100%;height: 100px; display: grid;   margin-left:-100px}
.recuadros div p{  width:70px;margin: 0 auto 0; display: grid;font-size: 12px;position:relative}

.cuadros1{width: 138px;position: relative;border-radius: 10px; text-align: center; background: white;padding: 40px;}
.cuadros2{ width: 138px;position: relative;border-radius: 10px;text-align: center;background: white;padding: 40px;}

.columna6{position: relative;padding: 90px 0px 100px 0px;background: white; width: 80%; margin: 0 auto 0;}
.columna6 h1{text-align: center;margin: 0 auto 1%;}
.columna6 p{text-align: left;}

.seguridad{margin: 2% auto 2%;font-size: 1.2em;width: 80%;text-align: left; }
.api{ background-color: aliceblue; display: grid; margin: 0 auto 0;padding-top: 5%;padding-bottom: 5%;width: 96%; height: 100%x;}

.caja1{position: relative;width:88%;text-align: center;margin: 0% auto 5%;background: aliceblue;border-radius: 20px;box-shadow: 0 3px 10px rgb(0 0 0 / 0.2);padding: 0%;}
.oculto{margin-top:  0%;float: left;width: 100%;height: 18px;display: inline-block;position: relative;}
 
.oculto2{margin-top:  0%; float: left;width: 100%;height: 25px;display: inline-block;position: relative;}

.caja1 h4{position: relative;font-size: 8.5px;line-height: 2.9;margin: 18% auto 20%;width:100%;}
.subtitulos{position: relative;margin:0% auto 0%;width:50px;text-align:left;left: 0px;top: 0px;display: grid;}
.subtitulos h4{position: relative;font-size: 10px;margin:68% auto 30%;}

.caja{max-width: 100%;height: auto;display: flex;margin: 0 auto 0;justify-content: left;align-items: left;}

.section2{padding: 0px;position: relative;width: 100%;margin-top: 10%;}
 
.caja1-1{display: grid;width: 100%;}
.caja1-1 h3{text-align:center;position: relative;font-size:10px;}

.titulos2{padding: 30px;}
.titulos2 h2{text-align: left;margin: 5% auto  10%; font-size: 2em;width: 70%;}
.titulos2 p{ margin: 0 auto 5%;font-size: 1.2em;  width: 70%;text-align: left;}

.ubicacion{align-items: center; padding: 20px;text-align: center;height: 200px;width: 90%; position:absolute; display: grid;margin: 0% auto 0%;color: white;}
.ubicacion-div a{color: white;}
.ubicacion h1{color: white;margin:-5% auto 0%;font-size: 2em;}

.postcartas{text-align: center; padding: 0px; position: relative;font-size: 300px;margin: 0% auto 0%;align-items: center;display: inline-block;width: 100%;}
.postcartas h3{text-align: center;padding: 50px; font-size: 2rem;margin: 1% auto 0%;}

.titulos{display: grid; align-items: center;}
.titulos h2{ text-align: left; margin: 5% auto 2.5%;font-size: 2.5em;width: 80%;}
.titulos2{ padding: 30px;}
.titulos2 p{ margin: 0 auto 5%;font-size: 1.2em; width: 67%;text-align: left; }
.titulos p{margin: 0 auto 20%;font-size: 1.2em; width: 80%;text-align: left;}

.imagen .bandera1{width: 100%;margin:1.1em auto 1.1em;border-radius: 3%;align-items: center; position: relative;z-index: 0;
}

.card {width:80%; border-radius: 1rem; padding: 1rem; margin: 1em auto 6%;height:auto;  background-color: white;display: grid; overflow-y:hidden;box-shadow: -3.009px 3.993px 10px rgb(0 0 0 / 14%);position:relative}
.cards{ background-color: aliceblue; height:auto;width: 100%;display: grid;padding-top: 3%;}

header{ display: flex;justify-content:space-between;padding-top: 3%; padding-bottom: 3%;}

.menu-vertical{background-color: rgb(108 70 222); width: 100%;height: auto;gap: 50px;margin-top: 30%;}

 body { overflow-x: hidden;overflow-y: auto;}

.abrir-menu,
.cerrar-menu{display: block;padding: 5px;margin-right: 7%;font-size: 1rem;border: none;background-color: rgb(108 70 222);}
.cerrar-menu{top: 100px; width: 40px;height: 40px;margin-left: 5%;}

.nav{ opacity: 0; visibility: hidden; height: 100px;display: flex; align-items: start; flex-direction: column; margin-top: 0;}

.menu-horizontal{justify-content:left;display: grid;top: 0; width: 100%;}
.menu-horizontal li{ justify-content:left;display: grid;top: 0; width: 1000%; }

.menu-vertical li a{display: block;color: white;padding: 15px 15px 15px 20px;text-decoration: none;font-size: 6px;margin-left: 0%;}

.nav ul li a{font-size: 15px;margin: 5%; text-align: left;float: left;}
.nav{position:fixed;display: flex;background-color:  rgba(0, 0, 0, .9);width:50%;height: 100%;padding: 5%;font-size: 10px;top: 0%;right: 0;box-shadow: 0 0 0 100vmax rgba(0, 0, 0, .5);}
.nav.visible{opacity: 1;visibility: visible; display: flex;}
.nav-list{gap: 2rem;display: flex;flex-direction: column;font-size: 140px;}
 .visi{visibility: hidden;}
.login-menu{width: auto;display: flex; align-items: left;justify-content:  left;padding: 0px;margin-left:-3%;text-decoration: none}
.login,
.regist { display: inline-block;justify-content:center;align-items:left;background-color: #704ae2;border-radius: 50%;margin-top:5%;margin-bottom:5%;border-radius: 10px;font-size: 12px;text-align: center;height: auto; padding-top: 5%; padding-bottom: 5%;  }
.whatsapp {position:fixed;width:60px;height:60px;bottom: 34px;left: 26px; background-color:#25d366; color:#FFF; border-radius:50px;text-align:center;font-size:30px;z-index:100;}
.whatsapp-icon {margin-top:13px;}
  /*plataformas*/
  .image-container {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    margin-left: 70px;
  }
   

}