@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital@0;1&family=Raleway:ital,wght@0,100..900;1,100..900&display=swap');

/*
Theme Name: Chalet Cridola - Dolomiti Mountain Group
Author: Laura Titton
Description: Chalet Cridola - 2024/2025
Version: 1.0
License: GNU General Public License v2 or later
*/

/*  
	
	FONTS UTILIZZATI :
	font-family: "Raleway", sans-serif;
	font-family: "Montserrat", sans-serif -> 400;
	
*/

:root{
	--brown: #7E684E;
	--white: #F0F0F0;
	--black: #141110;
}

html,body {  
	margin:0;
	padding:0;
	font-family: "Raleway", sans-serif !important;
	font-size: 16px !important;
	font-weight:400;
	background-color:#F0F0F0;
	color:#141110;
}


@media (min-width: 1600px){  
	html,body {
		font-size: 18px !important;
	}
}

html {
  scroll-behavior: smooth;
}

.montserrat{
	font-family: "Montserrat", sans-serif;
	font-weight: 400;
	font-size:0.9rem;
}
ul{
	padding:0;
	margin:0;
}

img,a img {
	border:none!important;
}

::-moz-selection {
	background:none repeat scroll 0 0 #F0F0F0;
	color:#141110;
}

* {
	outline:0!important;
}

b,strong,.bold {  
	font-weight:600;
}

a,a:visited {  
	outline-style:none;
	text-decoration:none;
	color:#141110;
}

a.button-white,a.button-white:visited {  
	outline-style:none;
	text-decoration:none;
	color:#fff;
}

a:hover {  
	cursor:pointer !important;
	color:#141110;
}

a.button-white:hover {  
	cursor:pointer !important;
	color:#141110 !important;
	text-decoration:none;
}



@media (min-width: 1200px){  
	.container-fluid {
		padding-left: 50px;
		padding-right: 50px;
	}
}

@media (min-width: 1600px){  
	.container-fluid {
		padding-left: 100px;
		padding-right: 100px;
	}
}


/* TYPO */

.uppercase{
	text-transform: uppercase;
}
.big{
	font-size: 1.2rem;   
}
@media(max-width:991px){
	.big{
		font-size: 1.1rem;
	}
}
.small{
	font-size: 0.8rem;	 
}

h1,.h1,h2,.h2,h3,.h3,h4,.h4,h5,.h5,h6,.h6{  
	margin:0;
	padding:0;
}

h1,.h1{
	font-family: "Raleway", sans-serif !important;
	font-size: 2.7rem;
	font-weight: 400;
}

#page-home h1, #page-home .h1{
	font-family: "Raleway", sans-serif !important;
	font-size: 3.5rem;
}

@media(max-width:991px){
	#page-home h1, #page-home .h1{
		font-size: 2.4rem;
	}
}


h2,.h2{
	font-family: "Raleway", sans-serif !important;
	font-size: 2.7rem;
	font-weight: 400;
}

h3,.h3{
	font-family: "Raleway", sans-serif !important;
	font-size: 2rem;
	font-weight: 400;
}

p{
	margin:0;
	padding:0;
	font-family: "Raleway", sans-serif !important;;
}

@media(max-width:991px){
	h1,.h1{
		font-size: 1.7rem;
	}
	h2,.h2{		
		font-size: 1.6rem;		
	}
	
	h3,.h3{	
		font-size: 1.3rem;		
	}
}

/* loader */

.loading-before {
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	z-index: 997;
	background-color: var(--brown);
	transition: .7s cubic-bezier(0.86, 0, 0.07, 1);
}

.loading-before.out {
	transform: translateY(-100%);
	transition-delay: .3s;
}

#loading {
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	z-index: 998;
	background-color: var(--brown);
	transition: .7s cubic-bezier(0.86, 0, 0.07, 1);
	transition-delay: .3s;
}

#loading::after {
	content: '';
	position: absolute;
	bottom: -30%; 
	left: 0;
	width: 100%;
	height: 30%; 
	background-color: var(--brown);
	z-index: -1;
}

#loading.out {
	transform: translateY(-130%);
	transition-delay: 0s;
}

