body {
  background:white url('https://doorcountytourismzone.com/templates/Itta Bena/images/3085179236.jpg') repeat 0 0;
  margin: 0;
  font-family:   font-family: Century Gothic;
  color: #333;
}

header {
  width: 100%;
}

h3 {
  background: #888;
  color: white;
  padding: 10px;
}

fieldset {
  border: none;
  padding: 0;
  margin-bottom: 10px;
}

fieldset > legend {
  display: inline;
}

input[type="submit" i].single-result-select-button {
  border: none;
  font-size: 0.85rem;
  cursor: pointer;
}

/* Sort-by dropdown */
.dropdown {
  position: relative;
  display: block;
  width: 50%;
  float: right;
}

.dropdown-content {
  display: none;
  position: absolute;
  background-color: #f9f9f9;
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  right: 0;
  top: 25px;
  z-index: 10;
}

.dropdown-content a {
  color: black;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
}

.dropdown-content a:hover {background-color: #f1f1f1}

.show {display:block;}
/* End sort-by dropdown */

.single-result-box {
  border: 1px solid #ddd;
  padding: 10px;
  margin-bottom: 20px;
  display: flex;
  flex-wrap: wrap;
}

.single-result-image-container {
  width: 40%;
  display: inline-block;
}

.single-result-text-container {
  width: 58.5%;
  display: inline-block;
  float: right;
  padding-left: 1.5%;
}

.single-result-overview {
  width: 100%;
  display: inline-block;
  margin-bottom: 40px;
}

.single-result-details {
  float: left;
  width: 55%;
  padding-right: 5%;
}

.single-result-details h2 {
  -webkit-margin-before: 0;
}

.single-result-details .fa-fw, .single-result-more-details .fa-fw {
  width: 3em;
  text-align: left;
}

.single-result-expand-link-container {
  margin-top: 3em;
}

.single-result-expand-link {
  color: #333;
  text-decoration: underline;
  cursor: pointer;
}

.single-result-pricing {
  float: left;
  text-align: right;
  width: 35%;
  padding-left: 5%;
}

.single-result-pricing h2 {
  margin: 0.5em 0;
}

.single-result-pricing p {
  margin: 0.5em 0;
  font-size: 0.85em;
}

.single-result-status {
  color: lightgreen;
  margin-top: 1.5em !important;
}

.single-result-select-container {
  margin-top: 1.5em !important;
  margin-bottom: 0 !important;
}

.single-result-select-button {
  background-color: #c84949;
  color: white;
  text-decoration: none;
  font-weight: bold;
  padding: 15px 0;
  width: 100%;
  max-width: 150px;
  display: inline-block;
  text-align: center;
}

.single-result-more-details {
  display: none;
  padding-left: 0;
}

.example-box {
  background: #888; 
  width: 48%;
  max-width: 300px;
  padding: 5px 1%;
  margin-bottom: 20px;
}

.back-to-results-link a {
  color: #888;
}

.room-type-details-image-container {
  width: 100%;
  display: inline-block;
}

.room-type-details-image-container .slick-track {
  height: 533.33px;
}

.room-type-details-overview-container {
  margin-bottom: 20px;
  display: flex;
  flex-wrap: wrap;
}

.room-type-details-overview-container .single-result-text-container {
  width: 100%;
  padding-left: 0;
}

.single-result-pricing.pricing-summary p {
  margin: 0.5em 0;
  font-size: 1em;
}

.pricing-summary-header {
  text-align: left;
}

.pricing-summary-label {
  float: left;
  font-size: 1rem;
  font-weight: normal;
}

.pricing-summary-total {
  margin-top: 30px !important;
  line-height: 1.5em;
}

.enter-res-info-section {
  margin-bottom: 40px;
}

.enter-res-info-section label {
  width: 45%;
  padding-right: 3%;
  max-width: 300px;
  text-align: left;
  clear: left;
}

.enter-res-info-section input, .enter-res-info-section select, .enter-res-info-section textarea {
  width: 50%;
  max-width: 300px;
  font-size: 1em;
}

.enter-res-info-section label, .enter-res-info-section input {
  display: inline-block;
}

.enter-res-info-section .months-open-container {
  display: flex;
}

.enter-res-info-section .months-open-input-container {
  display: inline-block;
  width: 50%;
  max-width: 300px;
  font-size: 1em;
}

.enter-res-info-section .months-open-input-container input {
  margin: 0;
  width: auto;
  margin-right: 20px;
}

.enter-res-info-section .months-open-input-container label {
  width: auto;
}

.enter-res-info-section .months-open-container .radio-container input[type="radio" i] {
  margin-bottom: 10px;
}

.enter-res-info-section .months-open-container .radio-container input[type="radio" i]:last-of-type {
  margin-bottom: 0;
}

.enter-res-info-section .textarea-container {
  display: flex;
}

.enter-res-info-section .chars-left-container input {
  width: auto;
}

.enter-res-info-section .chars-left-container label:last-of-type {
  width: auto;
}

.enter-res-info-section .calculate-button {
  width: 100%;
  max-width: 150px;
}

.room-tax-columns-container {
  display: flex;
  margin-top: 1.17em;
}

.room-tax-columns-container .room-tax-form-column {
  width: 48%;
  display: inline-block;
}

.room-tax-columns-container .room-tax-form-column:first-of-type {
  padding-right: 2%;
  border-right: 1px solid #888;
}

.room-tax-columns-container .room-tax-form-column:nth-of-type(2) {
  padding-left: 2%;
}

.room-tax-columns-container .room-tax-form-column h3:first-of-type {
  margin-top: 0px;
}

.i-agree {
  width: auto;
  margin-top: 30px;
}

.i-agree input[type="checkbox" i] {
  margin-right: 20px;
  width: auto;
}

.submit-buttons-container {
  text-align: center;
}

.submit-buttons-container input[type="submit" i] {
  margin-right: 20px;
}

.submit-buttons-container input[type="submit" i]:last-of-type {
  margin-right: 0;
}

#header-container {
  position: relative;
  width: 100%;
  max-width: 820px;
  margin: 0 auto;
}

