*{
    --primary-dark : #006400;
    --primary-green : #ADFF2F;
}

body{
    background-color: var(--primary-dark);
    font-family: cursive;
}
.main-container{
    display: block;
    margin: auto;
    padding: 30px; 
}
.main-container .container, .next-container{
    display: flex;
    flex-direction: column;
    width: 50%;
    color: var(--primary-green);
    font-size: large;
    margin-left: 25%;
    justify-content: center;
}
.next-container{
    width: 100%;
    position: relative;
    margin-left: 0 !important;
}
.main-container .container .heading{
    text-align: center;
    text-decoration: underline;
}
.main-container .container .description{
    text-align: center;
}
.main-container .container p{
    font-size: larger;
}
.main-container .container label,
.main-container .container .next-container label{
    padding: 0.5rem;
    font-size: larger;
}
.main-container .container input{
    border-radius: 10px;
    width: 40vw;
    padding: 0.2rem;
    margin: auto;
}
.main-container .container.next-container input{
    border-radius: 10px;
    width: 40vw;
    padding: 0.2rem;
    margin: auto;
}
.main-container .container input:hover,
.main-container .container .next-container input:hover{
    transform: scale(1.04);
    transition: all 1s ease-in-out;
}
.main-container .container .next-container #check-button,
.main-container .container #check-bill{
    margin-top: 1.5rem;
    border-radius: 10px;
    width: 10vw;
    padding: 0.25rem;
    margin-left: auto;
    margin-right: auto;
    background: transparent;
    border-color: #ADFF2F;
    color: #ADFF2F;
    cursor: pointer;
}
.main-container .container .next-container #check-button:hover,
.main-container .container #check-bill:hover{
    color: #006400 ;
    background-color: #ADFF2F;
}
.main-container .container .change-table{
    padding: 5px;
}
.main-container .container .change-table caption{
    font-size: larger;
    margin-bottom: 0.5rem;
}

.main-container .container table{
    border-collapse: collapse;
}
.main-container .container .change-table th,td{
    padding: 0.5rem;
    border: 1px solid black;
}
.main-container .container .change-table td{
    text-align: center;
    width: 50px;
}