#BBS_body {
    background-image: url('images/BBS_Background.jpg');
    background-repeat: no-repeat;
    background-attachment: fixed;  
    background-size: 800px auto;
    background-position: center ;
    font-family: 'Roboto', 'sans-serif';
    display: flex;
}


.bbs-form {
    background-color: white;
    font-weight: 400;
    text-align: left;
    padding: 20px;
    border: 1px solid rgba (0,0,0,0.16);
    border-radius: 6px;
    width: 340px;
    margin: 0 auto;
    margin-top: 150px;
    background-color: rgba(255, 255, 255, 0.8);
}

.bbs-form h2 {
    text-align: center;
    font-size: 24px;
    font-weight: bold;
    color: rgb(119,34,60);
}

h2 {
    text-align: center;
    font-size: 24px;
    font-weight: bold;
    color: rgb(119,34,60);
}

.bbs-form input {
    width: 100%;
    height: 20px;
    margin-bottom: 10px;
}

.bbs-form label {
    font-weight: 300;
    font-size: 13px;
    color: rgb(119,34,60);
}

.form-button {
    background-color: rgb(84, 146, 222);
    color: white;
    width: 150px;
    height: 30px;
    border-radius: 6px;
    display: block;
    margin: 0 auto;
    cursor: pointer;
}

.form-button:hover {
    background-color: rgb(209, 113, 34);
    color: rgb(13, 13, 14);;
}

.form-toggle {
    text-align: center;
    margin-top: 10px;
    font-size: 14px;
}

.bbs-personal_data {
    display:grid;
    
    width: 400px;
}

.bbs-personal_input {
    height: 20px;
    
}

.bbs-personal_label {
    padding-top: 10px;
    
}

.booking-button {
    background-color: rgb(84, 146, 222);
    color: white;
    width: 200px;
    height: 60px;
    border-radius: 6px;
    display: block;
    margin: 0 auto;
    font-size: 20px;
    cursor: pointer;
}

.booking-button:hover {
    background-color: rgb(209, 113, 34);
    color: rgb(13, 13, 14);;
}

.header p {
    display: flex;
    justify-content: center; /* Horizontal centering */
    align-items: center;    /* Vertical centering */
    margin-top: 20px;
    text-align:center;
    font-size: 22px;
    /*font-weight: bold;*/
    /*color: rgb(119,34,60);*/
    /*color: rgb(220,96,53);*/
    color: rgb(255, 255, 255);
}

.info p {
    display: flex;
    justify-content: center; /* Horizontal centering */
    align-items: center;    /* Vertical centering */
    margin-top: 20px;
    text-align:center;
    font-size: 18px;
    font-weight: bold;
    color: rgb(10, 10, 10);
}

.footer p {
    display: flex;
    justify-content: center; /* Horizontal centering */
    align-items: center;    /* Vertical centering */
    margin-top: 400px;
    text-align:left;
    font-size: 16px;
    font-weight: bold;
}

#bbs_bill {
    padding: 10px;
    overflow: scroll; 
    overflow: auto;
    display: grid;
    align-items: center;
}

.mdl-data-table {
    margin: 10px;
    
    width: 70%;
}

.bill_buttonbar {
    display: flex;
    gap:20px;
    align-items: center;
    width: 70%;
    margin-left: 10px;
}

.mdl-button {
    margin: 10px;
    width: 120px;
}

#page_help {
    padding: 10px;
    overflow: scroll; 
    overflow: auto;
}


#error-message {
    color: rgb(229,99,99);
    font-size: 14px;
    margin: 4px 0 12px 0px;
    text-align: center;
}

