/*
Theme Name: Comavit
Author: _definitive Studio Design
Author URI: https://www.def-studio.com/
Description: Comavit - 2024
Version: 1.0
License: GNU General Public License v2 or later
*/

/*  
	
	FONTS UTILIZZATI : Helvetica Neue 
	
	COLORI UTILIZZATI : Nero: #000000 | Grigio: #4D4D4D | Bianco: #FFFFFF | Rosso Comavit: #E2001A 
	
*/

/* IMPORT TYPO */

@import url('https://fonts.cdnfonts.com/css/helvetica-neue-5'); 

/* GENERAL */
html,body {
	margin: 0;
	padding: 0;
	font-family: var(--font-family);
	font-size: 18px !important;
	text-rendering: optimizeLegibility;
	-webkit-font-smoothing: antialiased;
	-moz-font-smoothing: antialiased;
	-o-font-smoothing: antialiased;
	background-color: var(--background-color);
	color: var(--text-color);
	transition: none;
}

:root {
	--text-color: #4D4D4D;
	--text-color-hover: #BD0016;
	--text-color-black: #000000;
	--text-color-light: #FFFFFF;
	--background-color: #FFFFFF;
	--background-menu: #EDEDED;
	--background-menu-dark: #d2d2d2;
	--background-color-btn: #E2001A;
	--background-color-btn-hover: #BD0016;
	--black: #000000;
	--red: #E2001A;
	--font-family: "Roboto", sans-serif;
	--transition: all 0.3s cubic-bezier(0.23,1,0.32,1);
}

.pb40 {
	padding-bottom: 40px;
}

.navbar-padding {
	padding-top: 18vh;
}

.navbar-padding-contact {
	padding-top: 25vh;
}

@media (max-width: 991.99px) {
	.navbar-padding {
		padding-top: 9vh;
	}
	
	.navbar-padding-contact {
		padding-top: 14vh;
	}
}

@media (max-width: 767.99px) {
	.navbar-padding {
		padding-top: 12vh;
	}
	
	.navbar-padding-contact {
		padding-top: 18vh;
	}
}


@media (max-width: 575.99px) {
	.navbar-padding {
		padding-top: 10vh;
	}
	
	.navbar-padding-contact {
		padding-top: 16vh;
	}
}


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


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

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

* {
	outline:0!important;
}

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

a {
	color: inherit;
}

a ,a:visited { 
	outline-style:none;
	text-decoration:none;
	transition: var(--transition);
}

a:hover { 
	cursor: pointer !important;
	text-decoration: none;
	color: var(--text-color-hover);
}

.button:hover, .button-second:hover {
	cursor: pointer !important;
	text-decoration: none;
	background-color: var(--background-color-btn-hover);
	transform: translateY(-5px);
}



@media (max-width: 575.99px) {
	.button:hover, .button-second:hover {
		transform: translateY(0px);
	}
}




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

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

@media (max-width: 991.99px) {
	.container-fluid {
		padding-left: 25px;
		padding-right: 25px;
	}
}


/* TYPO */

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

i, .i {
	color: var(--red);
	font-style: normal !important;
}

.prodotti-correlati {
	color: var(--text-color-black);
}

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

}

h1, .h1 {
	font-weight: 500;
	font-size: clamp(1.78rem, 3.125vw, 3.33rem);
	color: var(--text-color-black);
}

h2, .h2 {
	font-weight: 500;
	font-size: clamp(1.5rem, 2.34vw, 2.5rem);
	color: var(--text-color-black);
	margin-bottom: 0px;
}

h3, .h3 {
	font-weight: 500;
	font-size: clamp(1.33rem, 2.34vw, 1.778rem);
}

h4, .h4 {
	font-weight: 500 !important;
	font-size: clamp(1.11rem, 1.25vw, 1.33rem) !important;
}

h5, .h5 {
	font-weight: 500;
	font-size: clamp(0.833rem, 1.15vw, 1.222rem) !important;
}

h6, .h6 {
	font-weight: 500;
	font-size: clamp(1.2rem, 2.34vw, 1.778rem);
	font-style: italic;
	text-align: right;
}

p, .p {
	font-weight: 400;
	font-size: clamp(0.833rem, 0.94vw, 1rem);
	margin-bottom: 0px;
}

span, .span {
	font-weight: 400;
	font-size: clamp(0.89rem, 0.94vw, 1rem);
	margin-bottom: 0px;
}

.table-desc {
	font-weight: 500;
	font-size: clamp(0.89rem, 0.94vw, 1rem);
	white-space: nowrap;
}

/* COLOR */

.light {
	color: var(--text-color-light) !important;
}

/* BUTTON */

.button {
	background-color: var(--red);
	border-radius: 8px;
	padding: 12px 24px;
	width: fit-content;
	transition: var(--transition);
	color: var(--text-color-light);
}

.button:hover {
	color: var(--text-color-light);
}

.button-second {
	background-color: var(--background-color);
	border-radius: 8px;
	padding: 12px 24px;
	width: fit-content;
	border: 1px solid var(--red);
	transition: var(--transition);
	color: var(--black);
}

