@charset "utf-8";







/*

	YASMAK SULTAN - 02/2016






	Front-End Developer: HWT .INTERACTIVE



	Web Site: hwt-i.com



*/







.nav-button {



	float: right;



	margin-top: 12px;



	margin-bottom: 12px;



	cursor: pointer;



	background: url(../images/blank.gif);



	-webkit-transition: all .3s linear;



            transition: all .3s linear;



}



.nav-button:hover {



	opacity: .7;



}



.nav-button:active {



	-webkit-transition: none;



	   -moz-transition: none;



	        transition: none;



}



.nav-button strong {



	float: right;



	margin-left: 8px;



	margin-top: 0px;



	font-family: Arial, Tahoma !important;



	line-height: 26px;



	font-size: 15px;



	font-weight: 400 !important;



	color: #fff;



}



.nav-button .lines {



	position: relative;



	float: left;



	width: 26px;



	height: 2px;



	margin-top: 11px;



	background-color: #fff;



	-webkit-transition: all .3s linear;



            transition: all .3s linear;



}



.nav-button .lines:before,



.nav-button .lines:after {



	position: absolute;



	left: 0;



	width: 100%;



	height: 2px;



	content: "";



	background-color: #fff;



	-webkit-transition: all .3s linear;



            transition: all .3s linear;



	-webkit-transform-origin: 0.28571rem center;



	    -ms-transform-origin: 0.28571rem center;



	        transform-origin: 0.28571rem center;



}



.nav-button .lines:before {



	top: 7px;



}



.nav-button .lines:after {



	top: -7px;



}



.nav-button.open {



	-webkit-transform: scale3d(0.8, 0.8, 0.8);



	    -ms-transform: scale3d(0.8, 0.8, 0.8);



	        transform: scale3d(0.8, 0.8, 0.8);



}



.nav-button.open .lines {



	background-color: transparent;



}



.nav-button.open .lines:before,



.nav-button.open .lines:after {



	top: 0;



	width: 100%;



	-webkit-transform-origin: 50% 50%;



	    -ms-transform-origin: 50% 50%;



	        transform-origin: 50% 50%;



}



.nav-button.open .lines:before {



	-webkit-transform: rotate3d(0, 0, 1, 45deg);



	   -moz-transform: rotate3d(0, 0, 1, 45deg);



	        transform: rotate3d(0, 0, 1, 45deg);



}



.nav-button.open .lines:after {



	-webkit-transform: rotate3d(0, 0, 1, -45deg);



	    -ms-transform: rotate3d(0, 0, 1, -45deg);



	        transform: rotate3d(0, 0, 1, -45deg);



}























































@-ms-viewport {



	width: device-width;



}



































































#outer-wrap {



	overflow: hidden;



	position: relative;



	width: 100%;



}



#inner-wrap {



	position: relative;



	width: 100%;



}



#site-wrap {



	overflow: hidden;



	position: relative;



	z-index: 0;



	width: 100%;



}







.htmlHidden {



	overflow: hidden;



}















#res-background {



	position: fixed;



	left: -100%;



	top: 0;



	z-index: 1;



	width: 100%;



	height: 100%;



	opacity: 0;



	background-color: rgba(255, 255, 255, 0.8);



}



.nav-active #res-background {



	left: 0;



}



html.nav-active,



html.nav-active body {



	overflow: hidden !important;



}















#res-nav {



	overflow: hidden;



	overflow-y: scroll;

	position: fixed;






	top: 0;



	left: -500px;



	z-index: 2;



	width: 300px;



	max-width: 96%;



	height: 100%;



	/*



	padding-right: 10px;



	padding-left: 10px;



	padding-top: 20px;



	padding-bottom: 20px;



	*/



	padding: 0;



	background:



		url(../images/res_bg.png) repeat-y 0 50%,



		url(../images/res_bg_shadow.png) repeat-y 103% 50%



	;



	background-color: #34322f;



}



























#res-nav #navigation {



	display: block;



}



#navigation {



	position: relative;



	display: none;



	height: 100%;



}



#navigation .navigation-inner {



	float: left;



	width: 100%;



}



#navigation .close-btn {



	position: absolute;



	top: 0px;



	right: 10px;



	width: 30px;



	height: 30px;



	border: 1px solid #504d49;



	background: #44413d url(../images/icon-close.png) no-repeat;



	background-size: 100%;



}



#navigation .logo {



	float: left;



	width: 100%;



	margin-top: 30px;



	margin-bottom: 20px;



}