#Layer_1 {
	width: 135px; 
	height: auto;
}

@media(max-width:991px){
	#Layer_1 {
		width: 110px; 
		height: auto;
	}
}

.logo-animation-container {
	overflow: hidden;
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	animation: fadeInDown 1.2s ease-out forwards;
}

@keyframes fadeInDown {
	0% {
		opacity: 0;
		transform: translate(-50%, -100%);
	}
	
	100% {
		opacity: 1;
		transform: translate(-50%, -50%);
	}
}

/* HEADER */

#menu-menu-principale .nav-link span{
	color: #fff;
	text-transform: uppercase;
	font-weight: 600;
	font-size: 0.70rem;
}

#menu-menu-principale .nav-link span:hover{
	text-decoration: none;
}

@media(min-width:1300px) and (max-width:1500px){
	#menu-menu-principale .nav-link span{		
		font-size: 0.75rem;
	}
	
}

@media(min-width:1500.99px){
	#menu-menu-principale .nav-link span{		
		font-size: 0.85rem;
		font-weight:400;
	}
	.button-white{
		font-weight:400 !important;
	}
}

.navbar-expand-xl .navbar-nav .nav-link{
	padding-right: .65rem;
	padding-left: .65rem;
}


#header{
	position: fixed;
	top: 0;
	left:0;
	width:100%;
	z-index:3;
	opacity:0;
	background: rgb(0,0,0);
	background: linear-gradient(180deg, rgba(0,0,0,0.5) 0%, rgba(0,0,0,0.3) 70%, rgba(0,0,0,0) 100%);
}

#header .navbar-brand img{
	height: 65px;
}

#header .navbar .row{
	width: 95%;
}

@media(max-width:991px){
	#header .navbar .row{
		width:100%;
	}
	
	#header .navbar-brand img{
		height: 55px;
		margin-left:5px;
	}
}

#header.show {
	opacity:1;
	
}
#navigazione-mobile{
	background-color: #111;
	width:100%;
	height: 100vh !important;
	z-index: 2;
	text-align: center;
	position: fixed;
	top: 0;
	left:-100%;
	display: flex;
	transition: 0.4s;
	opacity:0;
}
#navigazione-mobile.show{
	left:0;
	opacity:1;
	transition: 0.4s;
}

#menu-menu-principale-1 {
	vertical-align: middle;
	display: flex;
}
#navigazione-mobile a span{
	color: #fff;
}

.navbar {
	position: relative;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	padding: 0;
	margin:0 5%;
	width:96%;
}

@media(max-width:991px){
	.navbar-nav .nav-link{
		margin-top:0;
		margin-bottom:0;
	}
	
	.menu-mobile .prenotazione-button{
		border:1px solid #7E684E;
		padding-left:20px;
		padding-right:20px;
		margin-top: 20px;
		transition: 0.3s;
	}
	
	.menu-mobile .prenotazione-button:hover{
		background-color: #7E684E;
		transition: 0.3s;
	}
}

@media(min-width: 992px) and (max-width: 1150px){
	.navbar-expand-lg .navbar-nav .nav-link{
		padding-left:6px;
		padding-right: 6px;
	}
}

@media(min-width: 1150.99px) and (max-width: 1439.99px){
	.navbar-expand-lg .navbar-nav .nav-link{
		padding-left:10px;
		padding-right: 10px;
	}
}

@media(min-width: 1440px){
	.navbar-expand-lg .navbar-nav .nav-link{
		padding-left:20px;
		padding-right: 20px;
	}
}



.current-menu-item span{
	position: relative;
}

.current-menu-item span::after{
	content: "";
	bottom: -1px;
	left:0;
	position: absolute;
	background-color: #fff;
	width: 100%;
	height: 1px;
}

.z-index{
	position: relative;
	z-index:1;
}

.overlay{
	width: 100%;
	height: 100%;
	position: absolute;
	top:0;
	left:0;
	background-color: rgba(0,0,0,0.2);
}
/* FOOTER */

#footer{
	background-color: #1c1716;
}

#footer #menu-menu-principale-1{
	display: flex;
	flex-direction: column;
}

