* {
  margin: 0rem;
  padding: 0rem;
  box-sizing: border-box;
}
a {
  text-decoration: none;
}
img {
  width: 100%;
  height: 100%;
}
body {
  max-width: 1800px;
  margin: auto;
  background: beige;
}
a {
  width: fit-content;
}
/* navigation */
nav {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.9rem;
  width: 100%;
  background: white;
  border-bottom: 1px solid lightgray;
}
.name {
  font-size: 2rem;
  font-weight: bold;
  font-family: "Trebuchet MS", "Lucida Sans Unicode", "Lucida Grande",
    "Lucida Sans", Arial, sans-serif;
}
/* rooms */
.roomsWrapper {
  padding: 2rem 0rem;
}
.executive{
  background-image: url("https://cf.bstatic.com/xdata/images/hotel/max1024x768/299811847.jpg?k=f0a0957424da7ba18cd93063de0213003ff06d230d653fda81ad7e3f8fc4dc5e&o=&hp=1");
}
.deluxeDouble{
  background-image: url("https://cf.bstatic.com/xdata/images/hotel/max1024x768/250610118.jpg?k=56fc0685bbdb3a6e49e4b4a9e3e67b5ee1527194c05bfaa24a5732f61f78299d&o=&hp=1");
}
.studioSuite{
  background-image: url("https://cf.bstatic.com/xdata/images/hotel/max1024x768/333547868.jpg?k=e24cdb7cb12a23879f23343099c32b27adea2481b244b2536c4e842d198f0348&o=&hp=1");
}
.ClassicFamily{
  background-image: url("https://cf.bstatic.com/xdata/images/hotel/max1024x768/195135911.jpg?k=dc90da5d9be107fb3a2361198083fab989fd18057e59eb9ac868bb4b046d87ae&o=&hp=1");
}
.room {
  height: 25rem;  
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  height: 23rem;
  color: white;
  padding-bottom: 1rem;
  cursor: pointer;
}
.container {
  width: 60%;
  margin-left: 5rem;
  margin-bottom: 5rem;
}
.info {
  padding: 0.5rem;
  width: 97%;
  margin: auto;
  margin-top: -5rem;
  color: white;
  border-top: 2px solid white;
  display: flex;
  align-items: center;
  font-family:sans-serif;
}
.info p {
  margin-left: auto;
  font-size: 1.18rem;
}
/* footer */
footer {
  background: rgba(0, 0, 0, 0.89);
  color: white;
  padding: 2.4rem 0rem;
  font-family:sans-serif;
  /* font-family:'inter'; */
}
.footerLinks1 {
  display: flex;
  align-items: center;
  justify-content: center;
}
.footerLinks1 h3 {
  margin: 2rem;
  font-weight: bolder;
}
.socialsWrapper {
  display: flex;
  align-items: center;
  margin-left: 1rem;
}
.sm {
  width: 1.8rem;
  margin: 0.4rem;
}
.footerLinks2 {
  display: flex;
  align-items: center;
  justify-content: space-around;
  padding-bottom: 2rem;
}
.copywright,
.subscribeText {
  font-weight: bolder;
}
input,
.send {
  outline: none !important;
  border: none;
  padding: 0.56rem;
  box-shadow: 0px 0px 1px 1px darkgrey;
}
.subscribeWrapper {
  display: flex;
  align-items: center;
}
.cpy {
  font-weight: bolder;
}
.subscribeWrapper .send {
  background-color: beige;
  color: black;
  width: 2.97rem;
  height: 2.13rem;
}
.send button {
  font-weight: bolder;
  background: none;
  outline: none !important;
  border: none;
}
@media (max-width: 1441px) {
  .container {
    margin: auto;
    margin-bottom: 4rem;
  }
}
@media (max-width: 1229px) {
  .footerLinks1 {
    flex-wrap: wrap;
  }
  .container {
    width: 82%;
  }
}
@media (max-width: 851px) {
  .socialsWrapper {
    margin-left: 0rem;
  }
  .sm {
    margin: 0rem 0.3rem;
  }
  .footerLinks1 h3 {
    margin: 1rem 1.4rem;
  }
  .info {
    padding: 0.5rem;
    width: 97%;
    margin: auto;
    margin-top: -4rem;
  }
  .info p {
    font-size: 1.18rem;
  }
}
@media (max-width: 742px) {
  .room {
    height: 21rem;
  }
  .footerLinks2 {
    flex-wrap: wrap;
  }
  .copywright {
    margin: 2rem;
  }
}
@media (max-width: 688px) {
  .container {
    width: 90%;
  }
}
@media (max-width: 578px) {
  .container {
    width: 92%;
  }
  .room {
    height: 18rem;
  }
  .info {
    padding: 0.3rem;
    margin-top: -3rem;
  }
}
@media (max-width: 471px) {
  .container {
    margin-bottom: 3rem;
  }
  .room {
    height: 16rem;
  }
  .info {
    padding: 0.1rem;
  }
}
@media (max-width: 405px) {
  .name {
    font-size: 1.72rem;
  }
}
@media (max-width: 393px) {
  .room {
    height: 14rem;
  }
  .info {
    padding: 0.3rem;
    margin-top: -2.8rem;
  }
}
@media (max-width: 387px) {
  .none {
    display: none;
  }
}
@media (max-width: 370px) {
  .room {
    height: 12.5rem;
  }
   .info h2{
    font-size: 1.35rem;
  }
  .info p{
    font-size: 1rem;
  }
}
@media (max-width: 334px) {
  .container3 a .info h2{
    /* font-size: 1.30rem; */
    line-height: 1.15rem;

  } 
}