#navigation .logo a {



	display: block;

	width: 120px;






	height: 68px;



	margin: 0 auto;



	text-decoration: none;



	background: url(../images/logo-2x.jpg) no-repeat;



	background-size: 100% 100%;



}







#navigation .mobil-nav {



	position: relative;



	float: left;



	width: 100%;



}



#navigation .mobil-nav a {



	white-space: normal;



}



#navigation .mobil-nav > ul {



	float: left;



	width: 100%;



}



#navigation .mobil-nav > ul > li {



	position: relative;



	float: left;



	width: 100%;



	border-bottom: 1px solid #292724;



}



#navigation .mobil-nav > ul > li:hover,



#navigation .mobil-nav > ul > li.selected {



	background-color: #2b2a28;



}



#navigation .mobil-nav > ul > li > a {



	position: relative;



	display: block;



	padding-left: 10px;



	padding-right: 10px;



	line-height: 52px;



	font-size: 18px;



	font-weight: 400;



	color: #fff;



	text-transform: uppercase;



	text-decoration: none;



	letter-spacing: -0.25px;



	-webkit-transition: all .3s linear;



	        transition: all .3s linear;



}







#navigation .mobil-nav > ul > li:hover > a,



#navigation .mobil-nav > ul > li.selected > a {



	background-color: #232220;



}











#navigation .mobil-nav > ul > li.dropdown > a {



	padding-right: 36px;



}



#navigation .mobil-nav > ul > li.dropdown > a:after {



    position: absolute;



    top: 0px;



    right: 0px;



	width: 50px;



	height: 100%;



    margin-top: 0px;



    content: "";



    background: url(../images/res_dropdown2.png) no-repeat 50%;



	background-size: 14px 8px;



	-webkit-transition: all .3s linear;



	        transition: all .3s linear;



}



#navigation .mobil-nav > ul > li.dropdown:hover > a:after,



#navigation .mobil-nav > ul > li.dropdown.selected > a:after {



	background-image: url(../images/res_dropdown3.png);



}















#navigation .mobil-nav > ul > li > ul {



	overflow: hidden;



	display: none;



	float: left;



	width: 100%;



	padding-right: 10px;



	padding-left: 13px;



}



#navigation .mobil-nav > ul > li > ul > li {



	float: left;



	width: 100%;



	padding-top: 5px;



	padding-bottom: 5px;



}



#navigation .mobil-nav > ul > li > ul > li > a {



	position: relative;



	display: block;



	padding: 5px 0px 2px 15px;



	line-height: 20px;



	font-size: 16px;



	font-weight: 400;



	color: #fff;



	letter-spacing: -0.25px;



	text-decoration: none;



	-webkit-transition: all .3s linear;



            transition: all .3s linear;



}



#navigation .mobil-nav > ul > li > ul > li:hover > a,



#navigation .mobil-nav > ul > li > ul > li.selected > a {



	color: #ffdd26;



}



#navigation .mobil-nav > ul > li > ul > li > a:after {



    position: absolute;



	top: 50%;



	left: 0px;



	width: 6px;



	height: 6px;



	margin-top: -3px;



    content: "";



    background-color: #fff;



	-webkit-transition: all .3s linear;



	        transition: all .3s linear;



}



#navigation .mobil-nav > ul > li > ul > li:hover > a:after,



#navigation .mobil-nav > ul > li > ul > li.selected > a:after {



	background-color: #ffdd26;



}











#navigation .mobil-nav > ul > li > ul > li > ul {



	overflow: hidden;



	display: block !important;



	float: left;



	width: 100%;



	padding-right: 0;



	padding-left: 16px;



}



#navigation .mobil-nav > ul > li > ul > li > ul > li > a {



	position: relative;



	display: block;



	padding: 2px 0px 2px 15px;



	line-height: 18px;



	font-size: 14px;



	font-weight: 400;



	color: #f5f5f5;



	letter-spacing: -0.25px;



	text-decoration: none;



	-webkit-transition: all .3s linear;



            transition: all .3s linear;



}



#navigation .mobil-nav > ul > li > ul > li > ul > li:hover > a,



#navigation .mobil-nav > ul > li > ul > li > ul > li.selected > a {



	color: #ffdd26;



}



#navigation .mobil-nav > ul > li > ul > li > ul > li > a:after {



    position: absolute;



	top: 50%;



	left: 0px;



	width: 4px;



	height: 4px;



	margin-top: -3px;



    content: "";



    background-color: #f5f5f5;



	-webkit-transition: all .3s linear;



	        transition: all .3s linear;



}



#navigation .mobil-nav > ul > li > ul > li > ul > li:hover > a:after,



