/*#####HOJA DE ESTILO PARA PÁGINA DE INDEX DE JDSUITE*/

/*####ESTILOS GLOBALES####*/

/* JDSUITE - HISTORIA - SOMOS DIFERENTES */
    .button-asesor {
      margin: 0;
      position: absolute;
      font-size: larger;
      border-radius: 10px;
      -ms-transform: translate(-50%, -50%);
      transform: translate(-50%, -50%);
    }
    .frow {
        max-width: 100%;
        clear: both;
        /* padding: 30px; */
        align-content: center;
        display: table;
        display: flex;
        align-items: center;
    }

    .estilo-textos {
        text-align: justify;
        background: rgba(255, 255, 255, 0.7);
        border-radius: 5px;
        padding: 1%;
    }
    .texto-jdsuite{
      font-size: 25px;
      font-weight: 600;
      color: #4c7eb6;
  }

    .texto-historia,
    .texto-diferentes{
        font-size: 20px;
        font-style:italic;
        font-weight: 800;
        color: #28badbff;
    }

    .titulo-historia,
    .titulo-diferentes{
        font-style: oblique;
        font-size: 35px;
        font-weight: 600;
        color: #4c7eb6;
    }

    .fondo-jdsuite
    {
        background: URL(../images/fondo\ -\ 1.webp);
        /* min-height: 650px; */
        background-size: cover;
        background-position: center; 
        display: flex;
        align-items: center;
    }

    .fondo-historia
    {
        background: URL(../images/fondo\ -\ 2.webp);
        /* min-height: 650px; */
        background-size: cover;
        background-position: center; 
        display: grid;
        align-items: center;
    }

    /* diferentes */
    .fondo-diferentes
    {
        background: URL(../images/Fondo\ -\ 3.webp);
        /* min-height: 650px; */
        background-size: cover;
        background-position: center; 
    }
    .diferentes-texto{
        background: rgba(255, 255, 255, 1);
    }
    /* diferentes */
/* FIN JDSUITE - HISTORIA - SOMOS DIFERENTES */

/**** LOS CONSENTIDOS ****/

.demo{ background: white; }
.testimonial{
    margin: 0 40px 40px;
    align-items: center;
}
.testimonial .testimonial-content{
    padding: 5px;
    margin-bottom: 35px;
    /*** Color fondo carta***/
    background: #fff;
    /*** Color borde carta **/
    border: 2px solid #4c7eb6;
    border-radius: 5px;
    position:relative;
}
.testimonial-content .testimonial-icon:before{
    content: "";
    /*** Color esquina detlle***/
    border-bottom: 16px solid #4c7eb6;
    border-left: 18px solid transparent;
    position: absolute;
    top: -16px;
    left: 1px;
}

.testimonial .title{
    display: block;
    font-size: 18px;
    font-weight: 700;
    /*** Color Nombre ***/
    color: #525252;
    text-transform: capitalize;
    letter-spacing: 1px;
    margin: 0 0 5px 0;
}

.testimonial .post{
    display: block;
    font-size: 14px;
    /*** Color Titulo**/
    color: #28bbdb;
}
.owl-theme .owl-controls{
    margin-top: 20px;
}
.owl-theme .owl-controls .owl-page span{
    background: #ccc;
    opacity: 1;
    transition: all 1s ease 0s;
}
.owl-theme .owl-controls .owl-page.active span,
.owl-theme .owl-controls.clickable .owl-page:hover span{
    /*** Color indicador ***/
    background: #4c7eb6;
}
.i-whatsapp{
    height: 38px;
    width: 38px;
    margin: 5px;
}
.i-whatsapp:hover{
    -webkit-transform:scale(1.25);
    -moz-transform:scale(1.25);
-ms-transform:scale(1.25);
-o-transform:scale(1.25);
transform:scale(1.25);
}
/**** FIN LOS CONSENTIDOS ****/


/*** INTEGRANTES FAMILIA ***/
  .texto-card{
    height: 67px;
    color: white;
    font-size:large;
    font-weight: 500;
    margin-bottom: 11%;
  }


    .carousel-familia .carousel-inner{
        margin-bottom: 40px;
    }

    .indicador-familia .active{ 
        background-color: black;
    }

    .indicador-familia li{ 
        background-color: gray;
    }

    .icono-mas-detalles-familia{
        
        padding: 0.0rem 0.5rem;
    }
    .btn-mas-detalles-familia{
        background: white;
        color: #28badbff;
        font-weight: 600;
        font-style: oblique;
        border-radius: 10px;
        padding: 0.6rem 0.5rem;
    }
