/* *{border: 1px solid red;} */

/*a {
  text-decoration: none;
}*/

h1,h2,h3,h4,h5 {
  font-family: Georgia, "Times New Roman", Times, serif;
}

p {
  color: #402e32;
  font-family: Georgia, "Times New Roman", Times, serif;
  font-size: 20px;
  line-height: 23px;
}

body,
html {
  max-width: 1350px;
  height: 100%;
  margin: 0 auto;
}

.spacer{
  height: 134px;
  margin-top: -85px!important;
  margin-bottom: 85px!important;
}

#CybotCookiebotDialogBodyButtonDecline{
  background-color: #a88c66!important;
  border-color: #d9a95c!important;
}
#CybotCookiebotDialogBodyLevelButtonLevelOptinAllowallSelection{
  background-color: #a88c66!important;
  border-color: #d9a95c!important;
}
#CybotCookiebotDialogBodyLevelButtonLevelOptinAllowAll{
  background-color: #a88c66!important;
  border-color: #d9a95c!important;
}
#CybotCookiebotDialogBodyEdgeMoreDetailsLink{
  color: #a88c66!important;
}
#CybotCookiebotDialogBodyContentTitle{
  text-shadow: 0px 4px 5px rgb(0, 0, 0)!important;
}


.hero_content h1, h2{
  text-shadow: 0px 4px 5px rgb(0, 0, 0)
}

/*------- HEADER --------------------------------------------------------*/
.header {
  height: 134px;
  width: 100%;
  max-width: 1350px;
  position: fixed;
  top: 0;
  background-color: #fff;
  display: flex;
  box-shadow: 0px 25px 15px #00000049;
  z-index: 1;
}
.header > .menu > li {
  height: calc(100% / 3);
}

#image_header{
  width: 100%;
}

.logo {
  background-color: #fff;
  text-align: center;
  line-height: 134px;
  width: 23.333%;
}
.logo img{
  height: 40px;
}

#logo_txt {
  white-space: nowrap;
  font-family: "Times New Roman", Times, serif;
  font-size: 70px;
  text-align: center;
  color: #d9a95c;
  background-color: #fff;
  line-height: 130px;
  width: 53.333%;
}

.menu {
  margin: 0;
  height: 134px;
  text-align: center;
  align-content: center;
  /*background-color: #fff;*/
  padding: 0;
  width: 23.333%;
  line-height: 44px;
}
.menu li {
  margin: auto;
  display: block;
  flex-grow: 0;
}

.logoTRUFFLE{
  position: absolute;
  top: 120px;
  z-index: 1;
  margin: 3vh 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  max-width: 768px;
  height: 96px;
}

#galleria,
#prodotti,
#contattaci {
  text-decoration: none;
  font-size: 20px;
  border-radius: 15px;
  padding: 4px 20px;
  font-family: Georgia;
  color: #d9a95c;
  background-color: #402e32;
}

#contattaci {
  color: white;
  background-color: #d9a95c;
}
.topnav .icon {
  display: none;
}

.container_footer_CTA{
  height: 30px;
  margin-top: 5px;
  text-align: center;
  align-items: center;
}
.footer_CTA {
  text-decoration: none!important;
  color: white;
  font-size: 20px;
  border-radius: 15px;
  padding: 2px 20px;
  background-color: #d9a95c;
  font-family: Georgia;
  width: 100%;
}

/*------- tricolore --------------------------------------------------------*/
.tricolore {
  position: fixed;
  top: 134px;
  width: 100%;
  max-width: 1350px;
  margin: 0!important;
}
.tricolore:after {
  content: "";
  display: table;
  clear: both;
}
.tricolore #verde, #bianco, #rosso {
  height: 10px;
  width: calc(100% / 3);
  border: 1px solid #d9a95c;
  float: left;
}
#verde {
  background: #12993a;
}
#bianco {
  background: white;
}
#rosso {
  background: red;
}

/* -------commerciale----------------------------------------------------------- */
.commerciale{
  align-self: center;
  width: 100%;
  max-width: 1350px;
  bottom: 0;
  position: fixed;
  height: 30px;
  color: #fff !important;
  background-color: #d9a95c;
  padding: 3px 3px 3px 3px;
  z-index: 999;
}
.commerciale p{
align-self: center;
}
.commerciale p a{
  color: #fff;
}
/* -------HERO----------------------------------------------------------- */

.flickity-enabled.is-draggable{
  user-select: none;
}

