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


/*
Theme Name: WL Pitture
Author: Neiko srl
Author URI: http://www.neiko.it/
Description: Wl Pitture 2023
Version: 1.0
License: GNU General Public License v2 or later
*/

/*  
	
	FONTS UTILIZZATI :
	
	font-family: 'Cormorant', serif;
	font-family: 'Inter', sans-serif;
	
*/

/* GENERAL */
html,body { 
	margin:0;
	padding:0;
	font-family: 'Inter', sans-serif !important;
	font-size: 16px !important;
	font-weight:400;
	text-rendering:optimizeLegibility;
	-webkit-font-smoothing:antialiased;
	-moz-font-smoothing:antialiased;
	-o-font-smoothing:antialiased;
	background-color:#101010;
	color:#fff;
	
}

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


img,a img {
	border:none!important;
	height: auto;
	width: 100%;
	object-fit: cover;
}

::-moz-selection {
	background:none repeat scroll 0 0 #FFF;
	color:#000;
}

* {
	outline:0!important;
}

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

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

a:hover { 
	cursor:pointer !important;
	color:#fff;
	text-decoration:underline;
}


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

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

.z-index {
  position: relative;
}

.first,
.second {
  opacity: 0;
  transition: opacity 2s ease-in-out;
}

/* TYPO */

.big{
	font-size: 1.1rem;  
}
.small{
	font-size: 0.9rem;	
}

h1,.h1,h2,.h2,h3,.h3,h4,.h4,h5,.h5,h6,.h6{ 

}
h1,.h1{
	font-family: 'Cormorant', serif;
}


h2,.h2{
	font-family: 'Cormorant', serif;
	font-size: 2.5rem;
}

h3,.h3{
	font-family: 'Inter', sans-serif;
	font-size: 1.3rem;
	line-height: 1.7;
}

h4,.h4{
	font-family: 'Inter', sans-serif;
	font-size: 1.2rem;
	line-height: 1.7;
}

p{
	margin: 0;
	padding:0;
}

@media(max-width:991px){
	h2,.h2{
		font-size: 2rem;
	}
}
.navbar{
	padding: 10px 5%;
	position: fixed;
	width: 100%;
	top: 0;
	left: 0;
	z-index: 10;
	border-bottom: 1px solid #fff;
	background-color: rgba(0,0,0,0.25);
}

.slick-dots {

	bottom: -35px !important;
	
}

@media(max-width:991px){
	
	.margin-top{
		margin-top: 80px;
	}
	.navbar{
		background-color: #000;
	
	}
	.navbar-dark .navbar-nav .nav-link{
		padding-top: 20px;
		padding-bottom:20px;
		text-align: center;
		padding-left:0;
	
	}
}

.scroll .navbar{
	background-color: #000;
}

.navbar svg{
	width: 85px;
	height: auto;
}

@media(max-width:991px){
	.navbar svg{
		width: 70px;
		
	}
}

.navbar-dark .navbar-nav .nav-link{
	color: #fff;
	text-transform: capitalize;
	padding-left: 50px;
	text-transform: uppercase;
	
}

@media(max-width:991px){
	.navbar-dark .navbar-nav .nav-link{
	
		padding-left: 0;
		
	}
}

.navbar-dark .navbar-nav .nav-link:hover{
	color: #fff;
}

.light-background{
	background-color: #EFEFEF;
}

.black-text{	
	color: #212121;
}
a.black-text:hover{
	color: #212121;	
}

/* contact form */

input{
	width: 100%;
	border: none;
	margin-bottom: 20px;
	font-size: 16px;
	padding: 8px 10px;
}
textarea{
	width: 100%;
	border: none;
	margin-bottom: 20px;
	font-size: 16px;
	padding: 8px 10px;
}
input[type=checkbox]{
	width: 13px;
	height: 13px;
}
.wpcf7-acceptance label{
	font-size: 13px;
	line-height: 1.2;
	margin-bottom: 20px !important;
	
}

.wpcf7-acceptance .wpcf7-list-item-label{
	bottom: 2px;
	position: relative;
	font-size: 13px;
}

.wpcf7-submit{
	width: 200px;
	background-color: #000;
	color: #fff;
}

.wpcf7-not-valid-tip{
	font-size: 15px !important;
}
	