.button-second:hover {
	background-color: var(--red);
	color: var(--background-color);
}

.selected-filter {
	background-color: var(--red);
	border-radius: 8px;
	padding: 12px 24px;
	width: fit-content;
	transition: var(--transition);
	color: var(--text-color-light);
}

.hide {
	display: none;
	transition: var(--transition);
}

.show {
	display: block;
	transition: var(--transition);
}

.button-second:hover .hide {
	display: block;
}

.button-second:hover .show {
	display: none;
}

.button-second.active {
	background-color: var(--red);
	border-radius: 8px;
	padding: 12px 24px;
	width: fit-content;
	transition: var(--transition);
	color: var(--text-color-light);
}

@media (max-width: 575.99px) {
	
	.button-second {
		background-color: var(--background-color);
		border-radius: 8px;
		padding: 6px 14px;
		width: fit-content;
		border: 1px solid var(--red);
		transition: var(--transition);
		color: var(--black);
	}
	
	.button-second.active {
		background-color: var(--red);
		border-radius: 8px;
		padding: 6px 14px;
		width: fit-content;
		transition: var(--transition);
		color: var(--text-color-light);
	}
	
	.button {
		background-color: var(--red);
		border-radius: 8px;
		padding: 6px 14px;
		width: fit-content;
		transition: var(--transition);
		color: var(--text-color-light);
	}
}


/* LOADER */

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

/*
.loader {
	position: absolute;
	left: 50%;
	top: 50%;
	width: 150px;
	translate: -50% -50%;
	animation: spin 1.5s infinite cubic-bezier(0.68, -0.55, 0.27, 1.55);
}

@keyframes spin {
  0% {
	transform: rotate(0deg);
  }
  100% {
	transform: rotate(360deg);
  }
}
*/



.loader {
	color: var(--red);  
	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 */

.navbar-brand {
	width: fit-content;
}

@media (max-width: 991.99px) {
	.navbar-brand img {
		width: fit-content;
		max-width: 170px;
	}
	
	#menu-item-wpml-ls-16-en span {
		text-transform: capitalize;
		font-size: 1.778rem;
		color: var(--text-color);
	}
}

@media (max-width: 575.99px) {
	
	.navbar {
		padding: 0;
	}
	
	.navbar-brand {
		padding: 0;
	}
	
	.navbar-brand img {
		width: 100%;
		height: auto;
	}
}

.wpml-ls-display {
	text-transform: capitalize !important;
	color: var(--text-color) !important;
}

ul .wpml-ls-menu-item a {
	display: flex;
	align-items: center;
	justify-content: center;
}

.navbar-expand-lg .navbar-nav .nav-link {
padding-right: 1.39rem;
padding-left: 1.39rem; 
}

.navbar-nav li a {
	text-transform: capitalize;
	font-size: clamp(1rem, 1.041vw, 1.11rem);
	color: var(--text-color);
}

#header {
	border-bottom: 1px solid var(--red);
	position: fixed;
	z-index: 10 !important;
	background-color: var(--background-color);
	padding: 20px 40px; /* Padding iniziale */
	transition: padding 0.3s ease; /* Transizione fluida sul padding */
}

/* .dropdown-menu {
position: absolute !important;
top: 100% !important;
left: 50% !important;
z-index: 1050 !important;
transform: translate(-50%, 15px) !important;
float: center;
width: 10rem;
padding: 0;
margin: 0;
font-size: 1rem;
color: var(--text-color);
text-align: center;
list-style: none;
background-color: var(--background-menu);
background-clip: padding-box;
border: 0px;
border-top-left-radius: 0px;
border-top-right-radius: 0px;
border-bottom-left-radius: 20px;
border-bottom-right-radius: 20px;
text-transform: capitalize;
transition: opacity 0.3s ease;
}

.dropdown.show > .dropdown-menu {
  display: block;
} */

#navbarNav {
	display: flex;
	justify-content: end;
}


/* Stile del dropdown */
.navbar-nav .dropdown-menu {
	display: none;
	position: absolute;
	top: 100%;
	left: 50%;
	transform: translate(-50%, 0px);
	background: var(--background-menu);
	min-width: 200px;
	border: 0px;
	border-top-left-radius: 0px;
	border-top-right-radius: 0px;
	border-bottom-left-radius: 20px;
	border-bottom-right-radius: 20px;
	text-transform: capitalize;
	float: center;
	width: 10rem;
	padding: 0;
	margin: 0;
	font-size: 1rem;
	color: var(--text-color);
	text-align: center;
	list-style: none;
	background-color: var(--background-menu);
	background-clip: padding-box;
	overflow: hidden;
}

/* Mostra il menu quando il mouse è sopra */
.navbar-nav .dropdown:hover .dropdown-menu {
	display: block;
}

/* Aggiunge una transizione morbida */
.navbar-nav .dropdown-menu a {
	padding: 15px 15px;
	display: block;
	color: black;
	transition: background 0.3s ease-in-out;
}

.navbar-nav .dropdown-menu a:hover {
	background-color: var(--background-menu-dark);
	border-radius: inherit;
}

/* Posizionamento corretto nei dropdown annidati */
.navbar-nav .dropdown {
	position: relative;
}