/*** FIN INTEGRANTES FAMILIA ***/

    /*####ESTILO GLOBAL CASOS####*/

    /*ESTILO GLOBAL CAROUSEL CASOS+++*/
    /*COLOR DE FONDO*/

    .casos-exito {
      background-image: url("../images/fondo - 4.webp");
      background-position: center;
      background-repeat: no-repeat;
    }

    
    /*INDICADORES DE CAROUSEL CASOS*/
    .indicador-casos .active {
      background-color: #4c7eb6;
      border: 2px white solid;
    }

    .indicador-casos li {
      background-color: #28BADB;
      border: 2px white solid;
    }

    /*FIN INDICADORES DE CAROUSEL CASOS*/

    /*+++FIN ESTILO GLOBAL CAROUSEL CASOS+++*/
    .hexagon {
      -webkit-transform: rotate(120deg);
      -ms-transform: rotate(120deg);
      transform: rotate(120deg);
      overflow: hidden;
      margin-top: 2vw;
    }

    .hexagon-inside {
      width: 100%;
      height: 100%;
      -webkit-transform: rotate(-60deg);
      -ms-transform: rotate(-60deg);
      transform: rotate(-60deg);
      overflow: hidden;

    }

    .hexagon-image {
      width: 100%;
      height: 100%;
      background: url('../images/logotftye.png') no-repeat 50% whitesmoke;
      background-size: 60% auto;
      -webkit-transform: rotate(-60deg);
      -ms-transform: rotate(-60deg);
      transform: rotate(-60deg);
    }


    /*####FIN ESTILO GLOBAL CASOS####*/

/*####FIN ESTILOS GLOBALES####*/


/*####ESTILOS PARA PANTALLAS MÓVILES*/
@media screen and (max-width:767.98px)
{
/*###NAVBAR MÓVIL*/

/*###FIN NAVBAR MÓVIL*/


/*###HEADER MÓVIL###*/
.fondo-jdsuite,
.fondo-historia,
.fondo-diferentes
{
padding:   0% 0% 5% 0%;
}
.fondo-jdsuite{
  background-position: left;
}
.texto-jdsuite,  
.texto-historia,
.texto-diferentes{
    font-size: 18px;
    font-weight: 600;
}
.espacio-pc{
  display: none;
}
.button-asesor{
  margin-top: -4%;
    font-size: small;
    border-radius: 10px;
    width: 60%;
      /* -ms-transform: translate(-50%, -50%);
      transform: translate(0%, 0%); */
}

.estilo-textos{
      background: rgba(255, 255, 255, 0.7);
}
.titulo-historia,
.titulo-diferentes{
    font-size: 25px;
    font-weight: 500;
}
/*###FIN HEADER MÓVIL###*/


/*###CONSENTIDOS MÓVIL###*/

.testimonial .description{
    font-size: 18px;
    font-style:normal;
    /*** Color letra ***/
    color: #28badb;
    line-height: 23px;
    margin: 0;
}

/*###FIN CONSENTIDOS MÓVIL###*/


/*###HISTORIA MÓVIL###*/

/*###FIN HISTORIA MÓVIL###*/


/*###INTEGRANTES MÓVIL###*/
.texto-card{
    height: 67px;
    color: white;
    font-size:large;
    font-weight: 500;
    margin-bottom: 11%;
  }
.margen-texto-card{
    margin-top: -53%;
}

.carousel-familia .carousel-inner .carousel-item > div {
    display: none;
}
.carousel-familia .carousel-inner .carousel-item > div:first-child {
    display: block;
}
/*ESTRUCTURAR ITEMS (SIN EL SE DESACOMODAN)*/
.carousel-familia .carousel-inner .carousel-item.active,
.carousel-familia .carousel-inner .carousel-item-next,
.carousel-familia .carousel-inner .carousel-item-prev {
    display: flex;
}

/* .carta-familia-1,.carta-familia-2, .carta-familia-3, .carta-familia-4{min-height:520px} */
.carrusel-familia-todo{max-width:74%;
    /* overflow:visible */
}
/*###FIN INTEGRANTES MÓVIL###*/


/*###DIFERENTES MÓVIL###*/

/*###FIN DIFERENTES MÓVIL###*/


/*###NUESTRO MÓVIL###*/

/*###FIN NUESTRO MÓVIL###*/


/*###ÉXITO MÓVIL###*/
            /*##ESTILOS DE COLORES PARA CAROUSEL CASOS*/


      /*FONDO CASOS DE ÉXITO*/
      .casos-exito {
        background-size: 100vw 80vw;
      }

      /*ALINEACIÓN DE HEXÁGONO*/
      .hexagon {
        width: 35vw;
        height: 17.5vw;
        margin-left: 30%;
      }

      /*ESTILO PARA AUTOR DE TESTIMONIO*/
      .autor-testimonio{
        margin-top: 1vw;
        background-color: #4c7eb6;
        border-radius: 10vw;
        width: 60%;
        margin-left: 20%;
        color: white;
        font-size: 3.5vw;
        font-weight: 600;
      }

      /*ESTILO PARA TESTIMONIO */
      .testimonio {
        margin-top: 2vw;
        width: 80%;
        margin-left: 10%;
        border-radius: 15px;
        padding-top: .9vw;
        padding-bottom: .9vw;
        background-color: rgba(255, 255, 255, .6);
        font-size: 3vw;
        font-weight: 600;
        color: #28badb;
      }

      /*EFECTOS Y SOMBRAS DE IMAGEN*/
      .carousel-casos .carousel-item img {
        margin-top: 30px;
        box-shadow: 0px 0px 20px 13px rgba(0, 0, 0, 0.75);
      }


      /*FORMATO DE FLECHAS*/
      .flecha-ant.carousel-control-prev-icon,
      .flecha-sig.carousel-control-next-icon {
        display: none;
      }

      /*FIN FORMATO DE FLECHAS*/

      /*##FIN ESTILOS DE COLORES PARA CAROUSEL CASOS*/

      /*CAROUSEL CASOS*/

      /*TAMAÑO DEL INNER*/
      .carousel-casos .carousel-inner {
        height: 60vw;
      }

      .carousel-casos .carousel-inner .carousel-item>div {
        display: none;
      }

      .carousel-casos .carousel-inner .carousel-item>div:first-child {
        display: block;
      }

      /*ESTRUCTURAR ITEMS (SIN EL SE DESACOMODAN)*/
      .carousel-casos .carousel-inner .carousel-item.active,
      .carousel-casos .carousel-inner .carousel-item-next,
      .carousel-casos .carousel-inner .carousel-item-prev {
        display: flex;
      }

      /*FIN CAROUSEL CASOS*/
/*###FIN ÉXITO MÓVIL###*/


/*###FOOTER MÓVIL###*/

/*###FIN FOOTER MÓVIL###*/

}
/*####FIN ESTILOS PARA PANTALLAS MÓVILES*/

