* {
    padding: 0;
    margin: 0;
    /*font-family: 'IBM Plex Sans', sans-serif;*/
}
body {

    background: #f1f2f3;
}
@-webkit-keyframes rotate {
  100% {
    transform: rotate(1turn);
  }
}
@keyframes rotate {
  100% {
    transform: rotate(1turn);
  }
}
.anim-border {
    position: relative;
    z-index: 0;
    /*width: 300px;*/
    height: auto;
    border-radius: 10px;
    overflow: hidden;
    padding: 4px;
}
.anim-border::before {
    content: "";
    position: absolute;
    z-index: -2;
    left: -50%;
    top: -50%;
    width: 200%;
    height: 200%;
    background-color: #b7a7ff;
    background-repeat: no-repeat;
    background-size: 50% 50%, 50% 50%;
    background-position: 0 0, 100% 0, 100% 100%, 0 100%;
    background-image: linear-gradient(#2e00ff, #917af9);
    -webkit-animation: rotate 4s linear infinite;
    animation: rotate 4s linear infinite;
}
.anim-border::after {
  content: "";
  position: absolute;
  z-index: -1;
  left: 6px;
  top: 6px;
  width: calc(100% - 12px);
  height: calc(100% - 12px);
  background: white;
  border-radius: 5px;
} 
.anim-border img {
    width: 100%;
}

/*#box {
  display: flex;
  border-radius: 15px;
  position: relative;
  margin-bottom: 30px;
  padding: 20px;
  display: flex;
  align-items: center;
  margin-left: -20px;
  margin-right: -20px;  
  padding-left: 35px;
  padding-right: 35px;
  flex-wrap: wrap;
}*/
.gradient-border {
  --borderWidth: 3px;
  /*background: rgba(233, 236, 239);*/
  background: #fff;
  position: relative;
}
.gradient-border:before {
  content: '';
  position: absolute;
  top: calc(-1 * var(--borderWidth));
  left: calc(-1 * var(--borderWidth));
  height: calc(100% + var(--borderWidth) * 2);
  width: calc(100% + var(--borderWidth) * 2);
  background: linear-gradient(45deg, #ff0000, #ff7300, #fffb00, #48ff00, #00ffd5, #002bff, #7a00ff, #ff00c8, #ff0000);
  border-radius: 10px;
  z-index: -1;
  animation: animatedgradient 9s ease alternate infinite;
  background-size: 300% 300%;
  box-shadow: #fff 0 0 12px 5px !important;
}
.gradient-border::after {
  content: "";
  position: absolute;
  z-index: -1;
  left: 1px;
  top: 1px;
  width: calc(100% - 2px);
  height: calc(100% - 2px);
  background: white;
  border-radius: 10px;
}
@keyframes animatedgradient {
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}