.navbar-toggler {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  width: 60px;
  height: 30px;
  background: none;
  border: none;
  cursor: pointer;
  z-index: 1000;
}

.navbar-toggler span {
  display: block;
  width: 100%;
  height: 3px;
  background-color: var(--black);
  transition: transform 0.3s, opacity 0.3s;
}

.navbar-toggler.active span:nth-child(1) {
  transform: translateY(9px) rotate(45deg);
}

.navbar-toggler.active span:nth-child(2) {
  opacity: 0;
}

.navbar-toggler.active span:nth-child(3) {
  transform: translateY(-10px) rotate(-45deg);
}

/* Mobile: i dropdown funzionano al click */
@media (max-width: 991px) {
	.navbar-nav .dropdown-menu {
		display: none;
		position: static;
		box-shadow: none;
	}
	
	.navbar-nav .dropdown.open .dropdown-menu {
		display: block;
	}
}


.menu-item li {
	display: block;
	width: 100%;
	padding: 0.8rem 1.5rem !important;
	clear: both;
	font-weight: 400;
	color: var(--text-color);
	text-align: inherit;
	background-color: transparent;
	border: 0;
}

.menu-item li a {
	text-transform: none;
}

@media (max-width: 575.99px) {
	.menu-item li a {
		text-transform: none !important;
	}
}


/* Media Query per schermi inferiori a 1200px */
@media (max-width: 1250px) {
	
	.navbar-nav li a {
		text-transform: capitalize;
		font-size: 1.778rem;
		color: var(--text-color);
	}
	
	.dropdown-menu li a {
		font-size: 1.3rem;
	}

	
	.dropdown-menu {
		display: none !important;
	}
	
	.dropdown-menu.show {
		display: block !important;
		left: 0%;
		position: relative !important;
		left: 0 !important;
		top: 0 !important;
		visibility: visible !important;
		opacity: 1 !important;
		transform: translate(0, 0) !important; /* Annulla qualsiasi trasformazione */
		z-index: 9 !important;
		font-size: clamp();
		color: var(--text-color);
		text-align: left;
		background-color: transparent;
		border: 0px;
		border-radius: 0 !important;
		text-align: center;
	}
	
	.navbar-nav li {
		text-align: center;
		
	}
	
	.menu-item li {
		display: block;
		width: 100%;
		padding-top: 0.8rem !important;
		padding-bottom: 0 !important;
		padding-left: 0 !important;
		padding-right: 0 !important;
		clear: both;
		font-weight: 400;
		color: var(--text-color);
		text-align: inherit;
		background-color: transparent;
		border: 0;
		text-align: center;
	}
	
	.navbar-collapse {
		position: fixed;
		top: 0;
		right: -100%; /* Inizia nascosto fuori dallo schermo */
		width: 100%;
		height: 100vh !important;
		background-color: white; /* Scegliere un colore appropriato */
		z-index: 999; /* Assicurarsi che sia sopra tutto il resto */
		display: flex;
		align-items: center;
		justify-content: center;
		overflow-y: auto; /* Permette lo scroll se il contenuto è troppo */
		transition: right 0.3s ease-out; /* Animazione */
	}
	
	.navbar-expand-lg .navbar-nav {
		position: absolute;
		flex-direction: column;
		left: 50%;
		top: 50%;
		transform: translate(-50%, -50%);
	}
	
}

@media (max-width: 992px) {
.navbar-expand-lg .navbar-collapse {
	display: flex !important;
	flex-direction: row-reverse;
}

.collapse:not(.show) {
	display: none;
}
}

@media (max-width: 575.99px) {
	.navbar-nav {
		gap: 30px;
	}
	
	.navbar-nav li a {
		text-transform: capitalize;
		font-size: 1.6rem;
		font-weight: 500;
		color: var(--text-color);
	}
	
	.dropdown-menu li a {
		font-size: 1.3rem;
	}
	
	.navbar-collapse {
		position: fixed;
		top: 0;
		right: -100%;
		width: 100%;
		height: 100vh;
		background-color: white;
		z-index: 999;
		display: flex;
		align-items: center;
		justify-content: center !important;
		overflow-y: auto;
		transition: right 0.3s ease-out;
	}
	
	.navbar-expand-lg .navbar-nav {
	position: absolute;
	flex-direction: column;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	}
}

.wpml-ls-display {
	text-transform: capitalize !important;
	color: var(--text-color) !important;
}

a.temp-disabled {
	pointer-events: none;
}

/* FOOTER */

.footer-link {
	width: fit-content;
	display: inline-block;
	color: var(--text-color);
	transition: var(--transition);
	margin: 0;
}

.footer-link:hover {
	color: var(--text-color-hover);
	cursor: pointer;
}

.footer-link-small, .footer-span {
	font-size: clamp(0.66rem, 0.78vw, 0.83rem);
	width: fit-content;
	display: inline-block;
	color: var(--text-color);
	transition: var(--transition);
	margin: 0;
}

.footer-link-small:hover {
	color: var(--text-color-hover);
}

footer, #footer {
	border-top: 1px solid var(--red);
	z-index: 1;
}


