#posts-show {
  .user-icon {
    width: 50px;
    height: 50px;
    border-radius: 50%;
  }

  .modal-content {
    border-radius: 0;
  }

  .modal-body {
    border-image: linear-gradient(to right, #77a1d3, #7cc9c9, #e684ae);
    border-image-slice: 1 1 1;
    border-bottom: 3px solid;
    border-top: 3px solid;
    border-left: 3px solid;
    border-right: 3px solid;
  }

  .card {
    border-radius: 0;
  }

  .card-img-top {
    border-radius: 0;
  }

  .twinkle {
    opacity: 0.9;
    overflow: hidden;
    position: relative;
    cursor: pointer;
  }
  .twinkle::before {
    background-color: #fff;
    content: "";
    display: block;
    position: absolute;
    top: -100px;
    left: 0;
    width: 40px;
    height: 100%;
    opacity: 0;
    transition: cubic-bezier(0.30, 0, 0.70, 0);
    animation: twinkle 3s linear infinite;
    animation-delay: 1s;
  }
  /*
   .twinkle:hover::before {
     animation: twinkle 0.5s linear;
   }
  */

  @keyframes twinkle {
    0% {
      transform: scale(0) rotate(45deg);
      opacity: 0;
    }
    4% /* 20% */ {
      transform: scale(20) rotate(45deg);
      opacity: 0.6;
    }
    8% /* 40% */ {
      transform: scale(30) rotate(45deg);
      opacity: 0.4;
    }
    18% /* 90% */ {
      transform: scale(45) rotate(45deg);
      opacity: 0.2;
    }
    20% /* 100% */{
      transform: scale(50) rotate(45deg);
      opacity: 0;
    }
  }
}