/* ------------------------- VARIABLES ------------------------- */
:root {
	
	--primary-font: "Petrona", serif;
	--secondary-font: "Montserrat", sans-serif;
	
	--line-height: calc(1em + 8px);
	
	--h1-size: 96px;
	--h1-weight: 300;
	
	--h2-size: 19px;
	--h2-weight: 700;
	
	--h3-size: 14px;
	--h3-weight: 500;
	
	--h4-size: 12px;
	--h4-weight: 700;
	
	--h5-size: 24px;
	--h5-weight: 400;
	
	--h6-size: 20px;
	--h6-weight: 400;
	
	--text-size: 16px;
	--text-weight: 400;
	
	--text-header-size: 14px;
	--text-header-weight: 400;
	
	--text-footer-copyright-size: 12px;
	--text-footer-copyright-weight: 400;
	
	--giallo: #C58025;
	--grigio: #999999;
	
	--h-header: 70px;
	--h-footer: 50px;
	
	--padding-content: 50px;
	
}


/* ------------------------- MENU ------------------------- */
.lines, .lines::before, .lines::after {
  background-color: var(--giallo) !important;
}
/* ------------------------- TEXT ------------------------- */

/* ----- text - line-height ----- */
html, body, footer, h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6, p, span, li, a, [class*="btn"], label {
  line-height: var(--line-height) !important;
}

/* ----- text - font-family ----- */
h1, .h1 {
	font-family: var(--primary-font) !important;
}
html, body, footer, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6, p, span, li, a, [class*="btn"], label {
	font-family: var(--secondary-font) !important;
}

/* ----- text - font-size ----- */
html {
	font-size: var(--text-size);
	font-weight: var(--text-weight);
}
h1, .h1 {
	font-size: var(--h1-size) !important;
	font-weight: var(--h1-weight) !important;
}
h2, .h2 {
	font-size: var(--h2-size);
	font-weight: var(--h2-weight);
}
h3, .h3 {
	font-size: var(--h3-size);
	font-weight: var(--h3-weight);
}
h4, .h4 {
	font-size: var(--h4-size);
	font-weight: var(--h4-weight);
}
h5, .h5 {
	font-size: var(--h5-size);
	font-weight: var(--h5-weight);
}
h6, .h6 {
	font-size: var(--h6-size);
	font-weight: var(--h6-weight);
}
p, span, li, a, [class*="btn"],
#topbar p, #topbar a {
	font-size: var(--text-size);
	font-weight: var(--text-weight);
}
label {
	font-size: var(--text-size) !important;
	font-weight: var(--text-weight) !important;
}
#mainMenu nav > ul > li > a {
	font-size: var(--text-header-size) !important;
	font-weight: var(--text-header-weight) !important;
	text-transform: uppercase;
  padding-right: 20px;
  padding-left: 20px;
}
#mainMenu ul.dropdown-menu > li > a {
	font-size: var(--text-header-size) !important;
	font-weight: var(--text-header-weight) !important;
}
#footer .copyright-content .text-copyright,
#footer .copyright-content .text-copyright a {
	font-size: var(--text-footer-copyright-size) !important;
	font-weight: var(--text-footer-copyright-weight) !important;
	color: var(--grigio);
}
#footer .copyright-content .text-copyright a:hover {
	color: var(--giallo);
}

/* ----- text - letter-spacing ----- */
h4, .h4 {
	letter-spacing: 0;
}

/* ----- text - font-weight ----- */
.font-regular {
	font-weight: 400 !important;
}

/* ----- text - color ----- */
.text-giallo, a:hover {
	color: var(--giallo) !important;
}
.text-grigio {
	color: var(--grigio) !important;
}
.text-black {
	color: black !important;
}

/* ----- text - align ----- */
.text-left {
	text-align: left;
}
.text-right {
	text-align: right;
}

/* ----- text - other ----- */
h1.title-home {
	font-size: 52px !important;
	font-weight: 400 !important;
	font-style: italic;
}