/* PAGINE */

/* GENERAL */


.red-line-right {
	width: 100%;
	height: 2px;
	background-color: var(--red);
	position: absolute;
	right: 0;
}

.red-line-left {
	width: 100%;
	height: 2px;
	background-color: var(--red);
	position: absolute;
	left: 0;
}

.red-line {
	display: none;
}

@media (max-width: 767.99px) {
	.red-line {
		display: block;
		width: 100%;
		height: 1px;
		margin: 20px 0;
		background-color: var(--red);
	}
}

/* HOMEPAGE */

.desc-hero {
	color: var(--red);
	transition: var(--transition);
	text-decoration: none;
}

.desc-hero:hover {
	color: var(--background-color-btn-hover);
}

.elenco {
	padding-bottom: clamp(1.66rem, 2.60vw, 2.78rem);
}

.span ul {
	margin-bottom: 0px;
	padding-left: 0px;
	list-style: none;
}

.span ul li {
	position: relative; /* Imposta i li per avere una posizione relativa */
	padding-left: clamp(2rem, 2.3vw, 2.45rem); /* Aggiungi padding a sinistra per fare spazio al bullet */
}

.span ul li::before {
	content: "";
	background-color: var(--red);
	position: absolute; /* Posiziona assolutamente il bullet rispetto al suo li */
	left: 0; /* Allinea il bullet all'inizio del li */
	top: 0; /* Allinea il bullet in alto, aggiusta questo valore se necessario per centrarlo con il testo */
	transform: translateY(50%);
	width: clamp(0.67rem, 0.73vw, 0.78rem);
	height: clamp(0.67rem, 0.73vw, 0.78rem);
	border-radius: 50%;
	margin-right: clamp(1.30rem, 1.56vw, 1.67rem);
}

.info-wrapper {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 2;
}

.overlay-40 {
	background-color: var(--black);
	opacity: 0.5;
	width: 100%;
	height: 100%;
	display: block;
	position: absolute;
	left: 0;
	top: 0;
	z-index: 1;
} 

.overlay-30 {
	background-color: var(--black);
	opacity: 0.3;
	width: 100%;
	height: 100%;
	display: block;
	position: absolute;
	left: 0;
	top: 0;
	z-index: 1;
} 

.overlay-40-product {
	background-color: var(--black);
	opacity: 0.5;
	width: calc(100% - 30px);
	height: 100%;
	display: block;
	position: absolute;
	left: 15px;
	top: 0;
	z-index: 1;
} 

.no-padding {
	padding-left: 0px;
	padding-right: 0px;
}

.no-padding-right {
	padding-right: 0px;
}

.no-padding-left {
	padding-left: 0px;
}

@media (max-width: 991.99px) {
	.no-padding {
		padding-left: 0px;
		padding-right: 0px;
	}
	
	.no-padding-right {
		padding-right: 0px;
	}
	
	.no-padding-left {
		padding-left: 0px;
	}
	
}

@media (max-width: 767.99px) {
	.no-padding-right {
		padding-right: 15px;
	}
}

@media (max-width: 575.99px) {
	.no-padding-right {
		padding-right: 0px;
	}
}


.img-background {
	height: 60vh;
	object-fit: cover;
	object-position: left 15%;
}

.product-title-home {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 2;
	text-align: center;
}

.img-product-home {
	aspect-ratio: 1/1;
	object-fit: cover;
	object-position: center;
	position: relative;
	
}

.home-product {
	display: inline-block;
	overflow: hidden;
	transition: var(--transition);
}

.home-product img {
	scale: 1;
	transition: var(--transition);
}

.home-product:hover img {
	scale: 1.05;
	transition: var(--transition);
}

.slider-item {
	position: relative;
}

.hero-img {
	width: 100%;
	height: 82vh;
	position: relative;
	top: 0;
	left: 0;
	display: block;
	object-fit: cover;
	object-position: center center;
	overflow: hidden;
}

.hero-img-normal {
	width: 100%;
	height: 82vh;
	position: relative;
	top: 0;
	left: 0;
	display: block;
	object-fit: cover;
	object-position: center 50%;
	overflow: hidden;
}

.title-hero {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	text-align: center;
	width: 90%;
	z-index: 2;
}

@media (max-width: 1024.99px) {
	
	.hero-img {
		width: 100%;
		height: 75vh;
		position: relative;
		top: 0;
		left: 0;
		display: block;
		object-fit: cover;
		object-position: center center;
	}
	
	.hero-img img {
		width: 100%;
		height: 100%;
		object-fit: cover;
		object-position: center center;
	}
	
	.title-hero {
		display: block;
		position: absolute;
		text-align: center;
		width: 100% !important;
		top: 50%;
		left: 50%;
		margin-bottom: 0px !important;
		transform: translate(-50%, -50%);
		padding: 0 30px;
		z-index: 2;
	}
	
	.container-title {
		padding-left: 15px;
	}
}


