/*-------------------- Root --------------------------*/
:root {
	--wdth-x1:130px;
	font-size:15px;

}
@media screen and (max-width: 768px){
	:root {
		font-size:14px;
	}
}
/* Scrollbar*/
::-webkit-scrollbar{
	width:8px;
}
::-webkit-scrollbar-track{
	background-color:#fff;
}
::-webkit-scrollbar-thumb{
	background-color:var(--color-primary-dark) !important;
}
::-webkit-scrollbar-thumb:hover{
	background-color:var(--color-primary-light) !important;
}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
    opacity: 1;
}

input[type=number]::-webkit-outer-spin-button, 
input[type=number]::-webkit-inner-spin-button {
	-webkit-appearance: inner-spin-button !important;
	min-width: 50px !important;
	position: absolute;
	top: 0 !important;
	bottom:0 !important;
	right: 0 !important;
	height: 100% !important;
	background:#f00 !important;
	display:none;
}
.form-check-input:checked {
    background-color: var(--color-primary);
    border-color: var(--color-primary);
}
.form-check-input{
	width: 1.2em;
    height: 1.2em;
	border: var(--bs-border-width) solid var(--color-secondary);	
}
.form-check-input, .form-check label{
	cursor: pointer;
}
img{
	border-radius:8px !important;
}
/*----------- Edit On BootStrap -----------------------*/
@media (min-width: 576px) {
    .container, .container-sm {
        max-width: 100%;
    }
}
@media (min-width: 1200px){
	.container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl, .container-fluid {
		max-width: 1024px;
	}
}

a{
	text-decoration: unset;
	color:unset;
}
.dropdown-item:focus, .dropdown-item:hover{
	background-color:unset;
	color:var(--color-primary);
}
[type=email], [type=number], [type=tel], [type=url] {
    direction: unset;
}
.dropdown-item{font-weight: 300;}
.navbar-toggler{border:0}
.i-dropdown .dropdown-menu[data-bs-popper]{
	left:unset;
	right:0;
}
html:lang(ar) .i-dropdown .dropdown-menu[data-bs-popper]{
	left:0;
	right:unset;
}
/*
#bookRoom .form-control, #contactHotel .form-control{
	background: unset;
	border: 1px solid #eee;
}
*/
.form-control:focus{
	border-color:rgba(var(--color-primary-rgb), 0.05);
	box-shadow: 0 0 0 .15rem rgba(var(--color-primary-rgb), 0.15);
}
.input-group .btn{
	background: rgba(var(--color-primary-rgb), 0.15);
	border: 1px solid #eee;
}
.modal {
    --bs-modal-width: 700px;
	z-index: 9999999;
}
.modal-content .form-control{
	padding: .8rem .75rem;
}
.table>:not(caption)>*>*{
	border:0;
}
.table-striped>tbody>tr:nth-of-type(odd)>*{
	--bs-table-bg-type: #fbfbfb;
}
/*-------------------- i-css ------------------------- */
body{
	background-color: unset;
	line-height: 2;
}
html:lang(ar) body{direction: rtl;}
	
