body {
	font-family: 'Roboto', sans-serif;
	background: #eddfbf;
	min-width: 320px;
}

body.home .main-container {
    overflow: inherit;
    background: url('../img/background.jpg') 50% 0% no-repeat;
    background-size: contain;
    border-top: 10px solid #ffa019;
}

body.page .main-container {
	overflow: inherit;
	background: #eddfbf;
}

svg:not(:root) {
    display: block;
}


.bg-primary {
	background-color: #14549b !important;
}

.bg-secondary {
	background-color: #ff9600 !important;
}


.feature-box.background-image-holder.overlay:before {
    background-color: #14549b;
}

.nav-container {
	top: 0;
    position: absolute;
    z-index: 100;
    width: 100%;
}

.nav-container:after {
	display: block;
	content: "";
	height: 150px;
	width: 100%;
	position: absolute;
	background: url('../img/shadow.png') 50% 0% repeat-x transparent;
	margin-top: 1px;
	pointer-events: none;
}

.top-bar {
    background: rgba(0,47,117,0.7);
    border-bottom: 1px solid transparent;
    height: 80px;
}

.top-bar.nav-sticky {
    background: rgba(20,84,175,1);
    /*background: rgba(255,150,0,0.9);*/
    border-bottom: 1px solid rgba(255,255,255,1);
}

.top-bar.nav-sticky:after {
    display: none;
}

.top-bar .nav-menu {
    padding-top: 0;
    display: flex;
    align-items: center;
    height: 80px;
 }

.top-bar .logo {
    bottom: 0px;
    max-width: initial;
}


.top-bar.overlay-bar .menu li a {
    color: #FFF;
}

.top-bar.overlay-bar .subnav li a {
    color: #777777;
}

.top-bar.nav-sticky .logo-wide {
    bottom: 0 !important;
}

.top-bar.nav-sticky .menu li a {
    padding-bottom: 10px;
}

/* top menu */

.menu > li > a {
    font-weight: 100;
    font-size: 16px;
    letter-spacing: 0;
    color: #000;
    padding-bottom: 10px;
    line-height: 14px;
}

.menu > li {
	transition: all ease-in 0.3s;
	border-bottom: 2px solid transparent;
}

.menu > li.selected,
.menu > li:hover {
	border-bottom: 2px solid #ff9600;
}

.menu .has-dropdown:after {
    font-family: Fontawesome;
    content: "\f107";
    color: #FFF !important;
}

.menu.mobile .has-dropdown:after {
    content: none;
}

.menu .subnav {
    z-index: 2;
    padding: 0;
}

.menu .has-dropdown {
    bottom: 0;
}


.menu .subnav li {
    min-width: 200px;
}

.menu .subnav li a {
	display: block;
	padding: 10px 20px !important;
	margin-bottom: 0;
    font-weight: 300;
    font-family: "Open Sans", serif;
}

.menu .subnav li a:hover {
	background: #ff9600;
	color: #FFF;
}

.menu.mobile {
	display: none;
	transition: all ease-in 0.3s;
}

.menu.mobile .icon:before {
	content: "\f0c9";
}

.menu.mobile.open .icon:before {
	content: "\f00d";
}

.menu.mobile > li:hover {
	border-bottom: 2px solid transparent;
}

.menu.mobile .subnav {
	position: relative;
	opacity: 0;
}

.menu.mobile .subnav li {
	float: none;
	width:100%;
    padding: 10px;
    border-bottom: 1px solid rgba(255,255,255,0.5);	
}

header.fullscreen-element .overlay:before {
    background-color: transparent;
}

header:after {
	display: block;
	content: "";
	height: 150px;
	width: 100%;
	position: absolute;
	background: url('../img/shadow.png') 50% 0% repeat-x transparent;
	transform:scaleY(-1);	
	bottom: 0;
}

header .title {
	/*background: url('../img/clouds.png') 50% 50% no-repeat transparent;*/
	display: flex;	
    flex-direction: column;
    align-items: flex-start;	
}

header .title span {
	display: inline-block;
	width: auto;
	background: #ff9600;
	padding: 20px 30px;
	margin-left: 30px;
	font-size: 20px;
	color: #FFF;
	font-weight: 100;
}

header .title span.stars {
	display: flex;
	justify-content: space-between;
	min-width: 20%;
}

header .title h1 {
	background: #14549b;
	padding: 40px 30px;
	font-size: 30px;
	color: #FFF;
	display: inline-block;
	line-height: 1.2;
	font-weight: 500;
	text-transform: uppercase;
	min-width: 50%;
	margin: 0;
}

header.short {
	background: url('../img/header-short.jpg') 50% 0% no-repeat;
	display: flex;
	align-items: flex-end;
	height: 400px;
}

