body{
    background: linear-gradient(135deg,rgb(245, 215, 22),rgb(253, 47, 47));
    height: 100vh;
}
.reserveDiv{
    height: 680px;
    width: 30%;
background:linear-gradient(rgba(0, 0, 0, 0.6)),url(images/tableBgrd1.jpg) ;
background-size: cover;
background-position-x:center ;
background-position-y:center ;
   margin: auto;
   border-radius: 10px;
   margin-top: 20px;
}
.reserveDiv img{
     width: 130px;
     margin-top: 20px;
}
.reserveDiv input{
     width: 300px;
     height: 35px;
     border-radius: 5px;
    border: 1px gray solid;
    font-size: 1.1em;
    background-color: rgb(225, 212, 212);
    font-family: Verdana, Geneva, Tahoma, sans-serif;
    padding-left: 15px;
}

.reserveDiv form{
    display: grid;
   gap: 10px;
   margin-left: 60px;
}
.reserveDiv label{
    font-size: 1.2em;
    font-family: verdana;
    color: beige;
}
form button{
    font-size: 1.2em;
    font-family: verdana;
    width: 300px;
    height: 30px;
    border-radius: 10px;
    border: 1px black solid;
    background-color: rgb(236, 126, 36);
    color: white;
}
form button:hover{
    filter: brightness(80%);
}
.selectTimeSection{
    border-radius: 10px;
    width: 500px;
    height: 450px; 
    background:linear-gradient(rgba(0, 0, 0, 0.15)), url(images/time.jpg);
   background-position-y: center;
   background-position-x:center ;
}
.selectTimeSection h1{
    text-align: center;
    margin-top: 40px;
    color: white;
    font-size: 1.5em;
    font-family: verdana;
    letter-spacing: 1px;
}
.timeDiv{
    display: grid;
    width: 500px;
    margin: auto;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
    gap: 10px;
    row-gap: 50px;
    margin-top: 60px;
    letter-spacing: 1px;
}
.timeDiv div{
    text-align: center;
    border: 1px black solid;
    border-radius: 10px;
    padding-top: 10px;
    padding-bottom: 10px;
    background-color: rgb(236, 126, 36);
    color: white;
    cursor: pointer;
}
.timeDiv div:hover{
    filter: brightness(70%);
}
.selectViewSection{
    width: 700px;
    height: 380px;
     background-size: cover;
    background: linear-gradient(rgba(0, 0, 0, 0.3)),url(images/view.jpg);
    margin: auto;
    border-radius: 10px;
}
.viewDiv{
     display: flex;
     gap: 20px;
     margin-top: 15px;
}
.selectViewSection img{
    width: 220px;
    height: 260px;
    border-radius: 10px;
}
.selectViewSection img:hover{
    filter: brightness(70%);
}
.selectViewSection h2{
    text-align: center;
    letter-spacing: 1px;
    font-family: verdana;
    font-size: 1.1em;
    color: white;
}
.reserveBtn{
   margin-top: 30px;
   width: 100px;
   height: 30px;
   border: none;
   border-radius: 5px;
   color: white;
   background-color: rgb(7, 206, 57);
   font-size: 1.3em;
}
.reserve h2{
    font-size: 1.8em;
    text-align: center;
    font-family: verdana;
    margin-top: 0;
   letter-spacing: 1px;
    border-radius: 5px;
    padding: 3px;
}
#reserveNotSent{
     color: red;
}
#reserveSent{
     color: rgb(23, 232, 124);
}

.reserve p{
    font-size: 0.8em;
    text-align: center;
    font-family: verdana;
    margin-top: 0;
   letter-spacing: 1px;
    border-radius: 5px;
    padding: 3px;
    color: white;
}
.reserve{
    border-radius: 10px;
    width: 100%;
    height: 100%;
    background: none;
    border: none;
    backdrop-filter: blur(10px); 
  -webkit-backdrop-filter: blur(10px); 
}
.reserve img{
    width: 100px;
    margin-bottom: 30px;
    margin-top: 200px;
}