/*19.SHORTCUT ESPACE.CSS*/
.raccourci{
  position: relative;
  overflow: hidden;
  margin: 10px;
  min-width: 225px;
  /*max-width: 281px;*/
  max-width: 25%;
  width: 100%;
  color: #000000;
  text-align: center;
  -webkit-perspective: 50em;
  perspective: 50em;
  margin: 0;
  padding:5px;
}

[id="HomepageTemplate"] .raccourci.shortcut-2 figcaption small > small > small{
  font-size: 1.2rem;
}

.page-id-6789 .raccourci.shortcut-2 figcaption h2 > small > small > small{
  font-size: 1.2rem;

}



.raccourci:after {
  background-color: transparent;
  border:2px solid #FFFFFF;
  position: absolute;
  content: "";
  display: block;
  top: 20px;
  left: 20px;
  right: 20px;
  bottom: 20px;
  -webkit-transform: rotateX(-90deg);
          transform: rotateX(-90deg);
  -webkit-transform-origin: 50% 50%;
          transform-origin: 50% 50%;
  opacity: 0;
  -webkit-transition: opacity 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
  transition: opacity 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
  transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
  transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;

}
.raccourci:hover:after,
.raccourci.hover:after {
  -webkit-transform: rotateX(0);
          transform: rotateX(0);
  opacity: 1;
}

.raccourci img{
  -webkit-transform:scale(1);
          transform:scale(1);
  -webkit-transition:transform 0.3s ease-in-out;
  -webkit-transition:-webkit-transform 0.3s ease-in-out;
  transition:-webkit-transform 0.3s ease-in-out;
  transition:transform 0.3s ease-in-out;
  transition:transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
}
.raccourci:hover img{
  -webkit-transform:scale(1.1);
          transform:scale(1.1);
}

.raccourci figcaption {
  top: 50%;
  left: 20px;
  right: 20px;
  text-align:center;
  position: absolute;
  opacity: 1;
  z-index: 1;
  -webkit-transform: translateY(-40%);
          transform: translateY(-40%);
  -webkit-transition: -webkit-transform 0.2s ease-out;
  transition: -webkit-transform 0.2s ease-out;
  transition: transform 0.2s ease-out;
  transition: transform 0.2s ease-out, -webkit-transform 0.2s ease-out;
}
.raccourci:hover figcaption,
.raccourci.hover figcaption {
  -webkit-transform: translateY(-60%);
  transform: translateY(-60%);
  -webkit-transition-delay: 0.2s;
  transition-delay: 0.2s;
}

/*TYPO*/
.raccourci h2{
  margin:0;
  font-size: 1.5rem;
  color:#FFFFFF;
  line-height: 1.2;
  text-transform: uppercase;
}
.raccourci h2 small{
  display: block;
  text-align:center;
}
.raccourci .h4-like{
  display: inline-block;
  padding:5px 10px;
  background-color:#e8430C;
  color:#FFFFFF;
  font-size:1.2rem;
  text-transform: uppercase;
  margin-bottom: 5px;
}
.raccourci span.plus{
  display: inline-block;
  width: 40px;
  height: 40px;
  background: #FFFFFF;
  text-align:center;
  border-radius: 50%;
  margin-top: 5px;
  padding:10px; 
  opacity: 0;
  -webkit-transform: rotateX(-90deg);
          transform: rotateX(-90deg);
  -webkit-transform-origin: 50% 50%;
          transform-origin: 50% 50%;
  -webkit-transition: opacity 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
  transition: opacity 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
  transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
  transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out; 
}
.raccourci span.plus img.svg{display:none;}
.raccourci:hover span.plus svg path{
  fill:#131926;
}
.raccourci:hover span.plus,
.raccourci.hover span.plus{
  -webkit-transform: rotateX(0);
          transform: rotateX(0);
  opacity: 1;
}

.raccourci a {
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  position: absolute;
  z-index: 1;
}




/*MEDIAQUERIES*/
@media(max-width:995px){
  .raccourci{
    max-width: 33.3334%;
  }
}
@media(max-width:767px){
  .raccourci{
    max-width: 50%;
    min-width: 143px;
  }
  .raccourci h2{
    font-size: 1.1rem;
  }
  .raccourci .h4-like{
    padding:5px;
    font-size:1.0rem;
  }
  .raccourci:after{
    border-width: 1px;
    top:5px;
    left:5px;
    bottom:5px;
    right:5px;
  }
  .raccourci span.plus{
    width:20px;
    height:20px;
  }
}
/*---*/





/*19.FIN SHORTCUT ESPACE.CSS*/