body {
  font-family: 'Inter', sans-serif;
}

main {
  background-color:#000;
}

main .background {
  background-image:url('./../img/background.png');
  background-size: cover;
  background-position: center;
  height: 100vh;
  width: 100%;
  position: absolute;
  opacity:41%;
  filter: blur(2px);
}

.main {
  display:flex;
  align-items: center;
  justify-content: center;
  height: 100vh;
  z-index: 10;
  position: relative;
}

.statusBadge {
  padding: 17px 47px 21px 47px;
  font-size: 39px;
  border-radius: 1rem;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
  background: rgb(29 30 30 / 82%);
  display: flex;
  flex-direction: column;
  align-items: center;
}

.statusBadge .working {
  color:#d15e5e;
}

.statusBadge .free {
  color:#7fcb70;
}

#workingStatus {
  animation: pop 1s ease;
  font-size: 52px;
  font-weight: 600;
  padding-top: 20px;
  padding-bottom: 20px;
}

@keyframes pop {
  0% { transform: scale(0.7); opacity: 0; }
  100% { transform: scale(1); opacity: 1; }
}

.bottomText {
  font-size:14px;
  font-weight: 600;
}

.bottomText .highlightText {
  color:#aec2d3;
}