/* Scss Document */
@import url('https://fonts.googleapis.com/css?family=Roboto:100,100i,300,300i,400,400i,500,500i,700,700i,900,900i&display=swap');

$color_violet: #5b2a53;

h1 {
	color: $color_violet;
	text-transform: uppercase;
}

.padd_less {
	padding: 0px;
}

body {
	font-family: 'Roboto', sans-serif;
	font-size: 16px !important;
}

.top_header {
	background-color: #4a2141;
	color: #fff;
}

.cont_phone {

	ul {
		padding-left: 0px;
		list-style: none;
		margin-bottom: 0px;
		padding: 5px;

		li {
			display: inline-block;
			font-weight: 300;
			padding: 5px;
			font-size: 16px;
		}
	}
}

.cont_social {
	ul {
		padding-left: 0px;
		list-style: none;
		margin-bottom: 0px;
		padding: 5px;
		text-align: right;

		li {
			display: inline-block;
			font-weight: 300;
			padding: 5px;
			color: #fff;
			font-size: 18px;

			:hover {
				color: #d61ab8;
			}
		}
	}
}

/*menu_part*/
.menu_part {
	.bg-primary {
		background-color: rgba(0, 0, 0, 0.00) !important;
		position: absolute;
		z-index: 9;
		width: 100%;
		margin-top: 17px;
	}

	.dropdown,
	.dropup {
		position: relative;
		margin-top: 9px;
		color: #fff;
	}

	.dropdown-menu.show {
		background-color: transparent;
		border: none;
		color: #fff;
		font-size: 16px;
	}

	a {
		color: #fff;
		text-decoration: none;
		text-transform: uppercase;
	}
}

.sidenav {
	height: 100%;
	width: 0;
	position: fixed;
	z-index: 1;
	top: 0;
	right: 0;
	background-color: #6b2f5e;
	overflow-x: hidden;
	transition: 0.5s;
	padding-top: 60px;

	ul {
		list-style: none;

		li {
			color: #fff;
			padding: 5px 0px;

			a {
				color: #fff;
			}
		}
	}

}


.sidenav a {
	/*padding: 8px 8px 8px 32px;*/
	text-decoration: none;
	font-size: 14px;
	color: #818181;
	display: block;
	transition: 0.3s;
}

.sidenav a:hover {
	color: #f1f1f1;
}

.sidenav .closebtn {
	position: absolute;
	top: 0;
	right: 25px;
	font-size: 36px;
	margin-left: 50px;
}

@media screen and (max-height: 450px) {
	.sidenav {
		padding-top: 15px;
	}

	.sidenav a {
		font-size: 18px;
	}
}





/*slider*/

.slider_part {
	.carousel-inner img {
		width: 100%;
		height: 100%;
	}

	.carousel-indicators {
		position: absolute;
		top: 20%;
		z-index: 15;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
		right: -68%;

		list-style: none;
		transform: rotate(90deg);

		li {
			position: relative;
			-webkit-box-flex: 0;
			-ms-flex: 0 1 auto;
			flex: 0 1 auto;
			width: 12px;
			height: 12px;
			margin-right: 3px;
			margin-left: 3px;
			text-indent: -999px;
			background-color: rgba(255, 255, 255, .5);
			border-radius: 50%;
		}
	}

}

.booking_body {
	background-color: rgba(255, 255, 255, 0.63);
	border-radius: 5px;
	padding: 15px;

	.btn-normas {
		background-color: #853387;
		border-color: #853387;
		margin-top: 24px;
		color: #fff;
	}
}

/*slider_end*/
.book_part {
	position: fixed;
	top: 40%;
	transform: rotate(90deg);
	left: -19px;
	z-index: 999;

	.btn-danger {
		color: #fff;
		background-color: #853387;
		border-color: #88348a;

		:hover {

			background-color: #b242b5;
			border-color: #89338e;
		}

		:focus {
			background-color: #b242b5;
			border-color: #89338e;
		}
	}
}