html:lang(ar) .bi-telephone { transform: rotateY(180deg);}
html:lang(ar) .bi-chevron-double-right{ transform: rotateY(180deg);}
#main-wrapper, #profile-wrapper{
	min-height:800px;
	position:relative;
	top:15px;
}
#main-wrapper{
	background-color: #fff;
}
#profile-wrapper{
	background-color: #fff;
}
.customBTN, .customBTN-1{
	border-radius: 5px;
	border: 0;
	font-size: 13px;
	padding: 7px 30px;
	cursor: pointer;
	min-width: 125px;
	text-align: center;
	letter-spacing: .25px;
}
.customBTN:disabled{
	background: #eee;
    border: 1px solid #999;
    color: #999;
}
.customBTN {   
    background: linear-gradient(29deg, #4fe9d8, #036458);      
    color: #fff;
}
.customBTN-1 {
	background: unset;
    color: #000000;
    border: 2px solid var(--color-primary);
}
.customBTN, .customBTN-1{
	background: #00c7b1;
	color: #fff;
}
.white-btn{
	background: #ffffff;
    color: #091179;
}
.bg-f53{
	background: #f53;
}
.header_contact i{
	border: 1px solid;
    padding: 3px 10px;
    border-radius: 50%;
}
/*custom Border*/
.cb-t {
	border-top:3px solid #eee;
}
.cb-b {
	border-bottom:3px solid #eee;
}
.notvalid{
	border:1px solid var(--color-red)
}
/*Header*/
header{
	background: var(--color-white);
	box-shadow: 0 1px 8px rgba(0, 0, 0, .05);
}
.header .logo img {
    width: 180px;
}

.navbar{
	padding:15px 0;
	border-bottom: 0px solid #009688;
}
.navbar .bi-list {
	font-size: 30px;
}

.i-menu .dropdown-toggle{
	position: relative;
    z-index: 999999;
	padding:0px;
 }
.i-menu .dropdown-menu{
	position: absolute;
	padding: 0;
    border: 0;
    top: -29px;
    z-index: 99999;
	padding-top: 90px;
    width: 300px;
    max-height: 100vh;
    overflow-y: auto;
	box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
	border-radius: 0px 0px 2px 2px;
	margin: 0 -20px;
 }
.i-menu .dropdown-menu li{
    margin: 0 20px;
}
.i-menu .dropdown-menu li:last-child {
    background-color: var(--color-primary);
    margin: 0;
    padding: 0 15px 0 15px;
    border: 0;
    background-image: none;
} 
.i-menu .dropdown-menu li a{
	border-bottom: 1px solid #eee;
	padding:10px;
}
.i-menu .dropdown-menu li:last-child a {
	border:0;
	color:var(--color-white);
}
.i-menu .dropdown-toggle::after{
	content:unset;
}
.i-menu img{
	z-index: 999999;
}
.i-menu .dropdown-menu img{
	width: 25px;
    padding: 0px 0px;
    margin-left: 15px;
}
@media screen and (max-width: 768px) {
	.navbar{padding:10px 0}
	.header .logo img{width: 160px;}
	.search-nav{
		width:100%;
		position: absolute;
        top: 72px;
		left:0;
		right:0;
	}
	.navbar-collapse{
		padding: 10px 20px;
		background: rgb(255, 255, 255);
		border-bottom: 5px solid #009688;
	}
}
@media screen and (max-width: 567px) {
	.navbar{padding:10px 0}
	.header .logo img{width: 130px;}
}
.navbar-expand-lg .bi-search-collapse::before {
	content: "\f62a";
	font-size: calc(1.375rem + 1.5vw) !important;
}
.navbar-expand-lg .collapsed::before {
    content: "\f52a";
	font-size: calc(1.00rem + 1.5vw) !important;
}
.dropdown span{
	background: rgba(var(--color-primary-rgb), 0.15);
    padding: 5px 15px;
    border-radius: 13px;
    font-size: 13px;
	cursor: pointer;
}
.btnContact, .btnBook{
	color:var(--color-cyan);
	cursor:pointer;
}
.footer1, .footer2{
	position: relative;   
    padding: 20px 0px;
	color:#fff;
	top: 120px;
}
.footer1{
	background: rgb(0 150 136 / 5%);
	background:#1a2b49;
	padding-bottom: 55px;
	
}
.footer2{
	background: #222;
}
.footer-img{
	max-width:250px;
}
/*----------- Search Bar ----------------*/
.search-nav ._searchBar{
	margin: 0 !important;
	padding: 0 !important;
	border-bottom : 0 !important;
}
.search-nav ._searchBar .form-control{
	height: 40px;
    margin-bottom: 0;
	padding:2px 10px !important;
	min-width: 150px;
	border-radius: 15px;
}
.search-nav ._searchBar .customBTN{
	min-width: 60px;
}
.search-nav ._searchBar .customBTN{
	background: rgba(var(--color-primary-rgb), 0.15);
	border: 0;
	color: #000;
}
@media (max-width: 768px) {
	.search-nav ._searchBar .form-control{
		margin:10px;
	}
	.search-nav{
		box-shadow: 0 8px 4px rgba(0, 0, 0, .150);
	}
}
.bi-search-collapse{
	background: rgba(var(--color-primary-rgb), 0.15);
	color: #000;
	font-weight: bold;
}
/*-------- Breadcrumbs ---------*/
.breadcrumbs {
    padding: 25px 0 5px 0;
    min-height: 40px;
}
.breadcrumbs ol {
    display: flex;
    list-style: none;
    padding: 0;
    margin: 0;
    font-size: 14px;
	white-space: nowrap;
    overflow-x: auto;
    padding-bottom: 15px;
}
.breadcrumbs ol li+li::before {
    display: inline-block;
    padding-right: 10px;
	padding-left: 10px;
    color: var(--color-secondary-light);
    content: "›";
}
html:lang(ar) ..breadcrumbs ol li+li::before { transform: rotateY(180deg);}
.breadcrumbs li{
	color:var(--color-secondary-light);
}
.breadcrumbs a{
	color:var(--color-secondary);
}
.breadcrumbs li:last-child a {
    pointer-events: unset;
    color: var(--color-secondary-light);;
}
/*------search bar -------*/
._searchBar .form-control{
	height:50px;
	margin-bottom:8px;
}
select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    cursor: pointer;
    padding-left: 12px;
    background-image: url(dropdown.png);
    background-repeat: no-repeat;
    background-position: 100% 50%;
}
html:lang(ar) select{
	background-position: 5% 50%;
}
/*-------- SHow Items ---------*/
._showItems .dropdown{
	border-bottom: 1px solid #eee;
    padding-bottom: 30px;
	display: flex;
    justify-content: end;
}
._searchBar .dropdown h2 {
    background: unset;
    padding: 6px 20px;
    border-radius: 2px;
    font-size: 16px;
    border: 1px solid var(--color-primary-light);
    min-width: 150px;
	cursor: pointer;
}
._showItems .imageSimilarHotels{
	background: #f5f6f7;
    display: flex;
    align-items: center;
	min-height: 150px;
	max-width: 30%;
	border: 1px solid #eee;
}
@media screen and (max-width: 768px) {
	._showItems .imageSimilarHotels{
		min-height: 150px;
		max-width: 40%;
	}
}
@media screen and (max-width: 567px) {
	._showItems .imageSimilarHotels{
		min-height: 100px;
		max-width: 100%;
	}
}
._showItems ._Item{
	border-bottom: 1px solid #eee;
    padding-bottom: 25px;
	font-size: .95rem;
}
._showItems ._Item:last-of-type{
	border-bottom: 0px;
	padding-bottom: 0px;
	padding-bottom: 0px !important;
}
@media screen and (max-width: 992px) {
	._showItems .customBTN{
		font-size: 13px;
        padding: 7px 10px;
	}
}
@media screen and (max-width: 768px) {
	._showItems .customBTN{
		font-size: 11px;
		padding: 7px 10px;
	}
}
@media screen and (max-width: 567px) {
	._showItems .customBTN{
		font-size: 12px;
		padding: 7px 5px;
	}
}
._showItems ._Item .hotelStars{
	color: var(--color-custom);
    display: flex;
	justify-content: start;
    gap: 3px;
    font-size: 13px;
    padding-top: 6px;
}
._showItems .bi-telephone, ._showItems .bi-geo-alt{
	border: 1px solid #eee;
    padding: 1px 5px;
    border-radius: 50%;
}
._showItems .facility::before{
	content: "\f287";
    border-radius: 50%;
    font-family: bootstrap-icons !important;
    font-size: 4px;
    padding: 5px;
    color: var(--color-custom);
}