.btn-primary{
	display: inline-block;
	border: 1px solid #000;
	background-color: transparent;
	color: #000;
	text-transform: uppercase;
	font-size: 0.9rem;
	padding: 8px 30px;
	border-radius: 0;
	transition: 0.3s;
}

.btn-primary-white{
	display: inline-block;
	border: 1px solid #fff;
	background-color: transparent;
	color: #fff;
	text-transform: uppercase;
	font-size: 0.9rem;
	padding: 8px 30px;
	border-radius: 0;
	transition: 0.3s;
}

.btn-primary:hover{
	background-color: #000;
	color: #fff;
	transition: 0.3s;
	outline: none;
	
}

.btn-primary:not(:disabled):not(.disabled).active:focus, .btn-primary:not(:disabled):not(.disabled):active:focus, .show>.btn-primary.dropdown-toggle:focus{
	box-shadow: none;
	background-color: #fff;
	border-color: #000;
	color: #000;
	outline: none;
}

.btn-primary:not(:disabled):not(.disabled).active, .btn-primary:not(:disabled):not(.disabled):active, .show>.btn-primary.dropdown-toggle{
	background-color: #fff;
	outline: none;
}

.btn:hover, .btn:active, .btn:focus{
	border-color: #000;
	background-color: #fff !important;
	color: #000;
	outline: none;
}

/* LOADER */

#loading {
	position:fixed;
	left:0;
	top:0;
	width:100%;
	height:100%;
	z-index:998;
	background-color:#fff;
}

.loader {
	color:#333; 
	font-size:50px;
	text-indent:-9999em;
	overflow:hidden;
	width:1em;
	height:1em;
	border-radius:50%;
	margin:50px auto;
	position:relative;
	top:40%;
	-webkit-transform:translateZ(0);
	-ms-transform:translateZ(0);
	transform:translateZ(0);
	-webkit-animation:loadnk 1.7s infinite ease,round 1.7s infinite ease;
	animation:loadnk 1.7s infinite ease,round 1.7s infinite ease;
}

@-webkit-keyframes loadnk{0%,100%,5%,95%{box-shadow:0 -.83em 0 -.4em,0 -.83em 0 -.42em,0 -.83em 0 -.44em,0 -.83em 0 -.46em,0 -.83em 0 -.477em}10%,59%{box-shadow:0 -.83em 0 -.4em,-.087em -.825em 0 -.42em,-.173em -.812em 0 -.44em,-.256em -.789em 0 -.46em,-.297em -.775em 0 -.477em}20%{box-shadow:0 -.83em 0 -.4em,-.338em -.758em 0 -.42em,-.555em -.617em 0 -.44em,-.671em -.488em 0 -.46em,-.749em -.34em 0 -.477em}38%{box-shadow:0 -.83em 0 -.4em,-.377em -.74em 0 -.42em,-.645em -.522em 0 -.44em,-.775em -.297em 0 -.46em,-.82em -.09em 0 -.477em}}@keyframes loadnk{0%,100%,5%,95%{box-shadow:0 -.83em 0 -.4em,0 -.83em 0 -.42em,0 -.83em 0 -.44em,0 -.83em 0 -.46em,0 -.83em 0 -.477em}10%,59%{box-shadow:0 -.83em 0 -.4em,-.087em -.825em 0 -.42em,-.173em -.812em 0 -.44em,-.256em -.789em 0 -.46em,-.297em -.775em 0 -.477em}20%{box-shadow:0 -.83em 0 -.4em,-.338em -.758em 0 -.42em,-.555em -.617em 0 -.44em,-.671em -.488em 0 -.46em,-.749em -.34em 0 -.477em}38%{box-shadow:0 -.83em 0 -.4em,-.377em -.74em 0 -.42em,-.645em -.522em 0 -.44em,-.775em -.297em 0 -.46em,-.82em -.09em 0 -.477em}}@-webkit-keyframes round{0%{-webkit-transform:rotate(0);transform:rotate(0)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes round{0%{-webkit-transform:rotate(0);transform:rotate(0)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}

/* HEADER */

#navigazione .current-menu-item{
	color: #fff !important;
	text-decoration: underline;
}

.navbar-dark .navbar-nav .active>.nav-link, .navbar-dark .navbar-nav .nav-link.active, .navbar-dark .navbar-nav .nav-link.show, .navbar-dark .navbar-nav .show>.nav-link{
	color: #fff;
}


/* FOOTER */

#footer{
	position: relative;
	
}

#footer::after{
	content: "";
	top: 0;
	left: 0;
	position: absolute;
	height: 100%;
	width: 100%;
	background-color: rgba(0,0,0,0.35);
}





