/*=============================================
HABITACIONES
=============================================*/

.habitaciones{
	position: relative;
	width: 100%;
	margin: auto;
	background: white;
	padding-bottom: 50px;
}

.habitaciones h1{
	text-align: center;
	font-weight: bold;
	margin-top: 50px;
	margin-bottom: 50px;
	color: #666;
}

.habitaciones .row{
	margin-left: 0px;
	margin-right: 0px;
}

.habitaciones .card{
	border-radius: 10px;
	overflow: hidden;
	margin-bottom: 20px;
}

.habitaciones .card img{
	width: 100%;
	height: 250px;
	object-fit: cover;
}

.habitaciones .card h3{
	font-weight: bold;
	margin-top: 10px;
	font-size: 20px;
	margin-bottom: 10px;
}

.habitaciones .card h5{
	font-weight: bold;
	font-size: 16px;
	margin-bottom: 10px;
}

.habitaciones .card p{
	line-height: 1.5;
	margin-bottom: 10px;
	color: #777;
}

.habitaciones .card .btn{
	width: 100%;
	border-radius: 5px;
	margin-top: 10px;
}

.habitaciones .card .precio{
	font-size: 16px;
	font-weight: bold;
	margin-bottom: 10px;
}

.habitaciones .card .estrellas{
	color: #FFCC29;
	margin-bottom: 10px;
}

.habitaciones .card .estrellas i{
	margin-right: 3px;
}

.habitaciones .card .categoria{
	font-size: 14px;
	color: #777;
	margin-bottom: 10px;
}

.habitaciones .card .descripcion{
	font-size: 14px;
	color: #777;
	margin-bottom: 10px;
}

.habitaciones .card .caracteristicas{
	font-size: 14px;
	color: #777;
	margin-bottom: 10px;
}

.habitaciones .card .caracteristicas i{
	margin-right: 5px;
	color: #47BAC1;
}

.habitaciones .card .disponibilidad{
	font-size: 14px;
	color: #47D03E;
	margin-bottom: 10px;
}

.habitaciones .card .no-disponibilidad{
	font-size: 14px;
	color: #FC4850;
	margin-bottom: 10px;
}

.habitaciones .card .reservar{
	background: #47BAC1;
	color: white;
	font-weight: bold;
	border: none;
	padding: 10px 0;
	border-radius: 5px;
	margin-top: 10px;
	cursor: pointer;
	transition: 0.3s;
}

.habitaciones .card .reservar:hover{
	background: #2F4F4F;
}

.habitaciones .card .ver-mas{
	background: #FFCC29;
	color: white;
	font-weight: bold;
	border: none;
	padding: 10px 0;
	border-radius: 5px;
	margin-top: 10px;
	cursor: pointer;
	transition: 0.3s;
}

.habitaciones .card .ver-mas:hover{
	background: #e6b800;
}

/*=============================================
HABITACIÓN DETALLE
=============================================*/

.habitacion-detalle{
	position: relative;
	width: 100%;
	margin: auto;
	background: white;
	padding-bottom: 50px;
}

.habitacion-detalle h1{
	text-align: center;
	font-weight: bold;
	margin-top: 50px;
	margin-bottom: 50px;
	color: #666;
}

.habitacion-detalle .row{
	margin-left: 0px;
	margin-right: 0px;
}

.habitacion-detalle .imagen-principal{
	width: 100%;
	height: 400px;
	object-fit: cover;
	border-radius: 10px;
	margin-bottom: 20px;
}

.habitacion-detalle .galeria{
	margin-bottom: 20px;
}

.habitacion-detalle .galeria img{
	width: 100%;
	height: 150px;
	object-fit: cover;
	border-radius: 5px;
	margin-bottom: 10px;
	cursor: pointer;
	transition: 0.3s;
}

.habitacion-detalle .galeria img:hover{
	opacity: 0.8;
}

.habitacion-detalle .info{
	margin-bottom: 20px;
}

.habitacion-detalle .info h3{
	font-weight: bold;
	margin-top: 10px;
	font-size: 24px;
	margin-bottom: 10px;
}

.habitacion-detalle .info h5{
	font-weight: bold;
	font-size: 18px;
	margin-bottom: 10px;
}

.habitacion-detalle .info p{
	line-height: 1.5;
	margin-bottom: 10px;
	color: #777;
}

.habitacion-detalle .info .precio{
	font-size: 18px;
	font-weight: bold;
	margin-bottom: 10px;
}

.habitacion-detalle .info .estrellas{
	color: #FFCC29;
	margin-bottom: 10px;
}

.habitacion-detalle .info .estrellas i{
	margin-right: 3px;
}

.habitacion-detalle .info .categoria{
	font-size: 16px;
	color: #777;
	margin-bottom: 10px;
}

.habitacion-detalle .info .descripcion{
	font-size: 16px;
	color: #777;
	margin-bottom: 10px;
}

.habitacion-detalle .info .caracteristicas{
	font-size: 16px;
	color: #777;
	margin-bottom: 10px;
}

.habitacion-detalle .info .caracteristicas i{
	margin-right: 5px;
	color: #47BAC1;
}

.habitacion-detalle .info .disponibilidad{
	font-size: 16px;
	color: #47D03E;
	margin-bottom: 10px;
}

.habitacion-detalle .info .no-disponibilidad{
	font-size: 16px;
	color: #FC4850;
	margin-bottom: 10px;
}

.habitacion-detalle .info .reservar{
	background: #47BAC1;
	color: white;
	font-weight: bold;
	border: none;
	padding: 10px 20px;
	border-radius: 5px;
	margin-top: 10px;
	cursor: pointer;
	transition: 0.3s;
}

.habitacion-detalle .info .reservar:hover{
	background: #2F4F4F;
}

.habitacion-detalle .info .volver{
	background: #FFCC29;
	color: white;
	font-weight: bold;
	border: none;
	padding: 10px 20px;
	border-radius: 5px;
	margin-top: 10px;
	cursor: pointer;
	transition: 0.3s;
}

.habitacion-detalle .info .volver:hover{
	background: #e6b800;
}

/*=============================================
TABLET HORIZONTAL (LG revisamos en 1024px)
=============================================*/

@media (max-width:1199px) and (min-width:992px){

	.habitaciones .card img{
		height: 200px;
	}

	.habitacion-detalle .imagen-principal{
		height: 350px;
	}

	.habitacion-detalle .galeria img{
		height: 120px;
	}

}

/*=============================================
TABLET VERTICAL (MD revisamos en 768px)
=============================================*/

@media (max-width:991px) and (min-width:768px){

	.habitaciones .card img{
		height: 180px;
	}

	.habitacion-detalle .imagen-principal{
		height: 300px;
	}

	.habitacion-detalle .galeria img{
		height: 100px;
	}

}

/*=============================================
MÓVIL HORIZONTAL (SM revisamos en 576px)
=============================================*/

@media (max-width:767px) and (min-width:576px){

	.habitaciones .card img{
		height: 200px;
	}

	.habitacion-detalle .imagen-principal{
		height: 250px;
	}

	.habitacion-detalle .galeria img{
		height: 80px;
	}

}

/*=============================================
MÓVIL VERTICAL (revisamos en 320px)
=============================================*/

@media (max-width:575px){

	.habitaciones .card img{
		height: 180px;
	}

	.habitacion-detalle .imagen-principal{
		height: 200px;
	}

	.habitacion-detalle .galeria img{
		height: 60px;
	}

}