join.css

:root {
  --primary-color: #f36100;
  --secondary-color: #fb8122;

  --primary-text-color: WHite;
  --secondary-text-color: #e1e2e2;

  --bgcolor: #1d2228;
  --bgcolor2: #051622;
}

#join {
  background-image: url(Assests/Yoga/pexels-elina-fairytale-3823076.jpg);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  position: relative;
  height: 100vh;
}

.card {
  background-color: rgba(255, 255, 255, 0.3);
}
.login {
  color: var(--primary-text-color) !important;
  text-shadow: 3px 4px 10px rgba(0, 0, 0, 0.59);
}
.login a u {
  color: black;
  transition: 0.5s all;
}
.login a u:hover {
  color: var(--primary-color);
}

.register {
  background-color: var(--primary-color);
  border-color: var(--primary-color);
}
.register:hover,
.register:active,
.register:focus {
  background-color: var(--secondary-color);
  border-color: var(--secondary-color);
}