/* Restricts the map container to the true 300px width of your image */
.suite-map-wrapper {
  position: relative;
  display: inline-block;
  width: 520px;
  max-width: 100%;
  height: auto;
}

/* Forces image to scale fluidly on smaller screens */
.suite-map-wrapper img {
  width: 100%; !important;
  height: auto; !important;
  display: block;
}

/* Shared hotspot foundation styles */
.room-hotspot {
  position: absolute;
  display: block;
  z-index: 10;
}

/* Optional visual indicator on cursor hover */
.room-hotspot:hover {
  outline: 1px solid #0096ff;
}

/* Individual Room Positions translated from your pixel dimensions */
.suite-a { left: 1.7%;  top: 38.5%; width: 22.7%; height: 55.1%; }
.suite-c { left: 25.0%; top: 34.6%; width: 16.0%; height: 57.7%; }
.suite-3 { left: 53.3%; top: 35.9%; width: 17.3%; height: 29.5%; }
.suite-4 { left: 71.7%; top: 38.5%; width: 15.3%; height: 25.6%; }
.suite-1 { left: 52.3%; top: 65.4%; width: 17.7%; height: 26.9%; }
.suite-2 { left: 70.7%; top: 65.4%; width: 26.0%; height: 29.5%; }

/* Table Link: Default Unvisited State (Red) */
.suite-rates-table td a:link {
  color: #f62d12 !important;
  text-decoration: underline;
}

/* Table Link: Visited State (Dark Grey) */
.suite-rates-table td a:visited {
  color: #555555 !important;
}

/* Table Link: Hover State (Light Red) */
.suite-rates-table td a:hover {
  color: #ff6b6b !important;
  text-decoration: none;
}

table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 4px;
    border: 2px solid grey;   /* The outside border */
}

table td {
    border: 1px solid grey;   /* The inside lines */
  padding: 4px 8px;              /* Adds breathing room inside cells */
}

table td:nth-child(1),
table td:nth-child(2),
table td:nth-child(3) {
    width: 30%;
}

table td:nth-child(4) {
    width: 10%;
}
