.bcontainer {
    border: 8px solid transparent;
  }
  .animated {
    background-image:
      linear-gradient(white, white),
      linear-gradient(180deg, rgb(255, 217, 0), rgb(255, 255, 255) 50%, rgb(255, 217, 0));

    background-repeat: no-repeat;
    background-size: 100% 100%, 100% 200%;
    background-position: 0 0, 0 100%;
    background-origin: padding-box, border-box;
    animation: highlight 1s infinite alternate;
  }
.animated2 {
    background-image:
      linear-gradient(white, white),
      linear-gradient(180deg, rgb(0, 89, 255), rgb(255, 255, 255) 50%, rgb(0, 89, 255));

    background-repeat: no-repeat;
    background-size: 100% 100%, 100% 200%;
    background-position: 0 0, 0 100%;
    background-origin: padding-box, border-box;
    animation: highlight 1s infinite alternate;
  }
  .animatedr {
    background-image:
      linear-gradient(white, white),
      linear-gradient(180deg, rgb(233, 31, 31), rgb(255, 255, 255) 50%, rgb(233, 31, 31));

    background-repeat: no-repeat;
    background-size: 100% 100%, 100% 200%;
    background-position: 0 0, 0 100%;
    background-origin: padding-box, border-box;
    animation: highlight 1s infinite alternate;
  }
  .animated3 {
  background-repeat: no-repeat;
  background-size: 100% 100%, 100% 100%;
  background-position: 100% 100%, 100% 100%;
  background-origin: padding-box, border-box;
  animation: highlight 3s infinite alternate;
    box-shadow: 0 14px 28px rgba(0, 0, 0, 0.25), 0 10px 10px rgba(0, 0, 0, 0.22);
  }
  @keyframes highlight {
    100% {
      background-position: 0 0, 0 0;
    }
  }