@import url("https://fonts.googleapis.com/css2?family=Bangers&family=Nosifer&family=VT323&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Rubik+Wet+Paint&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Miltonian+Tattoo&family=Rubik+Wet+Paint&display=swap");

* {
  color: white;
}

header,
.project:not(:last-child) {
  border-bottom: 1px solid #ccc;
  position: sticky;
}

textarea {
  color: black;
}

.no-button {
  background: none;
  border: none;
  padding: 0;
  cursor: pointer;
  color: #1b89bc;
  text-decoration: none;
  font-size: 100%;
}

.no-button:hover {
  color: #065b83;
  text-decoration: underline;
}

.dollar-amount {
  color: #056605;
  font-weight: bold;
  margin-left: -5px;
}

.main-container {
  display: flex;
  border: solid 2px black;
  justify-content: space-around;
  background-color: rgba(0, 0, 0, 0.6);
  transition: ease-in 400ms;
}

.main-container:hover {
  background-color: black;
  opacity: 0.9;
  box-shadow: 5px 2px 5px white;
}

body {
  background-image: url("./images/arnold.jpg");
  background-size: cover;
  background-repeat: no-repeat;
  font-size: 16px;
}

/* .bg-image{
  background-image: url('https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcQFs5EXRGiN0156q6bjFwe5mOrzVdjuz1uTMQ&usqp=CAU');
  background-image: url('https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcQFs5EXRGiN0156q6bjFwe5mOrzVdjuz1uTMQ&usqp=CAU');
  background-size: cover;
  background-repeat: no-repeat;
 height: 100vh;
  font-family: 'Nosifer', cursive;
  opacity: 0.3;

} */

.hide {
  display: none;
  background-color: rgba(0, 0, 0, 0.6);
}

.signup-btn {
  border-radius: 5px;
  background-color: rgba(0, 0, 0, 0.1);
  cursor: pointer;
  border: none;
  font-style: italic;
  text-decoration: underline;
}

.signin-form {
  border: solid rgb(0, 0, 0);
  padding: 40px;
  background-color: rgba(0, 0, 0, 0.8);
  border: solid 2px white;
}

.shown {
  border: solid 2px white;
  padding: 40px;
  background-color: rgba(0, 0, 0, 0.8);
}

.total-workout-time {
  font-family: "Nosifer", cursive;
}

.user-name {
}

.container1 {
  display: flex;
}

.card {
  background-color: rgb(121, 110, 110);
}

.chart-background {
  display: flex;
  justify-content: center;
  background-color: black;
  margin-top: 45px;
  width: 50%;
  border: solid white;
  padding: 10px;
}

#update-button {
  margin-top: 20px;
  display: flex;
}

.p-container {
  text-align: center;
  width: 100%;
  font-weight: 800;
  letter-spacing: 1px;
}

@media screen and (max-width: 1250px) {
  .card {
    /* height: 290px; */
    width: 135px;
  }
  textarea {
    width: 133px;
  }
  h3.weekday {
    font-size: 22px;
  }
}
@media screen and (max-width: 992px) {
  .container1 {
    flex-wrap: wrap;
    width: 95vw;
    /* width: 169px; */
    /* position:fixed; */
    /* height: fit-content; */
  }
  textarea {
    width: 169px;
  }
  .card {
    width: 171px;
  }

  .input-group-text {
    background-color: rgb(121, 110, 110);
  }
}