html {
  height: 100%;
  margin: 0;
}

body {
  font-family: 'Cormorant Garamond', Garamond, serif;
  color: #fff;
  margin: 0;
  font-size: 20px;
  text-align: center;
  background: url('media/background.jpg') no-repeat center center fixed;
  background-size: cover;
  text-shadow: 1px 1px 4px rgba(0,0,0,0.8);
  height: 100%;
  display: flex;
  flex-direction: column;
}

main {
  flex: 1;
}

header {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 20px;
  /*padding: 1rem;*/
}

footer {
  padding: 1em;
}

.logo {
  max-width: 150px;
  /*margin-bottom: 1rem;*/
}

.container {
  background-color: rgba(0, 0, 0, 0.3);
  padding: 2rem;
  max-width: 800px;
  margin: auto;
  border-radius: 10px;
  margin-top: 5vh;
}

a {
  #color: #00ffcc;
  color: #ddcdcb;
  text-decoration: none;
}

a:hover {
  text-decoration: underline;
}

/* HotelDruid */
div.mainbox { text-align: center; padding: 10px; text-shadow: none; }
table.formframe { margin-left: auto;  margin-right: auto; color: #550000; background-color: #ddcdcb; border-radius: 14px; }
table.formframe td { border-radius: 14px; }
table.formcont { text-align: left; margin-left: 0; }
table.formcont td { border: 0; border-radius: 0; }
table.tab_disp td { border: 1px solid #444444; }
.tab_disp {font-size:70%;}
.nowrp { white-space: nowrap; }
.t_book {  border-radius: 8px; }
.t_book td {  border-radius: 8px; }
input.dbutton { padding: 0; width: 14px; }
input.sbutton {  border: 1px solid #bbbbbb; border-radius: 4px; padding-top: 4px; padding-bottom: 4px; padding-left: 24px; padding-right: 24px; }
.avail_button input { background-color: rgba(85, 0, 0, 0.7); color: white; }
.avail_button input:hover { background-color: rgba(85, 0, 0, 1); }
div.agreem { max-width: 600px; border: 1px solid black; padding: 3px; }
select { background-color: #ffffff; }
.separ_cal_but { display: inline-block; width: 4px; }
.caltitle { font-size: 12px; display: inline-block; padding-bottom: 2px; }
.calbutton { font-size: 10px; }
.caltable td { font-size: 12px; }
.t1top { position: -webkit-sticky; position: sticky; top: 0; background-clip: padding-box; }
.t1left { position: -webkit-sticky; position: sticky; left: 0; background-clip: padding-box; }
input.dbutton { width: 20px; }
input.sbutton, button.sbutton { border: 1px solid #bbbbbb; border-radius: 4px; padding-top: 4px; padding-bottom: 4px; padding-left: 24px; padding-right: 24px; }
input.smallsbutton { border: 1px solid #bbbbbb; font-size: 70%; padding-top: 1px; padding-bottom: 1px; padding-left: 3px; padding-right: 3px; }
#step_dates .avail_button input, #step_avail_types .avail_button input { background-color: rgba(85, 0, 0, 0.7); color: white; }
.book_button input, .book_button button { background-color: rgba(85, 0, 0, 0.7); color: white; }
#step_dates .avail_button input:hover, #step_avail_types .avail_button input:hover { background-color: rgba(85, 0, 0, 1); }
.book_button input:hover, .book_button button:hover { background-color: rgba(85, 0, 0, 1); }
table.types_list { border-collapse: collapse; }
table.types_list td { border: 1px solid black; padding: 6px; }
table.types_list td td { border: none; padding: 0; }
tr.types_list_head td { font-size: x-small; padding: 2px 6px 2px 6px; }
div.avail_types { padding: 6px; }
div.typedescr { max-width: 600px; padding: 4px 2px 4px 12px; }
div.typephoto { float: right; }
div.typephoto img { float: right; max-width: 90px; max-height: 90px; border: 0px none ; text-decoration: none; }
.sp_book_butt { height: 6px }
.cctype { float: left; }
.ccnum { clear: left; }
.cclogo { display: block; float: left; width: 40px; height: 28px; padding: 1px; }
.ccvisa { background: url("https://www.digitaldruid.net/hosted/img/cc_visa.png") no-repeat left center; }
.ccmastercard { background: url("https://www.digitaldruid.net/hosted/img/cc_mastercard.png") no-repeat left center; }
.ccamericanexpress { background: url("https://www.digitaldruid.net/hosted/img/cc_americanexpress.png") no-repeat left center; }
.ccdinersclub { background: url("https://www.digitaldruid.net/hosted/img/cc_dinersclub.png") no-repeat left center; }
.ccdiscover { background: url("https://www.digitaldruid.net/hosted/img/cc_discover.png") no-repeat left center; }
.ccjcb { background: url("https://www.digitaldruid.net/hosted/img/cc_jcb.png") no-repeat left center; }
#ccv_info { font-size: 60% }
.t_book { border-radius: 8px; }
.t_book td { border-radius: 8px; }
.extra_costs { margin-top: 5px }
.not_avail { background-color: #dddddd; }
.book_now_col input { position: -webkit-sticky; position: sticky; top: 30px; bottom: 30px; }
.warnbox { position: fixed; top: 50%; left: 35%; right: 35%; background: #ffffff; padding: 10px; border: 2px solid black; border-radius:8px; font: 20px Arial, Helvetica, sans-serif; color: #000000; text-align: center; }
@media only screen and (max-width: 480px) {
  .t_book table, table.extra_costs, [class^="phr_separator"] { display: block; }
  .t_book table tr, .extra_costs tr { display: block; padding: 5px 0 5px 0; }
  .t_book table td, .extra_costs td { display: block; text-align: left; padding: 0; }
  div.agreem { max-width: 340px; }
  .warnbox { left: 15%; right: 15%; }
}
@media only screen and (max-width: 790px) {
  .book_now input[type="submit"] { margin-top: 10px; }
  .caltitle { font-size: 16px; }
  .separ_cal_but { display: inline-block; width: 10px; }
  .calbutton { font-size: 14px; padding-left: 12px; padding-right: 12px; }
  .caltable td { font-size: 16px; }
  .check_avail_line { line-height: 1.5; }
  table.perstype td { display: inline-block; }
  .tab_cont { overflow-x: scroll; padding-bottom: 6px; }
}
.rates { color: #550000; background-color: #ddcdcb; border-radius: 10px; }
.rates tr:first-child td:first-child { border-top-left-radius: 10px; }
.rates tr:first-child td:last-child { border-top-right-radius: 10px; }
.rates tr:last-child td:first-child { border-bottom-left-radius: 10px; }
.rates tr:last-child td:last-child { border-bottom-right-radius: 10px; }
@media only screen and (max-width: 790px) {
  .rates_cont { overflow-x: scroll; }
}
.tab_cont { color: #550000 }
div.bar_av { font-size:80%; font-weight: normal; text-align: center; background-color: #dddddd; }