/* PAGINE */

#video-home {
	height: 100vh;
	overflow: hidden;
	display: flex;
	align-items: center;
	justify-content: center;
	position: relative;
}


#video-home::after{	
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0,0,0,0.3);
}

#video-home .z-index{
	position: absolute;
}
video{
	width:100%;
	height: 100%;
	object-fit: cover;
}


@media(max-width:991px){
	#video-home{
	height: 55vh;
	}
	
	video{
		width:100%;
		height: 100%;
		object-fit: cover;
	}
}

.relative{
	position: relative;
}

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

#introduzione::before{
	content: "";
	position: absolute;
	width: 10%;
	left: 45%;
	top: 0;
	background-color: #fff;
	height: 1px;
}

#introduzione::after{
	content: "";
	position: absolute;
	width: 10%;
	left: 45%;
	bottom: 0;
	background-color: #fff;
	height: 1px;
}

#professionalita {
	height: 800px;
	position: relative;
	display: flex;
	align-items: end;
}

@media(max-width:991px){
	#professionalita{
	height: 600px;}
}

#professionalita::after{
	content: "";
	background: rgb(16,16,16);
	background: linear-gradient(270deg, rgba(16,16,16,1) 0%, rgba(16,16,16,0.9) 40%, rgba(16,16,16,0.7) 60%, rgba(255,255,255,0) 100%);
	top: 0;
	left: 0;
	position: absolute;
	width: 100%;
	height: 100%;
}

.hero{
	height: 100vh;
	display: flex;
	align-items: center;
	justify-content: center;
	background-repeat: no-repeat;
	background-position: center; 
	background-size: cover;
}

.hero span{
	font-size: 1.3rem;
}
.hero::after{
	content: "";
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0,0,0,0.4);
	position: absolute;
}


#video-home{
	position: relative;
}

#video-home .banner-inner{
	position: absolute;
	z-index: 9;
	bottom: 40%;
	right: 50%;
	transform: translateX(-50%);
	width: 50px;
	transition: 0.3s;
	height: 50px;
	transform: scale(1);
}
#video-home .banner-inner:hover{
	transform: scale(1.1);
	transition: 0.3s;
}

@media(max-width:991px){
	#video-home .banner-inner{
		bottom: 30px;
		right: 30px;
	}
}

.page-template-page-realizzazioni  button{
border:none;
}

#realizzazioni button.w3-red{
	text-decoration: underline;
}

#singolo-prodotto .hero-singolo{
	background-repeat:no-repeat;
	background-position: center; 
	background-size: cover;
	height: 100vh;
	display: flex;
	align-items: end;
	justify-content: start;
	padding-bottom: 80px;
	position: relative;
}
#singolo-prodotto .hero-singolo::after{
	content: "";
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	position: absolute;
	background: rgb(16,16,16);
	background: linear-gradient(0deg, #101010 0%, rgba(16, 16, 16, 0.381) 50%, rgba(255,255,255,0) 100%);
}

#gallery-prodotto .hover-image{
	position: relative;
	height: 100%;
	width:100%;
}

#gallery-prodotto .hover-image img{
	display: block;
}

#gallery-prodotto .hover-image .effect{
	width: 100%;
	height: 100%;
	background-color: rgba(0,0,0,0.3);
	position: absolute;
	top: 0;
	left: 0;
	z-index: 3;
	display: flex;
	align-items: center;
	justify-content: center;
	opacity: 0;
	transition: 0.3s;
}

#gallery-prodotto .hover-image:hover .effect{
	opacity: 1;
	transition: 0.3s;
}

@media(max-width:991px){
	.hero{
	height: 50vh;
	}
	
	.hero::after{
		content: "";
		top: 0;
		left: 0;
		width: 100%;
		height: 50vh;
		background-color: rgba(0,0,0,0.4);
		position: absolute;
	}
	
	#page-azienda .hero{
	background-position: left;
	}

}

@media(min-width:992px){
	.hero .container-fluid{
		width: 60%;
		margin: 0 auto;
	}
}


