body {
  background: black;
}
.button {
   background-image: linear-gradient(90deg, rgba(0,242,255,1) 0%, rgba(0,242,255,1) 100%);
   padding: 15px 32px;
   text-align: center;
   text-decoration: none;
   display: inline-block;
   font-size: 16px;
   margin: 4px 2px;
   cursor: pointer;
   border-radius: 50px;
   font-family: monospace;
   font-size: 20px;
   background-color: black;
   color: black;
 }

 .button {
   transition-duration: 0.4s;
 }


.button1 {
  background-color: white;
  background-image: linear-gradient(90deg, rgba(0,242,255,1) 0%, rgba(0,242,255,1) 100%);
  color: black; 
  border: 2px solid #4CAF50;
}

.button:hover {
 color: white;
  background-image: linear-gradient(90deg, #00cfd6, #00cfd6);
font-size: 28px;
  
.container {
  display: flex;
  justify-content: center;
  align-items: center;
  align-content: center;
  flex-wrap: wrap;
  width: 80vw;
  margin: 0 auto;
  min-height: 100vh;
}

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

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

img {
  border: double 2px transparent;
  border-radius: 25px;
  background-image: linear-gradient(black, black), 
                    linear-gradient(to right, aqua, lime);
  background-origin: border-box;
  background-clip: content-box, border-box;
}

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;
}

img {
  transition-duration: 0.8s;
}

img:hover {
  border-radius: 0px;
  border-width: 0px;
}


.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; }
