#members{
    height: 2vw;
    width: 5vw;
}

.card input,.card select{
    padding: 1rem auto;
    border: transparent;
    border-radius: 0.2rem;
    margin: 0.2vw auto;
    backdrop-filter: blur(15px);
    -webkit-backdrop-filter: blur(15px);
    background-color: #ffffff5b;
    width: 7vw;
    height: 2vw;
}

.card input[name='trip'], .card input[name='flight-type'],
 .card input[name='fuel2'], .card input[name='fuel4']{
    appearance: none;
    height: 15px;
    width: 15px;
    margin: auto;
    border-radius: 50%;
    box-shadow: 0 2px 5px -1px #666;
}
.card input[name='fuel']{
    appearance: none;
    height: 15px;
    width: 15px;
    margin: auto;
    box-shadow: 0 2px 5px -1px #666;
}
.card input[name='trip']:checked, [name='flight-type']:checked, .card input[name='fuel']:checked, 
.card input[name='fuel2']:checked, .card input[name='fuel4']:checked{
    background: radial-gradient(#4b9c77,#4eab81,#6fffbe);
}



.row-span-2{
    grid-row: 1 / 3;
}
.col-span-2{
    grid-column: 1/3;
}


#loadingScreen {
    display: flex;
    align-items: center;
    justify-content: center;
    position: fixed;
    top: 25%;
    left: 25%;
    width: 50%;
    height: 50%;
    background-color: rgba(255, 255, 255, 0.8);
  }
  
  .loader {
    border: 8px solid #f3f3f3;
    border-top: 8px solid #3498db;
    border-radius: 50%;
    width: 50px;
    height: 50px;
    animation: spin 1s linear infinite;
  }
  
@keyframes spin {
0% { 
    transform: rotate(0deg); 
}
100% { 
    transform: rotate(360deg); 
}
}
  
.loading p{
    margin-left: 10px;
    font-size: 20px;
  }

a{
    color: #333;
}
a:visited{
    color: #333;
}

a.dark-mode, 
a:visited.dark-mode{
    color:#fff;
}