@media all and (max-width: 1650px){
	#rooms .room_picture{
		width:100%;
	}

	#rooms .room_title{
		width: 70%;
	}

	#rooms .room_rates{
		padding: 10px 0 0 10px;
		width: 75%;
	}

	#services .service_picture{
		width:100%;
	}

	#services .services .service_title{
		width: 70%;
	}

	#services .services .service_rates{
		padding: 10px 0 0 10px;
		width: 75%;
	}
}

@media all and (max-width: 1500px){
	#search label{
		width:100%;
		margin: 0 0 10px
	}

	#checkout .details div label{
		width: 100%;
		padding-bottom: 10px
	}

	#checkout .details hgroup span{
		width: 50%;
		padding-top: 0
	}

	#search label {
     padding: 0; 
	}
}

@media all and (max-width: 1200px){
	#search_html_banner{
		width: 77%;
	}

	#rooms{
		width:77%;
	}

	#services{
		width:77%;
	}

	#hotel_amenities{
		width:77%;
	}

	#room_price{
		right: auto;
		left: 20px;
		width: 20%;
		z-index: 1
	}

	#checkout, #guest{
		width: 48%
	}

	#guest .info{
		border: none;
		padding: 0
	}

	.col2{
		width: 100% !important;
		margin-top: 10px
	}
}

@media all and (max-width: 1100px){
	#room_popup{
		width: 100%
	}

	#room_popup .photos, #room_popup .details{
		width: 45%;
		margin-right: 2.5%
	}

	#congrats #checkout{
		width: 100%
	}

	#search.central{
		width: 20%;
	}

	#search.central + #result{
		width: 78%;
	}
}

@media all and (max-width: 900px){
	#room_price, #room_price .btn{
		padding:10px;
	}

	#search div{
		float: none;
		width: 100%
	}

	#payments{
		width: 100%
	}

	#gotop{
		display: none !important;
	}
}

@media all and (max-width: 750px){
	input[type="color"],
	input[type="date"],
	input[type="datetime"],
	input[type="datetime-local"],
	input[type="email"],
	input[type="month"],
	input[type="number"],
	input[type="password"],
	input[type="search"],
	input[type="tel"],
	input[type="text"],
	input[type="time"],
	input[type="url"],
	input[type="week"],
	select,
	textarea {
		font-size: initial !important;
	}
	
	#rooms .room_rates, #services .service_rate, #checkout, #guest, #rooms .room_picture, #rooms .room_title, #rooms .rate_qty, #room_popup .photos, #room_popup .details{
		width:100% !important;
	}

	#search, #room_price{
		width: 150px !important;
	}

	#search_html_banner{
		width:calc(100% - 170px);
		float: right;
	}

	#rooms{
		width:calc(100% - 170px);
		float: right;
	}

	#rooms .rooms{
		margin-bottom: 20px
	}

	#rooms .rooms > div {
		width: 100%;
	}
	
	#rooms .room_title{
		margin: 10px 0
	}

	#rooms .room_rates {
		padding: 0px;
	}
	
	#rooms .room_rates .rates>div{
		width: 50%
	}

	#services{
		width:calc(100% - 170px);
		float: right;
	}

	#services .services{
		margin-bottom: 20px
	}
	
	#services .services > div {
		width: 100%;
	}

	#services .services .service_title{
		margin: 10px 0;
		width: 100%;
	}

	#services .services .service_rates{
		padding: 0px;
		width: 100%;
	}

	#services .service_rate >div{
		width: 100%;
	}

	#services .service_qty {
		width: 100% !important;
	}

	#services .qty_pax select, 
	#services .qty_pax input {
		height: auto;
	}

	#hotel_amenities{
		width:calc(100% - 170px);
		float: right;
	}

	#hotel_amenities .contenedor {
	    -webkit-column-count: 2;
	    -moz-column-count: 2;
	    column-count: 2;
	}

	#checkout{
		margin: 10px 0 !important
	}

	#checkout hgroup p, #checkout .actions{
		float: none;
		margin: 10px 0
	}
	
	#hotel_intro .cols{
		display: block;
	}

	#hotel_intro .slider, #hotel_intro .info{
		width: 100%;
		float: none
	}

	#hotel_intro .info .hidden{
		min-height: 50px;
	}
}

@media all and (max-width: 600px){
	/* header h1 a{
		background-size: contain !important;
	} */

	#search form, #checkout hgroup{
		padding: 10px
	}

	#search{
		position: relative !important;
		top: 0 !important;
		left: 0 !important;
		width: 100% !important;
	}

	#room_price{
		position: relative !important;
		top: 10px !important;
		left: 0 !important;
		width: 100% !important;
	}

	#search_html_banner{
		width: 100% !important;
		float: none;
		margin: 10px 0 !important;
	}

	#rooms{
		width: 100% !important;
		float: none;
		margin: 10px 0 !important;
	}

	#rooms .rooms > div {
	    width: 100%;
	}

	#rooms .qty_pax strong{
		text-align: left;
	}

	#services{
		width: 100% !important;
		float: none;
		margin: 10px 0 !important;
	}

	#services .services > div {
	    width: 100%;
	}

	#services .qty_pax strong{
		text-align: left;
	}

	#hotel_amenities{
		width: 100% !important;
		float: none;
		margin: 10px 0 !important;
	}

	#search h2, #rooms h2, #services h2{
		text-align: center;
		padding: 0.5em
	}

	#payments.methods{
		width: 100%
	}

	#checkout label{
		width: 100%;
		margin-top: 10px
	}

	#checkout .details div{
		padding: 10px 20px
	}

	#checkout .details div span, #checkout .details div label, #checkout .details div p, #checkout h4 label, #checkout h5 label{
		width: 100%;
		padding: 0;
		text-align: left;
	}

	#checkout .details div .tip, #congrats h5 strong, #checkout h4, #checkout h5{
		text-align: left;
		width: 100%
	}

	#room_price{
		display: none
	}

	#room_price.active{
		display: inline-block;
		margin-bottom: 10px
	}

	#room_price_link.active{
		display: block;
	}

	#hotel_amenities .contenedor {
	    -webkit-column-count: 1;
	    -moz-column-count: 1;
	    column-count: 1;
	}

	.hide_mobile{
		display: none
	}

	#hotel_intro{
		margin: 0;
		padding: 20px 10px;
	}

	#search h2, #hotel_intro .cols{
		display: none;
	}
}

@media (max-width: 515px) {
	#payments table {
		display: flex;
	}

	#payments table .cards {
		display: flex;
		height: 100%;
		flex-direction: column;
		justify-content: space-between;
	}

	#payments tr.odd {
		background: #ededed;
		display: flex;
		flex-direction: column;
		align-items: center;
	}

	#payments tr {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: space-between;
		min-width: 150px;
	}

	#payments tr.cards {
		min-width: 80px;
	}

	#payments tr.cards:first-child {
		margin-bottom: 5px;
	}

	#payments tbody {
		display: flex;
		height: 100%;
		overflow-x: auto;
	}

	#payments th,
	#payments td {
		height: 20%;
	}

	#payments table thead tr.cards td,
	#payments table tbody tr td {
		height: 100%;
	}
}