header.short .title h1 {
	background: #ff9600;
	padding: 30px;
	margin-bottom: 40px;
}


.subheader {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 80px;
	background: #FFF;
	position: relative;
	width: 100%;
    z-index: 1;
    padding: 10px 0;
}

.subheader:after {
	display: block;
	height: 10px;
	background: url('../img/shadow-small.png') 50% 0% no-repeat;
	content: "";
    position: absolute;
    bottom: -10px;
    z-index: 3;
    width: 100%;	
}

.subheader .container {
	height: inherit;
	/*width: auto;*/
	display: inline-flex;
	align-items: center;
}

.subheader .breadcrumb {
    padding:0;
    margin:0;
    background: transparent;
}

.subheader ul.nav {
	margin: auto;
}

.subheader ul.nav-pills>li {
    float: inherit;
    display: inline-block;
}

.subheader.nav-sticky {
	top: 80px;
	min-height: 50px;
}

.subheader.reservation.short.nav-sticky {
	height: auto;
	padding-top: 10px;
    padding-bottom: 10px;
}

.subheader.reservation.short.nav-sticky .form-control,
.subheader.reservation.short.nav-sticky .btn {
	height: 40px;
	font-size: 16px;
}

.subheader.reservation.short.nav-sticky .form-group {
    margin-bottom: 5px;
}

.subheader ul.nav li a {
	color: #000;
	text-transform: uppercase;
}

.subheader ul.nav li a:focus,
.subheader ul.nav li a:hover {
    text-decoration: none;
    background-color: #14549b;
    color: #FFF;
}

.subheader.nav-sticky li a {
	padding: 0px 10px;
}

/* SECTIONS */

section,
section:nth-of-type(odd),
section:nth-of-type(even) {
	overflow: inherit;
    background: transparent;
    padding-top: 60px;
    padding-bottom: 60px;
}

section .container {
	/*width: 980px;*/
}

section.featured {
	position: relative;
	padding: 0;
	background: transparent;
}

section.featured .content {
	height: 360px;
	overflow: hidden;
	display: flex;
	align-items: flex-end;
	background: url('../img/section-bg.jpg') 50% 50% no-repeat;
	background-size: cover;
	padding: 20px 0;
	position: relative;
    z-index: 2;		
}

section.featured:before {
	display: block;
    content: attr(title);
    width: 200px;
    height: 60px;
    position: absolute;
    left: 0;
    right: 0;
    background: #FFF;
    z-index: 3;
    margin: auto;
    font-size: 25px;
    font-weight: 700;
    text-align: center;
    line-height: 60px;
	font-family: 'Roboto Condensed', sans-serif;
	color: #14549b;
	top: -10px;
}

section.featured:after {
	display: flex;
	content: "\f107";
	width: 200px;
	height: 60px;
	position: absolute;
	left: 0;
	right: 0;
	background: #FFF;
	z-index: 1;
    margin: auto;
    bottom: -40px;	
	align-items: center;
    justify-content: center;
	font: normal normal normal 50px/1 FontAwesome;  
	color: #14549b;  
}