/* The hero image */
.hero_content {
  height: 200px;
  width: 100%;
  max-width: 1350px;
  margin: 0 auto;
  text-align: center;
  position: absolute;
  bottom: 0px;
}
.hero_content h1, h2 {
  text-shadow: 0px 4px 5px rgb(0, 0, 0);
}
.hero_content h1 {
  color: #d9a95c;
  font-family: "Times New Roman", Times, serif;
  font-style: normal;
  font-weight: normal;
  font-size: 80px;
  margin: 0px 0px 0px 0px;
  position: absolute;
  bottom: 130px;
  background-color: #ffffff98;
  width: 100%;
  text-align: left;
  padding-left: 50px;
}
.hero_content #hero_content_SPAN1{
  color: #d9a95c;
  font-family: Georgia, "Times New Roman", Times, serif;
  font-size: 55px;
  font-weight: bold;
  font-style: italic;
  position: absolute;
  bottom: 80px;
  left: 80px;
  width: 50%;
  white-space: nowrap;
}
.hero_content #hero_content_SPAN2{
  color: #d9a95c;
  font-family: Georgia, "Times New Roman", Times, serif;
  font-size: 55px;
  font-weight: lighter;
  font-style: italic;
  position: absolute;
  right: 80px;
  width: 50%;
  white-space: nowrap;
  bottom: 35px;
}
.hero_content_CTA {
  display: none;
  color: white;
  font-size: 20px;
  border-radius: 15px;
  padding: 2px 20px;
  background-color: #d9a95c;
  font-family: Georgia;
  position: absolute;
  bottom: 35px;
  transform: translateX(-50%);
  width: 200px;
}

/* ________ BIANCONERO ________________________________________________ */

.bianconero {
  font-family: Georgia, "Times New Roman", Times, serif;
  display: flex;
  background-color: #d9a95c20;
  padding: 50px 0px 50px 20px;
}

.bianco,
.nero {
  align-items: center;
}

.bambina_testo h3,
.donna_testo h3 {
  color: #402e32;
  margin-top: 0;
}
#donnatesto,
#bambinatesto {
  font-size: 16px;
  width: 100%;
  margin: 0;
}

.donna_testo {
  margin: 0px 30px;
  width: 30%;
}
.bianco{
  background: url(imgs/donna.jpg) no-repeat center center;
  box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.287);
  width: 320px;
  height: 450px;
}

.bambina_testo {
  margin: 0px 20px;
  height: 40%;
  width: 30%;
}
.nero{
  background: url(imgs/bambina.jpg) no-repeat center center;
  box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.287);
  width: 320px;
  height: 450px;
}
.nero img {
  box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.287);
  object-fit: cover;
  width: 100%;
  height: 100%;
}

/* ________ CAROSELLO ____________________________________________________ */
.main-carousel {
  height: 350px;
  width: 100%;
  padding: 30px 0px;
}
.carousel-cell {
  height: 300px;
  width: 300px;
  text-align: center;
}
.carousel-cell img{
  height: 300px;
}

.flickity-button{
  background: #d9a95c!important;
  color: #ffffff!important;
}
/* .flickity-icon{
  fill: #ffffff!important;
} */

/* ________ FORM __________________________________________________________ */
.infoform {
  font-family: Georgia, serif !important;
  height: 473px;
  display: flex;
  max-width: 1100px;
  margin: 0 auto;
  align-content: center;
}
.info {
  width: 40%;
  margin: 0px 40px 0px 40px;
}
.info h3 {
  margin: 20px 0px 30px 0px;
  font-size: 78px;
  font-weight: lighter;
  white-space: nowrap;
}
.info p {
  font-weight: lighter;
  line-height: 40px;
  font-size: 16px;
}
.info a{
  color: #a88c66;
}
.form {
  margin-right: 40px;
  padding: 10px 20px 20px 20px;
  width: 600px;
  background-color: #d9a95c;
  border-radius: 5px;
}
.form h3 {
  font-weight: lighter;
  color: #402e32;
  font-size: 27px!important;
  text-align: center;
  margin: 0px 0px 5px 0px;
}

.form .nome, .azienda, .email, .telefono {
  margin-bottom: 5px !important;
  padding: 10px!important;
  font-size: 16px!important;
  border: 0;
  border-radius: 5px;
}
.form .azienda, .telefono{
  float: right!important;
}

.form .nome, .email {
  float: left;
  margin-right: 10px;
}
.form .messaggio {
  width: 100%;
  font-size: 16px;
  border: 0;
  border-radius: 5px;
}
.form .submit {
  margin-top: 5px;
  height: 40px;
  line-height: 20px;
  font-size: 20px;
  background-color: #d9a95c;
  border: 2px solid #fff8ea;
  border-radius: 5px;
}

