.glass-container{
        display: flex;
        justify-content: center;
        flex-wrap: wrap;
        gap: 110px;
    }
    /* *{
        margin: 0;
        padding: 0;
        box-sizing: border-box;
    } */
    .glass-hover{
        display: flex;
        justify-content: center;
        height: 50vh;
        align-items: center;
        gap: 40px;
        flex-wrap: wrap;
        /* background-color: rgb(129, 129, 129); */
    }

    /* .notes i{
        font-size: 60px;
        background: linear-gradient(to left, #ffffff, #d1d1d1);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
    } */

    .Notes-All{
        width: 150px;
        height: 150px;
        position: relative;
    }
    .notes{
        width: 150px;
        height: 150px;
        border: 3px solid rgba(147, 43, 154, 0.637);
        background-color: rgba(255, 255, 255, 0.185);
        border-radius: 35px;
        cursor: pointer;
        /* padding-left: 20px; */
        padding-top: 20px;
        transition: all .5s ease-in-out;
        position: relative;
        justify-content: center;
        text-align: center;
    }

    .notes svg{
        width: 100px;
        height: 100px;
    }

    /* .notes svg{
        width: 150px;
        height: 150px;
        padding-right: 44px;
        padding-bottom: 40px;
        text-align: center;
        justify-content: center;

    } */
    .notes p{
        /* font-family: "Ostrich Sans Rounded Medium"; */
        font-size: 16px;
        color: #e978ff;
        opacity: 0;
        position: absolute;
        transform: translateY(100px);
        transition: all .5s ease-in-out;
        margin-top: 10px;
        text-align: center;
        justify-content: center;
    }
    .notes-bg{
        position: absolute;
        content: "";
        width: 150px;
        height: 150px;
        background: linear-gradient(315deg, #922B9A 0%, #46EACF 100%);
        border-radius: 35px;
        cursor: pointer;
        bottom: 5px;
        z-index: -111;
        transform-origin: 80% 80%;
        transform: rotateZ(20deg);
        right: 5px;
        padding-left: 44px;
        padding-top: 40px;
        transition: all .5s ease-in-out;
        pointer-events: none;
    }
    .notes:hover ~ .notes-bg{
        transform: rotateZ(0) scale(.9);
    }
    .notes:hover p{
        opacity: 1;
        transform: translateY(120px);
    }
    .notes:hover{
        transform: scale(.9);
    }