body {
    margin: 0;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

code {
    font-family: source-code-pro, Menlo, Monaco, Consolas, "Courier New", monospace
}

.App {
    text-align: center
}

.App-logo {
    height: 40vmin;
    pointer-events: none
}

@media (prefers-reduced-motion:no-preference) {
    .App-logo {
        -webkit-animation: App-logo-spin 20s linear infinite;
        animation: App-logo-spin 20s linear infinite
    }
}

.App-header {
    background-color: #282c34;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    font-size: calc(10px + 2vmin);
    color: #fff
}

.App-link {
    color: #61dafb
}

@-webkit-keyframes App-logo-spin {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }

    to {
        -webkit-transform: rotate(1turn);
        transform: rotate(1turn)
    }
}

@keyframes App-logo-spin {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }

    to {
        -webkit-transform: rotate(1turn);
        transform: rotate(1turn)
    }
}

.carousel {
    height: 45vw
}

.carousel-indicators {
    justify-content: flex-start !important;
    margin-left: 10% !important
}

.carousel-indicators button {
    width: .3vw !important;
    height: .3vw !important;
    border-radius: 100%;
    background-color: transparent !important;
    border: .2vw solid #a1aeb7 !important;
    margin-right: 1% !important;
    position: relative
}

.carousel-indicators .active {
    background-color: #5da9a6 !important;
    border: .15vw solid #5da9a6 !important;
    margin: .05vw
}

.slides {
    height: 45vw
}

.slide1 {
    background: url(../media/slide1.f5748d4e.png) no-repeat right 80%/70%
}

.slide2 {
    background: url(../media/slide2.62107392.png) no-repeat 90% top/65%;
    height: 55vw
}

.slide3 {
    background: url(../media/slide3.97dab6fb.png) no-repeat 100% 100%/60%
}

button {
    background-color: #5da9a6;
    color: #fff;
    border: none;
    border-radius: 4px;
    width: 8vw;
    height: 2.4vw;
    font-size: .7vw;
    font-family: ubuntu;
    margin-left: -.5%;
    position: absolute;
    z-index: 5
}

.slideText {
    width: 60%;
    padding: 4% 0 0 10%
}

.slideText h1 {
    font-size: 2vw;
    font-family: Ubuntu;
    color: #505d68;
    width: 70%;
    margin-top: 5%
}

.slideText p {
    font-size: 1vw;
    color: #a1aeb7;
    width: 58%
}

.slide2 h1 {
    font-size: 4vw;
    width: 100%
}

.slide1 p {
    margin: 2% 0 6%
}

.slide2 p {
    margin: 6% 0 2%
}

.slide3 p {
    margin: 6% 0
}

.rightAnc a {
    position: absolute;
    right: 8vw;
    bottom: 14vw;
    z-index: 5
}

.slide2 img {
    width: 10vw;
    height: 2.7vw
}

.slide2 a:nth-child(2n) {
    bottom: 19vw
}

.arrows {
    background-color: transparent;
    padding-bottom: 60%;
    width: 3vw
}

.contacto {
    color: #fff;
    background-color: #4368a9;
    align-items: center;
    display: flex;
    flex-flow: column;
    font-size: 1vw
}

.contacto h1 {
    margin: 8vw 0 6vw;
    font-size: 4vw
}

form {
    display: grid
}

.formulario {
    display: flex;
    width: 50vw;
    padding-bottom: 5vw
}

input,
textarea {
    margin-bottom: 1vw;
    border-radius: 4px
}

.submit {
    background-color: #8da5d2;
    color: #fff;
    border: transparent;
    height: 2vw
}

input {
    width: 20vw;
    height: 2.5vw
}

textarea {
    height: 5vw
}

::-webkit-input-placeholder {
    color: #c2d1d9
}

:-ms-input-placeholder {
    color: #c2d1d9
}

::placeholder {
    color: #c2d1d9
}

.formulario span {
    padding-right: 6vw;
    color: #c2d1d9
}

p img {
    margin-right: 1vw;
    width: 1.5vw
}

.formulario p {
    margin: 1vw 0 0
}

.redes img {
    padding-right: 2vw;
    margin: 1vw -.4vw;
    width: 4vw
}