.call_action {
	position: fixed;
	top: 57%;

	.call_part {
		background-color: #fff;
		width: 10px;
		border-radius: 30px;
		position: absolute;
		left: -60px;
		height: 30px;
		padding: 5px;
		transition: 0.5s;

		:hover {
			width: 170px;
			left: -6px;
			transition: 0.5s;
			transition: all 400ms cubic-bezier(.62, .1, .5, 1);
			width: 200px;
			border-top-right-radius: 5px;
			border-bottom-right-radius: 5px;
		}

		.fa {
			text-align: right;
			margin-left: 13px;
			background-color: #853387;
			color: #fff;
			width: 35px;
			height: 35px;
			/*position: absolute;*/
			padding: 9px;
			border-radius: 30px;
			top: -3px;
			right: 0;
		}
	}
}


.right-corder-container {
	position: fixed;
	left: 0px;
	top: 50%;
	z-index: 999;
}


.right-corder-container .right-corder-container-button {
	height: 40px;
	width: 40px;
	border: none;
	background-color: #853387;
	transition: all 300ms;
	cursor: pointer;
	border-top-right-radius: 50px;
	border-bottom-right-radius: 50px;
}


.right-corder-container .right-corder-container-button span {
	font-size: 24px;
	color: white;
	position: absolute;
	left: 10px;
	top: 8px;
	line-height: 24px;
}


.right-corder-container .right-corder-container-button:hover {
	transition: all 400ms cubic-bezier(.62, .1, .5, 1);
	width: 250px;
	border-top-right-radius: 5px;
	border-bottom-right-radius: 5px;
}


.right-corder-container .right-corder-container-button .long-text {
	transition: opacity 1000ms;
	opacity: 0;
	color: white;
	white-space: nowrap;
	font-size: 0;
	width: 0;
	margin: 0;
}


.right-corder-container .right-corder-container-button .long-text.show-long-text {
	transition: opacity 700ms,
		width 1ms linear 270ms,
		font-size 1ms linear 270ms;
	opacity: 1;
	margin-top: 2px;
	margin-left: 65px;
	font-size: 20px;
	width: auto;
}

/*about_us_part*/
section.about_us {
	padding: 50px 0px;
}

.about_us_head {
	padding: 50px 0px;

	h1 {
		span {
			width: auto;
			height: 50px;
			position: relative;
			z-index: 1;

			&:before {
				content: "";
				position: absolute;
				left: 0;
				top: 0px;
				height: 1px;
				width: 30%;
				/* percentage of the element width*/
				border-bottom: 4px solid #b11b99;
				margin-top: 1.2em;
				/*move the border below the text*/
				padding-bottom: 10px;
			}
		}
	}

	p {
		padding: 20px 0px;
	}
}


.box {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 500px;
	height: 400px;
	background: rgba(255, 255, 255, 0.00);
	transform-style: preserve-3d;
	transition: 0.5s;
	perspective: 2000px;
}

.text {
	position: absolute;
	top: 30px;
	left: -30px;
	background: #262626;
	width: calc(100% + 60px);
	height: calc(100% - 60px);
	transition: 0.5s;
}

.box::before {
	position: absolute;
	content: '';
	top: 0;
	left: 0;
	border-top: 20px solid #853387;
	border-left: 20px solid #853387;
	background: none;
	width: 100%;
	height: 100%;
	box-sizing: border-box;
}

.box::after {
	position: absolute;
	content: '';
	top: 0;
	left: 0;
	border-bottom: 20px solid #853387;
	border-right: 20px solid #853387;
	background: none;
	width: 100%;
	height: 100%;
	box-sizing: border-box;
}

.box:hover {
	transform: translate(-50%, -50%) rotateY(-30deg) skewY(5deg)
}

.box:hover .text {
	transform: rotateY(30deg) skewY(-5deg);
}

.about_header {
	background-image: url("../img/about_header.jpg");
	padding: 50px 0px;
	color: #fff;
	min-height: 250px;

	h2 {
		margin-top: 150px;
		font-weight: 300;
	}
}

.about_left_box {
	width: 100%;
	height: 100%;
}

.About_us_body {
	padding: 50px 0px;
}

/*our services*/
.our_feture_part {
	.display_part {
		position: relative;

		.dis_broad {
			position: absolute;
			top: 34px;
			background-color: #8d167a;
			padding: 10px;
			width: 56%;
			left: -65px;
			border-radius: 57px;
			text-align: center;
			color: #fff;
			-webkit-box-shadow: -9px 15px 32px -8px rgba(0, 0, 0, 0.3);
			-moz-box-shadow: -9px 15px 32px -8px rgba(0, 0, 0, 0.3);
			box-shadow: -9px 15px 32px -8px rgba(0, 0, 0, 0.3);
		}

		p {
			margin: 0px;
			font-size: 21px;
		}
	}
}