/*---- Profile Page -----*/
.imageProgile{
	background: #fdfdfd;
    display: flex;
    align-items: center;
	height:100px;
	max-width: 200px;
}
.imageProgile img{
	max-height:100%;
}
._sbi {
    /*background: #f9f9f9;*/
    padding: 3px 7px;
    border-radius: 6px;
	font-size:12px;
}
.Social {
    padding: 2px 0 2px 10px;
}
@media screen and (max-width: 768px) {

	.profileHeader .title{
		padding-top:10px;
	}
}
.sociaShare{
	display: flex;
    justify-content: start;
    align-items: center;
    gap: 12px;
    border-top: 2px solid rgba(210, 201, 210, .52);
    padding-top: 20px;
    margin-top: 20px;
}
.sociaShare i{
	padding: 3px 10px;
    border: 1px solid var(--color-primary);
    border-radius: 50%;
    font-size: 18px;
    cursor: pointer;
    color: var(--color-primary);
}
.hotelStars{
	color: var(--color-custom);
    display: flex;
    justify-content: center;
    gap: 3px;
	margin: 0;
}

li::marker{
	color: var(--color-primary);
	content : "\f12a";
	font-family: bootstrap-icons !important;
}
nav li::marker{
	content : "";
}
.ul{ list-style-type: none;}
.hotelDesc li{padding-top:15px}

