/* Booking background image section */

.booking-bg {
    background-image: url("../images/booking-bg.png");
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.form-bg {
    background-color: black;
    border: 1px solid #FFE6A7;
    opacity: 0.9;
    z-index: 2;
}

.form-content {
    z-index: 1;
}

/* Buttons of the hours */

.btn-hour {
    background-color: #FFFFFF;
    border: 2px solid #FFE6A7;
    color: #000000;
    font-weight: bold;
}

.btn-hour:hover {
    background-color: #FFE6A7;
    border: 2px solid #913732;
    color: #000000;
    font-weight: bold;
}

/* List of the buttons of the hours */

#noon-monday, #evening-monday {
    display: inline-block;
}

#noon-tuesday, #noon-wednesday, #noon-thursday, #noon-friday, #noon-saturday, #noon-sunday {
    display: none;
}
#evening-tuesday, #evening-wednesday, #evening-thursday, #evening-friday, #evening-saturday, #evening-sunday {
    display: none;
}

/* Button to see or hide the number of the remaining seats */

.btn-displaySeats, .btn-hideSeats, .btn-maximumGuests {
    background-color: #000000;
    border: 1px solid #FFE6A7;
    color: #FFFFFF;
}

.btn-displaySeats:hover, .btn-hideSeats:hover {
    color: #FFE6A7;
}

.btn-maximumGuests:hover {
    color: #FFFFFF;
}

/**********************************************************
              Admin bookings Page
************************************************************/

/* Bookings list */

.booking-list {
    background-image: url("../images/schedule.png");
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.list-bg {
    background-color: black;
    border: 1px solid #FFE6A7;
    opacity: 0.9;
}

.table-bg {
    background-color: black;
    color: #FFFFFF;
}


/*********************************************************************
                        Media queries
**********************************************************************/

/* mobile phones */

@media screen and (min-device-width: 280px) and (max-device-width: 767px) {
    .booking-bg, .booking-list {
        background: black;
    }
    .list-bg {
        border: none;
    }
}