@media (max-width: 767.99px) {
	.hero-img {
		width: 100%;
		height: 45vh;
		position: relative;
		top: 0;
		left: 0;
		display: block;
	}
	
	.title-hero {
		display: block;
		position: absolute;
		text-align: center;
		width: 100% !important;
		top: 50%;
		left: 50%;
		margin-bottom: 0px !important;
		transform: translate(-50%, -50%);
		padding: 0 30px;
		z-index: 2;
	}
}

.tns-nav {
	display: none;
}

#tns1-ow button {
	display: none;
}

/* AZIENDA */ 

.container-hero {
	width: 100%;
	height: auto;
}

#sezione-azienda {
	overflow-x: hidden;
}

@media (max-width: 575.99px) {
	#sezione-azienda {
		height: 100vh;
	}
}


.img-background-cta {
	height: 70vh;
	object-fit: cover;
	object-position: left 15%;
}

.rete-wrapper {
	width: 50%;
	left: 50%;
	position: absolute;
	top: 50%;
	transform: translate(-50%, -50%);
	z-index: 2;
}

@media (max-width: 767.99px) {
	.rete-wrapper {
		width: 75%;
		left: 50%;
		position: absolute;
		top: 50%;
		transform: translate(-50%, -50%);
		z-index: 2;
	}
	
	.colonna-storia-destra {
		padding-right: 0px !important;
		padding-left: 5px;
	}
	
	.colonna-storia-sinistra {
		padding-left: 0px !important;
		padding-right: 5px;
	}
}

.red-background {
	position: absolute;
	left: 50%;
	top: 0;
	transform: translateX(-50%);
	background-color: var(--red);
	width: 33%;
	height: 100%;
	z-index: 0;	
}

.data {
	z-index: 2 !important;
}

.data-storia {
	font-weight: 700 !important;
	font-size: clamp(3rem, 6.25vw, 7.5rem) !important;
	color: var(--text-color-light) !important;
	line-height: 6rem !important;
}

@media (max-width: 767.99px) {
	.data-storia {
		line-height: 4rem !important;
	}
	
	.titoletti {
		line-height: 2rem !important;
	}
}

@media (max-width: 575.99px) {
	.data-storia {
		line-height: 2.6rem !important;
		font-size: 2.6rem;
	}
	
	
	.titoletti {
		font-size: 18px;
		line-height: 1.3rem !important;
	}
	
	.red-background {
		position: absolute;
		left: 50%;
		top: 0;
		transform: translateX(-50%);
		background-color: var(--red);
		width: 30%;
		height: 100%;
		z-index: 0;	
	}
	
}

#linea-storia {
	z-index: 1 !important;
}

.titoletti {
	font-weight: 700;
	font-size: clamp(1rem, 2.9vw, 3.33rem);
	color: var(--red);
	line-height: 2.9rem;
	-webkit-hyphens: auto;
	-moz-hyphens: auto;
	hyphens: auto;
	word-break: break-word;
}

.testo-linea {
	-webkit-hyphens: auto;
	-moz-hyphens: auto;
	hyphens: auto;
	word-break: break-word;
}

#cit-aziendale {
	margin-right: 0px !important;
}

#red-cit {
	background-color: var(--red);
	border-bottom-left-radius: clamp(1.39rem, 3.125vw, 3.33rem);
	border-top-left-radius: clamp(1.39rem, 3.125vw, 3.33rem);
}

.cit-img {
	display: block;
	position: absolute;
	left: 0;
	bottom: 0;
	transform: translate(-30%, 30%);
	width: clamp(10.5rem, 16.145vw, 17.22rem);
	height: clamp(10.5rem, 16.145vw, 17.22rem);
	border-radius: 50%;
}

@media (max-width: 991.99px) {
	.cit-img {
		transform: translate(15%, 50%);
	}
}

.name-text {
	font-weight: 500;
	font-size: clamp(1.66rem, 2.083vw, 2.22rem);
	font-style: italic;
	text-align: right;
}

.position-text {
	font-weight: 400;
	font-size: clamp(1.11rem, 1.25vw, 1.33rem);
	font-style: italic;
	text-align: right;
}

.caratteristiche-azienda {
	position: relative;
	overflow: hidden;
}

.container-btr {
  position: relative;
  width: 100%;
  min-height: 100vh;
}

.space-holder {
  position: relative;
  width: 100%;
}

.sticky {
  position: sticky;
  top: 50px;
  padding: 0 50px;
  width: 100%;
  height: 100vh;
  overflow-x: hidden;
  display: flex;
  flex-flow: column;
  box-sizing: border-box;
}

@media (max-width: 575.99px) {
	.sticky {
	  position: sticky;
	  top: 30px;
	  padding: 0 30px;
	  width: 100%;
	  height: 100vh;
	  overflow-x: hidden;
	  display: flex;
	  flex-flow: column;
	  box-sizing: border-box;
	}
}


.horizontal {
  position: relative;
  height: 50%;
  will-change: transform;
}

.cards {
  position: relative;
  height: 100%;
  /* padding: 0 0 0 50px; */
  display: flex;
  flex-flow: row nowrap;
  justify-content: flex-start;
  align-items: center;
}

.sample-card {
  position: relative;
  width: 85vw;
  height: 100%;
  margin-right: 30px;
  flex-shrink: 0;
}