#navigation .mobil-nav > ul > li > ul > li > ul > li.selected > a:after {



	background-color: #ffdd26;



}



































#navigation .bottom-nav {



	position: absolute;



	bottom: 0;



	left: 0;



	width: 100%;



	height: 44px;



	padding: 10px 10px;



	text-align: center;



	border-top: 1px solid #504d49;



	background-color: #44413d;



}



#navigation .bottom-nav > div {



	display: inline-block;



	height: 100%;



}



#navigation .bottom-nav a {



	position: relative;



	float: left;



	margin-right: 8px;



	margin-left: 8px;



	line-height: 24px;



	font-size: 14px;



	font-weight: 400;



	color: #c5c1c1;



	text-decoration: none;



	letter-spacing: -0.25px;



	-webkit-transition: all .3s linear;



			transition: all .3s linear;



}



#navigation .bottom-nav a.selected {



	color: #fff;



}



















#navigation .socials {



	float: left;



	width: 100%;



	height: 29px;



	margin: 20px 0 0px;



	text-align: center;



}



#navigation .socials > div {



	display: inline-block;



}



#navigation .socials a {



	overflow: hidden;



	position: relative;



	float: left;



	width: 29px;



	height: 29px;



	margin-right: 2px;



	margin-left: 2px;



	background: url(../images/res_social_icon-2x.jpg) no-repeat;



	background-size: auto 28px;



	-webkit-transition: all .3s linear;



	        transition: all .3s linear;



}



#navigation .socials a:hover {opacity: 0.7}



#navigation .socials a.fb {background-position: 0px 0;}



#navigation .socials a.tw {background-position: -34px 0;}



#navigation .socials a.gp {background-position: -68px 0;}



#navigation .socials a.in {background-position: -102px 0;}



#navigation .socials a.yt {background-position: -136px 0;}



#navigation .socials a.li {background-position: -170px 0;}



#navigation .socials a.pi {background-position: -204px 0;}



#navigation .socials a.wt {background-position: -238px 0;}















































#header .res-bar {



	display: none;



	position: relative;



	z-index: 1;



	height: 70px;



	padding: 10px 0;



	background-color: #34322f;



	box-shadow: 0px 4px 10px -2px rgba(0, 0, 0, 0.25);



}



#header .res-bar .grid_2 {



	width: 16.66666667%;



}



#header .res-bar .grid_8 {



	width: 66.66666667%;



}



#header .res-bar .logo {



	float: left;

	width: 88px;






	height: 50px;



	margin: 0;



}



#header .res-bar .logo a {



	display: block;



	width: 100%;



	height: 100%;



	background-image: url(../images/logo-2x.jpg);



	background-size: 100% 100%;



}



















@media (max-width: 1220px) {







	.container_12 {



		width: 96%;



	}







	.grid_1,.grid_2,.grid_3,.grid_4,.grid_5,.grid_6,.grid_7,.grid_8,.grid_9,.grid_10,.grid_11,.grid_12 {



		width: 100%;



		margin-left: 0;



		margin-right: 0;



		padding-right: 0;



		padding-left: 0;



	}







	#site-wrap {



		padding-top: 70px;



	}



	.homepage .fp-viewing-0 #header .res-bar {



		background-color: transparent;



		box-shadow: none;



	}



	#header .top-bar,



	#header .bottom-bar {



		display: none;



	}



	#header .res-bar {



		display: block;



	}















	#main-slider .tp-banner {



		width: 100%;



	}



	#main-slider .wlt {



		bottom: 10px !important;



		right: 20px !important;



	}



	#main-slider .mouse-scroll {



		display: none;



	}











	.section .container_12 {



		width: 100%;



	}



	.section .grid_6 {



		width: 50%;



	}



	.section .text-cloumn {



		padding-right: 20px !important;



		padding-left: 20px !important;



	}



















	#footer,



	#footer .fp-tableCell,



	#footer .inner {



		height: auto !important;



	}



	#footer .grid_4 {



		height: auto;



		padding-top: 40px;



		padding-left: 20px;



		padding-right: 20px;



	}



	#footer .grid_4:before {



		content: none;



	}











	#footer .socials a {



		background-image: url(../images/footer_social_icon-2x.png);



		background-size: 310px 32px;



	}















	.sub-header h1 {



		font-size: 36px;



	}



	.sub-header h2 {



		position: relative;



		top: auto;



		right: auto;



		margin-left: 0;



	}



	.room-container .content-inner {



		position: relative;



		top: auto;



		left: auto;



	}



	.room-container .gbtn {



		top: -60px;



		bottom: 0;



		width: 100%;



	}



	.room-container .container_12 {



		width: 100%;



	}



	.room-container .text-cloumn {



		float: left;



		width: 100%;



		padding: 20px 30px;



	}



	.room-container:nth-child(even) .text-cloumn,



	.room-container:nth-child(even) .text-cloumn:after,



	.room-container:nth-child(even) .detail-cloumn {



		background-color: #f5f5f5;



	}



	.room-container .detail-cloumn .description {



		padding-right: 0;



	}



	.room-container.open-detail .description:after {



		display: none;



	}



















