/* CSS Document */
@import url('https://fonts.googleapis.com/css?family=Oxygen:300|Roboto|Roboto+Slab');
@font-face { 
  font-family: "Ionicons"; 
  src: url("../fonts/ionicons.ttf?v=1.5.2");
  font-weight: normal;
  font-style: normal;
}
body{margin: 0; font-size: 1em; font-family: 'Roboto', sans-serif; font-weight: 300; line-height: 1.45; color: #9a9a9a;}
a{text-decoration: none; color: #000000;}
header div{width:100;}
.superior{background: #728a54; height:33px;}
.inferior{background:#262529!important; height:42px; margin-left:auto; margin-right:auto;}
.mobile{display:none;}
.col{float:right; position: relative; min-height: 1px; padding-left: 15px; padding-right: 15px; width: 35%; font-size: 0.6em;}
.container{
	margin-right: auto;
    margin-left: auto;
    padding-left: 15px;
    padding-right: 15px;
	width: 1170px;
}
.col2{position: relative; min-height: 1px; padding-left: 15px; padding-right: 15px;}
.inline-list{margin-top: 0; padding: 0; list-style: none; font-family: sans-serif; margin: 9px 0; color:white;-webkit-margin-before: 1em;
    -webkit-margin-after: 1em;
    -webkit-margin-start: 0px;
    -webkit-margin-end: 0px;
    -webkit-padding-start: 40px;}
.clean-list{margin-top: 0; padding: 0; list-style: none; float:right;}
.uppercase{text-transform: uppercase;}
.superior li{float: left; padding: 0 10px;}
.sliderHome{height: 329px; width:100%;}
.sliderHome #slide1{background-color: rgba(0, 0, 0, 0);
    background-repeat: no-repeat;
    background-image: url("https://www.hotelparadapuigcerda.com/img/Panoramica-Hotel-3.jpg");
    background-size: cover;
    background-position: center center;
    width: 100%;
    height: 100%;
    opacity: 1;
    visibility: inherit;
	filter: contrast(1.2) saturate(1.35);
}
.sliderHome #slide1::before{
	content: '';
    display: block;
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
    pointer-events: none;
	background: rgba(127,187,227,.2);
    mix-blend-mode: overlay;
}
.sliderHome #slide2{background-color: rgba(0, 0, 0, 0);
    background-repeat: no-repeat;
    background-image: url("https://www.hotelparadapuigcerda.com/img/2.jpg");
    background-size: cover;
    background-position: center center;
    width: 100%;
    height: 100%;
    opacity: 1;
    visibility: inherit;
}
.sliderHome #slide3{background-color: rgba(0, 0, 0, 0);
    background-repeat: no-repeat;
    background-image: url("https://www.hotelparadapuigcerda.com/img/4.jpg");
    background-size: cover;
    background-position: center center;
    width: 100%;
    height: 100%;
    opacity: 1;
    visibility: inherit;
}
.sliderHome #slide4{background-color: rgba(0, 0, 0, 0);
    background-repeat: no-repeat;
    background-image: url("https://www.hotelparadapuigcerda.com/img/spa-5.jpg");
    background-size: cover;
    background-position: center center;
    width: 100%;
    height: 100%;
    opacity: 1;
    visibility: inherit;
}
.sliderHome #slide5{background-color: rgba(0, 0, 0, 0);
    background-repeat: no-repeat;
    background-image: url("https://www.hotelparadapuigcerda.com/img/especial5-1.jpg");
    background-size: cover;
    background-position: center center;
    width: 100%;
    height: 100%;
    opacity: 1;
    visibility: inherit;
}
.sliderHome #slide6{background-color: rgba(0, 0, 0, 0);
    background-repeat: no-repeat;
    background-image: url("https://www.hotelparadapuigcerda.com/img/zona_desayunos-8.jpg");
    background-size: cover;
    background-position: center center;
    width: 100%;
    height: 100%;
    opacity: 1;
    visibility: inherit;
}
.sliderHome #slide7{background-color: rgba(0, 0, 0, 0);
    background-repeat: no-repeat;
    background-image: url("https://www.hotelparadapuigcerda.com/img/sala_estar-7-1.jpg");
    background-size: cover;
    background-position: center center;
    width: 100%;
    height: 100%;
    opacity: 1;
    visibility: inherit;
}
.sliderHome #slide8{background-color: rgba(0, 0, 0, 0);
    background-repeat: no-repeat;
    background-image: url("https://www.hotelparadapuigcerda.com/img/6.jpg");
    background-size: cover;
    background-position: center center;
    width: 100%;
    height: 100%;
    opacity: 1;
    visibility: inherit;
}

