body {
  margin: 0;
  padding: 0;
  font-family: 'Montserrat', sans-serif;
}
.containerWrapper{
    display: flex;
    flex-wrap: wrap;
  }

.boxWrap{
  flex: 1 0 calc(50% - 10px);
  /* margin: 5px; */
  height: 50vh;
}

.box:after{
  content: '';
  display: block;
  padding-bottom: 100%;
}

.bgImage {
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  background-attachment: initial;
  position: relative;

}

.overlayLabel {
  position: absolute;
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
  /* background: rgba(43,36,30,.6); */
  -webkit-transition: all .3s;
  -moz-transition: all .3s;
  -o-transition: all .3s;
  transition: all .3s;
  z-index: 999;
  overflow: hidden;
}

.overlayLabel:hover {
  background: rgba(0, 0, 0, 0.5);
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -ms-transition: all 1s ease;
  -o-transition: all 1s ease;
  transition: all 1s ease;
}

.overlayLabel {
  -webkit-transition: all .3s;
  -moz-transition: all .3s;
  -o-transition: all .3s;
  transition: all .3s;

}

.overlayText {
  position: relative;
  left: 50%;
  top: 50%;
  transform: translate(-50%, 240%);
  display: flex;
  justify-content: center;
  align-content: center;
  flex-wrap: wrap;
  flex-direction: column;
}

.img-fluid {
  max-width: 100%;
  height: auto;
}
.boxImageOverlay {
  height: 55px;
  margin: 0 auto;
}
/* fix per safari */
.box1 {
  width: 437px;
}
.box2{
  width: 287px;
}
.box3{
  width: 335px;
}
.overlayText img:hover {
  transform: scale(1.1);
  -webkit-transition: all .3s ease-in-out;
  -moz-transition: all .3s ease-in-out;
  -ms-transition: all .3s ease-in-out;
  -o-transition: all .3s ease-in-out;
  transition: all .3s ease-in-out;
  cursor: pointer;
}


.overlayText img {
  -webkit-transition: all .3s ease-in-out;
  -moz-transition: all .3s ease-in-out;
  -ms-transition: all .3s ease-in-out;
  -o-transition: all .3s ease-in-out;
  transition: all .3s ease-in-out;
}


.boxImageOverlay {
  -webkit-animation: fadein 5s; /* Safari, Chrome and Opera > 12.1 */
  -moz-animation: fadein 5s; /* Firefox < 16 */
   -ms-animation: fadein 5s; /* Internet Explorer */
    -o-animation: fadein 5s; /* Opera < 12.1 */
       animation: fadein 5s;
}


@keyframes fadein {
  from { opacity: 0; }
  to   { opacity: 1; }
}

/* Firefox < 16 */
@-moz-keyframes fadein {
  from { opacity: 0; }
  to   { opacity: 1; }
}

/* Safari, Chrome and Opera > 12.1 */
@-webkit-keyframes fadein {
  from { opacity: 0; }
  to   { opacity: 1; }
}

/* Internet Explorer */
@-ms-keyframes fadein {
  from { opacity: 0; }
  to   { opacity: 1; }
}

/* Opera < 12.1 */
@-o-keyframes fadein {
  from { opacity: 0; }
  to   { opacity: 1; }
}

/* START footer */
.footerMonetti {
  padding: 20px 20px 20px 20px;
  background-color: #212529;
  display: flex;
  justify-items: center;
  align-items: center;
}
.footer-text {
  text-align: center;
  line-height: 1.4;
  color: white;
  margin: 0 auto;
}
.footer-text a  {
  text-decoration: none;
  color: white;
  transition: all .1s ease;
  font-family: 'Montserrat', sans-serif;
  font-size: 0.880em;
}
.footer-text a:hover  {
  text-decoration: none;
  color: #888;
  cursor: pointer;
  transition: all .1s ease;
}
/*
END FOOTER */



.box_testo {
  font-size:          22px;
  text-align:         center;
  position:           absolute;
  left:               50%;
  top:                60%;
  -webkit-transform:  translate(-50%, -50%);
  transform:          translate(-50%, -50%);
  line-height:        1.5em;
}



/* MEDIA QUERY  */

@media screen and (max-width:1366px) {
  .overlayText {
    transform: translate(-50%, 110%);
  }
}


@media screen and (max-width:1280px) {
  .boxWrap{
    flex: 1 0 calc(100% - 10px);
    height: 50vh;
  }
  .overlayText {
    transform: translate(-50%, 130%);
  }
  .boxImageOverlay {
    height: 40px;
  }
  /* fix per safari */
  .box1 {
    width: 350px;
  }
  .box2{
    width: 235px;
  }
  .box3{
    width: 250px;
  }
}



@media screen and (max-width:768px) {
  .box_testo {
    font-size:          16px;
    line-height:        1.1em;
  }
}


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

  /* fix per safari */
  .box1 {
    width: 290px;
  }
  .box2{
    width: 230px;
  }
  .box3{
    width: 250px;
  }
}