.imageSimilarHotels{
	background: #f5f6f7;
    display: flex;
    align-items: center;
	min-height: 60px;
	max-width: 80px;
	border: 1px solid #eee;
}
/*-- show * Hide UL Item List */
._ulItems{
	border-bottom: 1px solid #eee;
    padding-bottom: 20px;
	font-size: .95rem;
}
._ulItems:last-of-type{
	border-bottom: 0px;
	padding-bottom: 0px;
}
._ulItems p span:first-child{
	margin-top: -6px;
}
._ulItems .hotelStars{
	color: var(--color-custom);
    display: flex;
	justify-content: start;
    gap: 2px;
    font-size: 11px;
    padding-top: 6px;
}
._hideULItem{
	margin:0 !important;
	height:0;
	overflow:hidden;
	-webkit-transform:translateY(-20%);
	border: 0;
    padding: 0;
}
._showULItem{	
	-webkit-transform:translateY(-200%);
    -moz-transform:translateY(-200%);
    transform:translateY(0%);
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
	/*height:100%;*/

}
/*-- tables --*/
.rates_table{}

.rates_table tbody td, .fx-rate-table thead th {
    border: 1px solid #e7ebff;
    font-weight: 700;
    line-break: auto;
    line-height: 2.0rem;
}
.rates_table thead th {
	border: 1px solid #e7ebff;
    background: var(--color-primary-dark);;
    color: #fff;
    overflow: visible;
    /*white-space: pre-wrap;*/
	/*line-height: 2.0rem;*/
	vertical-align: middle;
}
.rates_table thead th span{
	font-size:11px
}
/*-- Calculators-- */

._span11{
	font-size: 11px !important;
    font-weight: 300;
}
#exchangerate, #goldCalculator{
	background: #333;
    color: #fff;
}
#fromCurrency, #toCurrency{
	background : #454545;
	color : #fff;
	border:0;
}
#fromAmount, #amount{
	background : #888;
	color : #fff;
	height:33px
}
#swap{
	display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
}
._ulItems_1,  ._ulItems_2{
    border-bottom: 1px solid #eee;
    padding-bottom: 20px;
    font-size: .85rem;
}
._hideULItem {
    margin: 0 !important;
    height: 0;
    overflow: hidden;
    -webkit-transform: translateY(-20%);
    border: 0;
    padding: 0;
	display: none;
}
._showULItem {
    -webkit-transform: translateY(-200%);
    -moz-transform: translateY(-200%);
    transform: translateY(0%);
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
	display: table-row;
}

/*------ General Classes------*/
._flexCenter{
	display: flex !important;
    align-items: center !important;
}






