@import url(//fonts.googleapis.com/css?family=Open+Sans:400,300,600,700);

/* Properties used to obtain the sticky footer. The html and body elements cannot have any padding or margin. Taken from http://getbootstrap.com/examples/sticky-footer/ */

html,
body {
	height: 100%;
}
.div_withPrice {
    margin-top: 5px!important;
    color: #333;
}	

#calendar td a {
    color: white;
    font-weight: bolder;
}

.glyphicon.glyphicon-arrow-left {
color: #AF201A;
}

.glyphicon.glyphicon-arrow-right {
color: #AF201A;
}

.Valid {
    background-color: rgba(164,179,87,1)!important; 
}

.notAvailable {    
    background-color: #AF201A!important;       
}    
#hotel-name-region{
	visibility:hidden;
}

.flag {
	width: 16px;
	height: 11px;
	background:url(../../img/flags.png) no-repeat
}

.flag.flag-de {background-position: -16px 0}
.flag.flag-es {background-position: -32px 0}
.flag.flag-fr {background-position: 0 -11px}
.flag.flag-gb {background-position: -16px -11px}
.flag.flag-pt {background-position: -32px -11px}


#offer-list-region > div > div > div > div > p:nth-child(6){
	visibility:hidden;
	display: none;
}

#payment-form-region > div > ul{
	Display: none;
	visibility: hidden;
}

/* OVERRIDE AND EXTEND BOOTSTRAP DEFINITIONS */


/* an extension to .input-sm classes (Height sizing for inputs - http://getbootstrap.com/css/#forms-control-sizes )*/

.input-xs {
  height: 28px;
  padding: 5px 10px;
  font-size: 12px;
  line-height: 1.5;
  border-radius: 0px;
}

select.input-xs {
  height: 28px;
  line-height: 28px;
}

textarea.input-xs {
  height: auto;
}

/* remove the display property - this will allow to center the image in the container div (why???) */
.img-responsive-2 {
/*  display: block;*/
  height: auto;
  max-width: 100%;
}



.btn-xxs {
  font-size: 11px;
  line-height: 1.4;
  border-radius: 0px;
  padding: 0px 8px 2px 8px;
  white-space: normal;
}

/* change the icon of the cursor for disabled elements*/
.form-control[disabled],
.form-control[readonly],
fieldset[disabled] .form-control {
  cursor: text;
  background-color: #eeeeee;
}

.label {
	border-radius: 0;
}



.carousel-indicators {
    bottom: 1px;
}

.carousel-indicators li {
  width: 20px;
  height: 20px;
  margin: 2px;
  border: 2px solid #ffffff;
  border-radius: 0px;
}

.carousel-indicators .active {
  width: 22px;
  height: 22px;
}





/* class from the datepicker plugin; used to style the "today" button */
.datepicker tfoot tr:first-child th {
  cursor: pointer;
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.4);
-webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.2);
-moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.2);
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.2);
color: #ffffff;
background-color: #1d509f;
border-color: black;
letter-spacing: 1px;

}
.datepicker tfoot tr:first-child th:hover {
	background-color: #1d509f;  
}

.datepicker table tr td.active.active{
  background: #7fbac0;
}

.datepicker table tr td.disabled,
.datepicker table tr td.disabled:hover {
  background: none;
/*  color: #999999;*/
  color: #adadad;  
  cursor: not-allowed;
}

.btn-lg {
  font-size: 22px;
  padding: 6px 16px;
}

.alert {
	margin-bottom: 0;
}

/* DEBUG CLASSES*/
.debug {
    border: solid;
    border-width: 1px;
}

.border-red {
    border-color: red;
}

.border-blue {
    border-color: blue;
}

.border-green {
    border-color: green;
}

.border-orange {
    border-color: orange;
}

.border-white {
    border-color: white;
}




.view-container {
	padding-top: 20px !important;
}




.overlay {
	background-image: url(../img/texture_overlay.png) 
}

.loading-view-logo {
	display: block;
	margin: auto;
	padding: 10px 0px;
}









/* STEP OFFERS LAYOUT */
.Steps-Show-StepOffersLV {
	margin-bottom: 30px;
}

/* LOGO */

.Logo-LogoLV {
/* TODO: is this a safe way way to make the image centered in the div? Does every browser treats a text as an image?*/
	text-align: center;
	padding: 20px 0px;
	cursor: pointer;
}



/* HEADER */

.Header-Show-HeaderLV {
  color: white;
  margin-top: 15px;
}