.nosotras {
    padding-top: 15vw;
    background-color: #fff
}

.nosotras span {
    display: flex;
    justify-content: center
}

.nosotras h1 {
    color: #126ca7;
    font-size: 3vw;
    margin-bottom: 1vw
}

.nosotras h1,
.nosotras p {
    text-align: center
}

.acerca p {
    width: 35vw;
    color: #000;
    margin: 0;
    font-size: 1vw
}

.acerca {
    display: grid;
    justify-items: center
}

.acerca a {
    color: #000;
    text-decoration: none;
    font-size: 1vw
}

#nosotras {
    position: relative;
    bottom: 5vw
}

.nosotrasBlockContainer {
    display: flex;
    justify-content: space-between;
    padding: 0 18vw
}

.nosotrasBlock {
    width: 20vw;
    color: #000;
    margin: 0;
    font-size: 1vw
}

.nosotrasBlock h2 {
    font-size: 1.8vw;
    position: relative
}

.nosotrasBlock p {
    text-align: start;
    font-size: 1vw;
    color: #a1aeb7
}

.nosotrasBlock h1 {
    position: relative;
    font-size: 16vw;
    color: #5c96c6;
    right: 5.5vw;
    top: 6vw;
    opacity: .3
}

.profesional {
    background-color: #3f5784;
    width: 20vw;
    box-shadow: 0 0 10px rgba(112, 111, 111, .5);
    border-radius: 2px;
    margin: 5vw 3vw;
    display: grid;
    justify-items: center
}

.profesional .foto {
    width: 8vw;
    margin: 3vw 0 1vw
}

.profesional img {
    width: 2vw
}

.profesional b,
.profesional h6,
.profesional p {
    color: #fff;
    text-align: center;
    padding: 0 3vw
}

.profesional span {
    justify-content: center;
    display: flex;
    padding: 2vw
}

.profesional p {
    font-size: .8vw
}

h6 {
    width: 60%;
    border-bottom: .1vw solid #0a3697;
    padding: 0 0 .5vw !important
}

.profesional b,
h6 {
    font-size: 1vw
}

.profesional a {
    padding: .5vw;
    font-size: 1vw
}

.container {
    display: inline;
    position: relative;
    top: 10vw
}

.row img {
    width: 50%;
    height: -webkit-min-content;
    height: min-content;
    padding: 0
}

.row {
    margin: 0
}

.col {
    padding: 5vw 12vw 0 10vw;
    margin-top: 5vw
}

.container h1 {
    font-size: 4vw;
    font-family: Ubuntu;
    color: #5da9a6
}

.container p {
    font-size: 1vw;
    margin-top: 5%
}

.solucion {
    display: flex;
    flex-flow: column;
    width: 40%;
    text-align: center;
    margin-top: 10vw
}

.solucion h1 {
    font-size: 3vw
}

.blockchain .row {
    background-color: #fff;
    padding-top: 20vw
}

.blockchain h1 {
    font-size: 3.1vw;
    font-family: Ubuntu;
    color: #5da9a6;
    width: 150%;
    bottom: 4vw;
    position: relative
}

.blockchain p {
    color: #a1aeb7
}

.blockchain img {
    padding-right: 15%
}

#tecnologia {
    position: relative;
    bottom: 6vw
}

.pointersContainer {
    justify-content: center;
    display: flex
}

.pointersContainer .row {
    justify-content: space-around;
    width: 100%
}

.pointers {
    display: flex;
    background-color: #fff;
    width: 18vw;
    padding: 0;
    flex: none;
    flex-flow: column;
    box-shadow: 0 0 4px hsla(0, 0%, 62.4%, .6);
    align-items: center;
    margin-bottom: 10vw
}

.pointers p {
    text-align: center;
    padding: 3vw
}

.pointers img {
    width: 6vw;
    margin-top: 3vw
}

header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    text-decoration: none;
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    box-shadow: 0 5px 10px rgba(0, 0, 0, .12);
    z-index: 10;
    background-color: #fff
}

header img {
    cursor: pointer
}

.top {
    height: 9vw
}

.small,
.top {
    transition-duration: 1s;
    -webkit-transform: scaleY(1);
    transform: scaleY(1)
}

