#ul_blog_container {
    padding: 5px;
}

.blog_li {
    background-color: white;
    list-style: none;
    border-radius: 5px;
    margin: 30px 10px;
    padding: 30px 10px;
    box-shadow: var(--box-shadow);
    cursor: pointer;
    transition: all 200ms;
    position: relative;
}

.blog_li:hover {
    background-color: var(--bgc-container-pattern-color);
    box-shadow: var(--box-shadow-dark);
}

.blog_li img {
    width: 100%;
    object-fit: cover;
    max-height: 300px;
    max-width: 300px;
}

.blog_li span {
    position: absolute;
    bottom: 30px;
    right: 33px;
    box-shadow: var(--box-shadow-dark);
    font-size: small;
    border-radius: 5px;
    padding: 2px 3px;
}

.blog_li h1 {
    font-size: x-large;
    font-weight: bold;
    padding: 5px;
}

.blog_li p {
    padding: 5px;
}

.blog_li a {
    width: 100%;
    height: 100%;
    position: absolute;
    opacity: 0;
}

.blog_li .blog_desc_div {
    padding: 20px 10px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

@media (max-width: 768px) {
}