@charset "utf-8";
/* CSS Document */
@font-face {
    font-family: 'prosto_oneregular';
    src: url('../fonts/prostoone-regular-webfont.eot');
    src: url('../fonts/prostoone-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/prostoone-regular-webfont.woff2') format('woff2'),
         url('../fonts/prostoone-regular-webfont.woff') format('woff'),
         url('../fonts/prostoone-regular-webfont.ttf') format('truetype'),
         url('../fonts/prostoone-regular-webfont.svg#prosto_oneregular') format('svg');
    font-weight: normal;
    font-style: normal;
}
body {
	overflow-x: hidden; /* Hide the browser horizontal scroll bar and make the search field autocomplete results responsive --> entire web page responsive */
}
.navbar {
	/* background: none; /* Transparent */
	/* filter: none; /* Transparent for older Internet Explorer */
	background: #1faee8;
	background: -webkit-linear-gradient(#1faee8, #1baae4); /* For Safari 5.1 to 6.0 */
	background: -o-linear-gradient(#1faee8, #1baae4); /* For Opera 11.1 to 12.0 */
	background: -moz-linear-gradient(#1faee8, #1baae4); /* For Firefox 3.6 to 15 */
	background: linear-gradient(#1faee8, #1baae4); /* Standard syntax */
	opacity: 0.9;
}
.navbar-brand {
	padding: 0px 0px;
}
.navbar-brand img {
	/* margin-top: 50px; /* Move logo downwards */
	height: 100%; /* Fit logo inside the navbar section */
}
.navbar .nav > li > a {
	color: #fff; /* Menu link color */
}
.navbar .nav > li > a:hover {
	color: lightblue; /* Menu link hover color */
}
.jumbotron {
	background-image:url('../jumbotron_bg.jpg');
	background-color:#152a55; /* Color taken from the jpeg-image */
	min-height:600px; /* Image minimum height */
	margin-bottom:0px; /* Margin under the jumbotron */
	/* padding-top:100px; */
    /* padding-bottom:20px; */
	background-position:center top; /*OR center center */ /* Position background to the center horizontally and the top/center vertically */ 
	/* background-attachment:fixed; */ /* Image don't scroll with the rest of the page */
	background-repeat:no-repeat; /* Don't repeat the image */
	/* background-size:100%; */ /* Fit the Jumbotron's background image horizontally in the browser <div>-element. */	
	background-size:cover; /* Scale the background image to be as large as possible in order to fill the <div>-element. */
}
p.jumbotron-contact {
	color: #fff;
	font-size: 10px;
	margin: 0;
	padding-top: 2px;
}
@media (max-width: 767px) { /* If screen width < 768px --> 'margin-top: 18px' */
p.jumbotron-contact {
	margin-top: 18px;
  }
}
p.jumbotron-slogan {
	color: lightblue;
	/*font-style: italic; */
	font-family: prosto_oneregular, "Helvetica Neue", Helvetica, Arial, sans-serif; /* 'prosto_oneregular' is defined at the beginning of this CSS file --> '@font-face' */
	font-size: 25px;
	margin-top: 14px; /* To keep vertical alignment same without the contact section 'p.jumbotron-contact' --> 'margin-top: 30px */
	/* margin-left: 20px; */
}
.btn-lg {
	margin-left: 20px; /* Jumbotron engage button left margin */
}
.btn-default:hover {
	/* background-color: lightblue; /* Button hover color */
}
.col-md-12 {
	padding: 30px; /* Column padding */
}
.col-md-6 {
	padding: 30px; /* Column padding */
}
.col-md-4 {
	padding: 30px; /* Column padding */
}
hr {
	margin-top: 50px; /* Default is 20px, move footer downwards 30px */
}
.add_top_margin {
	margin-top: 70px; /* Add margin in order to align image downwards */	
}
/* Style for date reset checkbox label --> 'id="reset-dates"' */
.datereset-label {
    color: #fff; /* font color */
	font-size: small;
	font-weight: 100;
/*	background-color: #fff;
	opacity: 0.8;
	border: 1px solid #999;
	border-radius: 4px;
	padding: 1px; */
}
/* Align the checkbox and the label (text) vertically */
#reset-dates {
	vertical-align: middle;
	position: relative;
	bottom: 3px;
	/* vertical-align: -2px; */  /* the most simple solution */
}
.glyph-lg { /* Large icons */
	font-size: 60px;
	color: #0099cc;
}
.blue-text {
	color: #0099cc;
}
.purple-section {
	background: #402857;
	padding-top: 10px;
	padding-bottom: 10px;
}
.padded-logo { /* Space between the partner logos */
	padding-left: 10px;
	padding-right: 10px;
/*	padding-top: 10px;
	padding-bottom: 10px; */  /* Vertical padding can either be set in this or '.grey-section' class */
}
.green-section {
	background: #045a04;
	color: #b8b8b9; /* Font color */
	padding-bottom: 10px;
}
.reduce-width {
	max-width: 80%;
	margin-right: auto;
	margin-left: auto;
}
.btn-outline-inverse, .btn-outline-inverse-cityinfo { /* Outlined button with inverse hover colors */
	background-color: transparent;
	border-color: #b8b8b9; /* grey */
	color: #b8b8b9; /* Font color - grey */
}
.btn-outline-inverse:hover {
	background-color: #b8b8b9; /* grey */
	color: #045a04; /* green */
}
.btn-outline-inverse-cityinfo:hover {
	background-color: #b8b8b9; /* grey */
	color: #0a1a60; /* blue */
}
.add-padding {
	padding-top: 30px;
	padding-bottom: 30px;
}
.add-padding-bottom {
	padding-bottom: 30px;
}
.blog-image:hover {
	filter: saturate(2);
	-webkit-filter: saturate(2);
	-o-filter: saturate(2);
	-moz-filter: saturate(2);
}
.blog-image-text { /* Overlayed text on '.blog-image' */
  color:#fff;
  position:absolute;
  z-index:12;
  top:60%;
  left:0;
  width:100%;
  text-align:center;
}
.city-image {
	margin-bottom: 20px;
}
.city-image:hover {
	/*opacity: 0.8;*/
	filter: saturate(2);
	-webkit-filter: saturate(2);
	-o-filter: saturate(2);
	-moz-filter: saturate(2);
	-moz-opacity: 0.8;
}
.city-image-text { /* Overlayed text on '.city-image' */
  color:#fff;
  position:absolute;
  z-index:12;
  top:0%;
  left:0;
  width:100%;
  text-align:center;
}
.blue-section {
	background: #0a1a60;
	color: #b8b8b9; /* Font color */
	padding-bottom: 10px;
}
.footer-section {
	padding-top: 30px;
	padding-bottom: 30px;
	background: #51475a;
	color: #b8b8b9; /* Font color */
}
.footer-section .navbar-nav>li>a {
	color: #b8b8b9; /* Footer menu link font color */
}
@media (min-width: 768px) { /* If screen width > 767px --> 'width: 460px' & margin: 0 auto; */
.footer-section .navbar-inverse { /* Center '.navbar-inverse' <div>-section */
	width: 460px;
	margin: 0 auto;
}
}
.footer-section .footer-contact { /* Center '.footer-contact' <div>-section */
	width: 235px;
	margin: 0 auto;
}
.padded-logo2 { /* Social logo padding in footer section */
	/*padding: 10px;*/
}
.embed-body { /* For the embedded content --> my_reservations_xx.html, price_gurarantee_xx.html, privacy_policy_xx.html, terms_of_use_xx.html, faq_xx.html */
	margin: 0px; 
	margin-top: 50px; 
}
.embed-container { 
	position: relative; 
	padding-bottom: 100%; 
	height: 0; 
	overflow: hidden; 
	max-width: 100%; 
	min-height: 100%; 
} 
.embed-container iframe, .embed-container object, .embed-container embed { 
	position: absolute; 
	clip:rect(190px,1140px,760px,0px); /* Clip out the header and footer sections --> top,right, bottom,left */ 
	top: -190px; /*top: 0;*/ /* Adjust top setting according to the clipping */
	left: 0; 
	width: 100%; 
	height: 100%; 
}
@media (max-width: 991px) { /* If screen width < 992px --> */
.google-maps { /* Make the embedded Google Maps Streetview ( in 'city_info.html') responsive */
	position: relative;
	padding-bottom: 25%; /* This is the aspect ratio --> 200px/800px = 0.25 */
	height: 0;
	overflow: hidden;
	}
.google-maps iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100% !important;
	height: 100% !important;
}
}
@media (min-width: 768px) { /* If screen width > 767px */
.navbarDivStyle { /* Navigation bar floats left and is side-by-side with the language bar */
	width: 54%;
	float: left;
}
}
@media (min-width: 992px) { /* If screen width > 991px */
.navbarDivStyle { /* Navigation bar floats left and is side-by-side with the language bar */
	width: 64%;
	float: left;
}
}
@media (min-width: 1200px) { /* If screen width > 1199px */
.navbarDivStyle { /* Navigation bar floats left and is side-by-side with the language bar */
	width: 70%;
	float: left;
}
}
.langbarDivStyle { /* Navigation bar floats left and is side-by-side with the language bar */
	width: 140px; 
	float: left; 
	margin-left: 30px; 
	margin-top: 13px; 
}
@media (max-width: 767px) { /* If screen width < 768px --> 'margin-top: 18px' */
.langbarDivStyle { /* Margins are not needed in the mobile mode menu */
	width: 140px;  
	margin-left: 0px; 
	margin-top: 10px;
  }
.navbar {
	opacity: 0.7;
  }
}