.chart-wrapper {
position: relative;
width: 1110px;
height: 850px;
margin-top: 4rem;
}

.titulouniverso{
font-size: 63px;
margin-bottom: 35px;
font-family: neue-haas-grotesk-display, sans-serif;
font-weight: 400;
font-style: normal;
max-width: 600px;
z-index: 10;
position: absolute;
margin-left: -112px;
top: 66px;
font-family: neue-haas-grotesk-text, sans-serif;
}

.bubble {
border-radius: 50%;
position: absolute;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
text-align: center;
padding: 0.8rem;
transition: transform 0.3s ease;
box-shadow: 0 5px 20px -5px rgb(0 0 0 / 0%);
z-index: 10;
}

.bubble .textos{
display: flex;
flex-direction: column;
justify-content: center;
align-items: start;
text-align: left;
}

.bubble:hover {
transform: scale(1.03);
box-shadow: 0 10px 30px rgba(0,0,0,0.2);
}

.b-num {
font-weight: 300;
line-height: 1;
margin-bottom: 5px;
display: block;
}

.b-desc {
font-size: 0.8rem;
line-height: 1.2;
font-weight: 400;
max-width: 90%;
white-space: nowrap;
}

.bubble-huge {
width: 680px;
height: 680px;
background-color: #EE6B58;
top: 0;
left: 47px;
align-items: flex-start;
padding-left: 90px;
padding-top: 120px;
text-align: left;
z-index: 1;
}

.bubble-huge .b-num { 
font-size: 3rem; 
margin-bottom: 8px;
}

.bubble-huge .b-desc { 
font-size: 0.8rem;
max-width: 300px; 
}

.bubble-large {
width: 320px;
height: 320px;
background-color: #EEDC9A;
top: 300px;
left: 713px;
z-index: 5;
align-items: baseline;
padding-left: 4rem;
}

.bubble-large .b-num { 
font-size: 2.5rem;
}

.bubble-large .b-desc { 
font-size: 1rem;
}

.bubble-medium-light {
width: 100px;
height: 100px;
background-color: whitesmoke;
bottom: 262px;
left: 0;
z-index: 8;
}

.bubble-medium-light .b-num { 
font-size: 2.2rem;
margin-top: -8px;
}

.bubble-medium-light .b-desc { 
font-size: 0.59rem; 
max-width: 200px; 
}

.bubble-medium {
width: 240px;
height: 240px;
background-color: #e5f2ee;
top: 560px;
left: 579px;
z-index: 7;
}

.bubble-medium .b-num { 
font-size: 2.5rem;
}

.bubble-medium .b-desc {
font-size: 0.8rem;
}

.bubble-small-blue {
width: 150px;
height: 150px;
background-color: #87cedc;
top: 572px;
left: 33px;
z-index: 9;
}

.bubble-small-blue .b-num { 
font-size: 2.2rem; 
}

.bubble-small-purple {
width: 100px;
height: 100px;
background-color: #9988bf;
top: 644px;
left: 174px;
z-index: 11;
}

.bubble-small-purple .textos {
padding-left: 47px;
margin-top: -5px;
}

.bubble-small-purple .b-num {
font-size: 2rem;
}

.bubble-mini-brown {
width: 75px;
height: 75px;
background-color: #926941;
/* color: white; */
top: 712px;
left: 119px;
z-index: 12;
}

.bubble-mini-brown .textos{
padding-left: 85px;
padding-top: 28px;
}

.bubble-mini-brown .b-num {
font-size: 1.8rem;
}

.bubble-mini-brown .b-desc {
font-size: 0.6rem;
}

.bubble-small-teal {
width: 160px;
height: 160px;
background-color: #008671;
/* color: white; */
top: 618px;
left: 818px;
z-index: 13;
}

.bubble-small-teal .b-num {
font-size: 2.2rem;
}

.bubble-small-red {
width: 130px;
height: 130px;
background-color: #b40542;
/* color: white; */
bottom: 156px;
right: 19px;
z-index: 14;
padding-left: 83px;
}

.bubble-small-red .b-num {
font-size: 2rem; 
}

.bubble-mini-grey1 {
width: 60px;
height: 60px;
background-color: #94969d;
top: 505px;
right: 31px;
z-index: 15;
padding-left: 48px;
}

.bubble-mini-grey1 .b-num {
font-size: 1.5rem;
margin: 0; 
}

