*{
    margin: 0;
    padding: 0;
    user-select: none;
}
body{
    background-color: black;
    color: white;
    font-family: 'Plus Jakarta Sans';
    display: flex;
    flex-direction: column-reverse;
}
.actualBody{
    margin-top: 30px;
}

#nothing{
    font-size: 3rem;
    font-weight: 900;
    word-spacing: 0.3rem;
    margin-top: 20svh;
    text-align: center;
}
.queries{
    display:flex;
    flex-wrap: wrap;
    gap:1.5vw;
    width:90vw;
    margin: 40px auto;
}

.query{
   
}

.container{
    width:29vw;
    max-height: fit-content;
    display: flex;
    flex-direction: column;
    gap: 15px;
    background-color: whitesmoke;
    color:black;
    border-radius: 1rem;
    padding: 1rem;
    box-sizing: border-box;
    position:relative;
    transition:background-color 0.8s ease-in-out;
}
.container img{
    position:absolute;
    right:1.5vw;
    top:2vh;
    filter:invert();
    display:none;
    transition: scale 0.3s ease-in-out;
}
.container:hover{
    background-color: rgb(181, 178, 178);
}
.container img:hover{
    scale:1.1;
}
.container:hover > img{
    display: block;
    cursor: pointer;
}
.name{
    font-size: 1.5rem;
    font-weight: 700;
}

.email, .mobile{
    font-size: 1.2rem;
    font-weight: 700;
}
.message{
    font-size: 1rem;
    font-weight: 400;
}
.heading{
    width:90vw;
    height:5vh;
    margin:auto;
    display:flex;
    justify-content: space-between;
    align-items: center;
}
.heading img{
    transition:all 0.3 ease-in-out;
}
.heading img:hover{
    cursor:pointer;
    scale:1.2;
}


/* responsive */

@media screen and (max-width:450px){

    
    .actualBody{
        margin-top: 3svh;
    }
    
    
    .queries{
        display:flex;
        flex-direction: column;
        gap:2svh;
        width:90svw;
    }
    
    .query{
       
    }
    
    .container{
        width:90svw;
        max-height: fit-content;
        display: flex;
        flex-direction: column;
        gap: 15px;
        background-color: whitesmoke;
        color:black;
        border-radius: 1rem;
        padding: 1rem;
        box-sizing: border-box;
        position:relative;
        transition:background-color 0.8s ease-in-out;
    }
    .container img{
        position:absolute;
        right:1.5vw;
        top:2vh;
        filter:invert();
        display:block;
        transition: scale 0.3s ease-in-out;
    }
    .name{
        font-size: 1.5rem;
        font-weight: 700;
    }
    
    .email, .mobile{
        font-size: 1.2rem;
        font-weight: 700;
    }
    .message{
        font-size: 1rem;
        font-weight: 400;
    }
    .heading{
        width:90svw;
        height:5svh;
        margin:auto;
        display:flex;
        justify-content: space-between;
        align-items: center;
    }
    .heading img{
        transition:all 0.3 ease-in-out;
    }
    .heading img:hover{
        cursor:pointer;
        scale:1.2;
    }    
}