.descip_part {
	padding: 120px 25px;

	h1 {
		span {
			width: auto;
			height: 50px;
			position: relative;
			z-index: 1;

			&:before {
				content: "";
				position: absolute;
				left: 0;
				top: 0px;
				height: 1px;
				width: 30%;
				/* percentage of the element width*/
				border-bottom: 4px solid #b11b99;
				margin-top: 1.2em;
				/*move the border below the text*/
				padding-bottom: 10px;
			}
		}
	}

	p {
		padding: 20px 0px;
		text-align: justify;
	}

	h3 {
		margin-top: 30px;
		color: #8d167a;
	}
}

.to_do {
	.padd_less {
		padding-bottom: 65px;
	}
	.display_part {
		.dis_broad {
			top: 15px;
			left: 15px;
		}
	}
	.descip_part {
		padding: 15px 25px;
		h1 {
			font-size: 1.5rem;
		}
	}
}

/*offer_part*/
.offer_bg {
	background-image: url("../img/offer_bg.jpg");
	padding: 30px 0px;
	color: #fff;
	margin-top: 40px;

	.img_part {
		border: 6px solid #fff;
	}
}

.offer_bg {
	.owl-nav {
		button.owl-prev {
			position: absolute;
			top: 32%;
			left: -20px;

			span {
				font-size: 35px;
			}
		}
	}

	.owl-nav {
		button.owl-next {
			position: absolute;
			top: 32%;
			right: -20px;

			span {
				font-size: 35px;
			}
		}
	}
}


/*footer*/
.footer_part {
	background-color: #DBDADC;
	padding: 40px 0px;

	.f_left_part {
		.btn_newsletter {
			min-height: 50px;
			border-radius: 0;
			background: #731563;
			color: #fff;
			font-weight: 400;
			border: none;
			padding: 8px 28px;
		}

		h4 {
			font-weight: 400;
			color: #777;
		}

		.input-group {
			width: 80%;
		}
	}

	.f_img {
		padding: 20px 0px;

		ul {
			padding-left: 0px;
			list-style: none;

			li {
				display: inline-block;
				vertical-align: top;
				img {
					width: 160px;
				}
				.handicapped {
					img {
						height: 96px;
						width: auto;
					}
				}
				.footer-review-container {
					background: #fff;
					padding: 10px;
					margin-top: 1px;
    				height: 93px;
					width: 236px;
					.logo {
						text-align: center;
						display: flex;
						justify-content: center;
						img {
							width: 24px;
						}
						span {
							margin-left: 5px;
							font-weight: 500;
							font-size: 24px;
						}
					}
					.link {
						display: flex;
    					justify-content: center;
						a {
							background: #731563;
							color: #fff;
							padding: 4px 5px 1px;
							border-radius: 4px;
							text-decoration: none;
						}
					}
				}
			}
		}
	}

	.address_part {
		h4 {
			font-weight: 400;
			color: #777;
		}

		ul {
			padding-left: 0px;
			list-style: none;

			li {
				padding: 3px 0px;
			}
		}

		.social_media {
			ul {
				text-align: left;

				li {
					color: #853387;
					font-size: 18px;

					:hover {
						color: #5a124e;
					}
				}
			}
		}
	}


}

/*contac_us*/
.contact_header {
	background-image: url("../img/cont_header.jpg");
	padding: 50px 0px;
	color: #fff;
	min-height: 250px;

	h2 {
		margin-top: 150px;
		font-weight: 300;
	}
}

.contac_body {
	padding: 50px 0px;

	.contact_details {
		padding: 0px 0px;

		ul {
			list-style: none;
			padding-left: 0px;

			li {
				padding: 4px 0px;
			}
		}

		h3 {
			color: #853387;
		}
	}

	.btn-normas {
		background: #731563;
		color: #fff;
		border-color: #731563;
		padding: 8px 22px;
	}

}

/*health*/
.health_header {
	background-image: url("../img/health_header.jpg");
	padding: 50px 0px;
	color: #fff;
	min-height: 250px;

	h2 {
		margin-top: 150px;
		font-weight: 300;
	}
}