.wpml-ls-legacy-list-horizontal{
	padding-right: 0 !important;
}

#footer a,#footer p{
	color:#ddd;
}

#footer ul{
	list-style: none;
}

#footer ul li{
	font-size: 1.15rem;
}


/* PAGINE */

.brown{
	color: #7E684E !important;
}
.brown_back{
	background-color: #7E684E;
}

.light_brown_back{
	background-color: rgba(126, 104, 78, 0.196);
}

.white{
color: #fff !important;
}

.grey_back{
	background-color: #E6E6E6;
	
}

.button{
	color: var(--black);
	border: 1px solid var(--black);
	display: inline-block;
	padding: 8px 25px;
	font-size: 1rem;
	text-transform: uppercase;
	font-family: "Montserrat", sans-serif;
	font-weight: 400;
}

.tf-button-link{
	color: var(--white) !important;
	border: 1px solid var(--black);
	display: inline-block;
	padding: 15px 35px;
	font-size: 1rem;
	text-transform: uppercase;
	font-family: "Montserrat", sans-serif;
	font-weight: 400;
	background-color: var(--black);
	transition: 0.3s;
}

.tf-button-link:hover, .tf-button-link:active, .tf-button-link:focus{
	color:var(--black) !important;
	border: 1px solid var(--black);
	background-color: transparent;
	text-decoration: none !important;
	transition: 0.3s;
}

.spa_text .button:hover{
	color: #fff; 
}

.button-white{
	color: #fff;
	border: 1px solid #fff;
	display: inline-block;
	padding: 8px 20px;
	font-size: 0.85rem;
	text-transform: uppercase;
	font-weight:600;
	font-family: "Montserrat", sans-serif;

}

video{
	height: 100vh;
	width: 100%;
	object-fit: cover;
}

.button:hover{
	color: #fff;
	background-color: var(--black);
	text-decoration: none;
	transition: 0.3s;
	font-weight:600;
}

.button-white:hover{
	color: var(--black);
	background-color: #fff;
	text-decoration: none;
	transition: 0.3s;
}

/* #page-servizi #hero-section {
	height: 100vh;
} */

@media(max-width:991px){
	#page-servizi #hero-section{
		height: 60vh;
		background-position: center !important;
	}
}

#hero-section{
	height: 75vh;
}


.slideshow-hero, .slideshow-hero .slick-list{
	height:100vh;
}

#hero-section-home .slick-slide {
	height: 100vh;
}

#hero-section-home{
	height:100vh;
	position: relative;
}

#hero-section-home .bannerpop{
	position: absolute;
	bottom:7%;
	right:3%;
	width:230px;
	height: auto;
	z-index: 1;
}

#hero-section-home .bannerpop .close{
	position: absolute;
	top: -40px;
	right:0;
	width: 35px;
	height: 35px;
	margin-bottom:3px;
}

#hero-section-home .bannerpop .close:hover{
	cursor: pointer;
}

#hero-section-home .bannerpop .close svg{
	width:100%;
	height: 100%;
}

#hero-section-home .bannerpopup-content{
	padding: 10px;
	border-radius:5px;
	box-shadow: 0 0 10px rgba(0,0,0,0.1);
	background-color: rgba(255,255,255,0.7);
	transform: scale(1);
	transition: 0.4s;
	width:100%;
	height: 100%;
}

#hero-section-home .bannerpopup-content:hover{
	transform: scale(1.03);
	transition: 0.4s;
	
}

#hero-section-home .bannerpop-content:hover p{
	text-decoration: none;
}

#hero-section-home .overlay{
	height: 100vh;
}

@media(max-width:991px){
	#hero-section{
		height: 60vh;
	}
	
	#hero-section-home .overlay{
		height: 60vh;
	}
	
	#hero-section-home{
		height:60vh;
	}
	
	.slideshow-hero, .slideshow-hero .slick-list{
		height:60vh;
	}
	
	slideshow-hero img{
		height:100%;
		width: 100%;
		object-fit:cover;
	}
	
	#hero-section-home .slick-slide {
		height: 60vh;
	}
}

