body {
  background: black;
}

p {
  font-family: monospace;
  font-size: 20px;
  color: #ffffff;
  border: 2px solid black;
  outline: #4CAF50 solid 10px;
}

h1 {
  font-family: monospace;
  color: #ffffff;
}

img {
  border-style: solid;
  border-width: 0px;
  border-radius: 50px;
  border-image: conic-gradient(lime, aqua, blue, magenta, yellow, lime) 1;
}

img {
  transition-duration: 0.8s;
}

img:hover {
  size: 110px;
}

a {
  color: white;
  padding: 10px 10px;
  border: 4px solid linear-gradient(90deg, rgba(0,255,48,1) 0%, rgba(0,242,255,1) 100%);
  font-family: monospace;
}

.gradient-box {
  
  display: flex;
  align-items: center;
  //width: 50vw;
  width: 90%;
  margin: auto;
  max-width: 22em;

  position: relative;
  padding: 30% 2em;
  box-sizing: border-box;

  $border: 5px;
  color: #FFF;
  background: #000;
  background-clip: padding-box; /* !importanté */
  border: solid $border transparent; /* !importanté */
  border-radius: 1em;

  &:before {
    content: '';
    position: absolute;
    top: 0; right: 0; bottom: 0; left: 0;
    z-index: -1;
    margin: -$border; /* !importanté */
    border-radius: inherit; /* !importanté */
    background: linear-gradient(to right, red, orange);
  }
}

html { height: 100%; background: #000; display: flex; }
body { margin: auto; }