:root {
    --main-brand-color: #9f9f9f; /* A nice shade of blue */
    --text-color: #333333; 
    --backgrund-color:white;
    --borders:#454545;
}

.blogs-main{
    display: flex;
    margin: 0px;
    width: 100%;
}
.img-blog{
    animation: loading linear;
    animation-timeline: view();
    border-radius: 10px;
    animation-range: entry 0% cover 40%;
}

@keyframes loading {
        from{
          opacity: 0;
          scale: 0.4;
        }
        
        to{
          opacity: 1;
          scale: 1;
        }
      }
.img-blog{
    height: 300px;
    aspect-ratio: 3/3;
    object-fit: cover;
    border-radius:10px;
    box-shadow: rgba(0, 0, 0, 0.05) 0px 6px 24px 0px, rgba(0, 0, 0, 0.08) 0px 0px 0px 1px;
    margin: 10px 20px 10px;
}
.disc{
    margin: 10px 20px 10px;
}
a{
    text-decoration: none;
    color: var(--text-color);
    font: bolder;
}
#blog-section{
    color: var(--text-color);
}
.blog-title{
    font:bolder;
    margin-top: 10px;
    font-size: 30px;
}


@media (width < 600px) {
    .blogs-main{
        display: block;
        margin: 0px;
    }
    .img-blog{
        height: 300px;
        object-fit: cover;
        width:auto;
        margin: 10px 30px 10px;
        border-radius: 10px;
    }
    .blog-content{
        margin: 10px 30px 10px;
    }
}