#hero-section-home .slick-slide img{
	object-fit: cover;
	width:100%;
	height: 100%;
}

.slideshow .slick-slide {
	float: left;
	height: 100%;
	min-height: 1px;
	padding-left:8px;
	padding-right: 8px;
}

.slideshow .slick-slide img {
	height: clamp(220px, 33.854vw, 650px);
	width: auto;
}

.border-bottom{
	border-bottom: 1px solid #fff !important;	
}

#contatto_natura {
	height:650px;
}

@media(max-width:991px){
	#contatto_natura {
		height:500px;
	}
	
}

#servizi_chalet .border-bottom {
	border-color: rgba(255,255,255,0.7) !important;
}

#chalet_intro svg{
	width: 160px;
	height: auto;
}

#esperienza_cridola {
	height: 1100px;
}

@media(max-width:991px){
	#esperienza_cridola {
		height: 500px;
	}
}

.half-overlay{
	width: 100%;
	height: 90%;
	position: absolute;
	bottom:0;
	left:0;
	background: rgb(0,0,0);
	background: linear-gradient(0deg, rgba(0,0,0,0.4) 0%, rgba(0,0,0,0.3) 65%, rgba(0,0,0,0) 100%);
}

.half-overlay-reverse{
	width: 100%;
	height: 65%;
	position: absolute;
	top:0;
	left:0;
	background: rgb(0,0,0);
	background: linear-gradient(180deg, rgba(0,0,0,0.4) 0%, rgba(0,0,0,0.3) 45%, rgba(0,0,0,0) 100%);
}

@media(max-width:991px){
	.half-overlay{
		width:100%;
		height: 100%;
		background-color: rgba(0,0,0,0.2);
	}
	
	#esperienza_cridola .half-overlay {
		width:100%;
		height: 30%;
		background: rgb(0,0,0);
		background: linear-gradient(0deg, rgba(0,0,0,0.4) 0%, rgba(0,0,0,0.3) 35%, rgba(0,0,0,0) 100%);
	}
	
}


.montagne_back{
	width: 100%;
	height: auto;
	position: absolute;
	bottom: 0;
	left:0;
}

.montagne_back svg{
	width:100%;
	height: auto;
}

#chalet_intro .montagne_back svg{
	width: 100%;
	height: auto;
	position: absolute;
	bottom: 0;
	left:0;
}

input{
	background-color: transparent;
	border:none;
	border-bottom: 1px solid rgba(255, 255, 255, 0.397);
	width:100%;
	padding: 10px 10px;
	color: #fff;
	border-radius: 0;
	margin-bottom: 10px;
}



#form_candidatura input{
	background-color: transparent;
	border:none;
	border-bottom: 1px solid rgba(0, 0, 0, 0.397);
	width:100%;
	padding: 10px 0;
	color: #000;
}

textarea{
	background-color: transparent;
	border:none;
	border-bottom: 1px solid rgba(255, 255, 255, 0.397);
	width:100%;
	padding: 10px 10px;
	color: #fff;
	border-radius: 0;
}

#form_candidatura textarea{
	background-color: transparent;
	border:none;
	border-bottom: 1px solid rgba(0, 0, 0, 0.397);
	width:100%;
	padding: 10px 0;
	color: #000;
}

.wpcf7-form-control-wrap{
	width:100%;
	display: inline-block;
}

.wpcf7 form.invalid .wpcf7-response-output, .wpcf7 form.unaccepted .wpcf7-response-output, .wpcf7 form.payment-required .wpcf7-response-output{
	color:#fff;
	background-color: var(--brown);
}

::placeholder{
	color: rgba(255,255,255,0.7);
}

#form_candidatura ::placeholder{
	color: rgba(0,0,0,0.5);
}

input[type=checkbox], input[type=radio],#form_candidatura input[type=checkbox],#form_candidatura input[type=radio]{
	width:15px;
	height: 15px;
	margin-right:5px;
}

.wpcf7-list-item{
	margin:0 !important;
}

.wpcf7-list-item-label{
	color: #fff !important;
}

#form_candidatura .wpcf7-list-item-label{
	color:#000 !important;
}

