@import url('https://fonts.googleapis.com/css2?family=Aboreto&family=Poppins:wght@300;400;500;600&display=swap');
html{
	scroll-behavior: smooth !important;
}
body{
	font-family: 'Poppins', sans-serif;
}
.top{
	position: fixed;
	top: 0;
	left: 0;
	z-index: 1000;
}
.homebg{
	height: 100vh;
	background-color: rgba(255,255,255,0.2);
	margin-top: 8rem;
}
@media screen and (max-width: 991px){
      .homebg{
	height: 140vh;
}
    }
.homebg .text{
	position: absolute;
	top: 50%;
	left: 300px;
}
.homebg .container-form{
	position: absolute;
	bottom: 0;
	left: 50%;
	transform: translateX(-50%);
}
.homebg .text h2{
	font-size: 3.25rem;
}
.homebg .text h2,.homebg .text p,.homebg .text button{
	color: #E5E7E9;
}
.homebg .text p{
	font-family: 'Aboreto', cursive;
	letter-spacing: 1px;
}

.homebg .text button{
	border: 1px solid #E5E7E9;
	padding: 0.55rem;
	font-weight: 300;
	transition: 0.3s;
}
.homebg .text button:hover{
	background-color: #E5E7E9 !important;
	color: #6d4c41;
}





.roomsbg{
	background-image: url(../../images/bghome.jpg);
	background-position: center;
	background-size: cover;
	height: 50vh;
	margin-top: 3.3rem;
	display: grid;
	place-items: center;
}
.roomsbg .text h4{
	font-size: 2rem;
	color: #E5E7E9;
}



.fs p{
	font-family: 'Aboreto', cursive;
	letter-spacing: 1px;
}
.fs i,.footer h5{
	color: #6d4c41;
}
.footer .fas{
	width: 25px;
	color: #E5E7E9;
}
.footer{
	padding: 7rem 0;
	border-top: 1px solid rgba(0,0,0,0.1);
	background-color: #222222;
}
.footer .btn{
	background-color: #6d4c41;
}
.footer p{
	color: #E5E7E9;
	font-size: 15px;
}
.rooms .text{
	position: absolute;
	bottom: 0;
	left: 20px;
}
.rooms .each-rooms button{
	position: absolute;
	background-color: #E5E7E9;
	right: 10px;
	top: 10px;
	font-size: 10px;
	opacity: 0;
	visibility: hidden;
	transition: 0.4s;
	z-index: 10;
	box-shadow: none;
}
.rooms .each-rooms:hover button{
	opacity: 1;
	visibility: visible;
}
.rooms .each-rooms img{
	transition: 0.5s;
}
.rooms .each-rooms img:hover{
	transform: scale(1.2);
}
.count{
	background-color: red;
	display: grid;
	place-items: center;
	width: 16px;
	height: 17px;
	font-size: 12px;
	font-weight: bold;
	border-radius: 50%;
	color: #fff;
	padding-left: 1px;
	position: absolute;
	top: -7px;
	left: 9px;
}
.countreserved{
	background-color: green;
	display: grid;
	place-items: center;
	width: 16px;
	height: 17px;
	font-size: 12px;
	font-weight: bold;
	border-radius: 50%;
	color: #fff;
	padding-left: 1px;
	position: absolute;
	top: 2px;
	right: 0px;
}
#toast-container > div{
	opacity: 1 !important;
}
@media screen and (max-width: 1300px){
	.homebg .text{
		left: 200px;
	}
}

@media screen and (max-width: 1024px){
	.homebg .text{
		left: 80px;

	}
}

@media screen and (max-width: 992px){
	.homebg .text{
		left: unset;
		text-align: center;
	}
	.container-form form{
		display:  unset !important;
	}
}