#top-user-groups-chat{
        border: 1px solid gray;
        border-radius: 7px;
        height: 660px;
        width: 1320px;
        margin-top: 100px;
    }
    
    #top-user-group-chat-title-container{
        border: 1px solid black;
        height: 40px;
        width: 1320px;
        margin-bottom: 10px;
        border-radius: 7px 7px 0px 0px;
    }
    #top-user-group-chat-title-text{
        border: 1px solid transparent;
        float: left;
        padding: 10px 20px;
    }

    #top-user-group-chats-display-box{
        border: 1px solid transparent;
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        height: 620px;
        grid-gap: 10px;
        width: 1300px;
    }

    .top-group-chat-card{
        border: 1px solid transparent;
        border-radius: 17px;
        height: 230px;
        position: relative;
        z-index: 1;
    }
    /* .top-group-chat-card:hover{
        border: 1px solid gray;
    } */
    .top-group-chat-card-profile-img{
        border: 1px solid transparent;
        height: 40px;
        width: 40px;
        object-fit: cover;
        border-radius: 13px;
        position: absolute;
        z-index: 3;
        left: 5px;
        top: 5px;
    }
    .profile-name-tint-cover{
        border: 1px solid black;
        border-radius: 13px;
        height: 20px;
        width: 100px;
        background-color: black;
        position: absolute;
        z-index: 3;
        padding: 3px 5px;
        opacity: .04;
        left: 60px;
        top: 11px;
    }
    .profile-name{
        border: 1px solid transparent;
        height: auto;
        background-color: transparent;
        color: white;
        text-shadow: 0 0 8px black;
        width: auto;
        padding: 3px 5px;
        position: absolute;
        z-index: 3;
        left: 60px;
        top: 11px;
    }

    .background-img{
        border: 1px solid transparent;
        border-radius: 13px;
        height: 230px;
        object-fit: cover;
        width: 100%;
        position: relative;
        z-index: 2;
    }
    /* .background-img:hover{
        border: 1px solid black;
    }  */
    .group-chat-into-box-tint-cover{
        border: 1px solid transparent;
        height: 70px;
        background-color: black;
        opacity: .4;
        display: none;
        border-radius: 0px 0px 13px 13px;
        position: absolute;
        bottom: 0px;
        z-index: 3;
        width: 99.5%;
        left: 1px;
    }
    .top-group-chat-card:hover .group-chat-into-box-tint-cover{
        display: block;
    }
    .group-chat-info-box{
        border: 1px solid transparent;
        z-index: 5;
        bottom: -60px;
        left: 0px;
        position: absolute;
        width: 100%;
    }
    .group-chat-info-text{
        text-align: left;
        color: white;
        position: absolute;
        z-index: 4;
        display: none;
        left: 0px;
        bottom: 50px;
        padding: 10px 0px 0px 10px;
    }
    .top-group-chat-card:hover .group-chat-info-text{
        display: block;
    }
    .group-chat-title{
        border: 1px solid transparent;
        height: 55px;
        width: 65%;
        /* z-index: 5; */
        float: left;
    }
    .group-chat-title-text{
        border: 1px solid transparent;
        height: auto;
        width: auto;
        z-index: 5;
        color: black;
        margin: 5px 0px 0px 10px;
        float: left;
    }

    .group-chat-settings-container{
        border: 1px solid transparent;
        height: 55px;
        width: 30%;
        float: right;
    }
    .group-chat-setting-icon-img-url{
        border: 1px solid transparent;
        border-radius: 50px;
        height: 30px;
        width: 30px;
        margin: 5px 5px 0px 0px;
        float: right;
    }