.Header-Show-ToplinksIV a {
  color: white;	
}

.Header-Show-ToplinksIV {
	text-align: right;
}

.Header-Show-CulturesCV {
	float: right;	 
}

.culture-deselected {
	opacity: 0.4;
}

.Header-Show-HotelNameIV {
	font-size: 150%;
	font-weight: 700;
}


/* we using the input-sm class on the select element; we have to use this on the elements next to it to make the height equal */
.input-sm-neighbour {
  height: 30px;
  padding: 3px 0px;
}



/* PROMOTION */

.Promotion-Show-PromotionIV {
	color: #fff;  
	padding: 10px 10px 15px 10px;
}





.SummaryPanel-Show-SummaryPanelLV {
	padding: 5px 10px 15px 10px;
}


.summary-panel-row {
	padding: 0px 5px;
}


/* an alternate hr element, a little more dark*/
hr.hr-summary-panel {
  margin: 2px 0px 12px 0px;
  border: 0;
  border-top: 1px solid #999;
  border-bottom: 1px solid #e0e0e0;
}

.summary-panel-total {
	font-size: 133%;
	font-weight: 500;
}

.summary-panel-price {
	font-weight: 600;
}

/* FOOTER */


.Footer-Show-SocialIconIV {
	margin-right: 10px;
	opacity: 0.8;
}
.Footer-Show-SocialIconIV:hover {
	opacity: 1.0;
}


.opaque {
	opacity: 1.0;
	z-index: 9999;
}





/* OFFER  767, 768 */


/* to be displayed in smarthphones ONLY (and not on larger screens) */
@media (max-width: 767px) {


.overview-corners {
	border-radius: 0px 0px 0 0;
	-moz-border-radius: 0px 0px 0 0;
	-webkit-border-radius: 0px 0px 0 0;
}


/* small adjustment in the column size, to be used in the date range (but only for xs sizes) */
/* NOTE: to make this affect the xs grids and not the other grids, I had to actually place it in this media section */
.col-xs-4-alt {
  position: relative;
  min-height: 1px;
  padding-right: 15px;
  padding-left: 15px;
}

.col-xs-4-alt {  
  float: left;
}

.col-xs-4-alt {    
  width: 36%;
}

}


/* to be displayed in tablets and larger screens ONLY (and not on smarthphones) */
@media (min-width: 768px) {

.arrow-box {
	position: relative;
	background: #fff;
}
.arrow-box:after, .arrow-box:before {
	left: 100%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}
.arrow-box:after {
	border-color: rgba(255, 255, 255, 0);
	border-left-color: #fff;
	border-width: 10px;
	top: 28%;
	margin-top: -10px;
}
.arrow-box:before {
	border-color: rgba(204, 204, 204, 0);
	border-left-color: #ccc;
	border-width: 11px;
	top: 28%;
	margin-top: -11px;
}

.overview-corners {
	border-radius: 0px 0 0 0px;
	-moz-border-radius: 0px 0 0 0px;
	-webkit-border-radius: 0px 0 0 0px;
}


/* small adjustment in the column size, to be used in the date range (but only for xs sizes) */
/* NOTE: to make this affect the xs grids and not the other grids, I had to actually place it in this media section */
.col-sm-4-alt {
  position: relative;
  min-height: 1px;
  padding-right: 15px;
  padding-left: 15px;
}

.col-sm-4-alt {  
  float: left;
}

.col-sm-4-alt {    
  width: 34.1%;
}

/*
.modal {
  overflow-x: hidden;
  overflow-y: hidden;
}

.modal-dialog {
    right: auto;
    left: 50%;
    width: 1000px;
    padding-top: 30px;
    padding-bottom: 30px;
  }
*/

}  /* end of the section min-width: 768px*/

@media (min-width: 1200px) {

  .col-lg-2-alt {
    width: 18.0%;
  }  

  .col-lg-6-alt  {
  	width: 48.0%;
  }


}




.overview {
	min-height: 165px;
	background: #fff;
	 border-right: 1px solid #777777;
}




.label-rooms-container {
	padding-top: 5px;
}
.label-rooms-container label {
	font-size: 105%;
}




.offer-img-container {
	text-align: center;
/*	padding: 8px;*/
}

.Offers-List-OfferLV {
	margin-bottom: 10px;
}


.restrictions-apply {
	font-size: 115%;
	font-weight: 500;
}

.restrictions-list {
	padding-left: 25px;
}



/* RANGE DATES */
.color-white {
	color: white;
}



