/* CSS by IDEATIVE.agency © 2020 */
/* TEMPLATE: Hostal Lola, v0.05Beta */


/******* IMPORTS *******/

@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@200;600&display=swap');

/******* GLOBAL *******/

/* COLOR */

.bg-lightgrey {
  background-color: #EBEBEB;
}

.bg-darkgrey {
  background-color: #484848;
}

.bg-offering {
  background-color: brown;
} 

.bg-alpha-grey {
  background-color: rgba(0, 0, 0, 0.5);
}


/* TEXT */

body {
  font-family: 'Nunito', sans-serif;
}

p {
  font-size: .90em;
}

h2 {
  font-size: 1.8em;
  padding-bottom: .6em;
}


.bold {
  font-weight: 600;
}

.text-center {
  text-align: center;
}

.text-red {
  color: brown;
}

.rest-menu{
  line-height: 0.9;

} 

/* BUTTONS */

.min-height-700 {
  min-height: 400px;
}

/* CARDS */

.card {
  border: 0;
  border-radius: 0;
}

.card-img {
  border-radius: 0;
  margin-right: 0;
}

/* LABELS */

.badge {
  font-size: 13px;
  padding-top: 6px;
}

/******* PAGE STRUCTURE *******/

/* PRIMARY MENU */

#menu-primary {
  box-shadow: 0 2px 15px rgba(0, 0, 0, 0.2);
}

#menu-primary .active {
  font-weight: 600;
}

#menu-primary .dropdown-menu {
  border: 0;
}


/* SECONDARY MENU */



/* CAROUSEL */

#carousel-primary {
  padding: 0;
}

.carousel-item .img-fluid {
  width:100%;
}

.carousel-caption {
  text-align: left;
}


/* SCREEN OVERLAY */


body.offcanvas-active{
	overflow:hidden;
}

.offcanvas-header{ display:none; }

.screen-overlay {
  width:0%;
  height: 100%;
  z-index: 1030;
  position: fixed;
  top: 0;
  left: 0;
  opacity:0;
  visibility:hidden;
  background-color: rgba(34, 34, 34, 0.6);
  transition:opacity .2s linear, visibility .1s, width 1s ease-in;
   }
.screen-overlay.show {
    transition:opacity .5s ease, width 0s;
    opacity:1;
    width:100%;
    visibility:visible;
}

@media all and (max-width:992px) {

	.offcanvas-header{ display:block; }

  .offcanvas-header h5 {
    font-size: 2em;
  }

	.mobile-offcanvas{
		visibility: hidden;
		transform:translateX(-100%);
	    border-radius:0;
		display:block;
	    position: fixed;
	    top: 0; left:0;
	    height: 100%;
	    z-index: 1200;
	    width:80%;
	    overflow-y: scroll;
	    overflow-x: hidden;
	    transition: visibility .2s ease-in-out, transform .2s ease-in-out;

      background-color: #EBEBEB;
	}

	.mobile-offcanvas.show{
		visibility: visible;
    	transform: translateX(0);
	}
}

/* HOTEL DATEPICKER */

#HotelDatePicker label {
  font-size: 10px;
  margin-bottom: 2px;
}

#HotelDatePicker input {
  font-size: 14px;
  border-radius: 0;
}

#HotelDatePicker select {
  font-size: 14px;
  border-radius: 0;
}

.btn-datepicker {
  font-size: 14px;
  border-radius: 0;
  background-color: darkgrey;

}

.ui-datepicker {
  background-color: #ececec;
  min-width: 250px;
} 

.ui-datepicker-header {
  background-color: lightgrey;
  padding-top: 5px;
  padding-bottom: 5px;
  text-align: center;
}

.ui-datepicker-prev {
  font-size: 10px;
  font-weight: bold;
  text-align: left;
  padding-right: 110px;
}

.ui-datepicker-next {
  font-size: 10px;
  font-weight: bold;
  text-align: right;
}

.ui-datepicker-title {
  font-weight: bold;
}

.ui-datepicker-calendar {
  background-color:#ececec;
  width: 90%;
  margin-left: 5%;
  text-align: center;
  
} 

.ui-datepicker-calendar a {
  color: black;
  text-decoration: none;
} 



.ui-datepicker-today {
  font-weight: bold;
  color: black;
} 

.ui-datepicker-current-day {
  color: black;
  background-color: lightgrey;
  border-radius: 18px;
}

.ui-state-disabled {
  color: darkgrey;
} 



.ui-state-hover {
  color: pink;
  font-weight: bold;
  font-style: normal;

} 

.ui-datepicker-other-month {
  color: darkgrey;
  background-color: #e6e6e6;
}

/* CONTENT FIRST */

#content-first {
  margin-bottom: 100px;
  margin-top: 50px;
}

#content-first .card-title {
  font-size: 1.5em;
  font-weight: 600;
}

#content-first .card-text {
  font-size: 1em;
  font-weight: 600;
  line-height: 1.1em;
  padding-top: 10px;
  padding-bottom: 0;
  margin-bottom: 5px;
}

/* CONTENT SECOND */

#content-second {
  margin-top: 100px;
}

#content-second h5 {
  font-size: 1.8em;
  font-weight: 600;
}

#content-second h6 {
  font-size: 1.2em;
  padding-top: 1em;
  font-weight: 600;
  text-align: right;

}

#content-second p {
  font-size: .9em;
}

#content-second .nav-link {
  color: white;
  background-color: #484848;
}

#content-second .card-body {
  min-height: auto;
}

/* CONTENT THIRD */

#content-third {
  margin-top: 100px;
  margin-bottom: 100px;

}

/* CONTENT FOURTH */

#content-fourth {
  margin-top: 100px;
  margin-bottom: 100px;
  min-height: 500px;
}

/* ROOM TYPE SELECTOR */


#multi-item-example  {
  padding: 0;
  padding-bottom: 50px;
}

#multi-item-example h5 {
  padding-left: 20px;
  font-weight: bold;
}

#multi-item-example p {
  padding-left: 20px;
}

#multi-item-example .btn {
  margin-left: 20px;
}

#multi-item-example .carousel-inner {
  padding: 0;

}

#multi-item-example .carousel-item .card-body {
  height: 270px;
}



#room-menu h6 {
  padding-top: 10px;
  padding-left: 10px;
  font-weight: bold;
}

#room-menu ul {
  padding-left: 10px;
  list-style-type: none;
  line-height: 40px;
}

.card-footer {
  margin-top: -53px;
}

/* FOOTER */

footer .nav-link {
  color: #EBEBEB;
  font-size: .95em;
}

footer .nav .active {
  font-weight: 600;
}

footer p {
  font-size: .7em;
}

.credits {
  color: lightgrey;
  margin-top: -9px;
  margin-bottom: 0;
  font-size: 9px;

}

.logo_turismo {
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.6), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}