/* Font data */

/* .sedan-regular {
    font-family: "Sedan", serif;
    font-weight: 400;
    font-style: normal;
  }
  
/* .lora-<uniquifier> {
  font-family: "Lora", serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
} */

/* Navbar + Website */

.fa-solid{
    margin:0 0.2rem;
  }
  
  .link-test:hover{
    opacity:0.3;
  }

  .navbar-brand{
    margin-left:3rem;
    padding-right:52.5rem;
  }
  
  .navbar{
    background-color: rgb(8, 139, 215);
    margin-bottom: 2%;
  }
  
  .nav-link{
    margin-right:2.5rem;
  }
  
  .website{
    position: absolute;
    top:0;
    z-index:-3;
    background-color: rgb(43, 156, 222);
    overflow-y: auto;
    border: 30px white solid;
    margin: 20px;
    overflow-x: hidden;
  }


/* Dropdown */

body
{
    padding-top: 1%;
}

h1
{
    text-align: center;
}

h4{
    text-align: center;
    padding-bottom: 2rem;
    font-family: "Sedan", serif;
    font-weight: 400;
}

.division {
    text-align: center;
    position: relative;
}

.division::after {
    margin-top: 10%;
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    right: -0.3rem; /* Adjust this value to shift the border */
    width: 2px;
    background-color: rgba(43, 156, 222, 0.3); /* Set the border color */
    height: var(--line-height, 85%); /* Set the height of the line */
}

.division20,.division21,.division22,.division23,.division30,.division31,.division32,.division33{
    font-size: 3rem;
    font-family: "Lora", serif;
    font-optical-sizing: auto;
    font-weight: 400;
}

.fa-person{
    color: #d7d4d5;
}

.list-group-item
{
    font-size: 21px;
    font-family: "Sedan", serif;
    font-weight: 400;
}

.list-group{
    width:50rem;
    margin-left:17%;
    border-radius: 20px;
}

.lift-Empty{
    color:#30AC40;
}

.lift-Full{
    color:#EF8510
}

.lift-Overweight{
    color:#DA1212;
}

#butt
{
    margin:3% 43.1%;
    position:relative;
    left:2.4%;
    color:white;
    background-color: #efb402;
    border: 1px solid #efb402;
}

#butt:hover{
  background-color: #d19d00;
  border: 1px solid #d19d00;
}

#butt1{
  margin:2% 43.1%;
  position:relative;
  left:4.3%;
}

#q,#q1,#q2,#q3
{
    color:#0a445e;
    font-size: 21px;
}

#test
{
    color:white;
    font-family: "Sedan", serif;
    font-weight: 400;
}

/* Popup */
.fa-clock{
  margin: 1rem;
}

.Time-button-less
{
  background-color: #D3D3D3;
}

.Time-button-more{
  background-color: #4682B4;
}

.Time-popup
  {
    position:absolute;
    top:0;
    left:50%;
    transform:translate(-50%, -50%) scale(0.1);
    visibility: hidden;
    width:400px;
    background: #fff;
    border-radius: 6px;
    text-align: center;
    padding: 0 30px 30px;
    color: #333;
    box-shadow: 10px 10px 3px rgba(0,0,0,0.5);
    transition: transform 0.6s, top 0.6s;
  }
  
  .close-popup{
    visibility: hidden;
    top:0;
    transform:translate(-50%, -50%) scale(0.1);
    z-index:100;
  }
  
  .open-popup{
    visibility: visible;
    top:50%;
    transform:translate(-45%,-70%) scale(1);
  }


/* Footer */
.footer{
    background-color: rgb(8,139,215);
    color:white;
    padding:30px 10px;
    text-align: center;
  }