/*####ESTILOS PARA PANTALLAS MEDIANAS*/
@media screen and (min-width:768px) and (max-width:991.98px)
{
/*###NAVBAR (IPADS-TABLETS)*/

/*###FIN NAVBAR (IPADS-TABLETS)*/


/*###HEADER (IPADS-TABLETS)###*/
.fondo-jdsuite,
.fondo-historia,
.fondo-diferentes
{
padding:   0% 0% 5% 0%;

}
/*###FIN HEADER (IPADS-TABLETS)###*/


/*###CONSENTIDOS (IPADS-TABLETS)###*/

.testimonial .description{
    font-size: 20px;
    font-style:normal;
    /*** Color letra ***/
    color: #28badb;
    line-height: 29px;
    margin: 0;
}

/*###FIN CONSENTIDOS (IPADS-TABLETS)###*/


/*###HISTORIA (IPADS-TABLETS)###*/

/*###FIN HISTORIA (IPADS-TABLETS)###*/


/*###INTEGRANTES (IPADS-TABLETS)###*/
.texto-card{
    height: 67px;
    color: white;
    font-size:large;
    font-weight: 500;
    margin-bottom: 12%;
  }
.margen-texto-card{
    margin-top: -53%;
}

    .carousel-familia .carousel-inner .carousel-item-right.active,
    .carousel-familia .carousel-inner .carousel-item-next {
        transform: translateX(50%);
    }

    .carousel-familia .carousel-inner .carousel-item-left.active,
    .carousel-familia .carousel-inner .carousel-item-prev {
        transform: translateX(-50%);
    }
    /*ESTRUCTURAR ITEMS (SIN EL SE DESACOMODAN)*/
    .carousel-familia .carousel-inner .carousel-item.active,
    .carousel-familia .carousel-inner .carousel-item-next,
    .carousel-familia .carousel-inner .carousel-item-prev {
        display: flex;
    }
    /*TRANSICIÓN ITEMS (SIN EL SE DESACOMODAN AL CAMBIAR)*/
    .carousel-familia .carousel-inner .carousel-item-right,
    .carousel-familia .carousel-inner .carousel-item-left {
        transform: translateX(0);
    }

    /* .carta-familia-1,
    .carta-familia-2,
    .carta-familia-3{margin-right:1rem!important}

    .carta-familia-4{margin-right:1.5rem!important}
    .carrusel-familia-todo{max-width:95%;overflow:hidden} */
/*###FIN INTEGRANTES (IPADS-TABLETS)###*/


/*###DIFERENTES (IPADS-TABLETS)###*/

/*###FIN DIFERENTES (IPADS-TABLETS)###*/


/*###NUESTRO (IPADS-TABLETS)###*/

/*###FIN NUESTRO (IPADS-TABLETS)###*/


/*###ÉXITO (IPADS-TABLETS)###*/

      /*##ESTILOS DE COLORES PARA CAROUSEL CASOS*/
      /*FONDO CASOS DE ÉXITO*/
      .casos-exito {
        background-size: 100vw 65vw;
      }


      /*ALINEACIÓN DE HEXÁGONO*/
      .hexagon {
        width: 30vw;
        height: 15vw;
        margin-left: 15%;
      }


      /*ESTILO PARA AUTOR DE TESTIMONIO*/
      .autor-testimonio{
        margin-top: 5vw;
        background-color: #4c7eb6;
        border-radius: 10vw;
        width: 65%;
        margin-left: 17.5%;
        color: white;
        font-size: 2.3vw;
        font-weight: 600;
      }

      /*ESTILO PARA TESTIMONIO */
      .testimonio {
        margin-top: 2vw;
        width: 70%;
        margin-left: 15%;
        border-radius: 15px;
        padding-top: .3vw;
        padding-bottom: .3vw;
        background-color: rgba(255, 255, 255, .7);
        font-size: 1.8vw;
        font-weight: 600;
        color: #28badb;
      }

      /*TAMAÑO DEL INNER*/
      .carousel-casos .carousel-inner {
        height: 50vw;
      }

      /*##FIN ESTILOS DE COLORES PARA CAROUSEL CASOS*/
      /*CAROUSEL CASOS*/
      .carousel-casos .carousel-inner .carousel-item-right.active,
      .carousel-casos .carousel-inner .carousel-item-next {
        transform: translateX(50%);
      }

      .carousel-casos .carousel-inner .carousel-item-left.active,
      .carousel-casos .carousel-inner .carousel-item-prev {
        transform: translateX(-50%);
      }

      /*ESTRUCTURAR ITEMS (SIN EL SE DESACOMODAN)*/
      .carousel-casos .carousel-inner .carousel-item.active,
      .carousel-casos .carousel-inner .carousel-item-next,
      .carousel-casos .carousel-inner .carousel-item-prev {
        display: flex;
      }

      /*TRANSICIÓN ITEMS (SIN EL SE DESACOMODAN AL CAMBIAR)*/
      .carousel-casos .carousel-inner .carousel-item-right,
      .carousel-casos .carousel-inner .carousel-item-left {
        transform: translateX(0);
      }

      /*FIN CAROUSEL CASOS*/

/*###FIN ÉXITO (IPADS-TABLETS)###*/


/*###FOOTER (IPADS-TABLETS)###*/

/*###FIN FOOTER (IPADS-TABLETS)###*/

}
/*####FIN ESTILOS PARA PANTALLAS MEDIANAS*/


