@font-face {
    font-family: 'DIN Pro Cond';
    src: url('../fonts/DINPro-CondensedBold.woff2') format('woff2'),
        url('../fonts/DINPro-CondensedBold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'DIN Pro Cond';
    src: url('../fonts/DINPro-CondensedMedium.woff2') format('woff2'),
        url('../fonts/DINPro-CondensedMedium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'DIN Pro';
    src: url('../fonts/DINPro.woff2') format('woff2'),
        url('../fonts/DINPro.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}



body{
	margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    vertical-align: baseline;
	background-color: #fff;
	font-family: 'DIN Pro Cond', sans-serif;
    font-weight: bold;
    font-style: normal;
}


main{
    margin-top: 70px;
}


footer {
    /*background: #383838;*/
    background: #e5e5e5;
    /*margin-top: 3px;*/
    
    padding: 8px 0 6px 0;
    
    
}

footer small {
    font-family: sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: 11px;
    letter-spacing: -1px;
    color: #77c702;
}

footer img {
    width: 40%;
}

.intestazione {
    background: #fff;
}

.risultato {
    background: #f0f0f0;
}

.scrolled-down{
  transform:translateY(-100%); transition: all 0.3s ease-in-out;
}
.scrolled-up{
  transform:translateY(0); transition: all 0.3s ease-in-out;
}

.navbar-custom {
  background-color: rgba(245, 245, 245, 0.7);
}

.navbar-light .navbar-brand,
.navbar-light .navbar-text {
    color: #545454;
    font-family: 'Cantarell', sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: 20px;
    letter-spacing: -1px;
    line-height: .9;
}

.navbar-custom .navbar-brand img {

}

.navbar-custom .navbar-brand small,
.navbar-custom .navbar-text small {
    font-weight: 200;
    font-style: oblique;
    font-size: 16px;
}


.navbar-custom .navbar-toggler-icon {
  /*background-image: url("../images/globe.svg");*/
  color: #383838; /*#7f7f7f;*/
  align-content: center;
  text-align: center;
  width: 20px;
  font-weight: 500;

  margin: 0;
  margin-top: 8px;
  padding: 0;
}

.navbar-toggler:focus,
.navbar-toggler:active,
.navbar-toggler-icon:focus {
     color: #383838;
}

.navbar-light .navbar-toggler-icon {
  /*background-image: url("../images/globe.svg");*/
  /*color: #fff; /*#7f7f7f;*/
  margin-top: 10px;
  font-weight: 500;

}

.nav-link img{
    margin-right: 8px;
    width: 24px;
}

.marchio {
    margin-top: 10px;
    color: #545454;
    font-family: 'Cantarell', sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: 20px;
    letter-spacing: -1px;
    line-height: .9;
}

.qr-intro {
    margin-top: 20px;
}

.qr-intro img{
    max-height: 400px;
}

.qr-marchio {
    display: none;
    margin-top: 18px;
    color: #545454;
    font-family: 'Cantarell', sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: 20px;
    letter-spacing: -1px;
    line-height: .9;
}

.qr-nomeprodotto {
    text-align: center;
    font-weight: 500;
    text-transform: uppercase;
    color: #787878;
    font-size: 8vW;
    line-height: .9;
    padding-left: 6px;
    padding-right: 6px;
    margin-top: 10px;
    margin-bottom: 30px;
}

.qr-bioveg {
    display: none;
    text-align: center;
    font-weight: 500;
    text-transform: uppercase;
    line-height: .9;
    padding-left: 6px;
    padding-right: 6px;
    margin-top: 10px;
    margin-bottom: 30px;
}


.qr-bioveg img{
    width: 100px;
    height: auto;
}


#img_veg{
    display: none;
}
#txt_veg_codice{
    display: none;
}

#img_sqnpi{
    display: none;
}

#img_bf{
    display: none;
}

#img_bio{
    display: none;
}

#img_veganeu{
    display: none;
}

#img_halal{
    display: none;
}

#img_blockchain{
    display: none;
}

#img_maiella{
    display: none;
}

#img_qualitaveg{
    display: none;
}

#img_demeter{
    display: none;
}

#img_demeterfiore{
    display: none;
}

#img_recicla{
    display: none;
}

#img_ffl{
    display: none;
}

#img_icea{
    display: none;
}


.txt_bio_codice {
  position: relative;
  text-transform: uppercase;
  top: -16px;
  bottom: 0;
  left: 0;
  right: 0;
  color: black;
  opacity: 1;
  font-size: 10px;
  letter-spacing: 1px;
}


.txt_bio_origine {
  position: relative;
  text-transform: uppercase;
  top: -30px;
  bottom: 0;
  left: 0;
  right: 0;
  color: black;
  opacity: 1;
  /* font-size: 10px; */
  font-size: 7px;
}


.qr-legal {
    display: none;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    width: 100%; 
    border: 0;
    margin: 0px;
    margin-top: 0px;
    padding: 20px 5px 10px 5px;
    
    color: #616161;
    background-color: lightgray;
}



.qr-legal img {
    display: block;
  margin-left: auto;
  margin-right: auto;
  width: 20%;

}