/* Main navigation */

.main-nav > ul {
  margin-bottom: 0;
  //margin-top: 6px;
}

.main-nav > ul li {
  position: relative;  
}

.main-nav > ul > li {
  float: left;
  text-transform: uppercase;
  margin-left: 0.5em;
}

.main-nav > ul > li a {
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition:    all 0.2s ease-in-out;
  -o-transition:      all 0.2s ease-in-out;
  -ms-transition:     all 0.2s ease-in-out;
  transition:         all 0.2s ease-in-out;
}

.main-nav > ul > li > a {
  display: inline-block;
  padding: 0.95em 1.15em;
  font-weight: 300;
}
.menu-item-846{background: #e48d40;}
.main-nav > ul > li#menu-item-846 a { color: #ffffff;}
.main-nav > ul > li a {
  color: #a5a5a5;
  font-size: 0.8em;
}


.main-nav > ul > li > a:hover,
.main-nav > ul > li:hover > a,
.main-nav > ul > li ul a:hover,
.main-nav > ul > li.current_page_item > a,
.main-nav > ul > li.current_page_parent > a {
  color: #ffffff;
  background: #e48d40;
}

.main-nav > ul > li.current_page_item > a,
.main-nav > ul > li.current_page_parent > a {
  opacity: 0.5;
}

.main-nav > ul > li.current_page_item > a:hover,
.main-nav > ul > li.current_page_parent > a:hover {
  opacity: 1;
}

.main-nav > ul > li a:hover + ul,
.main-nav > ul > li a + ul:hover {
  display: block;
}

.main-nav > ul > li ul {
  position: absolute;
  background: #ffffff;
  display: none;
  z-index: 100;
  box-shadow: 0 2px 2px rgba(0,0,0,0.1);
}

.main-nav > ul > li li {
  width: 220px; 
}

.main-nav > ul > li ul a {
  padding: 0.8em 1em;
  display: block;
  text-transform: capitalize;
}

.main-nav > ul > li > ul ul {
  top: 0;
  left: 100%;
}
.icon-312:before { content: "\f1a5"; }
.icon-338:before { content: "\f1b9"; }
.icon-274:before { content: "\f186"; }
.icon-402:before { content: "\f1e5"; }
.icon-185:before { content: "\f146"; }
.icon-549:before { content: "\f350"; }
.icon-556:before { content: "\f243"; }
.icon-528:before { content: "\f231"; }
.icon-467:before { content: "\f20d"; }
.icon-312, .icon-338, .icon-274, .icon-402, .icon-185, .icon-549, .icon-556, .icon-528{
	margin-right: 5px;
    vertical-align: top;
	display: inline-block;
    font-family: "Ionicons";
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    text-rendering: auto;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
	font-size: 1.3em;
}
.separador{
	color:inherit;
	width: 30%;
	margin-top: 1em;
    margin-bottom: 1em;
    position: relative;
	display: table;
    margin-left: auto;
    margin-right: auto;
}
.separador:before{
	content: '';
    display: block;
    position: absolute;
    left: 0;
    right: 0;
    top: -1px;
    bottom: 0;
    border-radius: 50%;
    margin: auto;
    width: 0.3em;
    height: 0.3em;
    border: 2px solid currentColor;
    background: #ffffff;
    box-shadow: 0 0 0 5px #ffffff;
}
.info{
	width:33.333333%; float:left; box-sizing: border-box; padding-left: 15px; padding-right: 15px;
}
.info h3{    font-size: 1.563em;}
.info img:hover{opacity: 0.8;}
/*.info img{width:360px; height:200px;}*/
.container2{
	background-image: url(https://www.lliviahotel.com/img/footer.webp) !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    background-size: cover !important;
	text-align:center;
}
.container2 img{
	width:600px; height:301px;
}
.boton-reservar{
	color: #FFF;
    background-color: #F90;
	font-size: 16px;
    padding: 18px 25px;
	border-radius: 5px;
	display: inline-block;
	display: inline-block;
    cursor: pointer;
    position: relative;
    top: 0;
    -webkit-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
    line-height: normal;
}
.boton-reservar:hover{color: #f2f2f2; background-color: #d68100; opacity:0.8;}
footer{background: #262529!important; width:100%; position:relative; float:left;}
.footerDiv{padding: 60px 0; float: left; width: 100%;}
.footerDiv ul > li {
  padding: 4px 0;
  font-size: 0.8em;
  position: relative;
  line-height: 1.3em;
}
.social-links{padding-left:0;}
.social-links > li {
  display: inline-block;
  min-width: 45px;
  margin: 0 5.5px;
}

.social-links > li:first-child {
  margin-left: 0;
}

.social-links > li a {
  display: block;
  border-radius: 5px;
  color: rgba(255,255,255,0.6) !important;
  -webkit-transition: all 0.3s ease;
  -moz-transition:    all 0.3s ease;
  -ms-transition:     all 0.3s ease;
  transition:         all 0.3s ease;
    text-align: center;
    position: relative;
    overflow: hidden;
    padding: 13%;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
	font-size: 2em;

}

.social-links > li a:hover {
  color: #ffffff !important;
  filter: alpha(opacity=80);
  opacity: 0.8;
}

.social-links > li a i {
  margin: auto;
  padding: 0;
}
.social-twitter,
.hover-twitter:hover {
  background: #55acee;
}

.social-facebook,
.hover-facebook:hover {
  background: #3b5998;
}
.social-google,
.hover-google:hover {
  background: #e51c23;
}
.social-rss,
.hover-rss:hover {
  background: #b6319c;
}
.xarxes-socials ul{
	list-style: none; 
	float:left; 
	-webkit-padding-start: 0px;
}
.xarxes-socials ul > li {
    padding-left: 36px !important;
    position: relative;
    margin-top: 18px;
	text-transform:uppercase;
}
.tituloHome{
	font-size: 35px; text-align: center;font-family:Roboto Slab;font-weight:400;font-style:normal;
}
.tituloSeccion{
	font-size: 45px; text-align: center;font-family:Roboto Slab;font-weight:400;font-style:normal;
	margin: 0.5em;
}
.subTituloSeccion{color: #118471; text-align: center; font-family: Roboto Slab; font-weight: 300; font-style: normal; font-size:28px;
}
.xarxes-socials .info img{width:auto; margin-bottom:0px;}
.logoMenu{position:absolute; margin-left: 5%;}
.fixed{position:fixed;top:0px;right:0;left:0; height:auto; z-index:3}
.fixedLogo{position:fixed;top:0px;right:0;left:0; height:auto; z-index:6; width:11%;}
.spa img{cursor:pointer;}
.spa img:hover{opacity:0.8;}
.containerDiv{padding-left:15px; padding-right:15px;}

/**** Habitaciones ****/
.divHabitaciones{float:left; padding:30px 0px 60px 0; color:#1d1d2f !important; width:100%;}
.colHabitaciones{width: 33.333%; float:left;}
.divSeparador{background-color:#F7BE68; width:50%; height:1px; margin:30px 25%;}
.divSeparador2{display:none;}
/**** SPA ****/
.divSpa{padding-right: 10px; float:left; width:24%; height:205px;}
/**** ACTIVIDADES ****/
.divActividades{padding:30px 0px 60px 0; color:#1d1d2f !important; text-align:center;}
.divActividades div{margin-bottom:30px;}
.divSituacion{float:left; width:47%; color: #1d1d2f; padding-left:15px; padding-right:15px; text-align:left;}
.divDetallesHabitacion{float:left; width:31.5%; height:377px;}
.activo{background-color:#e48d40; opacity: 0.5; transition: opacity 1s;}
.activo:hover{opacity: 1;}
.ordenador{display:block;}
.movil{display:none;}
.botonReservar{float:left; text-align:center; background-color: #F90; width:50%; border-radius: 5px; padding: 14px 20px; margin-left: 22.5%;}
.imagenReservar{float:left; width:65%; margin-top: 3.8%;}
.formularioReservar{width:32%; height:auto; float:left; background-color:#F3E8CE; margin-left:3%;}
.tituloSeccionHabitacion{font-size: 35px; font-weight:300;}
.habitacion{float:left; padding:30px 0px 30px 0; color:#1d1d2f !important; width:100%;}
@media only screen and (max-width:780px){
	.imagenReservar{float:left; width:100%; margin-top: 3.8%;}
	.formularioReservar{width:100%; height:auto; margin-left:0%;}
	.ordenador{display:none;}
	.movil{display:block;}
	.colHabitaciones{width: 100%; float:left;}
	.containerDiv{padding-left:0px; padding-right:0px;}
	.divSeparador2{background-color:#F7BE68; width:50%; height:1px; margin:30px 25%; display:block;}
	.divHabitaciones{padding:10px 0px 60px 0;}
	
	.divSpa{padding-right: 0px; float:left; width:100%; height:auto;}
	
	.divActividades div{margin-bottom:0px;}
	
	.divSituacion{width:100%;padding-left:0px; padding-right:0px;}
	
	.tituloSeccionHabitacion{font-size: 30px; font-weight:300;}
	.habitacion{padding:10px 0px 30px 0;}
	.containerDivHabitacion{padding-left:15px; padding-right:15px;}
	.divDetallesHabitacion{width: 100%; margin: 2% 0; height: 280px;}
	.botonReservar{width:87.5%; margin-left:0;}
	.tercero{display:none;}
	
	.subTituloSeccion{font-size: 23px; margin: 0;}
	
	.swiper-container{top: -4px;}
	
	header img{width:100px;}
	.superior{display:none;}
	.inferior{display:none;}
	.mobile{
		display:block;
		background:#262529!important; 
		height:50px; 
		margin-left:auto; 
		margin-right:auto;
		z-index:5;
	}
	.icon-467{
		display: inline-block;
		font-family: "Ionicons";
		speak: none;
		font-style: normal;
		font-weight: normal;
		font-variant: normal;
		text-transform: none;
		text-rendering: auto;
		-webkit-font-smoothing: antialiased;
	}
	.reservar{
		display:block !important;
		color:#F3E8CE; 
		text-decoration:none; 
		font-size:14px; 
		font-family: 'Open Sans', sans-serif;
		background: #728a54 url("https://www.hotelparadapuigcerda.com/img/calendar-white.svg") 14px center no-repeat;
		right: 22%;
    	top: 6.5px;
		position: absolute;
		width: 60px;
		float: right;
		padding: 0.563em 1.25em 0.625em 2.813em;
		font-weight: 700;
	}
	.sliderHome{height: 175px;}
	.sliderHome #slide5{
		background-image: url(https://www.hotelparadapuigcerda.com/img/slide-mobile.jpg)
	}
	.container{width:100%; padding:0;}
	.container h1{
		font-size: 22px; text-align: center;font-family:Roboto Slab;font-weight:400;font-style:normal; padding:0 10px;
	}
	.info{
		width:100%; float:left; box-sizing: border-box; padding-left: 15px; padding-right: 15px;
	}
	.container2 img{
		width:100%; height:auto;
	}
	.containerDiv img{width:100%; height:auto;}
	.xarxes-socials .info img{width:60%; margin-bottom:30px;}
	footer{padding: 60px 0; text-align:center;}
	.menuMobile{display:none; position: absolute; top: 50px; z-index: 4; width: 100%; text-align:center;}
	.menuMobile ul{box-shadow:0 1px 2px rgba(0,0,0,.5);width: 100%; list-style: none; padding: 0; margin: 0;}
	.menuMobile li{
		background:#262529!important;
		border-bottom:1px solid #282b30;
	}
	.menuMobile li:last-child{border-bottom:0}
	.menuMobile a{line-height:35px; color:white;}
	.menuMobile ul.open-menu{max-height:400px;transition:max-height .4s}
	.menuMobile ul.close-menu{max-height:0;transition:max-height .4s}
	#menuMobile{-webkit-animation-name:example;-webkit-animation-duration:0.5s;animation-name:example;animation-duration:0.5s;}
	@-webkit-keyframes example{0%{left:0px;top:-400px;}
	100%{left:0px;top:50px;}
	}
}