section.featured.left .content {
	clip-path: url(#leftPath);	
}

section.featured.right .content{
	clip-path: url(#rightPath);
}

section.hotels {
	padding: 0 20px;
    height: 330px;
    display: flex;
    align-items: center;
    background: transparent;
	top: -145px;
    margin-bottom: -145px;	
    position: relative;
}

section.hotels .container {
	width: 1570px;
}

section.hotels .row {
	display: flex;
    justify-content: space-between;
    align-items: center;
}

section.hotels .row .col {
	flex-basis: 18%;
	margin: 0 1%;
}

section.hotels .hotel-box {
	height: 300px;
	background: #14549b;
	display: flex;
	flex-direction: column;
	box-shadow: 0 5px 15px rgba(0,0,0,0.3);	
	position: relative;
}

section.hotels .hotel-box .title {
	display: block;
	font-size: 25px;
	font-weight: 500;
	margin: 40px 30px;
	color: #FFF;
	position: absolute;
	z-index: 2;
}

section.hotels .hotel-box .description {
	display: block;
	opacity: 0;
	font-size: 14px;
	margin: 0px 30px;
	color: #FFF;
	position: absolute;
    top: 42%;
    line-height: 1.4;
    transition: all ease-in 0.3s;	
    pointer-events: none;
}

section.hotels .hotel-box:hover .description {
	opacity: 1;
	top: 40%;
}

section.hotels .hotel-box .hotel-img {
	flex-basis: 80%;
	background-position: 50% 50%;
	background-repeat: no-repeat;
	background-size: cover;
	transition: all ease-in 0.3s;
	opacity: 1;
}

section.hotels .hotel-box:hover .hotel-img {
	opacity: 0.3;
}

section.hotels .hotel-box .hotel-price {
	flex-basis: 20%;
	background: #ffa019;
	position: relative;
	overflow: hidden;
	font-size: 16px;
	color: #FFF;
	padding: 20px 30px;
	transition: all ease-in 0.3s;
}

section.hotels .hotel-box:hover .hotel-price,
section.hotels .hotel-box .hotel-price:hover {
	background: #ff6600;
}

section.hotels .hotel-price:before {
	content: "";
	display: block;
	position: absolute;
	height: 10px;
    width: 100%;
    top: -5px;
    left: 0;
    background: #FFF;
    transform: skewY(1deg);
}

section.reservation {
	background: transparent;
}

section.reservation h1.title {
	font-size: 40px;
    font-weight: 500;
    color: #FFF;
    background: #14549b;
    display: inline-block;
    padding: 20px;
    margin: 0;
    line-height: 1;
}

section.reservation .form-group {
	padding: 0;
	margin-bottom: 30px;
}

section.reservation .input-group {
	background: #FFF;
	width: 100%;
	padding: 10px 10px 10px 0;
}

section.reservation .input-group-addon {
    padding: 0 20px;
    font-size: 20px;
    font-weight: 400; 
    color: #d8d8d8;
    background-color: transparent;
    border: none;
}

section.reservation .form-control {
	background: transparent;
	border: none;
	height: 50px;
	font-size: 25px;
	color: #14549b;
	box-shadow: none;
	border-left: 1px solid #e8e8e8;
}

section.reservation label {
	font-size: 18px;
	color: #14549b;
	font-weight: 300;
}

section.reservation .btn {
	/*border-radius: 0;*/
}

section.reservation.short .btn {
	height: 70px;
	margin-top: 29px;
	font-size: 20px;
	line-height: 1;
}

section.reservation.short {
	background: #FFF;
	height: 200px;
	padding: 0;
}

section.reservation.short .container {

}

section.reservation.short .form-control {
	background: #e8e8e8;
	border-left: 1px solid #FFF;
	height: 70px;
}

section.reservation.short label {
	font-size: 16px;
}

section.reservation .has-error .form-control {
	border: 1px solid rgba(255,0,0,0.3);
	border-radius: 5px !important;
	background: rgba(255,0,0,0.1);
}

section.reservation .has-error label {
	color: #F00;
}


section.other-hotels .hotels-list {
	overflow: initial;
}


.bootstrap-select .dropdown-toggle .caret {
    position: absolute;
    top: 50%;
    right: 10px;
    margin-top: -14px;
    vertical-align: middle;
    display: inline-block;
    width: 20px;
    height: 20px;
    margin-left: 2px;
    vertical-align: middle;
    border-top: none;
    border-right: none;
    border-bottom: 2px solid #d8d8d8;
    border-left: 2px solid #d8d8d8;
    transform: rotate(-45deg);
}

.bootstrap-select .btn {
	border: none;
	background: transparent;
	font-size: inherit;
	color: inherit;
}

.bootstrap-select.open .dropdown-toggle.btn-default {
    color: inherit;
    background-color: inherit;
    border-color: transparent;
}

.bootstrap-select > select.mobile-device:focus + .dropdown-toggle,
.bootstrap-select .dropdown-toggle:focus {
    outline: none !important;
}

.btn-primary {
	border: 2px solid #14549b;
	color: #14549b;
}

.btn-primary:hover {
	background: #14549b;
	border: 2px solid #14549b;
}

.btn-lg {
	padding: 20px 60px;
    font-size: 25px;
}


.btn-warning {
	background: #ff9600;
	border: 2px solid #ff9600;
}

.sticky-box {
    display: flex;
    align-items: center;
    justify-content: center;
	position: relative;
	width: 100%;
	height: 100px;
	z-index: 1;
}

.sticky-box .sticky-box-container {
	background: #FFF;
	height: 100%;
	width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    perspective: 1000px;	
	text-align: center;
	transition: all 0.4s;
	transform-style: preserve-3d;
 	position: relative;
	border: 1px solid transparent;
}

.sticky-box .sticky-box-container .front,
.sticky-box .sticky-box-container .back {
	position: absolute;
	width: 100%;
	height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;	
	-webkit-backface-visibility: hidden; /* Safari */
	backface-visibility: hidden;	
}


.sticky-box .sticky-box-container .front,
.sticky-box .sticky-box-container .front a {
	color: #000;
	font-size: 20px;
	font-weight: 100;
	font-family: "Open Sans", serif;
}

.sticky-box .sticky-box-container .back {
	transform: rotateX(180deg);
	overflow: hidden;
}

.sticky-box .sticky-box-container .back h3 {
	max-width: 75%;
}

.sticky-box .title {
    display: block;
    position: absolute;
    margin: auto;
    background: #ff9600;
    color: #FFF;
    top: -10px;
    padding: 5px 10px;
    min-width: 135px;
    text-align: center;
    z-index: 3;
    transition: all 0.3s;
  	transform-style: preserve-3d;
}

.sticky-box.animated {
	margin-top: 60px;
}

.sticky-box.animated:hover .title {
	top: -50px;
}

.sticky-box.animated:hover .sticky-box-container {
	transform: rotateX(180deg);
	height: 180px;
	border: 1px solid rgba(255,255,255,0.7);
	box-shadow: 0 0 15px rgba(255,255,255,0.7);
}

hr {
	border-top: 1px solid #d6c396;
	border-bottom: 1px solid #FFFFFF;
}

/* footer */

footer {
	background: url('../img/footer-bg.jpg') 50% 0% no-repeat;
	clip-path: url(#leftPath);
	height: 160px;
}

footer .container {
	/*width: 980px;*/
	padding-top: 15px;
}

footer .container .links {
	text-align: right;
}

footer.mobile {
	background: #FFF;
	padding: 0;
	clip-path: none;
	height: auto;
	position: sticky;
	bottom: 0;
	display: none;
}

footer.mobile .container {
	padding-top: 10px;
	padding-bottom: 10px;
}

/* pages */


.page.hotel {}
.page.hotel .hotel-info h3 {
	font-size: 16px;
	text-transform: uppercase;
	color: #000;
    font-weight: 500;
    margin-bottom: 10px;
}

.page.hotel .hotel-info ul {
	list-style: circle;
    padding: 0px;
    list-style-position: inside;
    margin-left: 20px;	
}

.page.about header.short {
	
}

section.accommodation .content {
	background: #FFF;
	align-items: center;
}

section.accommodation .container {
	/*width: 1570px;*/
}


section.accommodation:before {
	color: #FFF;
	background: #14549b;
}

section.accommodation:after {
	/*content: "\f236";*/
	content: none;
	font-size: 30px;	
}

section.accommodation .room figure {
	position: relative;
	display: block;
	background: rgba(234,156,41,1);
	overflow: hidden;
}

section.accommodation .room figure .img-overlay {
	display: flex;
	width: 100%;
	height: 100%;
	position: absolute;
	background: rgba(234,156,41,1);
	content: "";
	transition: all ease-in 0.3s;
	opacity: 0;
	z-index: 2;
	color: #FFF;
	align-items: center;
    padding: 0;
    margin: 0;
    justify-content: center;
    font-size: 30px;
}

section.accommodation .room:hover figure .img-overlay {
	opacity: 0.5;
}

section.accommodation .room figure img {
	transition: all ease-in 0.3s;
}

section.accommodation .room:hover figure img {
	opacity: 0.2;
}

section.accommodation .room a {
	margin-top: 30px;
	display: block;
	font-size: 20px;
	font-weight: 100;
	color: #000;
	font-family: 'Open Sans', serif;
}

.checks {
    display: flex;
    justify-content: center;	
}

.checks .label {
	color: #939598;
	font-weight: 300;
	font-size: 14px;
	display: flex;
    align-items: center;
    justify-content: space-between;
    width: fit-content;
    float: left;	
}

.checks .label .icon {
	font-size: 20px;
	color: #ff9600;
	margin-right: 10px;
}

.spinner {
    width: 80px;
    height: 80px;
	margin-left: -40px;
    margin-top: -40px;    
}

.double-bounce1,
.double-bounce2 {
    background-color: #ff9600;
}

.feature-icon-left .feature-text {
    width: auto;
}

.column-projects {
    margin-bottom: 0px;
}

.swiper-container .swiper-pagination {
	position: relative;
	bottom: 0;
}

.swiper-container .swiper-pagination.light .swiper-pagination-bullet {
    background: #FFF;
    opacity: .8;
}

.swiper-container .swiper-pagination.light .swiper-pagination-bullet-active {
    background: #ff9600;
    opacity: 1;
}

.other-hotels .swiper-pagination,
.hotel-rooms .swiper-pagination {
	display: none;
}

.page.contacts {}

.page.contacts .map-overlay {  
	padding: 0;
	height: 700px;
    display: flex;
    align-items: flex-end;	
}

.page.contacts .map-overlay .map-holder {
	height: 100%;
}

.page.contacts .details-holder {
	width: 100%;
	border-radius: 0;
	text-align: center;
	margin: 50px auto;
	z-index: 1;
	background: rgba(0, 74, 146, 0.8);
	padding: 30px; 
	color: #FFF;
}

.page.contacts .details-holder h3,
.page.contacts .details-holder a {
	color: #FFF;
}

textarea { 	
	resize: vertical;
}