input[type=submit]{
	margin-top: 30px;
	width: 50%;
	color: #fff;
	border: 1px solid #fff;
	display: inline-block;
	padding: 8px 25px;
	font-size: 1rem;
	text-transform: uppercase;
	font-family: "Montserrat", sans-serif;
	font-weight: 400;
}

@media(max-width:991){
	input[type=submit]{
		width:100%;
	}
}

#form_candidatura input[type=submit]{
	margin-top: 30px;
	width: 60%;
	color: #000;
	border: 1px solid #000;
	display: inline-block;
	padding: 8px 25px;
	font-size: 1rem;
	text-transform: uppercase;
	font-family: "Montserrat", sans-serif;
	font-weight: 400;
}

.slick-dots li button:before,.slick-dots li button:before{
	color:#fff !important;
}

.slick-dots li button:before{
	font-size: 9px !important;
}

.slick-dots{
	bottom: 30px !important;
	z-index: 10;
}

.slick-prev{
	left: 50px !important;
	z-index: 2;
	width: 50px !important;
	height: 50px !important;
	opacity: .8;
	top:50%;
	transform: translateY(-50%);
	top: 48% !important;
}
.slick-next{
	right: 50px !important;
	z-index: 2;
	width: 50px !important;
	height: 50px !important;
	opacity: .8;
	top: 48% !important;
}

@media(max-width:991px){
	.slick-prev,.slick-next{
		display: none;
	}
}

.banner-selettori button{
	border:none;
	background-color: transparent;
	margin-left:30px;
	margin-right: 30px;
	text-transform: uppercase;
	color: #fff;
	position: relative;
	padding:0;
}

@media(max-width:991px){
	.banner-selettori button{
		margin-top: 8px;
		margin-bottom:8px;
	}
}

.banner-selettori button::after{
	content:"";
	width:100%;
	height: 1px;
	transition: 0.3s;
	background-color:#fff;
	left:0;
	bottom: 0;
	position: absolute;
	opacity:0;
}

.banner-selettori .w3-red::after{
	content:"";
	width:100%;
	height: 1px;
	transition: 0.3s;
	background-color:#fff;
	left:0;
	bottom: 0;
	position: absolute;
	opacity:1;
}

.banner-selettori button:hover::after{
	opacity:1;
	transition: 0.3s;
}

.vertical-scroll{
	background-attachment: fixed;
}

@media(max-width:991px){
	.vertical-scroll{
		background-attachment: scroll;
	}
}

/* form di contatto */

.form-half p{
	display: flex;
	justify-content: space-between;
}

.form-half p .wpcf7-form-control-wrap{
	width: 49%;
}

.news a:hover{
	text-decoration: none;
}

.read_more {
	display: inline-block;
	position:relative;
}

.read_more::after{
	width:100%;
	height:1px;
	background-color:#111;
	bottom:-1px;
	transition:0.3s;
	left:0;
	position: absolute;
	content: "";
}

.read_more:hover::after{
	bottom:1px;
	transition:0.3s;
}

.lang-selector{
	border: 1px solid #fff;
	color: #fff;
	font-size:15px;
	width: 150px;
	padding-top: 5px;
	padding-bottom:5px;
	display: flex;
	align-items: center;
	justify-content:center;
	text-transform: uppercase;
	text-align: center;
	
}

.lang-selector span{
	font-size: 14px;
}

.single_service{
	height: 280px;
}

#page-camere .elenco_servizi img{
	height: 55px;
}


#page-camere #hero-section {
background-position: 50%;
}

@media(max-width:991px){
	#page-camere #hero-section {
		background-position: 60%;
	}
}

.wpcf7 form .wpcf7-response-output{
	color: #fff !important;
	margin-left:0 !important;
	margin-right:0 !important;
}

#staff_cridola .wpcf7 form .wpcf7-response-output{
	color:#111;
}

#cmplz-document, .editor-styles-wrapper .cmplz-unlinked-mode{
	max-width:100% !important;
	width:100% !important;
}

.grecaptcha-badge{
	display: none !important;
}

.page-template-page-contatti .grecaptcha-badge{
	display: flex !important;
}

