
body,html{margin: 0px; height: 100%}
body{font-family: 'Fieldwork', sans-serif; font-size:16px; color: #1d1d1d; background-color: #fff}


h1,h2,h3,h4,h5,h6{font-family: 'Fieldwork', sans-serif; }

a {text-decoration: none;}
a:hover {
    color: #000;
    text-decoration: underline;
}
.small {font-size: 100% !important}


.h-100vh{height: 100vh}
.color-brand {color: #292c4d}
.color-brand-bg {background-color: #292c4d}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {font-weight: 700}
h1 span.suptitle, h2 span.suptitle, h3 span.suptitle {font-size: 0.9rem; text-transform: none;}

h2, .h2 {font-size: 2rem; text-transform: uppercase;}
h3, .h3 {font-size: 1.3rem}
h4, .h4 {font-size: 1.1rem}

.big-text {font-size: 5rem; font-weight: bold;}
.med-text {font-size: 3rem; font-weight: bold;}

.vh-50 { height: 50vh!important;}
.vh-75 { height: 75vh!important;}
.padding-top-200 {padding-top: 200px;}

.btn-primary{padding: 7px 35px 5px;
    border-radius: 0;
    background: #fff;
    color: #000;
    border: 3px solid;
    box-shadow: 10px 10px 0px 0px;
    font-weight: bold;
}
.btn-primary:hover, .btn-primary:active{
	color: #000;
    background-color: #fff !important;
    text-decoration: underline !important;
}

.btn-back{padding: 7px 15px 5px;
    border-radius: 0;
    background: transparent;
    color: #000;
    border: 3px solid;
    border-color: #000; box-shadow: 10px 10px 0px 0px #000;
    font-weight: bold;
}
.btn-back:hover, .btn-primary:active{
    background-color: #fff !important;
    text-decoration: underline !important;
}

.bg-side {min-height: calc((100vw - 585px) / 2);}
.bg-grey {background-color: #ececec}

.bg_prodotto{background-size: 100%; background-position: center; background-repeat: no-repeat; overflow: hidden; }
.bg_prodotto label {width: 100%; padding: 45% 10% 0;}
.bg_prodotto .overlay {
	/*left: 5%;*/
	width:100%;
	height:100%;
	opacity: 0.95;
	position:absolute;
	top:-100%;
	transition: top 0.3s ease-in-out;
}
.bg_prodotto:hover .overlay {top: 0;}

.inner-ratio-box {
  padding-top: 100%;
  height: 0;
  overflow: hidden;
/*  background-color: #57BCB7;*/
  position: relative;
}
img.inner-img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.bg_parallax{background-image: url('/assets/img/bg.jpg'); background-size: cover; background-repeat: no-repeat; background-attachment: fixed;}

.padding-50 {padding-top: 50px; padding-bottom: 50px}
.padding-top-50 {padding-top: 50px;}
.padding-bottom-50 {padding-bottom: 50px}

.bg-grey {font-size: 15px}
.bg-grey h2 {font-size: 2rem}
.products h3 a {color: #000}

.c-black {color: #000}
.c-red {color: #E41F1C}
.c-blue {color: #3A8AC3}
.c-green {color: #439A8D}

.text-intro { font-size: 20px }
.text-category br{display: none;}

/*.bg_prodotto{background-size: 100%; background-position: center; background-repeat: no-repeat; overflow: hidden; }*/
.bg_category{background-size: 80%; background-position: center; background-repeat: no-repeat; overflow: hidden; margin: auto; }

.homepage .bg_prodotto{background-size: 100%; background-position: center; background-repeat: no-repeat; overflow: hidden; }

.bg_hero {background-repeat: no-repeat; background-size: 300px; background-position: center;}
.bg_hero_shape { background-repeat: no-repeat; background-size: 250px; background-position: right bottom;}

.bg_back {background-position: center top -50px; padding-top: 100px;
	background-size: cover;
    background-repeat: no-repeat;
    background-attachment: fixed;}
.bg-parallax {background-size: cover;
    background-repeat: no-repeat;
    background-attachment: fixed;}

.bg-shape {background-size: 60%; background-position: top left; background-repeat: no-repeat;  }
.bg-shape-mini {background-size: contain; background-position: center; background-repeat: no-repeat; }

.bg-transition {background-size: contain; background-position: center; background-repeat: no-repeat;  }

.bg_cuoco {background-size: contain; background-position: center; background-repeat: no-repeat; overflow: hidden; margin: auto;}


/*accordion*/
.card-header {
    padding: 0;
    margin-bottom: 0;
    color: inherit;
    background-color: rgba(0,0,0,.00);
    border-bottom: 0px solid rgba(0,0,0,.125);
}
.card-header h4 {color: #000}

.card-header .btn{padding: 0.35rem 0}
.card-body {padding: 0}

/*slick*/
/*.slick-dots li button:before {color: #fff; opacity: .75}*/
.slick-arrow {position: absolute; bottom: 0; top: 100%}
.slick-next {display: block; width: 50px; height: 50px; right: 0px;
	content: ''; background-image: url(../img/freccia_dx.png); background-repeat: no-repeat; background-size: 50px; z-index: 999}
.slick-next:hover, .slick-next:active, .slick-next:focus {display: block; width: 50px; height: 50px;
	content: ''; background-image: url(../img/freccia_dx_hover.png); background-repeat: no-repeat; background-size: 50px; z-index: 999}

.slick-prev {display: block; width: 50px; height: 50px; left: auto; right: 70px;
	content: ''; background-image: url(../img/freccia_sx.png); background-repeat: no-repeat; background-size: 50px; z-index: 999}
.slick-prev:hover, .slick-prev:active, .slick-prev:focus {display: block; width: 50px; height: 50px;
	content: ''; background-image: url(../img/freccia_sx_hover.png); background-repeat: no-repeat; background-size: 50px; z-index: 999}

.slick-prev:before {color: transparent;}
.slick-next:before {color: transparent;}

#slide-prodotti .slick-next {right: calc(((100vw - 350px) / 2) + 10px);}
#slide-prodotti .slick-prev {right: calc(((100vw - 350px) / 2) + 80px);}
#slide-prodotti .slick-next, #slide-prodotti .slick-prev {margin-top: 20px}




.recipe_icons span {font-size: 0.9rem; font-weight: bold; padding: 10px}
.recipe_product {margin-top:-30%; right: -1rem; position: absolute; background-image: url(../img/ricettario/icons/diamante.png); background-size: contain; background-position: center; background-repeat: no-repeat;}
/*.method, .ingredients  {line-height: 2rem; padding-bottom: 1rem;}*/
.ingredients ul {padding-left: 20px;}
.ingredients li {line-height: 2rem; padding-bottom: 1rem;  list-style: disc; font-size: initial;}
.ingredients li::marker {font-size: 1.5rem}
/*.method ol {padding: 0}*/
.method li {line-height: 2rem; padding-bottom: 1rem; padding-left: 30px;}
.method li:nth-of-type(1)::marker {content: url(../img/ricettario/steps/step_01.png); }
.method li:nth-of-type(2)::marker {content: url(../img/ricettario/steps/step_02.png);}
.method li:nth-of-type(3)::marker {content: url(../img/ricettario/steps/step_03.png);}
.method li:nth-of-type(4)::marker {content: url(../img/ricettario/steps/step_04.png);}
.method li:nth-of-type(5)::marker {content: url(../img/ricettario/steps/step_05.png);}
.method li:nth-of-type(6)::marker {content: url(../img/ricettario/steps/step_06.png);}
.method li:nth-of-type(7)::marker {content: url(../img/ricettario/steps/step_07.png);}
.method li:nth-of-type(8)::marker {content: url(../img/ricettario/steps/step_08.png);}
/*.method li::before {}*/




/*	SPECIFIC per animazione	cuore*/
#anim{ position: absolute; z-index: -1; }


.esagono_home_left {
	background-repeat: no-repeat;
    background-size: contain;
    background-position: top left -100px;
    padding: 200px;
    z-index: 0;
    margin-top: -200px;}
.esagono_home_right {
	background-repeat: no-repeat;
    background-size: contain;
    background-position: top right -100px;
    padding: 200px;
    z-index: 0;
    margin-top: -300px;
    right: 0}

/*@media (max-width: 1200px){
	.bg_prodotto {min-height: 280px}
}

@media (max-width: 991px){
	.bg_prodotto {min-height: 215px}
}
*/
@media (max-width: 767px){

	h1 {font-size: 1.7rem}
	h1 span.suptitle, h2 span.suptitle {font-size: 0.9rem}

	h2, .h2 {font-size: 1.7rem;}
	h3, .h3 {font-size: 1.3rem}
	h4, .h4 {font-size: 1rem}

	.big-text {font-size: 3.35rem;}
	.med-text {font-size: 2.75rem;}

	.cristallo1 {left: 10%;top: 40%;width: 80%;}
/*	.bg_prodotto {min-height: 315px}*/

	.bg-side {min-height: calc((100vw - 1170px) / 2);}

	.container-home-mobile{margin-top: 80%}

	.bg_hero {background-position: top center}
	.bg_hero_shape {background-image: none !important;}
	.bg_hero_shape img{padding-bottom: 0 !important; margin-top: 3rem !important}

	.hero .vh-75 { height: 60vh!important;}
	.hero .align-items-center {align-items: flex-end!important;}

	.recipe_product {right: 0}


}

@media (min-width: 767px){
	/*.slick-prev {left: 85%!important;}*/
	.text-intro { font-size: 25px }
	.esagono_home_right {display: none;}

	.banda {width: 65px !important}
}
@media (min-width: 990px){

	.padding-100 {padding-top: 100px; padding-bottom: 100px}
	.padding-top-100 {padding-top: 100px;}
	.padding-bottom-100 {padding-bottom: 100px}
	.padding-200 {padding-top: 200px; padding-bottom: 200px}
	.padding-top-200 {padding-top: 200px;}
	.padding-bottom-200 {padding-bottom: 200px}

	.banda {width: 83px !important}
	.esagono_home_left {padding: 300px;}
	.esagono_home_right {padding: 270px;}

	#slide-prodotti .slick-next {right: calc(((100vw - 900px) / 2) + 10px)}
	#slide-prodotti .slick-prev {right: calc(((100vw - 900px) / 2) + 80px) !important;}
}

@media (min-width: 1200px){
	#slide-prodotti .slick-next {right: calc(((100vw - 1140px) / 2) + 10px)}
	#slide-prodotti .slick-prev {right: calc(((100vw - 1140px) / 2) + 80px) !important;}

	.bg_hero {background-repeat: no-repeat; background-size: 400px; background-position: center;}
	.bg_hero_shape { background-repeat: no-repeat; background-size: 350px; background-position: right bottom;}
}

.footer {border-top: 2px solid; }
.footer a {color: #1d1d1d; text-decoration: none}
.footer a:hover {color: #292c4d; text-decoration: underline;}
.footer {font-size: 0.9rem}

/*	FIXED	*/
.fixed-header {padding: 30px 45px;
	position: fixed;
	width: 100%;
	top: 0px;
	z-index: 9;
}


@media (max-width: 1600px){
	.fixed-header {position: absolute;}
}
@media (max-width: 991px){
	.fixed-header {padding: 15px; position: absolute;}
	.fixed-header div {max-width: 30%; padding: 0;}
	.fixed-header div img {max-width: 100%}

	.fixed-header .float-right{font-size: 11px}
}
@media (max-width: 450px){
	.fixed-btn {width: 100px; height: 100px; }
	.fixed-btn a {font-size: 15px;}
}


/* #slide-home .product{transform: translateY(-200%) !important;transition: all 2s;transition-delay: 0.5s;}
#slide-home .slick-slide{overflow:hidden}
#slide-home .h2{transform: translateX(-200%);transition: all 2s;transition-delay: 0.5s;}
#slide-home .slick-active.slick-current  .product{transform: translateY(0%) !important;}
#slide-home .slick-active.slick-current .h2{transform: translateX(0%);} */

.anim-left{transition: 0.5s all;transform: translateX(-200%);overflow: hidden;opacity: 0;}
.anim-left-2{transition: 0.5s all;overflow: hidden;opacity: 0;}
.anim-left-2{transition-delay: 0.4s}
.anim-top,.anim-top-2{transition: 0.5s all;transform: translateY(-200%);overflow: hidden;opacity: 0;}
.anim-top-2{transition-delay: 0.4s}
.start-animation .anim-left, .start-animation .anim-left-2{transform: translateX(0%);opacity: 1;}
.start-animation .anim-top,.start-animation .anim-top-2{transform: translateY(0%);opacity: 1;}
.slick-slide{overflow: hidden;position: relative;width: 100%}
