h1,h2,h3,h4,h5,h6,p{color:#f4f4f4!important;}
body{
  background-color:#000;
  font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue",
  Helvetica, Arial, "Lucida Grande", sans-serif;
}
.bg-dark{background-color:#000!important;}
.text-muted{color:#b1b1b1!important;}
.text-light{color:#f4f4f4!important;}
.btn-primary{
  background-color:#f4f4f4!important;
  color:#000!important;
  border: 0px solid black;
  font-size:13px;
  padding:12px;
  font-weight:600;
}
.btn-secondary{
  background-color:#111111!important;
  color:#f4f4f4!important;
  border: 1.5px solid #f4f4f4;
  font-size:13px;
  padding:12px;
  font-weight:600;
}
.bg-primary{
  background-color:#2a2a2a!important;
}
.bg-secondary{
  background-color:#181818!important;
}
.badge-bg{
  background-color:#ddedea!important;
  color:black!important;
}
.form-control{
  background-color:#181818!important;
  color:#f4f4f4!important;
  border: 1px solid #606060;
  padding:12px;
  font-size:14px;
}
input::placeholder{
  color:#b1b1b1!important;
}
.form-label{
  font-size:13px;
}
.form-control:focus {
    border-color: #f4f4f4;
    box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.075) inset, 0px 0px 8px rgba(255, 255, 255, 0.5);
}
.gradientBG{
  background: rgb(40,40,55);
  background: linear-gradient(344deg, rgba(40,40,55,1) 0%, rgba(16,16,18,1) 50%);
}
.start_card {
  height: 150px;
  background: rgb(17, 4, 134);
  border-radius: 10px;
  box-shadow: rgb(0,0,0,0.7) 5px 10px 50px ,rgb(0,0,0,0.7) -5px 0px 250px;
  display: flex;
  color: white;
  justify-content: center;
  position: relative;
  flex-direction: column;
  background: linear-gradient(to right, rgb(20, 30, 48), rgb(36, 59, 85));
  transition: all 0.3s ease-in-out;
  overflow: hidden;
}

.card:hover {
  box-shadow: rgb(0,0,0) 5px 10px 50px ,rgb(0,0,0) -5px 0px 250px;
}

.time-text {
  font-size: 50px;
  margin-top: 0px;
  margin-left: 15px;
  font-weight: 600;
  margin-bottom:0px;
}

.time-sub-text {
  font-size: 15px;
  margin-left: 5px;
}

.day-text {
  font-size: 18px;
  margin-top: 0px;
  margin-left: 15px;
  font-weight: 500;
}

.moon {
  font-size: 24px;
  position: absolute;
  right: 22px;
  top: 14px;
  transition: all 0.3s ease-in-out;
}
.calendar-box {
  height: 50px;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: flex-end;
  position: relative;
  border-radius: 10px;
  background: rgb(40,40,55);
  background: linear-gradient(344deg, rgba(40,40,55,1) 0%, rgba(10,10,10,1) 50%);
}
.calendar-spend {
  font-size: 0.55rem;
  position: absolute;
  bottom: 28px;
  text-align: center;
  font-weight:700;
}
.calendar-number {
  font-size: 0.75rem;
  position: absolute;
  bottom: 5px;
  text-align: center;
  font-weight:700;
}
.box-item{

}