.sample-card img {
  width: 100%;
  height: 90vh;
  object-fit: cover;
  object-position: center center;
}

@media (max-width: 767.99px) {
	.services {
		margin-top: -100px;
	}
}

@media (max-width: 575.99px) {
	.services {
		margin-top: -50px;
	}
}




/* PALI IN CEMENTO */

.protezioni-wrapper {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 2;
}

.img-background-cta-protezioni {
	height: 70vh;
	object-fit: cover;
	object-position: left bottom;
}

@media (max-width: 575.99px) {
	#cemento {
		width: 100%;
		overflow-x: scroll;
	}
	
	.protezioni-wrapper {
		display: flex;
		flex-direction: column;
		align-items: center;
		text-align: center;
	}
}


.table.pali td, .table.pali th {
padding: 0.75rem;
vertical-align: top;
border-top: 1px solid var(--background-menu);
padding-bottom: 50px;
}

.table.pali thead th {
	vertical-align: bottom;
}



/* PALI IN FERRO */

.arg-bottons {
	gap: 30px;
}

@media (max-width: 575.99px) {
	.cta-home {
		text-align: center;
		height: 70vh;
	}
	
	.img-background {
		object-fit: cover;
		object-position: center center;
		height: 100%;
	}
	
	.arg-bottons {
		gap: 20px;
		white-space: nowrap;
		justify-content: center;
	}
}


.anteprima-title {
	font-weight: 700;
	font-size: clamp(1.333rem, 1.66vw, 1.778rem);
	color: var(--text-color-black);
	text-transform: uppercase;
}

/* MATERIALI */

.img-background-cta-pali-ferro {
	
	height: 70vh;
	object-fit: cover;
	object-position: left center;
}

/* ACCESSORI */

.img-fluid.hide {
	display: none; /* Nasconde le icone bianche di default */
}

.button-second.active .img-fluid.hide {
	display: inline; /* Mostra l'icona bianca quando il bottone è attivo */
}

.button-second.active .img-fluid.show {
	display: none; /* Nasconde l'icona di default quando il bottone è attivo */
}

.icon-accessori {
	width: auto;
	height: clamp(6.667rem, 10vw, 11.11rem);
	padding-right: 10px;
}

/*
.image-container {
	width: 150px;
}
*/

/*
.icon-accessori {
	display: block;
	max-width: 100%;
	height: auto;
}
*/

.table.accessori-table {
	table-layout: fixed; /* Imposta un layout fisso per la tabella */
	width: 100%;
}

.table.accessori-table th,
.table.accessori-table td {
	overflow: hidden; /* Evita l'overflow del contenuto */
}

.accessori-table.table td {
	border-top: 1px solid var(--background-menu);
	padding: 20px 0px;
	align-content: center;
}

.accessori-table.table thead th {
	vertical-align: middle;
	border-bottom: 1px solid var(--background-menu);
	padding-bottom: 10px;
}

.custom-access {
	border-bottom: 1px solid var(--background-menu);
	padding-bottom: 5px;
	padding-left: 0.75rem;
}

.accessori-table.table td, .table th {
	vertical-align: top;
	border-top: 1px solid var(--background-menu);
}

@media (max-width: 575.99px) {
	
	#accessori {
		padding-left: 0;
		padding-right: 0;
	}
	
	.filters-container {
		display: flex;
		flex-wrap: wrap;
		padding: 0 20px;
	}

	.filters-container .d-inline-flex {
		flex: 0 0 auto; /* Previene che i filtri si comprimano */
	}

	.button-second {
		display: flex; /* Assicura che i contenuti del bottone siano in linea */
		align-items: center;
		margin-right: 10px; /* Spazio tra i bottoni */
		color: inherit;
	}
	
	
	#tabella-accessori {
		width: 180%;
		overflow-x: scroll;
	}
}



/* FILI E FUNI */

.fili-table-title {
	font-weight: 500;
	font-size: clamp(1rem, 1.15vw, 1.222rem);
	text-transform: uppercase;
	white-space: nowrap;
}

.table.fili {
	margin-top: 30px;
}

.single-filo {
	border-bottom: 1px solid var(--background-menu);
}

.table.fili.table td {
	vertical-align: top;
	border-top: 0px solid var(--background-menu);
	padding: 0.75rem;
}

.table.fili.table th {
	vertical-align: top;
	border-top: 1px solid var(--background-menu);
	padding-bottom: 10px !important;
}

.table.fili thead th {
vertical-align: bottom;
border-bottom: 1px solid var(--background-menu);

}

/* .row-fili {
	padding-left: 0;
	padding-right: 0;
} */

@media (max-width: 991.99px) {
	#tabella-fili {
		width: auto;
		overflow-x: scroll;
	}
}

@media (max-width: 575.99px) {
	#tabella-fili {
		width: 100%;
		overflow-x: scroll;
	}
	
	/* .tab-content, .row-fili {
		padding-left: 15px;
		padding-right: 15px;
	} */
	
	#fili {
		padding-left: 0;
		padding-right: 0;
	}
}


/* IMPIANTI */

.impianti-hero {
	object-fit: cover;
	object-position: center top !important;
}