.small {
    height: 5vw
}

.top img {
    -webkit-transform: scale(1);
    transform: scale(1);
    margin-left: 4vw;
    height: 7vw
}

.small img,
.top img {
    transition-duration: 1s
}

.small img {
    -webkit-transform: scale(.7);
    transform: scale(.7);
    margin-left: 2.3vw;
    height: 5vw
}

.links {
    display: flex;
    width: 40%;
    justify-content: space-evenly
}

.NavLink {
    font-family: Ubuntu;
    text-decoration: none;
    color: #505d68;
    font-size: .8vw;
    cursor: pointer
}

.blockNavBar {
    height: 5vw
}

.blockNavBar img {
    margin-left: 4vw;
    height: 3vw
}

#iconBackground {
    background: url(../media/loading.ab7530c7.png) no-repeat top/50vw auto;
    height: 25vw
}

#iconBackground,
#opacity {
    position: absolute;
    width: 100vw
}

#opacity {
    height: 100%;
    background-color: rgba(240, 248, 255, .5);
    z-index: 999;
    bottom: 0;
    -webkit-animation: loadingAnimation 10s linear infinite;
    animation: loadingAnimation 10s linear infinite
}

@-webkit-keyframes loadingAnimation {
    0% {
        bottom: 10%
    }

    25% {
        bottom: 30%
    }

    70% {
        bottom: 50%
    }

    90% {
        bottom: 60%
    }
}

@keyframes loadingAnimation {
    0% {
        bottom: 10%
    }

    25% {
        bottom: 30%
    }

    70% {
        bottom: 50%
    }

    90% {
        bottom: 60%
    }
}

.upButton {
    width: 3vw;
    height: 3vw;
    border-radius: 100%;
    position: fixed;
    bottom: 5vw;
    right: 5vw;
    z-index: 5;
    background-color: #334f82;
    padding: 0 0 .4vw
}

.upButton img {
    height: 1vw;
    width: 1.7vw
}

.productos {
    padding-bottom: 10vw
}

.productosImg {
    border-radius: .5vw;
    height: 19vw;
    width: 11.7vw;
    margin: 2vw;
    color: #fff;
    font-size: 2.1vw;
    text-align: center;
    align-items: center;
    font-weight: 900
}

.productos>div,
.productosImg {
    display: flex;
    justify-content: center
}

.productos>div {
    margin-top: 5vw
}

.productos>span {
    text-align: center;
    width: 20vw
}

.productos p {
    padding: 0 30vw;
    font-size: 1vw;
    color: #a1aeb7;
    margin-bottom: 0
}

.productos h1 {
    color: #505d68;
    font-size: 3vw;
    padding-top: 10vw
}

.productosOpacity {
    height: 19vw;
    width: 11.7vw;
    position: absolute;
    opacity: .5;
    z-index: 2;
    border-radius: .5vw
}

.productosLinks {
    color: #fff;
    position: absolute;
    z-index: 3;
    padding: 0;
    text-decoration: none
}

#wine {
    background: url(../media/wine.6ea956a8.png) round
}

#wine .productosLinks {
    font-size: 2vw
}

#wine .productosOpacity {
    background: #e7b84c
}

#water {
    background: url(../media/water.bfabca9c.png)
}

#vacations {
    background: url(../media/vacations.dd330b6a.png) round
}

#vacations .productosOpacity {
    background: #5da9a6
}

#vacations .productosLinks {
    font-size: 1.5vw
}

#vet {
    background: url("../media/vet.7b0143ba.png")
}

#vet .productosLinks {
    color: #4d7de8
}

#vet .productosLinks:hover {
    color: #fff
}

.index {
    width: 100%;
    height: 200vh;
    margin-top: 9vw
}

.index,
html {
    background-color: #f0f8ff
}

.tecnologia {
    display: flex;
    background: #fff;
    padding: 10vw;
    margin-top: -5vw
}

.nodo {
    width: 35vw;
    height: 50vw
}

.blockInfo {
    width: 50vw
}

.check {
    position: relative
}

.shape {
    height: .8vw;
    right: 1.25vw;
    top: .4vw
}

.mask {
    width: 1.5vw;
    height: 1.5vw
}