#logo {
  position: absolute;
  left: 50%;
  bottom: 50%;
  height: 50%;
  max-width: 100%;
  transform: translateX(-50%) translateY(50%);
}

#header-container.with-rates-starting #logo {
  left: 10px;
  bottom: 10px;
  transform: none;
}

#rates-starting {
  position: absolute;
  right: 10px;
  bottom: 10px;
  background-color: rgba(0,0,0,0.6);
  color: white;
  font-size: 1.5em;
  padding: 15px;
  display: none;
}

#header-container.with-rates-starting #rates-starting {
  display: block;
}

#content-container {
  width: 100%;
  margin: 0 auto;
  max-width: 800px;
  background-color: #fff;
  padding: 10px;
}

#search-box {
  padding: 10px;
  border: 2px solid #ddd;
  margin-bottom: 20px;
}

#search-form {
  text-align: right;
  margin-bottom: 0;
}

#search-form fieldset > legend, #search-form input {
  font-size: 1.25em;
}

#search-form fieldset > legend {
  font-weight: bold;
  float: left;
  margin-bottom: 10px;
}

#search-form input {
  margin-left: 10px;
  margin-bottom: 10px;
  width: 100%;
  max-width: 275px;
}

#search-form input[type="submit" i] {
  width: auto;
  padding: 10px 30px;
  background: #fff;
  border: 1px solid #c84949;
  cursor: pointer;
  font-size: 1em;
}

#search-form input[type="submit" i]:hover {
  background: #c84949;
  color: #fff;
}

#info-sort-container {
  color: #888;
  margin-bottom: 20px;
  padding: 0 10px;
}

#results-info {
  width: 50%;
  display: inline-block;
}

#sort-by {
  float: right;
  font-style: normal;
  cursor: pointer;
}

/* BEGIN RESPONSIVE */

/* Tablet and smaller */
@media screen and (max-width: 768px) {
  .single-result-overview {
    margin-bottom: 0;
  }

  .single-result-details .fa-fw, .single-result-more-details .fa-fw {
    width: 1.5em;
  }

  .slick-track {
    height: 145.33px !important;
  }

  .room-type-details-image-container .slick-track {
    height: 378.66px !important;
  }

  .enter-res-info-section select {
    width: 48%;
  }

  .room-tax-columns-container {
    display: block;
    margin-top: initial;
  }

  .room-tax-columns-container .room-tax-form-column {
    width: 100%;
    display: initial;
  }

  .room-tax-columns-container .room-tax-form-column:first-of-type {
    padding-right: initial;
    border-right: none;
  }

  .room-tax-columns-container .room-tax-form-column:nth-of-type(2) {
    padding-left: initial;
  }

  .room-tax-columns-container .room-tax-form-column h3:first-of-type {
    margin-top: 1.17em;
  }
}

/* Phone and smaller */
@media screen and (max-width: 480px) {
  .dropdown-content {
    right: 50%;
    transform: translateX(50%);
    top: 30px;
  }

  .single-result-box {
    display: block;
  }

  .single-result-image-container {
    width: 100%;
  }

  .single-result-text-container {
    width: 100%;
    float: none;
    padding-left: 0;
    padding-top: 10px;
  }

  .slick-track {
    height: 198.66px !important;
  }

  .room-type-details-image-container .slick-track {
    height: 213.33px !important;
  }

  .enter-res-info-section select {
    width: 100%;
    display: block;
    margin-top: 10px;
  }

  .enter-res-info-section .textarea-container {
    display: block;
  }

  .enter-res-info-section .textarea-container label {
    margin-bottom: 10px;
  }

  .enter-res-info-section .textarea-container label, .enter-res-info-section .textarea-container textarea {
    width: 100%;
  }

  .submit-buttons-container input[type="submit" i] {
    margin-right: 0;
  }

  .res-itinerary, .pricing-summary {
    width: 100%;
    margin-bottom: 20px;
  }

  .res-itinerary {
    padding-right: 0;
  }

  .pricing-summary {
    padding-left: 0;
  }

  #header-container.with-rates-starting #logo {
    top: 10px;
    left: 50%;
    transform: translateX(-50%);
  }

  #header-container.with-rates-starting #rates-starting {
    bottom: 10px;
    left: 50%;
    transform: translateX(-50%);
    display: inline-table;
    font-size: 1em;
  }

  #search-form input {
    margin-left: 0;
  }

  #info-sort-container {
    display: inline-block;
    text-align: center;
  }

  #results-info, .dropdown {
    width: 100%;
    margin: 10px 0;
  }

  #sort-by {
    float: none;
  }
}