.container-hero-impianti img {
	width: 80%;
	height: 100%;
	object-fit: contain;
	object-position: center center;
}

@media (max-width: 767.99px) {
	.correlati {
		width: 100%;
		overflow-x: scroll;
	}
}

/* PROTEZIONI */

.protezioni-hero {
	object-fit: cover;
	object-position: center bottom !important;
}

.icon-protezioni {
	width: clamp(1.944rem, 2.60vw, 2.778rem);
	height: auto;
}

.info-accessori {
	padding: 10px 0;
	gap: 30px;
	border-top: 1px solid var(--background-menu);
	border-bottom: 1px solid var(--background-menu);

}

/* SINGOLO PALO */

.single-palo-description {
	position: absolute;
	display: block;
	left: clamp(1.667rem, 3.90vw, 4.167rem);
	bottom: clamp(1.667rem, 3.90vw, 4.167rem);
}

.single-materiali {
	height: 80vh;
	width: 100%;
	overflow: hidden;
}

.single-materiali img {
	height: 80vh;
	width: 100%;
	object-fit: cover;
	object-position: center center;
}

.slick-next {
	right: 30px !important;
}

.slick-prev {
	left: 30px !important;
}

.slick-prev, .slick-next {
	font-size: 0;
	line-height: 0;
	position: absolute;
	top: 50%;
	z-index: 10;
	display: block;
	width: 50px !important;
	height: 50px !important;
	padding: 0;
	-webkit-transform: translate(0, -50%);
	-ms-transform: translate(0, -50%);
	transform: translate(0, -50%);
	cursor: pointer;
	color: var(--text-color) !important;
	border: none;
	outline: none;
}

.slick-dots li button:before {
font-family: 'slick';
font-size: 10px !important;
line-height: 20px;
position: absolute;
top: 15px !important;
left: 0;
width: 20px;
height: 20px;
content: '•';
text-align: center;
opacity: .25;
color: black;
-webkit-font-smoothing: antialiased;
}

@media (max-width: 767.99px) {
	.single-materiali img {
		height: 60vh;
		width: 100%;
		object-fit: cover;
		object-position: center center;
	}
}

@media (max-width: 575.99px) {
	.single-materiali img {
		height: 55vh;
		width: 100%;
		object-fit: cover;
		object-position: center center;
	}
}


/* PROGETTI */

.gallery-container {
	display: flex;
	overflow-x: auto;
	white-space: nowrap;
	padding: 15px 0;
}

.gallery-image {
	flex: 0 0 auto;
}

/* .slick-prev,
.slick-next {
	color: #fff;
	background-color: #333;
	border-radius: 50%;
	padding: 10px;
	z-index: 1000;
}

.slick-prev:before, .slick-next:before {
	font-family: 'slick';
	font-size: 40px !important;
	line-height: 1;
	opacity: .90;
	color: white;
	transform: translateX(-50%);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
} */

.bg-white {
	background-color: var(--background-color);
}

.bg-gray {
	background-color: var(--background-menu);
}

@media (max-width: 575.99px) {
	.container-title {
		padding-left: 15px;
	}
}


/* CONTATTI */

.contact {
	font-size: clamp(1rem, 1.14vw, 1.222rem);
	width: fit-content;
	display: block;
	margin: 15px 0px;
	color: var(--text-color);
}

.contact-link {
	width: fit-content;
	display: block;
	color: var(--red);
	transition: var(--transition);
	margin: 15px 0;
	cursor: pointer !important;
	font-size: clamp(1rem, 1.14vw, 1.222rem);
}

.contact-link:hover {
	color: var(--text-color-hover);
	cursor: pointer !important;
}

.contact-tel {
	font-size: clamp(1rem, 1.14vw, 1.222rem);
	width: fit-content !important;
	display: block !important;
	color: var(--text-color) !important;
	transition: var(--transition) !important;
}

.contact-tel:hover {
	color: var(--text-color-hover) !important;
}

.maps {
	width: 100%;
	height: 70vh;
}

@media (max-width: 991.99px) {
	.contact {
		width: fit-content;
		display: block;
		margin: 8px 0px;
		color: var(--text-color);
	}
	
	.contact-link {
		width: fit-content;
		display: block;
		color: var(--red);
		transition: var(--transition);
		margin: 8px 0;
	}
	
	.contact-link:hover {
		color: var(--text-color-hover);
	}
	
	.contact-tel {
		width: fit-content;
		display: block;
		color: var(--text-color);
		transition: var(--transition);
		margin: 8px 0;
	}
	
	
	.maps {
		width: 100%;
		height: 40vh;
	}
}

.icon-contatti {
	width: auto;
	height: 40px;
	margin-right: 10px;
}

.wpcf7-form {
	width: 100%;
	display: flex;
	flex-direction: column;
}

.half-label  {
	width: 100%;
	display: flex;
	gap: 15px;
}

.half-label p {
	display: flex;
	width: 50%;
}

.total-label label {
	display: block !important;
	margin-right: 0 !important;
	width: 100% !important;
}

.wpcf7-form label {
	width: 100%;
	display: block;
}