/* ________ GALLERIA __________________________________________________________ */
.content {
  display: flex;
  flex-wrap: wrap;
}

.wrapper {
  width: 12.5%;
}

.wrapper img {
  width: 100%;
  height: 100%;
  cursor: zoom-in;
}


/* ________ VIDEO ____________________________________________________________ */
.video{
  height: 470px;
  padding: 10px;
  background-color: #d9a95c20;
  border-radius: 5px;
  text-align: center;
  width: 100%;
  max-width: 1350px;
  display: flex;
  margin: 0!important;
}

.video :after {
  content: "";
  display: table;
  clear: both;
}
.videoSX video{
  box-shadow: 0px 25px 15px #00000049;
}

.videoSX{
  margin-left: 30px;
  border-radius: 15px 0px 0px 15px;
  margin: 0;
  width: 50%;
}

.videoDX video{
  box-shadow: 0px 25px 15px #00000049;
}
.videoDX{
  width: 50%;
  height: 426px;
}
/* .controlBar controlBar{
  background-color: #d9a95c!important;
} */

/* ________ MAPPA ____________________________________________________________ */
.map_container{
  margin-top: 30px;
  height: 350px;
}

/* ________ tricolore1 ________________________________________________________ */

.row_tricolore1{
  padding: 0;
  margin: 0!important;
  width: 100%;
  max-width: 1350px;
}
.row_tricolore1 #verde, #bianco, #rosso{
  height: 10px;
  width: calc(100% / 3);
  border: 1px solid #d9a95c;
  float: left;
}

/* ________ FOOTER ________________________________________________________ */
.row_footer{
  text-align: center;
  padding: 20px 20px 40px 20px;
  margin: 0!important;
  width: 100%;
  background-color: #402e32;
}

.row_footer .column_sinistra, .column_centro, .column_destra{ 
  width: calc(100% / 3);
  float: left;
  height: 160px;
  padding: 0px 10px;
}

.row_footer .column_sinistra{
  margin-top: 5px;
  line-height: 15px;
}
  
.row_footer h1{
  font-family: 'Times New Roman', Times, serif;
  margin: 0;
  color: #FFF8EA;
  font-size: 18px;
}
.row_footer p{
  font-family: 'Times New Roman', Times, serif;
  font-size: 13t;
  font-weight: normal;
  color: #FFF8EA;
  margin: 10px 0px 0px 0px;
  line-height: 30px;
}
.row_footer .column_destra p{
  margin: 0px 0px 0px 0px;
}

/* Clear floats after the columns */
.row_footer:after {
  content: "";
  display: table;
  clear: both;
}

.container_footer_CTA{
  margin-top: 15px;
}

/* ________ COPYRIGHT ______________________________________________________ */
.copyright{
  background-color: #402e32;
  text-align: center;
  bottom: 55px;
}
.copyright p{
  margin: 0;
  color: #FFF8EA;
  font-size: 15pt;
}

#buttonUP {
  position: fixed;
  bottom: 55px;
  right: 0;
  opacity: 0;
  visibility: hidden;
}
#buttonUP.show {
  height: 62px;
  width: 62px;
  opacity: 0.8;
  visibility: visible;
}
#buttonUP:hover{
  opacity: 1;
}

/*-----------------------------------------------------------*/
/*------------------------MEDIA QUERY------------------------*/
/*-----------------------------------------------------------*/

@media (max-width: 1350px){
  .hero_content h2{
  font-size: 4.1vw;
  }
    .commerciale p{
    font-size: 13pt;
}





  .copyright p{
    display: none;
  }
}




@media (max-width: 1076px) {

    .commerciale p{
    font-size: 10pt;
}
  .info {
    margin-right: 0px 10px 0px 10px;
  }
  .info h3 {
    font-size: 60px;
  }

  .form .nome, .azienda, .email, .telefono {
    margin-bottom: 5px !important;
  }
  .form h3 {
    font-size: 16px!important;
    margin-bottom: 17px!important;
  }



  .copyright p{
    display: none;
  }


}




@media (max-width: 1024px) {
  #logo_txt {
    font-size: 50px;
  }
  .menu li a {
    margin-top: 10px;
  }


  .row_footer .column_sinistra p{
    line-height: 25px;
  }


    .copyright p{
    display: none;
  }
}