/* ------------------------- BACKGROUND ------------------------- */
.bg-norepeat { background-repeat: no-repeat; }
.bg-contain { background-size: contain; }
.bg-cover { background-size: cover; }
.bg-10 { background-size: 10%; }
.bg-20 { background-size: 20%; }
.bg-30 { background-size: 30%; }
.bg-35 { background-size: 35%; }
.bg-40 { background-size: 40%; }
.bg-50 { background-size: 50%; }
.bg-60 { background-size: 60%; }
.bg-70 { background-size: 70%; }
.bg-80 { background-size: 80%; }
.bg-90 { background-size: 90%; }
.bg-center { background-position: center; }
.bg-center-top { background-position: center top; }
.bg-center-bottom { background-position: center bottom; }
.bg-left-center { background-position: left center; }
.bg-left-top { background-position: left top; }
.bg-left-bottom { background-position: left bottom; }
.bg-right-center { background-position: right center; }
.bg-right-top { background-position: right top; }
.bg-right-bottom { background-position: right bottom; }
.bg-black { background-color: black !important; }
.bg-giallo { background-color: var(--giallo) !important; }
.bg-grigio { background-color: var(--grigio) !important; }
.shadow-overlay {
	position: relative;
}
.shadow-overlay:before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	width: 100%;
	height: 100%;
	background: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), black 95%);
  z-index: 0;
}
.shadow-overlay > * {
	position: relative;
  z-index: 10;
}


/* ------------------------- BTN ------------------------- */

/* ----- btn - general ----- */
[class*="btn"] {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  padding: 6px 17px !important;
  border-width: 1.5px !important;
  border-style: solid !important;
	border-radius: 0;
  margin-bottom: 0 !important;
  text-transform: none !important;
	transition: 0.3s all ease-in-out;
}

/* ----- btn - base ----- */

/* ----- btn - base - bg ----- */
[class*="btn"][class*="-bg-giallo"] { background-color: var(--giallo) !important; }
[class*="btn"][class*="-bg-grigio"] { background-color: var(--grigio) !important; }
[class*="btn"][class*="-bg-white"] { background-color: white !important; }
[class*="btn"][class*="-bg-white"] { background-color: white !important; }
[class*="btn"][class*="-bg-transparent"] { background-color: transparent!important; }
[class*="btn"][class*="-bg-blur"] { background-color: rgba(255, 255, 255, 0.05) !important; backdrop-filter: blur(5px); }

/* ----- btn - base - color ----- */
[class*="btn"][class*="-cl-giallo"] { color: var(--giallo) !important; }
[class*="btn"][class*="-cl-grigio"] { color: var(--grigio) !important; }
[class*="btn"][class*="-cl-white"] { color: white !important; }

/* ----- btn - base - border ----- */
[class*="btn"][class*="-br-giallo"] { border-color: var(--giallo) !important; }
[class*="btn"][class*="-br-grigio"] { border-color: var(--grigio) !important; }
[class*="btn"][class*="-br-white"] { border-color: white !important; }

/* ----- btn - hover ----- */

/* ----- btn - hover - bg ----- */
[class*="btn"][class*="-bg-h-giallo"]:hover { background-color: var(--giallo) !important; }
[class*="btn"][class*="-bg-h-grigio"]:hover { background-color: var(--grigio) !important; }
[class*="btn"][class*="-bg-h-white"]:hover { background-color: white !important; }

/* ----- btn - hover - color ----- */
[class*="btn"][class*="-cl-h-giallo"]:hover { color: var(--giallo) !important; }
[class*="btn"][class*="-cl-h-grigio"]:hover { color: var(--grigio) !important; }
[class*="btn"][class*="-cl-h-white"]:hover { color: white !important; }

/* ----- btn - hover - border ----- */
[class*="btn"][class*="-br-h-giallo"] { border-color: var(--giallo) !important; }
[class*="btn"][class*="-br-h-grigio"] { border-color: var(--grigio) !important; }
[class*="btn"][class*="-br-h-white"] { border-color: white !important; }


/* ------------------------- OBJECT ------------------------- */

/* ----- general ----- */
section {
  padding: 100px 0;
}
.sez-principale {
	/*min-height: calc(100vh - (var(--h-header) + var(--h-footer)));*/
	min-height: calc(100vh - var(--h-header));
	background-color: black;
  padding-left: var(--padding-content);
  padding-right: var(--padding-content);
}
/*#chisiamo.sez-principale { min-height: 1050px; }*/
#torrefazioneMission.sez-principale { min-height: 1150px; }
#torrefazioneImpianto.sez-principale { min-height: 1000px; }
#torrefazioneQualita.sez-principale { min-height: 1000px; }
#prodotti.sez-principale { min-height: 1100px; }
#prodottiSofia.sez-principale { min-height: 1150px; }
#prodottiNjuki.sez-principale { min-height: 1200px; }
#prodottiMonodose.sez-principale { min-height: 1250px; }
#prodottiCompatibili.sez-principale { min-height: 1150px; }
#formazione.sez-principale { min-height: 1000px; }

