html, body {
  height: 100%;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column; /* Stack children vertically */
}

a{
  color: inherit;
  text-decoration: none;
  cursor: pointer !important;
}

a:hover{
  color: blue;
  font-size: 95%;
  cursor: pointer !important;
}
a:visited,a:active{
  cursor: pointer !important;
}

p{
  margin: 10px;
}

.text {
  font-family: 'Times New Roman', Times, serif;
  /* background-color: #f4f4f4; */
  width: 38%; 
  margin: 0; 
}
.text-right {
  font-family: 'Times New Roman', Times, serif;
  /* background-color: #f4f4f4; */
  /* width: 38%;  */
  text-align: right; 
}
.text-centered {
  font-family: 'Times New Roman', Times, serif;
  /* background-color: #f4f4f4; */
  padding-left: 13%;
  padding-right: 13%;
  text-align: center; 
}

.right-side {
  width: 45%; /* Adjust width for proper spacing */
  padding-left: 20px; /* Add spacing between sections */
  font-family: 'Times New Roman', Times, serif;
}

.media {
  flex-grow: 1;
  display: flex;
  margin-left: 150px;
  margin-top: auto;
}

.image-container {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: center;
  align-items: center;
}

.fixed-size-image {
  width: 30%;
  height: 30%;
  object-fit: cover;
}
.graf-images{
  width: 22%;
  height: 22%;
  object-fit: cover;
}

video {
  width: 20%; /* Example video width, adjust as needed */
  height: auto; /* Maintain aspect ratio */
}

.room-vid {
  width: 20%;
}


/* if mobile device max width 480px */
@media only screen and (max-device-width: 480px) {
 .text {
  width: 1200px; /* Full width on mobile */
  text-align: center; /* Center text on mobile */
  margin: 0 auto;
  margin-right: 30%; /* Center the div horizontally */ 
  }
} 