@import url("https://fonts.googleapis.com/css?family=Ubuntu|Ubuntu+Mono&display=swap");
body {
  background-color: #10131a;
  background-image: url("/assets/img/background.jpg");
  background-size: 100%;
}

#particles-js {
  height: 100vh;
  width: 100%;
  position: fixed;
  z-index: -1;
}

#content {
  margin: auto;
  width: 420px;
}

#mainIcon {
  min-width: 200px;
  min-height: 200px;
  max-height: 400px;
  max-width: 400px;
  position: relative;
  top: 50px;
  border-width: 5px;
  border-style: solid;
  border-radius: 90px;
  border-color: #2ed49c;
  padding-right: 10px;
  background-color: rgba(0, 255, 216, 0.45);
  z-index: 1;
}

#projectsButton {
  color: #c1c1c1;
  position: relative;
  top: 100px;
  border-width: 5px;
  border-radius: 30px;
  border-style: solid;
  width: 200px;
  padding: 20px;
  padding-bottom: 10px;
  background-color: rgba(128, 128, 128, 0.51);
  cursor: pointer;
  transition: 0.8s;
  margin: auto;
  z-index: 1;
}

#projectsButton:hover {
  background-color: rgba(140, 140, 140, 0.51);
  top: 90px;
  transition: 0.4s;
}

#projectsButton i {
  font-size: 70px;
  width: 200px;
  text-align: center;
}

#projectsButton p {
  font-family: "Ubuntu Mono", "Ubuntu", "Verdana Pro", "Verdana";
  font-size: 25px;
  width: 200px;
  text-align: center;
}

#projectsButton p::selection {
  background-color: transparent;
}

.animatedHide {
  opacity: 0;
  transition: 1s;
}

.animatedShow {
  top: 0px;
  opacity: 1;
  transition: 0.6s;
}