.blockPointers {
    margin-top: 10vw
}

.blockPointers>div {
    display: flex;
    margin-bottom: 2vw
}

.blockPointers p {
    font-size: 1vw
}

.blockInfo button {
    color: #8da5d2;
    background: #fff;
    border: thin solid #8da5d2;
    font-size: .8vw;
    margin: .1vw
}

.blockInfo p {
    font-size: 1vw;
    color: #a1aeb7;
    width: 35vw
}

.blockInfo h1 {
    font-size: 3.5vw;
    color: #126ca7;
    margin-bottom: 2vw
}

.gracias {
    font-size: 5vw;
    justify-content: center;
    display: flex;
    margin-top: 20vw;
    background-color: #f0f8ff
}

.tecnologiaContainer {
    padding-top: 10vw
}

.solucionesContainer {
    display: flex
}

.solucionesContainer h1 {
    color: #126ca7;
    font-size: 3vw
}

.solucionesRowContainer {
    display: flex;
    grid-gap: 2vw;
    gap: 2vw
}

.solucionesSubContainer {
    justify-content: center;
    display: grid;
    grid-gap: 2vw;
    gap: 2vw;
    margin-top: 7vw
}

.solucionesSubContainer>h2 {
    text-align: center;
    color: #126ca7;
    font-size: 2vw
}

.hexagons {
    width: 40vw;
    height: 100vw
}

.solucionesInfo {
    width: 50vw;
    margin-top: 7vw
}

.solucionesInfo p {
    margin: 0;
    font-size: 1.2vw;
    text-align: justify
}

.soluciones {
    width: 20vw;
    height: 40vw;
    background-color: #8da5d2;
    color: #fff;
    display: grid
}

.soluciones img {
    width: 20vw;
    height: 20vw
}

.soluciones h2,
.soluciones p {
    margin: 0 1vw
}

.soluciones h2 {
    font-size: 1.6vw
}

.soluciones p {
    font-size: 1vw
}

.arquitecturaContainer {
    background-color: #96b5dd;
    padding: 0 0 10vw 10vw;
    margin-top: -10vw
}

.arquitecturaContainer img {
    background-color: #fff;
    padding: 5vw;
    width: 50vw
}

.arquitecturaPointersContainer {
    display: grid;
    grid-gap: 2vw;
    gap: 2vw
}

.arquitecturaContainer h1 {
    font-size: 3vw;
    color: #fff;
    width: 30vw;
    padding-top: 20vw
}

.arquitecturaContainer p {
    color: #fff;
    width: 30vw;
    padding: 2vw 0;
    font-size: 1vw
}

.arquitecturaPointers {
    background-color: #fff;
    width: 37vw;
    color: #505d68;
    padding: 1.5vw;
    border-left: .8vw solid #334f82;
    border-radius: .2vw 0 0 .2vw;
    height: 10vw;
    font-size: 1vw
}

.arquitecturaPointers li {
    color: #415986
}

.arquitecturaPointers li:first-of-type {
    margin-top: 1vw
}

.footer {
    background-color: #334f82;
    height: 15vw;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-flow: column;
    color: #fff;
    font-size: 1vw
}

.footer img {
    width: 5vw;
    height: 3vw
}

*,
:after,
:before {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    scroll-behavior: smooth;
    font-family: "Ubuntu", sans-serif
}

.grupoFamiliar {
    display: flex;
    justify-content: center;
    align-items: flex-start
}

.pasaporte1 {
    max-width: 85%;
    margin: 0 0 20px;
    padding-top: 200px
}

.pasaporte1 h1 {
    color: #5da9a6;
    font-size: 66px;
    font-weight: 400;
    margin-bottom: 40px;
    margin-left: 130px
}

.pasaporte1 p {
    font-weight: 400;
    color: #271a11;
    margin-top: 20px;
    margin-left: 10%
}

.caracteristicas {
    margin-top: 100px;
    margin-left: 170px;
    width: 45%
}

.caracteristicasPasaporte {
    margin-top: 30px
}

.textoCaracteristicas {
    width: 70%
}

.textoCaracteristicas p {
    line-height: 1.6
}

.img-tilde {
    margin-bottom: 10px
}

