html {
color: #000066;
font-family: 'Arsenal', sans-serif;
}

.headerLogo {
display:block;
text-align:center;
margin-left: auto;
margin-right: auto;
}

h1 {
font-size: 24px;
text-align: center;
margin-bottom: 0px;
padding-bottom: 0px;
}

h2 {
font-size: 18px;
text-align: center;
margin-top: 0px;
}

.button {
  padding: 12px 24px;
  text-align: center;
  text-decoration: none;
  display: block;
  font-size: 16px;
  margin: 10px 2px;
  transition-duration: 0.8s;
  cursor: pointer;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
  background-color: white; 
  color: #000066; 
  border: 2px solid #000066;
  width: 90%;
  border-radius: 12px;
}

.button_home {
  padding: 8px 16px;
  width: 75%;
  color: white;
  background-color: #000066;
  margin-bottom: 10px;
}

.button_cancel {
  padding: 8px 16px;
  width: 75%;
  color: white;
  background-color: #ff0000;
  margin-bottom: 10px;
  border: 2px solid #ff0000;
}

.datenote {
font-size: 12px;
}

table.reserve_timeslots {
   width: 100%;

}

table.reserve_timeslots td {
   text-align:center;
}

table.reserve_timeslots button {
  background-color: green; 
  color: #ffffff; 
  border: 2px solid green;
}

table.reserve_timeslots button.button_disabled {
  background-color: #D0D0D0;
  color: white; 
  border: 2px solid #B0B0B0;
}

form.reservation {
 text-align:center;
}

form.reservation button.submit {
  background-color: green; 
  color: #ffffff; 
  border: 2px solid green;
}

form p {
margin-top: 0px;
margin-bottom: 10px;
}

/* Mobile Styles */
@media only screen and (max-width: 480px) {


}

/* Desktop Styles */
@media only screen and (min-width: 769px) {

html {
background-color: #000066;
}

#uberContainer {
  background-color: #000066;
}

#mobileContainer {
  background-color: white;
  width: 60%;
  margin-left: auto;
  margin-right: auto;
}

.button {
  max-width: 300px;
}

}


}