/* ----- recaptcha ----- */
.grecaptcha-badge { visibility: hidden; }

/* ----- scroll ----- */
html { scroll-behavior: smooth; }

/* ----- divider ----- */
.divider {
	display: block;
	width: 150px;
	height: 2px;
	background-color: var(--giallo);
	margin: auto;
}
.divider-sx {
	margin-left: 0;
	margin-right: auto;
}
.divider-dx {
	margin-left: auto;
	margin-right: 0;
}

/* ----- carousel ----- */
.carousel .flickity-page-dots {
	bottom: 20px;
	display: flex;
	justify-content: center;
	align-items: center;
}
.carousel .flickity-page-dots .dot:after {
	height: 100%;
	transition: 0.3s all ease-in-out;
}
.carousel .flickity-page-dots .dot.is-selected:after {
	background-color: var(--giallo);
}

/* ----- carousel - half screen ----- */
[class*="container-img-half-screen"],
[class*="container-carousel-half-screen"] {
	position: absolute;
	top: 0;
	display: block;
	width: 50%;
	height: 100%;
}
.container-img-half-screen-sx,
.container-carousel-half-screen-sx {
	left: 0;
}
.container-img-half-screen-dx,
.container-carousel-half-screen-dx {
	right: 0;
}
[class*="container-carousel-half-screen"] .flickity-viewport,
[class*="container-carousel-half-screen"] .flickity-slide,
[class*="container-carousel-half-screen"] .polo-carousel-item {
	height: 100%;
}

/* ----- form ----- */
.form-control {
	color: white !important;
	background-color: transparent !important;
	border: 1px solid white;
	border-radius: 0 !important;
}
.form-control:focus {
	border-color: var(--giallo);
}
.form-control:focus-visible {
	outline: none;
}

/* ----- checkbox-form ----- */
.checkbox-form {
  display: flex;
  position: relative;
}
.checkbox-form > input {
  position: relative;
  z-index: 10;
  opacity: 0 !important;
  margin-right: 10px;
}
.checkbox-form .privacyContatti {
  display: block;
  position: absolute;
  z-index: 5;
  top: 2px;
  width: 16px;
  height: 16px;
  background-color: transparent;
  border: 1px solid white;
  border-radius: 0;
}
.checkbox-form .privacyContatti:after {
  content: '';
  display: none;
  position: relative;
  top: 2px;
  left: 5px;
  width: 4px;
  height: 8px;
  border: solid var(--giallo);
  border-width: 0 1px 1px 0;
  transform: rotate(45deg);
}
.checkbox-form > input:checked ~ .privacyContatti:after {
  display: block;
}
.checkbox-form label,
.checkbox-form label > a {
  font-size: 12px!important;
  line-height: var(--line-height);
}
.checkbox-form label,
.checkbox-form label > a {
  color: white;
}
.checkbox-form label > a:hover {
  color: var(--giallo) !important;
  text-decoration: underline !important;
}
.checkbox-form.checkbox-center {
  justify-content: center;
  align-items: center;
}
.checkbox-form.checkbox-center > input {
  position: relative;
  margin-right: 0;
  right: -14px;
}
.checkbox-form.checkbox-center .privacyContatti {
  position: relative;
  top: -1px;
  margin-right: 8px;
}


/* ------------------------- HEADER ------------------------- */

/* ----- header ----- */
#header,
#header .header-inner,
#header .header-inner .container-fluid {
  height: var(--h-header);
}
#header .header-inner {
	background-color: black;
	border-bottom: 1px solid var(--giallo);
  padding-left: var(--padding-content);
  padding-right: var(--padding-content);
}
#header .header-inner .container-fluid {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

/* ----- header - logo ----- */
#header .header-inner .container-fluid #logo {
	height: var(--h-header);
}
#header .header-inner .container-fluid #logo img {
	display: block;
	height: var(--h-header);
	padding: 20px 0;
}