/* CUSTOM CSS - MAKE CHANGES FROM HERE TO THE END OF THE FILE */

body {
	background: url(../../img/background_AHA.jpg) no-repeat center center fixed; 
/*	 background: #005E82; */
  /*    background: url(../../img/backgrounds/Subtle-Artistic-Surfaces-Textures-Thumb-07.jpg);*/
  /*      background: #f0f0f0 url(../../img/backgrounds/blue_retro/04.jpg); */
  /*background: url(https://bookings.hotelparis.pt/hwe_v10/Areas/Booking2/assets/img/logos/background.png) no-repeat center center fixed; */
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  font-family: Lato,sans-serif;
}


.js-offer-title{
	font-size: 15px!important;	
}

/* OVERRIDE AND EXTEND BOOTSTRAP DEFINITIONS */

/* change the anchor links to be a little darker blue*/
a {
	color: #08c;
    text-decoration: none;
	border: #000;
	text-shadow: #000;
}

#promotion-region > div > div:nth-child(1) > div > label{
	color: white;
}

/* the element with id #main-wrapper is doing the role of the div#wrap in the sticky-footer example; we are using the same css properties of bootstrap's container class */

#main-wrapper {
  background-color: rgba(255, 255, 255, 0.76);
  margin-top: 20px;
  border-radius: 5px;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  box-shadow: 0 8px 12px rgba(0, 0, 0, 0.5);
  /* Negative indent footer by its height */
  margin: 0 auto-140px;
  /* Pad bottom by footer height */
  padding: 0 0 120px;
}

/* copy css from bootstrap's .container */	
#main-wrapper:before,
#main-wrapper:after {
  display: table;
  content: " ";
}

@media (min-width: 768px) {
  #main-wrapper {
    max-width: 750px;
  }
}

@media (min-width: 992px) {
  #main-wrapper {
    max-width: 970px;
  }
}  

@media (min-width: 1200px) {
  #main-wrapper {
    max-width: 1170px;
  }
}



.mybtn {
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
    border-radius: 0px;
    border: solid 1px #FFF;
	  background-color: #7fbac0;

    text-shadow: none;
    -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.2);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.2);
}

.mybtn:hover {
  background-color: #FFF;
  color: #7fbac0;
  text-shadow: none;
}



.block {
	background-color: #1d509f;
	box-shadow: 1px 1px 0px #FFF;

	border-radius: 0px;
	-moz-border-radius: 0px;
	-webkit-border-radius: 0px;
}

#official-website-region > div > div > div > div:nth-child(1){
	color: black;
}

.overlay {
	background-image: url(../../img/texture_overlay.png) 
}

.loading-view-logo {
	display: block;
	margin: auto;
	padding: 10px 0px;
}

#logo-region > div {
	background: #FFF;
	border: transparent;
	box-shadow: none;
}


/* ANIMATIONS */
body { 
/* Addresses a small issue in webkit: http://bit.ly/NEdoDq */
	-webkit-backface-visibility: hidden;
}

.animated {
	-webkit-animation-duration: 0.45s;
	   -moz-animation-duration: 0.45s;
	     -o-animation-duration: 0.45s;
	        animation-duration: 0.45s;
	-webkit-animation-fill-mode: both;
	   -moz-animation-fill-mode: both;
	     -o-animation-fill-mode: both;
	        animation-fill-mode: both;
}


@-webkit-keyframes swing {
	20%, 40%, 60%, 80%, 100% { -webkit-transform-origin: top center; }

	20% { -webkit-transform: rotate(-0.7deg); }
	40% { -webkit-transform: rotate(0.6deg); }
	60% { -webkit-transform: rotate(-0.6deg); }
	80% { -webkit-transform: rotate(0.5deg); }
	100% { -webkit-transform: rotate(0deg); }
}

@-moz-keyframes swing {

	20% { -moz-transform: rotate(-0.7deg); }
	40% { -moz-transform: rotate(0.6deg); }
	60% { -moz-transform: rotate(-0.6deg); }
	80% { -moz-transform: rotate(0.5deg); }
	100% { -moz-transform: rotate(0deg); }
}

@-o-keyframes swing {

	20% { -o-transform: rotate(-0.7deg); }
	40% { -o-transform: rotate(0.6deg); }
	60% { -o-transform: rotate(-0.6deg); }
	80% { -o-transform: rotate(0.5deg); }
	100% { -o-transform: rotate(0deg); }
}

