.login {
  height: 100vh;
  width: 100vw;
  display: flex;
  justify-content: center;
  align-items: center;
  background: #eeaeca;
  background: radial-gradient(circle, #eeaeca 0%, #94bbe9 100%);
}
.login h2 {
  color: aliceblue;
  font-size: 10vw;
  position: absolute;
  top: 15vw;
  left: 5vw;
}
.login .grain {
  display: flex;
  justify-content: center;
  align-items: center;
}
.login form {
  justify-content: unset;
  bottom: unset;
  width: 30vw;
}
.login form button {
  background-color: transparent;
  margin-top: 10px;
}
.login input {
  height: 50px;
  background-color: #fffdfd78;
}
.back {
  background-color: #1c1c24;
}
.back main {
  display: flex;
  justify-content: center;
  height: unset;
  width: 100vw;
}
.back header {
  height: 10vh;
  display: flex;
  flex-direction: row;
  justify-content: space-evenly;
  padding: 20px;
}
.back header ul {
  display: flex;
  flex-direction: row;
  list-style: none;
  justify-content: space-evenly;
  width: 90vw;
}
.back a {
  color: whitesmoke;
  position: relative;
}
.back table tr.card {
  margin-top: 30px;
}
.back table th {
  margin: 10px;
  color: whitesmoke;
}
.back table td {
  display: table-cell;
  padding: 10px;
}
.back table .save {
  display: flex;
  width: 100%;
  justify-content: center;
  height: 50px;
}
.back .hobby {
  display: none;
  height: fit-content;
}
.back .experience {
  display: none;
  height: fit-content;
}
.back .portfolio {
  display: none;
  height: fit-content;
  width: 60vw;
}
.back .portfolio img {
  width: 20vw;
}
.back form {
  display: flex;
  position: unset;
  bottom: unset;
}
.back .mb-3 {
  margin-bottom: 3vh;
}