/* ----- header - header extras ----- */
#header .header-inner .container-fluid .header-extras {
	height: var(--h-header);
	display: flex;
	align-items: center;
}
#header .header-inner .container-fluid .header-extras a i {
	color: var(--grigio) !important;
}
#header .header-inner .container-fluid .header-extras a:hover i {
	color: white !important;
}
#header .header-inner .container-fluid .header-extras ul.p-dropdown-content {
  right: 0px;
	background-color: transparent;
	box-shadow: none;
	border: 1px solid var(--giallo);
	border-radius: 0;
	padding: 15px;
  margin-top: 0;
}
#header .header-inner .container-fluid .header-extras ul.p-dropdown-content:before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.65);
  backdrop-filter: blur(5px);
  z-index: 10;
}
#header .header-inner .container-fluid .header-extras ul.p-dropdown-content li {
	position: relative;
	z-index: 20;
}
#header .header-inner .container-fluid .header-extras ul.p-dropdown-content li a {
	font-size: var(--text-header-size) !important;
  color: var(--grigio);
}
#header .header-inner .container-fluid .header-extras ul.p-dropdown-content li a:hover {
  color: white;
}
#header .header-inner .container-fluid .header-extras ul.p-dropdown-content li.current a {
	font-weight: 700;
  color: var(--giallo);
}

/* ----- header - menu ----- */
#header .header-inner .container-fluid #mainMenu nav > ul {
  display: flex;
  align-items: center;
}
#header .header-inner .container-fluid #mainMenu nav > ul > li {
	margin: 0 !important;
}
#header .header-inner .container-fluid #mainMenu nav > ul > li > a {
  color: var(--grigio);
}
#header .header-inner .container-fluid #mainMenu nav > ul > li.current > a {
	font-weight: 700 !important;
  color: var(--giallo) !important;
}
#header .header-inner .container-fluid #mainMenu nav > ul > li:not(.current) > a:hover,
#header .header-inner .container-fluid #mainMenu nav > ul > li:not(.current) > a:focus {
  color: white !important;
}

/* ----- header - submenu ----- */
#header .header-inner .container-fluid #mainMenu nav > ul > li ul.dropdown-menu,
#header .header-inner .container-fluid #mainMenu nav > ul > li ul.p-dropdown-content {
	text-align: center;
	background-color: transparent;
	box-shadow: none;
	border: 1px solid var(--giallo);
	border-radius: 0;
	padding: 15px;
  margin-top: 7.5px;
}
#header .header-inner .container-fluid #mainMenu nav > ul > li ul.dropdown-menu:before,
#header .header-inner .container-fluid #mainMenu nav > ul > li ul.p-dropdown-content:before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.65);
  backdrop-filter: blur(5px);
  z-index: 10;
}
#header .header-inner .container-fluid #mainMenu nav > ul > li ul.dropdown-menu li,
#header .header-inner .container-fluid #mainMenu nav > ul > li ul.p-dropdown-content li {
	position: relative;
	z-index: 20;
}
#header .header-inner .container-fluid #mainMenu nav > ul > li ul.dropdown-menu li:not(:last-child),
#header .header-inner .container-fluid #mainMenu nav > ul > li ul.p-dropdown-content li:not(:last-child) {
	margin-bottom: 7.5px;
}
#header .header-inner .container-fluid #mainMenu nav > ul > li ul.dropdown-menu li a,
#header .header-inner .container-fluid #mainMenu nav > ul > li ul.p-dropdown-content li a {
  color: var(--grigio);
	padding: 10px 0;
}
#header .header-inner .container-fluid #mainMenu nav > ul > li ul.dropdown-menu li:not(.current) a:hover,
#header .header-inner .container-fluid #mainMenu nav > ul > li ul.p-dropdown-content li:not(.current) a:hover {
  color: white !important;
}
#header .header-inner .container-fluid #mainMenu nav > ul > li ul.dropdown-menu li.current a,
#header .header-inner .container-fluid #mainMenu nav > ul > li ul.p-dropdown-content li.current a {
	font-weight: 700 !important;
  color: var(--giallo) !important;
}
#header .header-extras-mobile {
	display: none;
}

/* ------------------------- FOOTER ------------------------- */

/* ----- footer - copyright ----- */
#footer .copyright-content {
  display: flex;
  align-items: center;
  min-height: var(--h-footer);
	background-color: black;
	border-top: 1px solid var(--giallo);
  padding: 10px var(--padding-content);
}


/* ------------------------- HOME ------------------------- */
#sliderHome {
	padding-top: 50px;
	transition: 0.3s all ease-in-out !important;
}


/* ------------------------- BRIDGE - TORREFAZIONE/PRODOTTI ------------------------- */
ul.elenco-bridge {
	padding-left: 12px;
	margin-bottom: 0;
}
ul.elenco-bridge > li {
	width: fit-content;
	padding: 10px 0;
}
ul.elenco-bridge > li::marker {
  content: '\f04b';
  font-family: 'Font Awesome 5 Pro';
  font-weight: 700;
  color: white;
}
ul.elenco-bridge > li:hover::marker,
ul.elenco-bridge > li:hover > a {
  color: var(--giallo) !important;
}