@media screen and (max-width: 768px) {
  /*----- HEADER ----------------------------------------*/
  .menu {
    display: none;
  }
  .header {
    height: 70px;
  }
  .logoIMG{
    top: 60px;
  }
  .logo > img {
    height: 70px;
  }
  .logo {
    line-height: 70px;
    width: 100%;
    align-items: center;
  }
  #logo_txt {
    display: none;
    font-size: 20px;
    height: 30px;
    width: 100%;
    line-height: 30px;
  }
  .tricolore {
    top: 70px;
    width: 100%;
    height: 10px;
  }
  .logoTRUFFLE{
    top: 60px;
  }
  .logoTRUFFLE img{
    /* top: 100px; */
    height: 60px;
  }

  .hero_content h1, .hero_content_CTA{
    margin-bottom: 20px;
  }
  #hero_content_SPAN1{
    margin-bottom: 30px;
  }
  #hero_content_SPAN2{
    margin-bottom: 50px;
  }

  /*----- HERO ----------------------------------------*/
   .hero_content h1 {
    font-size: 10.5vw;
    margin-left: 10;
    text-align: center;
  }
  .hero_content #hero_content_SPAN1{
    font-size: 6.5vw!important;
    left: 0;
    width: 100%;
    bottom: 75px;
  }
  .hero_content #hero_content_SPAN2{
    display: none;
  }
  .hero_content .hero_content_CTA{
    display: initial;
  }


  /*----- BIANCONERO ----------------------------------------*/
  .bianconero {
    display: inline-block;
    padding: 20px;
  }
  .infoform {
    display: inline-block;
  }
  .bianco {
    background: url(imgs/donnaCENTER.jpg) no-repeat center center;
    background-size: cover;
    height: 200px;
    margin-top: 10px;
    background-position: bottom;
    width: 100%;
  }
  .nero {
    background: url(imgs/bambinaCENTER.jpg) no-repeat center center;
    background-size: cover;
    height: 200px;
    margin-top: 10px;
    background-position: bottom;
    width: 100%;
  }

  .donna_testo, .bambina_testo {
    width: 100%;
    margin: 10px 0px 0px 0px;
  }



  /*----- CAROUSEL ----------------------------------------*/
  .main-carousel {
    height: 240px;
    text-align: center;
  }
  .carousel-cell {
    height: 200px;
    width: 250px;
    text-align: center;
  }
  .carousel-cell img {
    height: 200px;
  }



  /*----- GALLERIA-MODAL ----------------------------------------*/
.modal-content{
  background-color: #402e3270!important;
}


  /*----- FORM ----------------------------------------*/
  .info{
    width: 100%;
    margin: 0 auto;
    padding: 10px;
  }
  .info h3 {
    text-align: center;
    margin: 0 auto !important;
    font-size: 50px;
  }
  .info p {
    margin-top: 0;
    line-height: 25px;
  }



  .form {
    margin: 0 auto;
    width: 100%;
    padding: 10px;
  }
  .form h3 {
    font-size: 4.5vw!important;
    height: 40px;
    margin-bottom: 20px!important;
  }
  .form .nome, .azienda, .email, .telefono, .messaggio {
    font-size: 20px;
  }

  .form .submit {
    width: 100%;
  }




  /*----- GALLERIA ----------------------------------------*/
  .galleria {
    margin-top: 20px;
  }
  .wrapper {
    width: 50%;
  }

/*--------footer-------------------------------------------*/
  .row_footer .column_centro p, .column_destra p, .column_sinistra p, .copyright p{
    font-size: 15px;
  }
  .row_footer{
  height: 280px!important;  
  }
  .copyright p{
    display: none;
  }
  .row_footer .column_sinistra p{
    line-height: 25px;
  }
}






@media all and (max-width: 480px) {

.logo img{
height: 70px;
}
  /*----- HERO ----------------------------------------*/
.hero{
  width: 100%;
}


/*----- FOOTER ----------------------------------------*/
.row_footer{
  display: block;
  height: 360px!important;
  padding: 10px 0px;
}
.row_footer h1{
  font-size: 13px;
}
.row_footer p{
  font-size: 12px;
  line-height: 20px;
}
.row_footer .column_sinistra, .column_centro{
  height: 100px;
  width: 100%;
  padding: 0px 5px;
}
.row_footer .column_destra{
  height: 135px;
  width: 100%;
  padding: 0px 5px;
}
.row_footer .column_centro{
  /*margin-top: 15px;*/
  height: 40px;
}
.row_footer .column_destra p{
  margin-top: 0;
}


.videoSX, .videoDX{
  margin: 0 auto!important;
  margin-bottom: 40px!important;
  width: 200px!important;
}

.video{
  height: 940px;
  display: inline-block;
}

.commerciale{
  height: 50px;
}
.footer_CTA{
  display: none;
}
.container_footer_CTA{
  height: 0px;
}

}




*,
*::before,
*::after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}