@media(max-width:991px){
	#cmplz-manage-consent .cmplz-show{
		font-size: 12px;
		padding-top: 5px !important;
		padding-bottom: 5px !important;
		height: 35px !important;
	}
}

/* POPUP */

.popup{
	display: none;
	  position: fixed;
	  top: 0;
	  left: 0;
	  width: 100%;
	  height: 100%;
	  background-color: rgba(0,0,0,0.5);
	  z-index: 9999;
}

.popup .banner-content{
	position: absolute;
	  top: 50%;
	  left: 50%;
	  transform: translate(-50%, -50%);
	  background-color: white;
	  padding: 50px 100px;
	  overflow: auto; /* aggiunto overflow e altezza */
	  height: 500px;
	  width: 90%;
	  max-height: 80%; /* altezza massima del contenuto */
	  /* border-radius: 5px; */
	  padding-top: 50px;
	  padding-bottom: 50px;
	  display: flex;
	  flex-direction: column;
	  justify-content: center;
}



@media(max-width: 991px){
	.popup .banner-content{
		padding: 30px 30px;
	}
}
.popup .banner-content a{
	line-height: 1.3;
}

.close-popup-button{
	display: flex;
	align-items: center;
	justify-content: center;
	border: none;
	height: 25px;
	width: 25px;
	border: 1px solid #000;
	background-color: transparent;
	border-radius: 50%;
	position: absolute;
	top: 15px;
	right: 15px;
	padding-bottom:2px;
}

ul li{
	list-style-position: inside;
}

.core-wrapper__inner{
	position: relative !important;
}

.dogs{
	width:130px;
	height:130px;
	position:absolute;
	left:-50px;
	top:-50px;
	opacity:0.15;
}

.dogs svg{
	width:100%;
	height: auto;
	object-fit: cover;
}

.dogs-home svg{
	width:30px;
	height: auto;
	object-fit: cover;
}

#popup{
	position: fixed;
	z-index: 4;
	padding:50px;
	height: auto;
	width: 70%;
	background-color: #fff;
	top: 50%;
	left:50%;
	transform: translate(-50%, -50%); 
	box-shadow: 0 0 20px rgba(0,0,0,0.1);
	text-align: center;
}

@media(max-width: 991px){
	#popup{
		width: 90%;
		margin: 0 auto;
	}
}

#popup #close-popup-button{
	position: absolute;
	top:0;
	left:0;
	border:none;
	color:#fff;
	background-color: #000;
	padding: 5px 10px;
}

#page-servizi .w3-bar-item{
	width:100%;
	text-align: left;
	color: #fff !important;
	background-color:transparent;
	border:none;
	font-size: 20px;
	padding: 5px 0;
}

#page-servizi .w3-bar-item:hover{
	text-decoration: underline;
}

#page-servizi .w3-bar-item.w3-red{
	font-weight: 600 !important;
}


.open-lang {
  display: none;
  transition: opacity 3s;
  
}

.open-lang span{
	color:#fff;
	text-transform: uppercase;
}
.open-lang.show {
  display: block;
  opacity: 1;
  transition: opacity 3s;
}
.wpml-ls-item span{
text-decoration:center !important;
}


ul .wpml-ls-menu-item a{
justify-content:center;
}

#footer ul .wpml-ls-menu-item a{
justify-content:left;
text-transform: capitalize;
}

#navigazione-mobile li.wpml-ls-current-language span{
	color: #7E684E;
}

.open-lang li.wpml-ls-current-language span{
	font-weight: 800;
}

#footer li.wpml-ls-current-language span{
	color: #7E684E;
	font-weight: 600;
}

.radius-image{
	width: 35px;
	height: 35px;
}
.radius-image img{
	width: 27px;
	height: 27px;
}

#page-spa .button:hover{
	color:#fff;
}

.payment-form__input[_ngcontent-sgn-c98], .payment-form__textarea[_ngcontent-sgn-c98]{
	background-color:#333 !important;
}

#page-prenotazioni textarea, #page-prenotazioni input{
color: #000 !important;
}

.single p{
	margin-bottom: 1rem;
}