/* ------------------------- TORREFAZIONE - IMPINATO ------------------------- */
.box-impianto {
	background-color: rgba(0, 0, 0, 0.8);
	padding: 30px;
	border: 1px solid var(--giallo);
}


/* ------------------------- TORREFAZIONE - RICONOSCIMENTI ------------------------- */
.grid-camaleonte-awards {
  display: grid;
  grid-template-columns: 120px auto;
  grid-column-gap: 20px;
}
.grid-ict {
  display: grid;
	grid-template-columns: 150px auto;
  grid-column-gap: 10px;
}
.grid-ict img {
	max-width: 90px !important;
}
.grid-ict .grid-ict-group-medal img:first-child {
	position: relative;
	z-index: 50;
}
.grid-ict .grid-ict-group-medal img:not(:first-child) {
	margin-left: -25px;
}
.grid-ict .grid-ict-group-medal img:nth-child(2) {
	position: relative;
	z-index: 40;
}
.grid-ict .grid-ict-group-medal img:nth-child(3) {
	position: relative;
	z-index: 30;
}
.grid-ict .grid-ict-group-medal img:nth-child(4) {
	position: relative;
	z-index: 20;
}
.grid-ict .grid-ict-group-medal img:last-child {
	position: relative;
	z-index: 10;
}


/* ------------------------- TORREFAZIONE - CERTIFICAZIONI ------------------------- */
.testo-nascosto:not(.testo-nascosto-mostra) {
  display: none;
}
.logo-certificazione {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 150px;
	margin-bottom: 30px;
}
.col-md-3 .logo-certificazione img {
	max-width: 185px;
}


/* ------------------------- PRODOTTI - MISCELE ------------------------- */
.col-miscela-desc .col-miscela-desc-img {
  display: flex;
  justify-content: center;
  align-items: flex-end;
	min-height: 140px;
}


/* ------------------------- PRODOTTI - SOFIA ------------------------- */
.grid-ict.grid-ict-prod {
	grid-template-columns: 130px auto 120px;
}
.grid-ict.grid-ict-prod .grid-ict-group-medal img:not(:first-child) {
	margin-left: -40px;
}
.grid-ict.grid-ict-prod img {
	max-width: 75px;
}


/* ------------------------- PRODOTTI - NJUKI ------------------------- */
.sez-njuki > .container-fluid {
	position: relative;
}
.sez-njuki > .container-fluid > a.njuki-img {
	position: absolute;
	top: 0;
	left: 54%;
	max-width: 400px;
}
.sez-njuki .card-njuki {
	width: 100%;
	padding: 15px;
	border: 1px solid white;
	border-radius: 5px;
	transition: .2s all ease-in-out;
}
.sez-njuki a:hover .card-njuki {
	border-color: var(--giallo);
}
.sez-njuki .card-njuki img {
	max-height: 100px;
}


/* ------------------------- CONTATTI ------------------------- */
form#formContatti {
	display: grid;
	grid-template-areas:	'nome nome cognome cognome'
												'email email telefono telefono'
												'oggetto oggetto oggetto oggetto'
												'messaggio messaggio messaggio messaggio'
												'checkbox checkbox checkbox submit';
	grid-template-columns: repeat(4, 1fr);
	grid-gap: 15px;
}
form#formContatti .btn-submit {
	width: 100%;
	color: white;
	border: 1px solid var(--giallo);
	background-color: var(--giallo);
	transition: 0.3s all ease-in-out;
}
form#formContatti .btn-submit:hover,
form#formContatti .btn-submit:focus {
	color: var(--giallo);
	background-color: transparent;
}
.icon-group-contatti {
	display: grid;
	grid-template-columns: 40px auto;
	grid-column-gap: 10px;
}
ul.social-group-contatti {
	display: flex;
	align-items: center;
	list-style: none;
	padding-left: 0;
}
ul.social-group-contatti li {
	
}
.icon-group-contatti a,
ul.social-group-contatti li a {
	color: white;
	transition: 0.2s all ease-in-out;
}
.icon-group-contatti a:hover,
ul.social-group-contatti li a:hover,
.icon-group-contatti a:focus,
ul.social-group-contatti li a:focus,
.icon-group-contatti a:active,
ul.social-group-contatti li a:active {
	color: var(--giallo) !important;
}