.health_body {
	padding: 30px 0px;

	p {
		padding: 20px 0px;
		text-align: justify;
	}
}

/*restaurants_header*/
.restaurants_header {
	background-image: url("../img/cont_header.jpg");
	padding: 50px 0px;
	color: #fff;
	min-height: 250px;

	h2 {
		margin-top: 150px;
		font-weight: 300;
	}
}

.restaurants_body {
	padding: 30px 0px;

	p {
		padding: 20px 0px;
		text-align: justify;
	}
}

/*meeting*/
.meeting_header {
	background-image: url("../img/meeting_header.jpg");
	padding: 50px 0px;
	color: #fff;
	min-height: 250px;

	h2 {
		margin-top: 150px;
		font-weight: 300;
	}
}

.meeting_body {
	padding: 30px 0px;

	p {
		padding: 20px 0px;
	}
}

.meeting_body {
	padding: 30px 0px;

	p {
		padding: 20px 0px;
		text-align: justify;
	}
}

/*media*/

.media_header {
	background-image: url("../img/media_header.jpg");
	padding: 50px 0px;
	color: #fff;
	min-height: 250px;

	h2 {
		margin-top: 150px;
		font-weight: 300;
	}
}

.media_body {
	padding: 30px 0px;

	.img_name {
		h3 {
			text-transform: uppercase;
		}

		padding: 10px 0px;

		h3 {
			color: #9F1FC1;
			font-weight: 400;
		}
	}
}

.gallry_part img {
	padding: 10px 0px;
}

/*booking*/
.normas_table {
	background-color: #82448c;
	color: #fff;

}

.hotel_bk {
	.media-body {
		padding: 8px;
	}
}

.hotel_type {
	ul {
		padding-left: 0px;
		list-style: none;
	}

	li {
		border-top: 1px solid #ccc;
		background-color: #f4e3f7;
		padding: 5px;
		border-bottom: 1px 1px solid #ccc;
		margin: 5px 0px;
	}
}

.booking_head {
	background-color: #ccc;
	padding: 50px 0px;
}

/*contact*/
.contac_body {
	.form-control {
		display: block;
		width: 100%;
		padding: .375rem .75rem;
		font-size: 1rem;
		line-height: 2.5;
		color: #495057;
		background-color: #fff;
		background-clip: padding-box;
		border: 1px solid #ec52ef;
		/* border-radius: .25rem; */
		transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
	}
}

/*responsive*/
@media (max-width:767px) {
	.cont_social ul {
		text-align: center;
	}

	.navbar-brand {

		img {
			width: 50px;
		}
	}

	.slider_part {
		.carousel-caption {
			display: none;
		}
	}

	h1 {
		font-size: 22px;
	}

	.box {
		position: absolute;
		top: 50%;
		left: 52%;
		transform: translate(-50%, -50%);
		width: 70%;
		height: 225px;
		background: rgba(255, 255, 255, 0.00);
		transform-style: preserve-3d;
		transition: 0.5s;
		perspective: 2000px;
		margin-top: 66px;
	}

	.our_feture_part .display_part .dis_broad {
		left: 0;
	}

	.our_feture_part .display_part p {
		margin: 0px;
		font-size: 13px;
	}

	.descip_part {
		padding: 10px 10px;
	}

	.about_us_head {
		padding-top: 200px !important;
		text-align: justify;
	}
}



.about_us_head {
	padding-top: 93px;
	text-align: justify;
}

.restaurants_header {
	padding: 50px 0px;
	min-height: 250px;

	h2 {
		/*font-size:22px;*/
	}

}

.acco_header {
	background-image: url("../img/media_header.jpg");
	padding: 50px 0px;
	color: #fff;
	min-height: 250px;

	h2 {
		margin-top: 150px;
		font-weight: 300;

	}
}


.acco_body {
	text-align: justify;
}

.contact_details p {
	text-align: justify;
}

.menu_part {
	.navbar-nav {
		font-size: 17px;

	}
}

section.make_booking_header {
	padding: 20px;
}

.booking-engine {
	padding: 30px 0px;
}

#roi-engine-container {
	display: inline-block;
}

.footer-review-container {}

.footer_part .f_img .footer-review-container .logo img {
	width: 24px;
}