.contactpage .text-cloumn {



	width: 50%;



	padding: 20px;



}



















#main-reservation {



	background-color: #fff !important;



}



#main-reservation .oc-btn {



	background-color: #d0d0d0 !important;



}

#main-buttons {
	top: auto;
	bottom: 30px;
	left: 10px;
	right: auto !important;
}
#main-buttons a.main-button {
	right: auto !important;
	left: 0;
}
#main-buttons a.main-button.btn1 {
    margin-right: 0;
	top: auto;
	bottom: 50px;
}
#main-buttons a.main-button.btn2 {
    margin-left: 70px;
	top: auto;
	bottom: 0;
}








#partners .grid_12 {
	padding-left: 400px;
}
#partners .grid_12 .text-cloumn {
	width: 360px;
}

























}







































































@media (max-width: 960px) {







.section .contact .list li {



	width: 32%;



	margin-right: 2%;



}



.section .contact .list li:last-child {



	margin-right: 0;



}



.section .contact .list li img,



.section .contact .list li div {



	height: 40px;



}



.section .contact .list li div {



	padding-left: 10px;



}



.section .contact .list li span {



	font-size: 20px;

}


#partners .grid_12 {
	padding-left: 380px;
}
#partners .grid_12 .text-cloumn {
	width: 340px;
}







}























































@media (max-width: 840px) {



.contactpage #contact-map {



	height: auto;



}



.contactpage #contact-map #map {



	height: 400px;



}



.contactpage #contact-map .container_12,



.contactpage #contact-form .container_12 {



	width: 100%;



}



.contactpage .content-inner {



	position: relative;



	top: auto;



	left: auto;



}



.contactpage .text-cloumn {



	float: left;



	width: 100%;



}











#contact-form .text-cloumn,



#contact-form .form-cloumn {



	width: 100%;



}



#contact-form .form-cloumn {



	background-color: #34322f;



}



















.scdown #main-reservation.open {



	height: auto;



	margin-left: 0;



	-webkit-transform: translateX(-50%);



	    -ms-transform: translateX(-50%);



	        transform: translateX(-50%);



}



.scdown #main-reservation.open .open-content {



    width: 374px;



}



#main-reservation .re-content {



	padding-top: 15px;



}



#main-reservation .open-content .form li.special {



	width: 100%;



	margin-top: 10px;



}



#main-reservation .open-content .form li.obtn {



	position: relative;



	right: auto;



	top: auto;



	width: 100%;



	height: auto;



	margin-top: 10px;



}



#main-reservation .open-content .form li.child {



	margin-right: 0;



}






#partners .grid_12 {
	padding-left: 360px;
}
#partners .grid_12 .text-cloumn {
	width: 320px;
}













}



















































































































