* {
    margin: auto;
    padding: 0;
    box-sizing: border-box;
}
body {
    background-color:hsl(47, 88%, 63%) ;
    min-height: 100vh;
    font-family: 'Figtree', 'sans-serif';
    display: grid;
    place-content: center;

}
img {
    width: 100%;
    display: block;
}
.card {
    background-color: hsl(0, 0%, 100%);
    padding: 1.5rem;
    margin: 1rem;
    position: relative;
    border-radius: 1rem;
    outline: 2px solid#000;
    box-shadow: 8px 8px black;

}
.card::before{
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 15px;
    right: -15px;
    border-radius: 1rem;
    z-index: -1;
}
.card img {
    border-radius: 1rem;
}
.card .Learning {
    background-color: hsl(47, 88%, 63%) ;
    width: min-content;
    padding: .5rem;
    margin-top: 1.5rem;
    font-weight: 800;
    border-radius: .5rem;
    margin-left: 1%;
   
}
.card .Date{
    margin-top: 1rem;
    margin-bottom: 1rem;
}
.card .h2{
    margin: 1rem;

}
.card .msg{
    color: gray;
    line-height: 1.5;
    margin-top: 1rem;
    text-decoration: none;
    font-size: 20px;
}
.card .avatar{
    margin-top: 1rem;
    display: inline-flex;
   
    gap: .5rem;
}
.card .avatar img {
    width: 30px;
}
.card .avatar .name {
    font-weight: 800;
   place-content: left;
}
@media  {max-width: 375;) {
    .card h2 a {
        font-size: 1.25rem;
    }
}
    
}