.mod_head{
	display: flex;
    justify-content: space-between;
	background: var(--color-primary);
    padding: 10px 15px;
    border-right: 6px solid #FFC107;
    margin: 20px 0;
    font-size: 18px;
    font-weight: 700;
    border-radius: 21px 0px 0px 42px;
    color: #fff;
}
.mod-1 .card-img, .mod-1 .card-img-top{
	max-height:200px;
}
.title{
	font-weight: 700;
	line-height: 1.9rem;
}
/*--- MOD-1 ---*/
.mod-1 .mod_body:first-child{
	width:70%
}
.mod-1 .mod_body:first-child img{
	width:100%
}
.mod-1 .mod_body:first-child .title{
	font-size:25px !important;
	color:#000;
	font-weight: 700;
	line-height: 1.8;
}
@media screen and (max-width: 768px){
	.mod-1 .mod_body:first-child{
		width:100%
	}
	.mod-1 .card-img, .mod-1 .card-img-top{
		max-height:110px;
	}
	.mod-1 .mod_body:first-child img{
		max-height:unset;
	}
}
@media screen and (min-width: 768px){
	.mod-1 .mod_body:first-child img{
		max-height:unset;
	}
}
/*--- MOD-2 ---*/
@media screen and (max-width: 768px){
	.mod-2 .mod_body:first-child{
		width:100%
	}
	.mod-2 .mod_body{
		display: flex;
        align-items: center;
        margin: 5px 0;
        
	}
	.mod-2 img{
		max-width:40%;
		width:40%;
		margin-left: 20px;
	}
}
/*--- MOD-3 ---*/
.mod-3 .mod_body:first-child {
	margin-bottom:10px;
}
.mod-3 .mod_img{
	position: relative;
	display: flex;
	align-items: center;
	margin: 5px 0;
}
.mod-3 img{
	width:35%;
	margin-left: 20px;
}
.mod-3 .mod_body:first-child img{
	width:100%
}	
.mod-3 .mod_body:first-child .mod_img:before{
	content: "";
	position: absolute;
	width: 100%;
	bottom: 0;
	height: 70%;
	z-index: 1;
	background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.85) 100%);
	border-radius: 0 0 10px 10px;
		
}
.mod-3 .mod_body:first-child .title{
	position: absolute;
    bottom: 10px;
    color: #fff;
    z-index: 2;
    font-size: 20px !important;
    padding: 10px;
}
.mod-3 .card-img-top{
	border-radius: 10px !important;
}	
@media screen and (max-width: 768px){

}
/*--- MOD-4 ---*/
.mod-4 .mod_body{
	width:33%
}
.mod-4 .mod_body:first-child, .mod-4 .mod_body:nth-child(2){
	width:50%
}
@media screen and (max-width: 768px){
	.mod-4 .mod_body:first-child, .mod-4 .mod_body:nth-child(2){
		width:100%;
		display: block;
	}
	
	.mod-4 .mod_body{
		width:100%
	}
	.mod-4 .mod_body{
		display: flex;
        align-items: center;
        margin: 5px 0;
        
	}
	.mod-4 img{
		max-width:40%;
		width:40%;
	}
	.mod-4 .title{
		padding-right: 20px;
	}
	.mod-4 .mod_body:first-child img, .mod-4 .mod_body:nth-child(2) img{
		width:100%;
		max-width:100%;
	}
}
/*--- MOD-5 ---*/
.mod-5 .mod_head{
	display:block;
}
.mod-5 .mod_head img{
	width:30px;
	margin-left: 10px;
}
.mod-5 .mod_body {
	display: flex;
	align-items: center;
	margin: 8px 0;
}
.mod-5 .mod_img{
	position: relative;
	display: flex;
	align-items: center;
	margin: 5px 0;
}
.mod-5 img{
	width:28%;
	margin-left: 20px;
}
/* News Content*/
h1{
	line-height: 1.7 !important;
	font-weight: 700 !important;
}
._u i{
	border: 1px solid #009688;
    padding: 0px 5px;
    border-radius: 10px;
    margin-left: 10px;
    background: #009688;
    color: #fff !important;
    font-size: 18px;
}
.content strong{
    color: #009688;
}
#main-wrapper {
    background-color: #fff; 
}
.content blockquote{
	color:#a8a8a8;
	line-height: 1.8;
	padding-right: 15px;
}
.content blockquote-xxx {
	margin: 0 0 1rem;
    background: #2f2b37;
    padding: 18px;
    line-height: 1.8;
    border-right: 9px solid #FF9800;
    color: #fff;
    margin-right: 10px;;
}
.content p, .content div{
	line-height: 1.9;
    margin: 1.5rem 0;
}
.content li{
	line-height: 1.5;
    padding: 0.5rem 0;
}
.share_sc{
	position: relative;
}
.share_sc ._fix{
	position: absolute;
    left: 0;
    bottom: -25px;
    border-top: 1px solid #FFEB3B;
    width: 100%;
	color: #009688;
}
/* ----- */
.iForm{
	background: #eee;
    padding: 37px;
    border-radius: 10px;
}