@media (max-width: 768px) {







































	.section .grid_6 {



		width: 100%;



		height: 50% !important;



	}



	.section .image-container,



	.section .image-container figure {



		height: 100% !important;



	}















	.section._2s .left-to-text .text-cloumn .td {



		padding-right: 0;



	}



	.section._2s .right-to-text .text-cloumn .td {



		padding-left: 0;



	}



	.section .tripadvisor-list .text-cloumn {



		width: 100%;



	}



	.section .tripadvisor-list .owl-carousel .item {



		padding: 65px 0 0 0;



		background-position: 50% 0;



		background-size: auto 70px;



	}



	.section .tripadvisor-list .owl-carousel .owl-stage-outer {



		padding-bottom: 38px;



	}



	.section .tripadvisor-list .owl-carousel .owl-prev,



	.section .tripadvisor-list .owl-carousel .owl-next {



		bottom: 0;



	}















.section h3 {



	font-size: 22px;



}



.section p {



	line-height: 1.2;



	font-size: 14px;



}







.section .contact h2 {



	font-size: 26px;



}



.section .contact address {



	font-size: 15px;



}



.section .contact .list li {



	width: 100%;



	margin-right: 0;



	margin-bottom: 20px;



}



.section .contact .list li:after {



	content: none;



}







.section .owl-carousel .owl-prev,



.section .owl-carousel .owl-next {



	right: 36px;



	width: 32px;



	height: 32px;



	margin-top: -16px;



	background-size: auto 18px;



}



.section .owl-carousel .owl-next {



	right: 0;



}



.section._2s .right-to-text .owl-carousel .owl-next {



	left: 36px;



}











.section .title-container h4 {



	padding-bottom: 2px;



	line-height: 24px;



	font-size: 20px;



}



.title-container h5 {



	line-height: 20px;



	font-size: 15px;



}



.section .title-container .discount {



	font-size: 32px;



}



.four-boxs .title-container h4 {



	line-height: 1.2;



	font-size: 22px;



}















.section .four-boxs .owl-carousel .owl-nav {



	position: absolute;



	right: 0;



	top: 50%;



}







.section .four-boxs .owl-carousel .owl-prev {



	bottom: 36px;



}

#main-buttons a.main-button {
	right: auto !important;
	left: 0;
}
#main-buttons a.main-button.btn1 {
	margin-right: 0;
	top: auto;
	bottom: 46px;
	width: 80px;
	height: 80px;
	    font-size: 14px;
    padding: 23px 5px;
}
#main-buttons a.main-button.btn1 span {
    font-size: 10px;
}
#main-buttons a.main-button.btn2 {
	margin-left: 40px;
	top: auto;
	bottom: 0;
	width: 64px;
	height: 64px;
	padding: 20px 0px 10px;
	font-size: 10px;
}






#partners,
#partners .inner,
#partners .content-inner,
#partners .text-cloumn {
	height: auto !important;
}
#partners .inner {
	float: left;
}
#partners .grid_12 {
	padding-left: 0;
}
#partners .grid_12 .text-cloumn {
	position: relative;
	left: auto;
	top: auto;
	width: 100%;
}
#partners .content-inner {
	position: relative;
	left: auto;
	top: auto;
}
#partners .item h2 {
	font-family: 'FuturaBT_Medium';
	font-size: 28px;
}
#partners .item .address {
	font-size: 16px;
}
#partners-map {
	display: none;
}







}



































































@media (max-width: 640px) {











#header .res-bar .res-reservation-btn a {



	padding: 13px 0 13px 26px;



	line-height: 24px;



	font-size: 13px;



	background-size: 20px auto;



}











	#main-slider .wlt h4,



	#main-slider .wlt p {



		font-size: 14px;



	}







	#footer .socials a {



		margin-right: 2px;



		margin-left: 2px;



	}



























































}



























































@media (max-width: 480px) {







#header .res-bar .grid_2 {



    width: 25%;



}



#header .res-bar .grid_8 {



    width: 50%;



}







#header .res-bar .logo {

	width: 70px;

	height: 40px;

	margin-top: 5px;

}



















.room-container .features {



	width: 100%;



	margin: 0;



}











#contact-form .form-cloumn .form {



	width: 90%;



	margin-left: 5%;



	margin-right: 5%;



}































.scdown #main-reservation.open {



	height: auto;



	margin-left: 0;



	-webkit-transform: translateX(-50%);



	    -ms-transform: translateX(-50%);



	        transform: translateX(-50%);



}



#main-reservation .re-content {



	padding-top: 8px;



	padding-bottom: 8px;



}



.scdown #main-reservation.open .open-content {



    width: 202px;



}



#main-reservation .open-content .form li {



	height: 72px;



	background-size: 16px auto;



}



#main-reservation .open-content .form li > span.b {



	line-height: 24px;



	font-size: 20px;



}



#main-reservation .open-content .form li._dp {



    margin-bottom: 10px;



}



#main-reservation .open-content .form li.nights,



#main-reservation .open-content .form li.child {



	margin-right: 0;



}



#main-reservation .open-content .form li.special > span.a {



	line-height: 20px;



	font-family: 'FuturaBT_Light', Arial, Tahoma;



	font-size: 16px;



	letter-spacing: 0;



}



#main-reservation .open-content .form li.obtn {



	width: 100%;



	height: auto;



	margin-top: 10px;



	margin-bottom: 0;



}



#main-reservation .open-content .form li.obtn .b1 {



	padding: 0 5px;



	line-height: 28px;



	font-size: 16px;



}























}











































































@media (max-width: 400px) {











.nav-button .lines {



	width: 20px;



}



.nav-button strong {



	margin-left: 4px;



	font-size: 12px;



}







#header .res-bar .res-reservation-btn a {



	padding: 15px 0 15px 22px;



	line-height: 20px;



	font-size: 11px;



	background-size: 18px auto;



}











}























































@media (max-width: 340px) {















}