/*####ESTILOS PARA PANTALLAS GRANDES*/
@media screen and (min-width:991.98px)
{
/*###NAVBAR DESKTOP*/

/*###FIN NAVBAR DESKTOP*/


/*###HEADER DESKTOP###*/
.fondo-jdsuite,
.fondo-historia,
.fondo-diferentes
{
    min-height: 600px;
}
    .frow .parte-izq {
        width: 40%; 
    }

    .frow .jdsuite-texto {
        width: 60%;
    } 
/*###FIN HEADER DESKTOP###*/


/*###CONSENTIDOS DESKTOP###*/

.testimonial .description{
    font-size: 23px;
    font-style:normal;
    /*** Color letra ***/
    color: #28badb;
    line-height: 40px;
    margin: 0;
}

/*###FIN CONSENTIDOS DESKTOP###*/


/*###HISTORIA DESKTOP###*/
    .frow .historia-texto {
        width: 50%;
    }
/*###FIN HISTORIA DESKTOP###*/


/*###INTEGRANTES DESKTOP###*/
.texto-card{
    height: 67px;
    color: white;
    font-size:large;
    font-weight: 500;
    margin-bottom: 11%; 
  }
.margen-texto-card{
    margin-top: -56%;
    line-height: 1.2;
}

    /*ESTRUCTURAR ITEMS (SIN EL SE DESACOMODAN)*/
    .carousel-familia  .carousel-inner .carousel-item.active,
    .carousel-familia .carousel-inner .carousel-item-next,
    .carousel-familia .carousel-inner .carousel-item-prev {
        display: flex;
    }
    .cara{
      height: 100%;
  }
    .cara:hover{
        box-shadow:1px 10px 15px 10px rgba(0,0,0,1);
        transform:translateY(-20px);
        transition: .2s;
    }
    .btn-mas-detalles-familia:hover{
        box-shadow:2px 2px 3px 1px rgba(0,0,0,1);
        /* cursor:pointer */
    }
    .primera-carta-familia{padding:0px;margin-left:-10px}
    .carta-familia-2,.carta-familia-3,.carta-familia-4{margin-left:0.5rem!important}
    .carta-familia-4{margin-right:0.5rem!important}

    .carrusel-familia-todo{max-width:99%;overflow:visible}
    .indicador-familia{visibility:hidden}
/*###FIN INTEGRANTES DESKTOP###*/


/*###DIFERENTES DESKTOP###*/
    .frow .parte-izq {
        width: 40%; 
    }

    .frow .diferentes-texto {
        width: 60%;
    }
/*###FIN DIFERENTES DESKTOP###*/


/*###NUESTRO DESKTOP###*/

/*###FIN NUESTRO DESKTOP###*/


/*###ÉXITO DESKTOP###*/
      /*##ESTILOS DE COLORES PARA CAROUSEL CASOS*/


      /*FONDO CASOS DE ÉXITO*/
      .casos-exito {
        background-position: bottom;
        background-size: 100vw 47vw;
        height: calc(30vw + 10px);/*TAMAÑO DE SECCION*/
      }

      /*ALINEACIÓN DE HEXÁGONO*/
      .hexagon {
        width: 25vw;
        height: 12.5vw;
        margin-left: 5%;
      }

      /*ESTILO PARA AUTOR DE TESTIMONIO*/
      .autor-testimonio{
        margin-top: 2vw;
        background-color: #4c7eb6;
        border-radius: 10vw;
        width: 20vw;
        margin-left: 19%;
        color: white;
        font-size: 1.2vw;
        font-weight: 600;
      }
      /*ESTILO PARA TESTIMONIO */
      .testimonio {
        margin-top: 2vw;
        width: 80%;
        margin-left: 10%;
        border-radius: .5vw;
        padding-top: .3vw;
        padding-bottom: .3vw;
        background-color: rgba(255, 255, 255, .7);
        text-align: justify;
        font-size: calc(1vw + 5px);
        font-weight: 600;
        color: #28badb;
      }

      /*TAMAÑO DEL INNER*/
      .carousel-casos .carousel-inner {
        /*  height:38vw;  */
        height:26vw;
      }

      /*##FIN ESTILOS DE COLORES PARA CAROUSEL CASOS*/

      /*CAROUSEL CASOS*/
      .carousel-casos .carousel-inner .carousel-item-right.active,
      .carousel-casos .carousel-inner .carousel-item-next {
        transform: translateX(33.333%);
      }

      .carousel-casos .carousel-inner .carousel-item-left.active,
      .carousel-casos .carousel-inner .carousel-item-prev {
        transform: translateX(-33.333%);
      }

      /*ESTRUCTURAR ITEMS (SIN EL SE DESACOMODAN)*/
      .carousel-casos .carousel-inner .carousel-item.active,
      .carousel-casos .carousel-inner .carousel-item-next,
      .carousel-casos .carousel-inner .carousel-item-prev {
        display: flex;
      }

      /*TRANSICIÓN ITEMS (SIN EL SE DESACOMODAN AL CAMBIAR)*/
      .carousel-casos .carousel-inner .carousel-item-right,
      .carousel-casos .carousel-inner .carousel-item-left {
        transform: translateX(0);
      }

      /*FIN CAROUSEL CASOS*/

/*###FIN ÉXITO DESKTOP###*/


/*###FOOTER DESKTOP###*/

/*###FIN FOOTER DESKTOP###*/

}
/*####FIN ESTILOS PARA PANTALLAS GRANDES*/