.grid-post3 {
    display: grid;
    grid-template-areas: 'grid_item_one grid_item_two grid_item_three' 'grid_item_four grid_item_five grid_item_five';
    grid-gap: 20px;
}

.grid-post3 .item {
    width: 100%;
    position: relative;
    background-size: cover;
    transition-duration: .3s;
    overflow: hidden;
    min-height: 250px;
    border-radius: 10px 10px 10px 10px;
    box-shadow: 0 2px 15px 0 rgba(0, 0, 0, 0.5);
}

.grid-post3 .item .post-item-details {
    width: 100%;
}

.grid-post3 .item a {
    position: absolute;
    right: 0;
    left: 0;
    top: 0;
    bottom: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-end;
    text-align: right;
    padding: 20px 20px 20px 20px;
}

.grid-post3 .item a .post-meta {
    margin: 3px 0 0;
}

.grid-post3 .item a span {
    display: inline-block;
}

.grid-post3 .item a .post-meta span:not(:first-of-type) {
    margin: 0 10px;
}

.grid-post3 .item:nth-of-type(1) {
    grid-area: grid_item_one;
}

.grid-post3 .item:nth-of-type(2) {
    grid-area: grid_item_two;
}

.grid-post3 .item:nth-of-type(3) {
    grid-area: grid_item_three;
}

.grid-post3 .item:nth-of-type(4) {
    grid-area: grid_item_four;
}

.grid-post3 .item:nth-of-type(5) {
    grid-area: grid_item_five;
}

.grid-post3 .item:nth-of-type(1) a {
    background-image: linear-gradient(360deg, rgba(183, 28, 28, 0.77) -20%, rgba(12, 211, 31, 0) 70%);
}

.grid-post3 .item:nth-of-type(2) a {
    background-image: linear-gradient(360deg, rgba(104, 159, 56, 0.5) -20%, rgba(12, 211, 31, 0) 70%);
}

.grid-post3 .item:nth-of-type(3) a {
    background-image: linear-gradient(360deg, rgba(81, 45, 168, 0.77) -20%, rgba(12, 211, 31, 0) 70%);
}

.grid-post3 .item:nth-of-type(4) a {
    background-image: linear-gradient(360deg, rgba(230, 81, 0, 0.77) -20%, rgba(12, 211, 31, 0) 70%);
}

.grid-post3 .item:nth-of-type(5) a {
    background-image: linear-gradient(360deg, rgba(13, 71, 161, 0.77) -20%, rgba(12, 211, 31, 0) 70%);
}

.grid-post3 .item h3{
    color: #fff;
    font-size: 18px;
}

.grid-post3 .item h3,
.grid-post3 .item .post-meta {
    width: 100%;
}

.grid-post3 .none-cover-overlay.item a {
    background-image: none;
}

.grid-post3 .item a .post-meta span {
    color: #fff;
    font-size: 13px;
    font-weight: 300;
}

@media screen and (max-width: 767px) {
    .elementor .grid-post3 {
        display: grid;
        grid-template-columns: repeat(2,minmax(0,1fr));
        grid-template-areas: none;
        gap: 10px;
    }

    .elementor .grid-post3 .item {
        grid-area: auto;
        width: 100%;
        margin-bottom: 20px;
    }
}

@media screen and (max-width: 575.98px) {
    .elementor .grid-post3 {
        grid-template-columns: repeat(1,minmax(0,1fr));
    }
}