.wrapper { 
  height: 100%;
  width: 100%;
  left:0;
  right: 0;
  top: 0;
  bottom: 0;
  position: absolute;
  background: linear-gradient(124deg, #ff2400, #e81d1d, #e8b71d, #e3e81d, #1de840, #1ddde8, #2b1de8, #dd00f3, #dd00f3);
  background-size: 1800% 1800%;

  -webkit-animation: rainbow 18s ease infinite;
  -z-animation: rainbow 18s ease infinite;
  -o-animation: rainbow 18s ease infinite;
  animation: rainbow 18s ease infinite;}

@-webkit-keyframes rainbow {
    0%{background-position:0% 82%}
    50%{background-position:100% 19%}
    100%{background-position:0% 82%}
}
@-moz-keyframes rainbow {
    0%{background-position:0% 82%}
    50%{background-position:100% 19%}
    100%{background-position:0% 82%}
}
@-o-keyframes rainbow {
    0%{background-position:0% 82%}
    50%{background-position:100% 19%}
    100%{background-position:0% 82%}
}
@keyframes rainbow { 
    0%{background-position:0% 82%}
    50%{background-position:100% 19%}
    100%{background-position:0% 82%}
}

/*
body {
  background-color: teal;

  color: white;
  font-family: "Open Sans", sans-serif;
  letter-spacing: 2px;
}

.fancy-gradient {
body {
  background-color: var(--gradient_bg_color);
  background-image: radial-gradient(
      var(--gradient_spot1_w) var(--gradient_spot1_h)
      at left var(--gradient_spot1_x) top var(--gradient_spot1_y),
      var(--gradient_spot1_color),
      transparent
    ),
    radial-gradient(
      var(--gradient_spot2_w) var(--gradient_spot2_h)
      at left var(--gradient_spot2_x) top var(--gradient_spot2_y),
      var(--gradient_spot2_color),
      transparent
    ),
    radial-gradient(
      var(--gradient_spot3_w) var(--gradient_spot3_h)
      at left var(--gradient_spot3_x) top var(--gradient_spot3_y),
      var(--gradient_spot3_color),
      transparent
    ),
    radial-gradient(
      var(--gradient_spot4_w) var(--gradient_spot4_h)
      at left var(--gradient_spot4_x) top var(--gradient_spot4_y),
      var(--gradient_spot4_color),
      transparent
    );

}
*/

.profile-picture {
  display: block;
  margin-left: auto;
  margin-right: auto;

  margin-top: 10%;
  height: auto;
  max-width: 200px;

  border-radius: 50%;
}

.profile-name {
  text-align: center;

  padding: 30px;
  font-size: 48px;
  font-weight: bold;
}

.links {
  text-align: center;
  margin-top: 20px;
  border: 1px solid black;
  background-color: whitesmoke;
  border-width: 2px;
  padding: 20px;

  max-height: 75px;
  width: 290px;
  display: block;
  margin-left: auto;
  margin-right: auto;

  border-radius: 40px;

  font-size: 18px;
}

a {
  text-decoration: none;

  color: black;
  transition: color 1s;
}

a:hover {
  color: whitesmoke;
  background-color: black;
}

.link-picture {
  display: block;
  margin-left: auto;
  margin-right: auto;

  margin-top: 2.5%;
  height: auto;
  max-width: 50px;

  border-radius: 50%;
}

.link-picture-full {
  display: block;
  margin-left: auto;
  margin-right: auto;

  height: auto;
  max-width: 280px;

}

--gradient_spot1_color: #db0072; /* rose */
--gradient_spot1_w: 50vw;
--gradient_spot1_h: 100vh;
--gradient_spot1_x: -10%;
--gradient_spot1_y: 80%;

--gradient_spot2_color: #ffe53e; /* yellow */
--gradient_spot2_w: 50vw;
--gradient_spot2_h: 100vh;
--gradient_spot2_x: 25%;
--gradient_spot2_y: 60%;

--gradient_spot3_color: #00ffe4; /* teal */
--gradient_spot3_w: 50vw;
--gradient_spot3_h: 100vh;
--gradient_spot3_x: 55%;
--gradient_spot3_y: 40%;

--gradient_spot4_color: #d150ff; /* purple */
--gradient_spot4_w: 50vw;
--gradient_spot4_h: 100vh;
--gradient_spot4_x: 90%;
--gradient_spot4_y: 20%;