.imagen-grafico {
    width: 45%
}

.imagen-grafico img {
    margin-top: 30px;
    object-fit: cover
}

@media (max-width:940px) {
    .grupoFamiliar {
        display: flex;
        justify-content: center;
        align-items: center;
        flex-wrap: wrap
    }

    .textoCaracteristicas {
        width: 80%
    }

    .textoCaracteristicas p {
        line-height: 1.6
    }
}

@media (max-width:940px) {
    .caracteristicas {
        margin-top: 40px;
        margin-left: 20px;
        margin-right: 20px
    }

    .pasaporte1 {
        max-width: 100%
    }

    .pasaporte1 h1 {
        color: #5da9a6;
        font-size: 40px;
        font-weight: 400;
        margin: 0 20px 40px
    }

    .pasaporte1 p {
        margin: 0 20px
    }
}

.cardsContainer {
    width: 100%;
    margin: 30px 0;
    display: flex;
    justify-content: center;
    flex-wrap: wrap
}

.card-1 {
    width: 40%;
    box-shadow: 0 0 10px 0 rgba(0, 0, 0, .26);
    -webkit-box-shadow: 0 0 10px 0 rgba(0, 0, 0, .26);
    -moz-box-shadow: 0 0 10px 0 rgba(0, 0, 0, .26);
    margin: 0 0 0 2rem
}

.card-1 .cardLarge {
    display: flex
}

.card-1 img {
    width: 150px;
    height: 150px;
    margin: 2rem 1rem
}

.card-1 p {
    color: #271a11
}

.cards-2 {
    width: 40%;
    margin: 0 2rem 0 0
}

.mb-2 {
    margin: 0 0 2rem
}

.mb-4 {
    margin: 0 0 4rem
}

.cards-2 .cardtype1 {
    display: flex;
    box-shadow: 0 0 10px 0 rgba(0, 0, 0, .26);
    -webkit-box-shadow: 0 0 10px 0 rgba(0, 0, 0, .26);
    -moz-box-shadow: 0 0 10px 0 rgba(0, 0, 0, .26);
    height: 480px
}

.cards-2 .cardtype1 img {
    width: 150px;
    height: 150px;
    margin: 2rem 1rem
}

.cards-2 .cardtype1 p {
    color: #271a11
}

.parrafosFlex {
    display: flex;
    flex-direction: column;
    margin: 2rem 1rem
}

.medium-card {
    width: 100%;
    display: flex;
    justify-content: center
}

.medium-card .card-single {
    width: 84.2%;
    display: flex;
    justify-content: center;
    height: 50%;
    box-shadow: 0 0 10px 0 rgba(0, 0, 0, .26);
    -webkit-box-shadow: 0 0 10px 0 rgba(0, 0, 0, .26);
    -moz-box-shadow: 0 0 10px 0 rgba(0, 0, 0, .26)
}

.medium-card .card-single img {
    width: 150px;
    height: 150px;
    margin: 2rem 1rem
}

.medium-card .card-single p {
    color: #271a11;
    margin: 2rem 1rem
}

@media (max-width:1220px) {

    .card-1,
    .card-single,
    .cards-2 {
        min-width: 96%;
        margin: 1rem
    }
}

@media (max-width:510px) {

    .card-1 .cardLarge,
    .cards-2 .cardtype1 {
        justify-content: center;
        align-items: center;
        flex-direction: column;
        height: auto
    }
}

.saludInfantilh1 {
    text-align: center;
    padding-top: 200px;
    font-size: 66px;
    color: #5da9a6
}

.saludInfantil {
    display: flex;
    justify-content: center
}

.parrafoInfo {
    color: #271a11;
    font-size: 19px;
    margin: 60px 60px 100px 100px
}

.parrafo2 {
    margin-top: 30px;
    font-weight: 600;
    color: #271a11
}

.imagenSalud {
    margin: 60px 100px
}

@media (max-width:1300px) {
    .saludInfantil {
        flex-wrap: wrap
    }

    .imagenSalud {
        margin: 0
    }

    .parrafoInfo {
        margin: 30px
    }
}

/*# sourceMappingURL=main.9fd259f3.chunk.css.map */