#gallerie-section2 img, #gallerie-section2 video{
  width: 100%;
  height: auto;
}
#themetimbres{
  color:#1b1b1b;
}
.grid-gallerie{
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(550px, 1fr));
  /*grid-gap: 1em;*/
  transition: all 1s;
}


.box {
  position: relative;
}

.box-image {
  line-height: 0;
  overflow: hidden;
}

.box-image img , .box-image video{
  transition: 0.5s;
  transform: scale(1.1);

}

.box-title {
  text-decoration: none;
  padding:0 0;
  z-index: 1;
  position: absolute;
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
  opacity: 0;
  transition: .5s;
  background: rgba(0,0,0,0.88);
  color: white;
  text-align: center;
  
  display: grid;
  align-items: center;
  
}
.box-title h2 {
  font-family: 'Noe display', sans-serif;
  font-weight: 500;
  font-size: 4rem;
}

.theme{
  font-family: 'Noe display', sans-serif;
  font-weight: 500;
  font-size: 1.6rem;
  letter-spacing: 0.1rem;
  z-index: 2;
  position: absolute;
  width: 100%;
  bottom: 0;
  left: 0;
  padding-left: 2rem;
  opacity: 0;
  transition: .25s;
  /*background: rgba(90,0,10,0.4);*/
  color: white;
}
.theme>span{
  color:orange;
}
.box:hover .box-title {
  opacity: 1;
  height:100%;
  font-size: 2rem;
  transition: .5s;
}

.box:hover .theme{
  opacity: 1;
  bottom: 2rem;
  transition: .5s .1s;
}

.box:hover .box-image img {
/*  filter: blur(2px);*/
  transform: scale(1.2);
  transition: .5s;
}



@media (max-width:1920px){
.grid-gallerie {
  grid-template-columns: repeat(3, 1fr);
  }
}

@media (max-width:1023px){
  .grid-gallerie {
    grid-template-columns: repeat(2, 1fr);
  }
  .box-title h2 {
    font-size: 3rem;
  }
}



@media (max-width:320){
.grid-gallerie {
  grid-template-columns: 1fr;
  }
  
}
@media (hover: none){
  .box-title h2{display: none;} 


}


