div .controls {
all:unset;
}

.akengage-comment-submit-btn{
    float:left;
}

.ex_cat:hover{
background: url("/images/excited_cat_sm.gif") 100% no-repeat;
-webkit-transform: scaleX(-1);
transform: scaleX(-1);
overflow: visible;
}

#ex_cat{
    display: none;
}

#ex_cat_dark{
    display: block;
}

/*rooms table*/
table.rooms {
    width: 100%;
    border-collapse: collapse;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    background-color: white;
}

table.rooms th {
    font-weight: bold;
    text-transform: uppercase;
    border-bottom: 2px solid #003366;
    text-align: left;
    padding: 0px;
}

table.rooms tr:nth-child(even) {
    background-color: #f4f4f4;
}

table.rooms tr:hover {
    background-color: #e0e0e0;
}

table.rooms td {
    border-bottom: 1px solid #ccc;
}
/* Add subtle transitions */
table.rooms tr, table.rooms td {
    transition: background-color 0.3s ease-in-out;
}

    /* The container holds the image and the overlay in a relative position */
    .floor3-container, .floor2-container, .floor1-container, .groundfloor-container {
      position: relative;
      width: 100%;
      max-width: 725px;
      margin: 0 auto;
    }
    
    /* The floor plan image */
    .floor-image {
      width: 100%;
      display: block;
      border-radius: 10px;
      box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    }
    
    /* This overlay covers the entire image */
    .overlay {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      pointer-events: none;  /* Allows clicks to pass through if needed */
    }
    
    /* Common styles for each cell overlay */
    .overlay .cell {
      position: absolute;
      background-color: rgba(255, 255, 255, 0.85);
      
      font-size: 0.4em;
      font-weight: bold;
      padding: 2px 5px;
      border: 1px solid #ccc;
      border-radius: 4px;
      text-align: center;
    }

.vacant {
    color: red;
    font-weight: bold;
    }
    
    /* Example positioning for each cell.
       Adjust these percentage values to position the overlays exactly over the room numbers in your image. */
    .cell.room23 {
      top: 52%;
      left: 18%;
      transform: translate(-50%, -50%);
    }
    .cell.room22 {
      top: 82%;
      left: 18%;
      transform: translate(-50%, -50%);
    }
    .cell.room21 {
      top: 15%;
      left: 20%;
      transform: translate(-50%, -50%);
    }
    .cell.room20 {
      top: 86%;
      left: 28%;
      transform: translate(50%, -50%);
    }
    .cell.room19 {
      top: 15%;
      left: 24%;
      transform: translate(50%, -50%);
    }
      .cell.room18 {
      top: 40%;
      left: 8%;
      transform: translate(50%, -50%);
    }
    .cell.room17 {
      top: 12%;
      left: 10%;
      transform: translate(50%, -50%);
    }
    .cell.room16 {
      top: 20%;
      left: 20%;
      transform: translate(50%, -50%);
    }
    .cell.room15 {
      top: 40%;
      left: 22%;
      transform: translate(50%, -50%);
    }
    .cell.room14 {
      top: 30%;
      left: 34%;
      transform: translate(50%, -50%);
    }
    .cell.room13 {
      top: 12%;
      left: 42%;
      transform: translate(50%, -50%);
    }
    .cell.room12 {
      top: 40%;
      left: 46%;
      transform: translate(50%, -50%);
    }
    .cell.room11 {
      top: 12%;
      left: 50%;
      transform: translate(50%, -50%);
    }
    .cell.room10 {
      top: 12%;
      left: 68%;
      transform: translate(50%, -50%);
    }
    .cell.room1 {
      top: 20%;
      left: 80%;
      transform: translate(-50%, -50%);
    }    
    .cell.room2 {
      top: 78%;
      left: 54%;
      transform: translate(-50%, -50%);
    }
    .cell.room3 {
      top: 22%;
      left: 56%;
      transform: translate(-50%, -50%);
    }
    .cell.room9 {
      top: 20%;
      left: 40%;
      transform: translate(-50%, -50%);
    }
    .cell.room8 {
      top: 80%;
      left: 56%;
      transform: translate(-50%, -50%);
    }
    .cell.room7 {
      top: 20%;
      left: 54%;
      transform: translate(-50%, -50%);
    }
    .cell.room6 {
      top: 40%;
      left: 66%;
      transform: translate(-50%, -50%);
    }
    .cell.room5 {
      top: 80%;
      left: 84%;
      transform: translate(-50%, -50%);
    }
    .cell.room4 {
      top: 20%;
      left: 86%;
      transform: translate(-50%, -50%);
    }