.qr-legal h2 {
    margin-top: 10px;
    display: flex;
    font-size: 4vH;
    line-height: 1;
    flex-direction: column;
    justify-content: center;
    align-items: center; 
    text-transform: uppercase;

}

.qr-legal h3 {
    margin-top: 0px;
    margin-bottom: 18px;
    line-height: 1;
    font-style: italic;
    letter-spacing: 2px;
}

.qr-warning {
    display: none;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    width: 100%;
    background: #a3a3a3;
    color: #f7f7f7;
    margin: 0;
    padding: 10px;
    text-transform: uppercase;
}

.qr-warning p {
    padding: 0;
    margin: 0;
    font-size: 6vW;
    line-height: 1.1;
}
.qr-warning h3 {
    color: #525252;
    font-weight: bold;
    font-size: 6vH;
}
.qr-warning hr {
    margin: auto;
    border-top: solid 3px #525252;
    width: 70%;
    margin-top: 0;
    margin-bottom: 10px;
}

.qr-inforiciclo {
	/*background-color: #fafafa;*/
}

.shadow {
  -moz-box-shadow:    0px 0px 3px 0px #000;
  -webkit-box-shadow: 0px 0px 3px 0px #000;
  box-shadow:         0px 0px 3px 0px #000;
}


.qr-inforiciclo .info-bottiglia{
    display: none;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    margin: 15px auto 6px auto;
    width: 94%;    
    /*background: #fcfcfc;*/    
    border-radius: 6px 50px 6px 50px; 


}

.mat-vetro {
    border: solid;
    border-width: 4px 0 0 4px;
    border-color: #00c702;
    color: white;
    background: #6daf4b;

}

.mat-plastica {
    border: solid;
    border-width: 4px 0 0 4px;
    border-color: #dda944;
    color: white;
    background: #f9b000;

}

.mat-acciaio {
    border: solid;
    border-width: 4px 0 0 4px;
    border-color: #85acdf;
    color: white;
    background: #538bd2;

}

.mat-alluminio {
    border: solid;
    border-width: 4px 0 0 4px;
    border-color: #85acdf;
    color: white;
    background: #538bd2;

}

.mat-tessile {
    border: solid;
    border-width: 4px 0 0 4px;
    border-color: #e3b287;
    color: white;
    background: #e8c4a5;

}

.mat-legno {
    border: solid;
    border-width: 4px 0 0 4px;
    border-color: #be722d;
    color: white;
    background: #a9713e;
}

.mat-carta {
    border: solid;
    border-width: 4px 0 0 4px;
    border-color: #4c86d0;
    color: white;
    background: #306cb9;;

}

.mat-altro {
    border: solid;
    border-width: 4px 0 0 4px;
    border-color: #626262;
    color: white;
    background: #7a7a7a;;

}




.materiale {
    font-family: 'DIN Pro Cond';
    font-weight: 500;
    font-style: normal;
    /*background: #fcfcfc;*/
    text-align: center;
    text-transform: uppercase;
    border-width: 4px 0 0 0;
    border-color: white;
    margin: 0;
    padding: 0 0 20px 0;

}
.materiale h2{
    display: block;
    font-size: 5vW;
    margin: 0;
    padding: 10px;
}

.materiale img {
    width: 40px;
    height: auto;
}

.test path{
    fill: red;
}

.specifiche {
    /*background: #f5f5f5;*/
    color: white;
    text-align: center;
    font-family: 'Cantarell';
    font-weight: normal;
    font-style: normal;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center; 
}

.spacer {
    margin: 10px 0;
    background-color: #f0f0f0;
}


.accordion {
    accordion-padding-y: 40px;
}

.accordion-button.collapsed {
    color: #666666;
}   


.accordion-button:not(.collapsed) {
    color: white;
    background-color: #a9d8cf;
}


.accordion-button:focus {
    box-shadow: none;
    border-color: rgba(169,216,207,.5);
}

.accordion-button:not(.collapsed)::after {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ffffff'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}

.titolo-acc {
    font-size: .8em;
    text-transform: uppercase;
   /* color: #666666; */
}

.ris-ingredienti {
    color: 000;
    text-align: center;
    font-family: 'Cantarell';
    font-weight: normal;
    font-style: normal;
    /* display: flex;
    flex-direction: column; */
    justify-content: center;
    align-items: center; 
}

.legenda-ingredienti {
    color: 000;
    text-align: left;
    font-family: 'Cantarell';
    font-weight: normal;
    font-style: italic;
    font-size: .9em;
    /* display: flex;
    flex-direction: column; */
    justify-content: center;
}

.allergene {
    /* font-size: 1.2em; */
    font-weight: 600;
    white-space: nowrap;
}

.video-embedded {
    width: 100%;
    height: 315px; 
    float: none; 
    clear: both; 
    margin: 0px;
}

.div-solfiti {
    margin-top: 10px;
    font-size: 1.2em;
    text-transform: uppercase;   
    text-align: center;
    letter-spacing: .1rem;
}

.div-protettiva {
    margin-top: 10px;
    font-family: 'Cantarell';
    font-weight: normal;
    font-style: normal;
    font-size: .9em;
    text-align: center;
    
}