@keyframes swing {

	20% { transform: rotate(-0.7deg); }
	40% { transform: rotate(0.6deg); }
	60% { transform: rotate(-0.6deg); }
	80% { transform: rotate(0.5deg); }
	100% { transform: rotate(0deg); }
}

.animated.swing {
	-webkit-transform-origin: top center;
	-moz-transform-origin: top center;
	-o-transform-origin: top center;
	transform-origin: top center;
	-webkit-animation-name: swing;
	-moz-animation-name: swing;
	-o-animation-name: swing;
	animation-name: swing;
}


.summary-panel-background {
	background-image: -webkit-linear-gradient(bottom, #fff, #f0f0f0);
	background-image: -moz-linear-gradient(bottom, #fff, #f0f0f0);
	background-image: -o-linear-gradient(bottom, #fff, #f0f0f0);
	background-image: -ms-linear-gradient(bottom, #fff, #f0f0f0);
	background-image: linear-gradient(to top, #fff, #f0f0f0);

	-moz-box-shadow: 0px 1px 3px rgba(0,0,0,0.55);
	-webkit-box-shadow: 0px 1px 3px rgba(0,0,0,0.55);
	box-shadow: 0px 1px 3px rgba(0,0,0,0.55);
}



#footer-wrapper {
	height: 120px;
	background: rgb(200, 54, 54);  /* fallback for IE8 */
	background: rgba(245, 245, 245, 0.5); 
	color: black;
}

#footer-region {
	color: black;
}

.Footer-Show-DisclaimerIV {
	color: black;
}


.overview {
	min-height: 165px;
	background: #fff;
	border-right: 1px solid #777777;
}


.offer {
	background-color: #c2c2c2;
	background-image: -webkit-gradient(linear, left top, left bottom, from(rgb(194, 194, 194)), to(rgb(99, 99, 99)));
	background-image: -webkit-linear-gradient(top, rgb(194, 194, 194), rgb(99, 99, 99));
	background-image: -moz-linear-gradient(top, rgb(194, 194, 194), rgb(99, 99, 99));
	background-image: -o-linear-gradient(top, rgb(194, 194, 194), rgb(99, 99, 99));
	background-image: -ms-linear-gradient(top, rgb(194, 194, 194), rgb(99, 99, 99));
	background-image: linear-gradient(top, rgb(194, 194, 194), rgb(99, 99, 99));
	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr='#c2c2c2', EndColorStr='#636363');

	border-radius: 0px;
	-moz-border-radius: 0px;
	-webkit-border-radius: 0px;

	margin-bottom: 20px;

	border: 1px solid #9b9b9b;
}

.contacts-no-offers > li {
  margin-bottom: 4px;
}

.price2 {
	text-align: center;
	color:#333333; 
	padding-top: 15px;
}

.price2 small {
	color: white; 
	font-size: 92%;
}

.price-value {
	font-weight: 700;
	text-shadow: 0px 1px 0 #ccc;
	font-size: 115%;
}


.offer-mouseover {
	background-image: -webkit-linear-gradient(bottom, #2A9CC4, #71E1FF);
	background-image: -moz-linear-gradient(bottom, #2A9CC4, #71E1FF);
	background-image: -o-linear-gradient(bottom, #2A9CC4, #71E1FF);
	background-image: -ms-linear-gradient(bottom, #2A9CC4, #71E1FF);
	background-image: linear-gradient(to top, #2A9CC4, #71E1FF);

	border: 1px solid #cccccc;
	-webkit-box-shadow: 0px 0px  5px 0px #D8D8D8;
	-moz-box-shadow:    0px 0px  5px 0px #D8D8D8;
	box-shadow:         0px 0px  5px 0px #D8D8D8;
}

.offer-selected {
	background-image: -webkit-linear-gradient(bottom, #2A9CC4, #71E1FF);
	background-image: -moz-linear-gradient(bottom, #2A9CC4, #71E1FF);
	background-image: -o-linear-gradient(bottom, #2A9CC4, #71E1FF);
	background-image: -ms-linear-gradient(bottom, #2A9CC4, #71E1FF);
	background-image: linear-gradient(to top, #2A9CC4, #71E1FF);

	border: 2px solid #cccccc;
	-webkit-box-shadow: 0px 0px  10px 0px #D8D8D8;
	-moz-box-shadow:    0px 0px  10px 0px #D8D8D8;
	box-shadow:         0px 0px  10px 0px #D8D8D8;
}

.dates-range-color {
	color: white;
}