.bubble-mini-grey1 .b-desc { 
font-size: 0.5rem; 
}

.bubble-mini-grey2 {
width: 100px;
height: 100px;
background-color: #D3D3D3;
bottom: -3px;
right: 240px;
z-index: 16;
padding-left: 83px;
}

.bubble-mini-grey2 .b-num { 
font-size: 1.8rem;
margin: 0; }

.bubble-mini-grey2 .b-desc { 
font-size: 0.6rem;
margin-top: 5px;
}

.fragunimovil{
    display: none;
}

.titulomoviluni{
    display: none;
}

@media (max-width: 1400px) {

    .titulouniverso {
    font-size: 56px;
    top: 53px;
    margin-left: -52px;
    }

}

@media (max-width: 1200px) {

.chart-wrapper {
transform: scale(0.9);
transform-origin: top left;
}

}


@media (max-width: 1100px) {

    .chart-wrapper {
    transform: scale(0.83);
    transform-origin: top left;
    margin-top: 2rem;
    }

    .titulouniverso {
    font-size: 63px;
    top: 70px;
    margin-left: 5px;
    }

}


@media (max-width: 991.98px){ 

    .fragunimovil{
        display: block;
        margin-bottom: 3rem;
    }

        .titulomoviluni{
        text-align: center;
        padding: 22px;
        font-family: neue-haas-grotesk-display, sans-serif;
        font-weight: 400;
        font-size: 43px;
        margin-bottom: 2rem;
        display: block;
        }

   .chart-wrapper {
    display: none;
    }


    .carrusel_universo .esferain{
    aspect-ratio: 1 / 1;
    width: 100%;
    height: 100%;
    display: block;
    display: flex;
    align-items: center;
    justify-content: center;
    } 

    .carrusel_universo .esferain .esfera{
    height: 100%;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    border-radius: 100%;
    background-color: #e5f2ee;
    } 

    .carrusel_universo .esfera.esferared{
    background-color: #ed6c53;
    } 


    .carrusel_universo  .esfera.esferared {
    background-color: #ED6C53;
    }


    .carrusel_universo  .esfera.esferayellow {
    background-color: #E8CF89;
    width: 80%;
    height: 80%;
    }

    .carrusel_universo  .esfera.esferablueclar {
    background-color: #D9EDE9;
    width: 75%;
    height: 75%;
    }


    .carrusel_universo   .esfera.esferaverdclaro {
    background-color: #0A7D6C;
        width:70%;
    height: 70%;
    }


    .carrusel_universo  .esfera.esferablue {
    background-color: #7DC7D8;
    width:65%;
    height: 65%;
    }


      .carrusel_universo  .esfera.esferareddark {
    background-color: #B11845;
    width:62%;
    height: 62%;
    }


    .carrusel_universo  .esfera.esferapurple {
    background-color: #9A8EB5;
    height: 53%;
    width: 53%;
    }

    .carrusel_universo  .esfera.esferabrown {
    background-color: #927757;
    height: 45%;
    width: 45%;
    }

    .carrusel_universo  .esfera.grisdark {
    background-color: #7F7F82;
    height: 45%;
    width: 45%;
    }


    .carrusel_universo  .esfera.esferagris {
    background-color: #CFCFCF;
        height: 53%;
    width: 53%;
    }


    .carrusel_universo  .esfera.esferagrisclar {
    background-color: #E6E6E6;
        height: 53%;
    width: 53%;
    }




    .carrusel_universo .esfera{

    } 

    .carrusel_universo .esferain .textos {
    padding: 0px 20px;
    margin-top: -5px;
    }

    .carrusel_universo .esferain .textos .numero {
    margin-bottom: 12px;
    font-size: 34px;
    }

    .carrusel_universo .esferain .textos .frase{
    font-size: 12px;
    line-height: 17px;
    margin-bottom: 0px;
    } 

    .owl-carousel.carrusel_universo .owl-dots{
        margin-top: 2rem;
    }

    .owl-carousel.carrusel_universo button.owl-dot{
    background-color: #DFE0E4 !important;
    border-radius: 15px;
    }

    .owl-carousel.carrusel_universo button.owl-dot.active{
    background-color: #2D2926!important;
    }


}


@media (max-width: 575.98px){

    .titulomoviluni {
    padding-top: 0px;
    margin-top: -2rem;
    text-align: left;
    font-size: 29px;
    margin-bottom: 0rem;
    }

}