.tcgelements-blog-modern{
  .post-card {
    position: relative;
    padding: 30px;
    border: 1px solid #9993;
    border-radius: 15px;
    display: block;
    overflow: hidden;
    z-index: 20;
    margin-bottom: 20px;
    &::after {
      position: absolute;
      content: "";
      left: 0;
      top: 0;
      width: 100%;
      height: 100%;
      background-color: #000;
      z-index: -1;
      transition: all 0.5s ease;
      opacity: 0;
    }
    .bg {
      position: absolute;
      left: 0;
      top: 0;
      width: 100%;
      height: 100%;
      object-fit: cover;
      z-index: -2;
      transition: all 0.5s ease;
      opacity: 0;
    }
    .butn {
      position: absolute;
      left: 92%;
      top: 50%;
      transform: translate(-50%, -50%) scale(0.5);
      width: 100px;
      height: 100px;
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      background-color: #fff3;
      color: #fff;
      font-size: 30px;
      z-index: 10;
      opacity: 0;
      transition: all 0.5s ease;
    }
    &:hover {
      &::after {
        opacity: 0.6;
      }
      .bg {
        opacity: 1;
      }
      * {
        color: #fff ;
      }
      .date,
      .excerpt {
        opacity: 0;
      }
      .butn {
        opacity: 1;
        transform: translate(-50%, -50%) scale(1);
      }
    }
  }
}