body {font-family: 'Helvetica', sans-serif; color: #2F2F2F; font-size: 14px; line-height: 20px; width: 100%; overflow-x: hidden}
h1, h2, h3{ font-family: 'Prata', serif; color: #2F2F2F;}

h1 {}
h2 {font-size: 1.75rem; line-height: 2.45rem}
h3 {font-size: 1.50rem; line-height: 2.30rem}

h4 {font-size: 1.25rem; line-height: 1.25rem; font-weight: bold}
h5 {font-size: 1rem; line-height: 1.1rem; font-weight: bold; border-bottom: 2px solid #CBA769; display: inline-block;  padding-bottom: 10px;}
h5.inverse {border-bottom: 2px solid #fff; }
h6 {font-weight: bold;}

a {color: inherit;}
a:hover {color: inherit; text-decoration: none;}

img{max-width: 100%}
p {font-size: 1.2em; line-height: 1.6em}
h6 p {font-weight: bold; font-size: 1rem; line-height: 1.2rem}

.suptitle {font-size: 0.9rem; text-transform: uppercase; font-family: 'Montserrat', sans-serif; font-weight: 600; margin-bottom: 0px;}



/*colors*/
.c-white {color: #fff;}
.c-black {color: #000;}
.c-red {color: #e4002b;}
.c-gold {color: #CBA769;}
.c-grey {color: #6F6F6F;}

.bg-white {background-color: #fff;}
.bg-gold {background-color: #CBA769;}
.bg-grey {background-color: #eFeFeF;}


.vh-100 {height: 100vh!important;}
.vh-75 {height: 75vh!important;}

#main-wrapper {overflow-x: hidden;}

.no-mob {display: unset;}
.no-desk {display: none;}

.btn-square {font-size: 0.85rem; background-color: #e4002b; color: #fff!important; border-color: #e4002b!important; padding: 0.45rem 2rem; border-radius: 0}
/*.btn-square:hover {background-color: #fff; color: #e4002b!important; border-color: #e4002b!important;}*/
.btn-square:hover {text-decoration: underline;}
.btn-square-arrow {content: '>'; color: #000; font-size: 30px; font-weight: bold}

.order-2 {
-ms-flex-order: 1;
order: 1;
}
.order-1 {
-ms-flex-order: 2;
order: 2;
}

a.active {font-weight: bold;}

/*header&menu*/
#header .top {background-color: #eFeFeF; padding: 5px 10px 10px; text-align: right;}
.homepage #header .top {background-color: #fff;}
#header .top p {font-size: 0.85rem;}
.lang li {display: inline; list-style: none; padding: 10px;}
.lang li a.active {font-weight: bold;}

#header .logo {display: inline-block;  width: 235px; max-width: 100%;/* margin: 10px 0px*/}


#main-menu{padding: 0px; margin: 0; z-index: 3}

#main-menu .dropdown{position: static}
#main-menu .dropdown-menu{width: 100%; transform: translate3d(0px, 0px ,0px) !important; box-shadow: 0px 10px 10px 0px rgb(0 0 0 / 35%); border:0;margin-top: 0px; padding-top: 0px;padding-bottom: 0px}
#main-menu .dropdown-menu .text-box{border-right: 2px solid #CBA769;}
#main-menu .dropdown-menu > div{max-width: 1200px; margin: auto}
.navbar-light .navbar-toggler{border: 0px; padding: 0px}
#menu a.active{color:#CBA769 !important}
.navbar-light .navbar-toggler-icon{background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%280, 0, 0, 1%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e")}


#menu ul li  { list-style: none;}
#menu a {color: #2F2F2F; font-weight: bold; line-height: 2.5rem; padding: 12px; cursor: pointer; display: inline;}
#menu a:hover{color: #CBA769}
#menu a.nav-link {text-transform: uppercase;}
#menu .social {float: inherit; color: #CBA769; padding-left: 20px }
#menu .social a {padding: 12px 0px; }
#menu .social a img {width: 20px; height: 20px; padding:0; filter: invert(30%) sepia(100%) saturate(6700%) hue-rotate(345deg) brightness(85%) contrast(100%);}
#menu .social a img:hover{filter: none;}

#hamburger {width: 50px; height: 50px; top: 10px; right: 0;}

.toggle {width: 50px; height: 50px; position: absolute; z-index: 1000; cursor: pointer; top: 42px;}
.toggle span { width: 30px; height: 2px; background: #2f2f2f; top: 30px; position: absolute; left: 20px;
transform: translate(0%, 0%);
transition: .3s;}
.toggle span:nth-child(2) {margin-top: 10px;}
.toggle span:nth-child(3) {margin-top: 20px;}
.toggle.active span {background: #fff;}
.toggle.active span:nth-child(1) {transform: rotate(45deg); margin-top: 10px; transition-duration: 0.3s;}
.toggle.active span:nth-child(2) {opacity: 0; transition-duration: 0.1s;}
.toggle.active span:nth-child(3) {transform: rotate(-45deg); margin-top: 10px; transition-duration: 0.3s;}

@media screen and (max-width: 991px) {
	#header {min-height: 120px; z-index: 3; position: absolute;}
	#header .logo{max-width: 230px; margin-top: 10px;}
/*	.toggle {right: 15px;}
	.toggle span {top: 26px;}*/

	a.navbar-brand{display: block;margin: auto}
	button.navbar-toggler{position: absolute; right: 30px; top: 30px}
	.navbar-nav {padding: 3rem; background-color: #fff; position: absolute; width: 100%;  box-shadow: 0px 10px 10px 0px rgb(0 0 0 / 35%);}
	#main-menu .dropdown-menu {box-shadow: none }

}
@media screen and (max-width: 768px) {
	#header {background-color: #fff}
}
@media screen and (max-width: 480px) {
	#header .logo{width: 200px}
}
@media screen and (max-width: 480px) {
	#header .logo{width: 200px}
}


@media(min-width: 991px) {
	.navbar-brand{margin-left: calc((100vw - 960px) / 2)}
	#navbarSupportedContent{margin-right: calc((100vw - 960px) / 2)}
}
@media(min-width: 1200px) {
	.dropdown-menu>div{height: 370px}
	.navbar-brand{margin-left: calc((100vw - 1170px) / 2)}
	#navbarSupportedContent{margin-right: calc((100vw - 1170px) / 2)}
}

.slick-dots{position: static}


.collapsing { position: relative; height: 0; overflow: hidden; transition: 0s ease;}
.fade { transition: opacity .25s linear; }



/*footer*/
#social a img {max-width: 30px;}
#social a img:hover {filter: invert(9%) sepia(100%) saturate(6771%) hue-rotate(345deg) brightness(94%) contrast(102%);}
#social {background-image: url(../img/general/pennellata_footer-min.png); background-size: contain; background-repeat: no-repeat; background-position: center;}

#partners img {max-width: 100%}
#partners .news {border-right: 2px solid #CBA769}
#partners h6 { color: #e4002b; font-weight: bold; text-transform: uppercase; margin-bottom: 2rem; font-size: 0.85rem;}
.form-control { color: black; background-color: rgba(0,0,0,0.1); border: 0px; border-radius: 0px; font-size: 0.85rem;}

#footer {border-top: 2px solid #CBA769; border-bottom: 18px solid #CBA769}
#footer p {font-size: 0.85rem; line-height: 1rem;}
.bg-footer {background-position: right bottom 130px; background-repeat: no-repeat; background-size: 42%}

.success-msg {position: fixed;z-index: 19;width: 100%;height: 100%;background-color: rgba(0, 0, 0, 0.8);top: 0px;left: 0px;display: none;padding-top: 20px}
.contact-alert-success {position: fixed;z-index: 20;top: 50%;left: 50%;width: 600px;padding: 40px;max-width: 90%;-webkit-transform: translate(-50%, -50%);-moz-transform: translate(-50%, -50%);-ms-transform: translate(-50%, -50%);-o-transform: translate(-50%, -50%);transform: translate(-50%, -50%);}
.alert .close {position: absolute;top: 5px;right: 5px}


/*GENERAL*/
.box {padding: 6rem; border: 2px solid #CBA769;}
.word_container {top: 40%; z-index: 2; position: absolute; overflow: hidden; width: 100%}
.word {left:50%; z-index: 2; position: relative; }
.lines .word {left: 34%; margin-top: 3.5rem; width: 90%}

.bg-slider {background-position: center; background-repeat: no-repeat; background-size: cover;}
.bg-hero {background-position: right bottom -120px; background-repeat: no-repeat; background-size: 70%}
.bg-hero-full {background-position: right top 25vh; background-repeat: no-repeat; background-size: 70%}
.bg-left {background-position: left top; background-repeat: no-repeat; background-size: 70%}
.bg-container {background-position: right top -120px; background-repeat: no-repeat; background-size: 70%}
.bg-container-bottom {background-position: left bottom -120px; background-repeat: no-repeat; background-size: 70%}
.bg-parallax {background-position: center; background-repeat: no-repeat; background-size: cover;}
.bg-gold {background-position: center; background-repeat: no-repeat;  background-size: cover}

.brush-hero::before {content: '';
/*background-image: url(../img/general/pennellata_paragrafo.svg);*/
background-image: url(../img/general/pennellata_dx-min.png);
background-repeat: no-repeat; background-size: contain;
width: 120px; height: 100px; display: block;
margin-bottom: -6rem;
margin-left: -15%;}
.brush-1::before {content: '';
background-image: url(../img/general/pennellata_sx-min.png); background-repeat: no-repeat; background-size: contain;
width: 100%; max-width: 120px; height: 80px; display: block;
margin-bottom: -80px;
margin-left: -10%;}
.brush-2::after {content: '';
background-image: url(../img/general/pennellata_dx-min.png); background-repeat: no-repeat; background-size: contain;
width: 100%; max-width: 120px; height: 80px; display: block;
margin-top: -60px;
margin-left: 65%;}

.brush-slider::after {
background-repeat: no-repeat; background-size: auto; background-position: center;
width: auto; height: 40px; display: block;
margin: auto; margin-top: -20px}
.brush-slider.ambasciatori::after {content: '';
background-image: url(../img/homepage/slider/pennellata_ambasciatori_mare.png);}
.brush-slider.anticatradizione::after {content: '';
background-image: url(../img/homepage/slider/pennellata_anticatradizione.png);}
.brush-slider.aperitips::after {content: '';
background-image: url(../img/homepage/slider/pennellata_aperitips.png);}
.brush-slider.cantabrico::after {content: '';
background-image: url(../img/homepage/slider/pennellata_cantabrico.png);}
.brush-slider.omegabuono::after {content: '';
background-image: url(../img/homepage/slider/pennellata_omegabuono.png);}
.brush-slider.sichef::after {content: '';
background-image: url(../img/homepage/slider/pennellata_sichef.png);}

.quote h3::before {
	content: '“';
	font-family: 'Prata', serif;
	font-size: 100px;
	display: block;
	margin-bottom: -2rem;
	margin-left: -3rem;
}
.quote p::after {
	content: '“';
	transform: rotate(180deg);
	font-family: 'Prata', serif; font-size: 95px; line-height: 95px;
	display: block;
	margin-top: -4rem;
	margin-right: -3rem;
}

/*#certifications h6:hover,
#news h6:hover,*/
h6:hover {text-decoration: underline; cursor: pointer;}

.animated-img {width: 280px; max-width: 100%; margin:auto; display: block;}
.breadcrumb {background-color: transparent; font-size: 0.85em; text-transform: capitalize; position: absolute; margin-left: calc((100vw - 1170px) / 2); z-index: 4 }



/*CHI SIAMO*/
.box-sea {border: 2px solid #CBA769;}
.focus img{}

/*PRODOTTI/LINEE*/
.box-pack {border: 1px solid #ededed}
.box-line {border: 2px solid #fff;}
.box-variations {border: 2px solid #CBA769; display: inline;}
.box-variations a {padding: 0 10px}
/*.box-info-products p {display: inline; padding: 0 1rem}*/

.info_recipes h3{font-size: 1rem; font-family: inherit; line-height: 1.1rem; font-weight: bold; border-bottom: 2px solid #CBA769; display: inline-block;  padding-bottom: 10px;}
/*.box-variations a{padding: 0 10px;}*/

table {width: 100%; border:2px solid #fff;}
tr, td {height: 30px; padding: 10px}
tr:nth-child(even) {
  background-color: rgba(0,0,0,0.15);
}

/*RICETTE*/
.box-mini {border: 2px solid #fff; padding-top: 100%}
.box-mini label { font-weight: bold;position: absolute; width: 40%;top: 50%;transform: translateY(-50%);margin-left: 10px; z-index: 3; cursor: pointer;}

.img-intro{position: absolute; top: -2rem; left: 6rem; margin-bottom: 2rem; }
.img-intro img{max-width: 250px; }
.img-intro-big {background-position: center; background-repeat: no-repeat;  background-size: cover; min-height: 200px}

.recipes .type {max-width: 120px; right: -5%}
.recipes .col-lg-2 {
	width: 20%!important;
	flex: 0 0 20%;
    max-width: 20%;
}

/*ANTICA TRADIZIONE - e4002b*/
.cat-descr[data-category="1"],
.cat-descr[data-category="1"] h3{color: #fff}

.box-pack[data-category="1"] img:hover{
background-image: url(../img/products/pennellata_prodotto_antica_tradizione.png);
background-repeat: no-repeat; background-size: contain; background-position: center 100px;
/*    transition: .3s;*/
}
.img-box[data-category="1"] img{
background-image: url(../img/products/pennellata_prodotto_antica_tradizione.png);
background-repeat: no-repeat; background-size: 75%; background-position: bottom 100px center;
}

/*APERITIPS*/
.box-pack[data-category="2"] img:hover{
background-image: url(../img/products/pennellata_prodotto_aperitips.png);
background-repeat: no-repeat; background-size: contain; background-position: center 100px;
/*    transition: .3s;*/
}
.box-info-products[data-category="2"] p,
.box-info-products[data-category="2"] h5,
.box-info-products[data-category="2"] table {color: #000}

.img-box[data-category="2"] img{
background-image: url(../img/products/pennellata_prodotto_aperitips.png);
background-repeat: no-repeat; background-size: 75%; background-position: bottom 100px center;
}


/*CANTABRICO*/
.cat-descr[data-category="3"],
.cat-descr[data-category="3"] h3{color: #fff}
.box-info-products[data-category="3"] tr:nth-child(even) {
    background-color: rgba(255,255,255,0.15);
}

.box-pack[data-category="3"] img:hover{
background-image: url(../img/products/pennellata_prodotto_cantabrico.png);
background-repeat: no-repeat; background-size: contain; background-position: center 100px;
/*    transition: .3s;*/
}
.img-box[data-category="3"] img{
background-image: url(../img/products/pennellata_prodotto_cantabrico.png);
background-repeat: no-repeat; background-size: 75%; background-position: bottom 100px center;
}


/*OMEGABUONO*/
.box-pack[data-category="4"] img:hover{
background-image: url(../img/products/pennellata_prodotto_omegabuono.png);
background-repeat: no-repeat; background-size: contain; background-position: center 100px;
/*    transition: .3s;*/
}
.img-box[data-category="4"] img{
background-image: url(../img/products/pennellata_prodotto_omegabuono.png);
background-repeat: no-repeat; background-size: 75%; background-position: bottom 100px center;
}

/*SICHEF*/
.cat-descr[data-category="5"],
.cat-descr[data-category="5"] h3{color: #fff}

.box-pack[data-category="5"] img:hover{
background-image: url(../img/products/pennellata_prodotto_sichef.png);
background-repeat: no-repeat; background-size: contain; background-position: center 100px;
/*    transition: .3s;*/
}
.img-box[data-category="5"] img{
background-image: url(../img/products/pennellata_prodotto_sichef.png);
background-repeat: no-repeat; background-size: 75%; background-position: bottom 100px center;
}



.box-overlay{position: absolute;
    width: 64%; height: 70%;
    opacity: 0.65;
    top: 15%; left: 18%;
    display: none;
}
.category-box:hover .box-overlay{display: block;}




.category-box{position: relative}
.category-box label{position: absolute; transform: translateY(-50%);
left:5%; top: 50%;
font-size: 1.1rem; line-height: 1.1rem; font-weight: bold;}
img.cat-box-img{position: absolute; transform: translateY(-50%);top: 50%;right: -15%; max-width: 240px}
img.fish-box-img{position: absolute; transform: translateY(-20%);top: 50%;right: 0px; max-width: 150px}


.suptitle-product {display: inline-block; padding: 0.45rem 1rem; font-size: 0.85rem; line-height: initial; text-transform: uppercase; font-family: 'Montserrat', sans-serif; font-weight: 600; color: #fff;}
.word-big{font-size: 10rem; line-height: 8rem; text-transform: uppercase; opacity: 0.20; color: #fff; font-family: Montserrat, sans-serif; font-weight: bolder}
.filter {font-weight: bold; line-height: 2rem}
.filter:hover {text-decoration: underline;}
.filter-box {border-right: 2px solid #CBA769; border-bottom: 2px solid #CBA769;  border-top: 2px solid #CBA769; padding: 10px;}
.filter-box:first-child {border-left: 2px solid #CBA769;}

#subcat-items h4 {font-size: 1rem; line-height: 1.1rem; font-weight: bold; border-bottom: 2px solid #CBA769; display: inline-block;  padding-bottom: 10px;}
#subcat-items p {font-size: 0.85rem;}


/*slick*/
.slick-prev {display: none!important;}
.slick-slider {overflow-x: hidden;}
.home-slick {top: 10px; padding-left: 10px; padding-right: 10px;}
.home-slick .slick-dots {bottom: 30px}
.home-slick.crea .slick-dots {bottom: 0px}
.slick-dots {margin-top: -24px}

/*NEWS*/
.data {font-size: 0.85rem; margin-bottom: 0}
.box-news {border-bottom: 2px solid #CBA769; background-color: #fff}

/*CONTACTS*/
iframe {width: 100%;}
.text-contacts {padding: 3rem 6rem}



/*MOBILE*/

@media screen and (max-width: 345px){
	#header .logo {margin-top: 10px}
	#header {min-height: 120px}
	.page-content {
	    padding-top: 120px !important;
	}
}

@media screen and (max-width: 767px) {

	.page-content {padding-top: 120px}

	.homepage #header .top {background-color: #eFeFeF;}

	.no-mob {display: none;}
	.no-desk {display: unset;}

	.h-100 {height: auto !important;}

	.vh-100 {height: auto!important;}
	.vh-75 {height: auto!important;}

	/*text*/
	h1 {font-size: 2.25rem; line-height: 2.85rem}
	h2 {font-size: 1.55rem; line-height: 2.25rem}
	h3 {font-size: 1.30rem; line-height: 2.10rem}
	h4 {font-size: 1rem; line-height: 1.20rem}

	h2 br{display: none;}

	p {font-size: 1.1em; line-height: 1.8em}

	.suptitle {font-size: 0.85rem;}

	.order-1 {
	-ms-flex-order: 1;
	order: 1;
	}
	.order-2 {
	-ms-flex-order: 2;
	order: 2;
	}

	ul {padding-left: 0}


	/*footer*/
	#social {background-image: url(../img/general/pennellata_footer-min.png); background-size: cover;}
	#partners .news {border-bottom: 2px solid #CBA769; border-right: 0; padding-bottom: 2rem;}
	.bg-footer {background-position: right bottom 250px; background-repeat: no-repeat; background-size: 200%}



	/*general*/
	.box {padding: 3rem;}
	.word_container {margin-top: -15%; padding-bottom: 10%; position: relative; width: 200%; overflow: visible; }
	.word {left:-7%;}
	.lines .word {left:-7%; margin-top: 0}
	.bg-hero {background-position: right bottom; background-size: 150%}
	.bg-hero-aperitips {background-position: right top 2%; background-size: 150%}
	.bg-container {background-position: right top; background-size: 150%}

	.category-box label {
	    top: 50%;
	    font-size: 0.9rem;
	}
	img.cat-box-img {
	    max-width: 120px;
	    height: 120px;
	    top: 75%;
	}
	img.fish-box-img {
	    max-width: 100px;
	    height: 100px;
	    top: 55%;
	}

	.brush-1::before { margin-left: -5%;}
/*	.brush-2::after {margin-bottom: -5rem;}*/

/*	.quote h3::before { font-size: 120px; line-height: 150px; margin-bottom: -5rem;}*/
	.quote p::after {margin-top: -6rem;margin-right: -5%;}

	.img-intro-big {background-size: contain; min-height: 350px;  margin-bottom: -6rem;}

	.recipes .cat-box-img {max-width: 170px}
	.text-contacts {padding: 3rem}

	.breadcrumb {margin-bottom: 0; margin-left: 15px; position: relative;}


	}/*end mobile*/



/*DESK - TABLET*/
@media screen and (min-width: 768px) and (max-width: 990px) {

	.page-content {padding-top: 120px}

	/*general*/
	.box {padding: 4rem;}
	.word_container {top: 52%; width: 100%;}
	.word {left: 20%; z-index: 2; position: relative;}
	.bg-hero {background-position: right bottom; background-repeat: no-repeat; background-size: 150%}
	.lines .word {left: 20%;margin-top: 0rem;}
	.img-intro-big {background-size: contain;}

	.vh-75 {height: 60vh!important;}

	#social {background-image: url(../img/general/pennellata_footer-min.png); background-size: contain; background-repeat: no-repeat; background-position: center;}
	#partners .news {border-bottom: 2px solid #CBA769; border-right: 0; padding-bottom: 2rem;}

	.brush-hero::before {margin-left: -10%}
	.text-contacts {padding-right: 1rem}

	.recipes .cat-box-img {max-width: 100px}

	.img-intro {left: 4rem}

	.breadcrumb {margin-bottom: 0; margin-left: 15px;}

}
/*DESK - TABLET*/
@media screen and (min-width: 991px) and (max-width: 1200px) {

	/*general*/
	.word_container {top: 55%; width: 100%;}
	/*body{font-size: 13px;}*/
}



/*BIG SCREEN*/


@media (min-width: 1200px) {
	h1 {width: 70%}
	.single-item {margin-top: -95px}

	.vh-75 {
	    height: 75vh !important;
	}
}
@media (min-width: 1400px){
	.container {width: 1200px}
	/*.vh-75 {
	    height: 68vh !important;
	}*/
}
@media(min-width: 1920px){
	.container {width: 1400px}
	/*.vh-75 {
	    height: 60vh !important;
	}*/
}



.lds-spinner {color: official;display: inline-block;position: relative;width: 80px;height: 80px;}
.lds-spinner div {transform-origin: 40px 40px;animation: lds-spinner 1.2s linear infinite;}
.lds-spinner div:after {content: " ";display: block;position: absolute;top: 3px;left: 37px;width: 6px;height: 18px;border-radius: 20%;background: #000;}
.lds-spinner div:nth-child(1) {transform: rotate(0deg);animation-delay: -1.1s;}
.lds-spinner div:nth-child(2) {transform: rotate(30deg);animation-delay: -1s;}
.lds-spinner div:nth-child(3) {transform: rotate(60deg);animation-delay: -0.9s;}
.lds-spinner div:nth-child(4) {transform: rotate(90deg);animation-delay: -0.8s;}
.lds-spinner div:nth-child(5) {transform: rotate(120deg);animation-delay: -0.7s;}
.lds-spinner div:nth-child(6) {transform: rotate(150deg);animation-delay: -0.6s;}
.lds-spinner div:nth-child(7) {transform: rotate(180deg);animation-delay: -0.5s;}
.lds-spinner div:nth-child(8) {transform: rotate(210deg);animation-delay: -0.4s;}
.lds-spinner div:nth-child(9) {transform: rotate(240deg);animation-delay: -0.3s;}
.lds-spinner div:nth-child(10) {transform: rotate(270deg);animation-delay: -0.2s;}
.lds-spinner div:nth-child(11) {transform: rotate(300deg);animation-delay: -0.1s;}
.lds-spinner div:nth-child(12) {transform: rotate(330deg);animation-delay: 0s;}
@keyframes lds-spinner { 0% {opacity: 1;} 100% {opacity: 0;} }
.lds-spinner{position: absolute;top: 50%; right: 50%;transform: translate(50%,-50%);}
.form-loading{position: absolute; top: 0px; left: 0px; background-color: rgba(255,255,255,0.8);height: 100%; width: 100%}
#loader-box{position: fixed;z-index: 9999;top: 0px;left: 0px;height: 100vh;width: 100vw;background-color: rgba(0,0,0,0.7);text-align: center;display: none;}
nav.navbar.active{background-color: rgba(255,255,255,1);}