*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body{
    overflow-x: hidden !important;
}


.contenedor-selector{
        
    display: flex;
    justify-content: start;
    margin-bottom: 30px;
    margin-top: 6rem;
}





.selector{
    
    background-color: rgba(252, 197, 244, 0.473);
    -webkit-backdrop-filter: blur(30px);
    backdrop-filter: blur(30px);
    width: 47%;
    border-top-right-radius: 50px;
    border-bottom-right-radius: 50px; 
    padding-right: 43px; 
    padding-bottom: 10px;
    
}



.iconos{
    display: flex;
    flex-direction: row-reverse;
    overflow-x: auto;   
    overscroll-behavior-inline: contain; 
    scrollbar-width: 5px; 
     -ms-overflow-style: -ms-autohiding-scrollbar; 
}



/* Scrollbar */
.iconos::-webkit-scrollbar{
    inline-size: 5px;
    height: 8px;
    
}


.iconos::-webkit-scrollbar-track{
    border-radius: 8px;
    background-color: rgba(255, 255, 255, 0.219); 
}

.iconos::-webkit-scrollbar-thumb{
    border-radius: 5px;
    background-color: rgba(255, 255, 255, 0.55);
}

.iconos::-webkit-scrollbar-thumb:hover{
    background-color: rgba(255, 255, 255, 0.9);
}


.scroller{
    scroll-snap-type: inline mandatory;
}

.scroller > * {
    scroll-snap-align: end;
}




.iconos img{
    width: 50px;
    height: 50px;
    margin: 5px 0;
    transition: all .3s ease;
    
} 

.iconos img:hover{
    transform: scale(1.1);
}

.inner{
    display: flex;
    flex-direction: column;
    align-items:center;
    background-color: rgba(255, 255, 255, 0.158);
    border-radius: 30%;
    padding: 3px;
    margin: 5px 23px;
    cursor: pointer;
}



.inner p{
    font-size: .75rem;
    
}


@media (min-width: 320px)  and (max-width: 700px){
    
    body{
        overflow: visible;
    }

    .contenedor-selector{
        margin: 20px 0;
        margin-top: 4.5rem
    }

    .selector{
        
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
        padding-right: 0; 
        padding-bottom: 10px;
        
    }


    .inner{
    padding: 3px;
    margin: 0 21.7px;
    
    }
    .iconos img{
        max-width: 50px;
        max-height: 50px;
        
    }

   .selector{
    padding-bottom: 0;
    width: 100%;
   }


.iconos::-webkit-scrollbar{
    height: 0;
    width: 0;
}

.iconos{
    scrollbar-width: 0px; 
     -ms-overflow-style: -ms-autohiding-scrollbar; 
}

}