#page-azienda .finitura{
	background-repeat: no-repeat; 
	background-position: center center; 
	background-size: cover;
	height: 600px;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 30px;
	text-align:center;
	position: relative;
}
@media(max-width:991px){
	#page-azienda .finitura{
		height: 350px;
	}
}

#page-azienda .finitura::after{
	content: "";
	top: 0;
	left: 0;
	width: 100%;
	height:100%;
	position: absolute;
	background-color: rgba(0,0,0,0.35);
}
.elenco-finiture{
	position: relative;
}
.elenco-finiture::after{
	content: "";
	bottom: 0;
	left: 0;
	background-color: #EFEFEF;
	position: absolute;
	width: 100%;
	height: 200px;
}
.anteprima{
	height: 750px;
	position: relative;
	display: flex;
	flex-direction: column;
	padding-top: 80px;
	padding-bottom:50px;
	position: relative;
}

@media(max-width:991px){
	.anteprima{
	height: 400px;
}
}

.anteprima::after{
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0,0,0,0.4);
}

.anteprima h2{
	position: relative;
	z-index:1;
	padding-left: 150px;
}
.anteprima h2::after{
	content: "";
	top: 50%;
	left: 0;
	transform: translateX(-50%);
	width: 250px;
	height: 1px;
	background-color: #fff;
	position: absolute;
}
 .anteprima p{
	position: relative;
	z-index:1;
	padding-left: 150px;
}

.anteprima:hover{
	text-transform: none;
}

#azienda #introduzione::after{
	content: "";
	bottom: 0;
	left: 0;
	background-color: #EFEFEF;
	position: absolute;
	width: 100%;
	height: 200px;			
}

@media(min-width:991px){
	#elenco-servizi .left-title{
		position: relative;
		left: 20%;
		z-index: 1;
		top: -80px;
	}
	
	#elenco-servizi .right-title{
		position: relative;
		right: 20%;
		z-index: 1;
		top: -80px;
	}
}

#page-servizi h2{
	font-size: 2.3rem;
}
.overlay{
	position: relative;
}
.overlay::after{
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0,0,0,0.3);
}

#elenco-finiture .round-image{
	width: 60px;
	height: 60px;
	border-radius: 50%;
	display: block;			
}
#elenco-finiture button.w3-bar-item{
	border:none;
	background-color: transparent;
	color: #fff;
}
#realizzazioni a:hover{
	text-decoration: none;
}

@media(min-width:991px){
	.col-lg-no-margin-y{
		margin-top: 0;
		margin-bottom: 0;
	}
}

.carosello .slick-slide{
	margin: 0 15px;
	box-shadow: 0 0 20px rgba(0,0,0,0.1);
}

.carosello .slick-prev{
	bottom: 24%;
	display: block;
	z-index: 12;
	top: inherit;
	right: -8%;
	left: inherit;
}

.slick-prev:before{
	display: none;
}
.home #realizzazioni .carosello .slick-slide .background-inner{
	position:relative;
}

.home #realizzazioni{
	position:relative;
}

@media(min-width: 1350px){
	.home #realizzazioni::after{
		content: "";
		left:0;
		bottom:0;
		position: absolute;
		width: 100%;
		height: 25%;
		background-color: #101010;
	
	}
}


.home #realizzazioni .carosello .slick-slide .background-inner::after{
	content: "";
	top: 0;
	left: 0;
	background-color: rgba(0,0,0,0.3);
	width: 100%;
	height: 100%;
	position: absolute;
	opacity: 0;
	transition: 0.3s;
}

.home #realizzazioni .carosello .slick-slide .background-inner:hover::after{
	opacity: 1;
	transition: 0.3s;
}

/* impostazioni form di contatto */

@media(min-width: 992px){
	.half-field p{
		display: flex;
		align-items: center;
		justify-content: space-between;
	}
	
	.half-field p span{
		width: 49%;
	}
	
}

.slick-prev.realizzazioni{
	display: none !important;
}

@media(min-width: 1450px){
	.slick-prev.realizzazioni{
		display: inline-block !important;
	}
}

.grecaptcha-badge{
	z-index: 999;
}

@media(min-width:992px){
	#footer .privacy-text br{
		display: none;
	}
}

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

.wpcf7-not-valid-tip{
	font-size:0.8rem !important;
	padding-bottom: 20px !important;
}