.wpcf7-form .wpcf7-form-control-wrap {
	width: 100%;
	display: block;
	box-sizing: border-box;
}

.wpcf7-form .wpcf7-form-control {
	width: 100%;
	box-sizing: border-box;
	border: 1px solid #cccccc;
	border-radius: 0;
	padding: 10px;
	color: black;
}

.wpcf7-form .wpcf7-form-control:focus {
	border-color: red;
	outline: none;
	color: red;
}

.last-check {
	width: 100%;
	box-sizing: border-box;
	border: 0px solid #cccccc !important;
	border-radius: 0;
	padding: 10px;
	color: black;
	align-items: center;
	justify-items: center;
}

.wpcf7-list-item {
display: inline-block;
margin: 0 0 0 1em;
width: 100%;
}

.privacy-form {
	width: 100% !important;
	display: flex !important;
}

.privacy-form p {
	display: flex !important;
}

.privacy-form p span {
width: auto !important;	
display: block;
vertical-align: middle !important;
}

.link-check {
height: auto !important;	
align-self: flex-start !important;
margin-left: 5px;
color: var(--red);
transition: var(--transition);
}

.link-check:hover {
color: var(--background-color-btn-hover);
}


.text-check {
height: auto !important;	
align-self: flex-start !important;
padding-top: 10px;
}

.wpcf7-acceptance {
	border: 0px !important;
}

.wpcf7-submit {
	color: var(--text-color-light) !important;
	border: 0px !important; 
	
}

@media (max-width: 767px) {
	.wpcf7-form .wpcf7-form-control-wrap {
		width: 100%;
		margin-right: 0;
	}
}

/* SINGOLI ACCESSORI */

.table.single-accessori-table {
	table-layout: auto;
	width: 100%;
}

.table.single-accessori-table th,
.table.single-accessori-table td {
	overflow: hidden; /* Evita l'overflow del contenuto */
}

.single-accessori-table.table td {
	border-top: 1px solid var(--background-menu);
	padding: 20px 0;
	align-content: center;
}

.single-accessori-table.table thead th {
	vertical-align: middle;
	border-bottom: 1px solid var(--background-menu);
	padding: 10px 20px;
}

.accessori-table.table td, .table th {
	vertical-align: top;
	border-top: 1px solid var(--background-menu);
}

.custom-access-single-accessori {
	border-bottom: 1px solid var(--background-menu);
	padding-bottom: 5px;
	padding-top: 5px;
	padding-left: 0.75rem;
}

.breadcrumb {
	background-color: var(--background-color);
	padding: 0;
	gap: 5px;
}

#single-accessori {
	
}

.slick-next-accessori {
	right: -20px !important;
}

.slick-prev-accessori {
	left: -20px !important;
}

.slick-prev-accessori, .slick-next-accessori {
	font-size: 0;
	line-height: 0;
	position: absolute;
	top: 50%;
	z-index: 10;
	display: block;
	width: 50px !important;
	height: 50px !important;
	padding: 0;
	-webkit-transform: translate(0, -50%);
	-ms-transform: translate(0, -50%);
	transform: translate(0, -50%);
	cursor: pointer;
	color: var(--text-color) !important;
	border: none;
	outline: none;
	background-color: transparent;
}



.slick-next-accessori:before {
	content: '→';
	font-family: 'slick';
	font-size: 20px;
	line-height: 1;
	opacity: .75;
	color: var(--black);
	-webkit-font-smoothing: antialiased;
}

.slick-prev-accessori:before {
	content: '←';
	font-family: 'slick';
	font-size: 20px;
	line-height: 1;
	opacity: .75;
	color: var(--black);
	-webkit-font-smoothing: antialiased;
}

.accessori-descrizione p {
	font-size: clamp(1.125rem, 1.042vw, 1.250rem) !important;
}

.slider-accessori .slick-dots {
	position: absolute;
	bottom: -10px;
	display: block;
	width: 100%;
	padding: 0;
	margin: 0;
	list-style: none;
	text-align: center;
}

.slider-accessori .slick-slider {
  aspect-ratio: 1 / 1;
}

.slider-accessori .slick-slide {
  width: 100%;
  overflow: hidden;
  aspect-ratio: 1 / 1;
}

.slider-accessori .slick-slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
   /* fa sì che l'immagine si ritagli/zoommi per riempire lo spazio */
}


@media (max-width: 575.99px) {
	
	.container-table-access {
		overflow-x: auto;
	}
	
	.table.single-accessori-table {
	width: max-content;
	table-layout: auto;
}

.accessory-link {
	width: fit-content;
	display: inline-block;
	color: var(--black);
	transition: var(--transition);
	margin: 0;
}

.accessory-link:hover {
	color: var(--text-color-hover);
	cursor: pointer;
}

/* SEZIONE ASOLE */

.asole-link {
	width: fit-content;
	display: block;
	color: var(--black);
	transition: var(--transition);
	margin: 15px 0;
	cursor: pointer !important;
	font-size: clamp(1rem, 1.14vw, 1.222rem);
}

.asole-link:hover {
	color: var(--red);
	cursor: pointer !important;
}