
.card-img-flash::before {
content: '';
position: absolute;
top: 0;
z-index: 2;
left: -80%;
width: 50%;
height: 100%;
display: block;
background: -webkit-gradient(linear, left top, right top, from(rgba(255, 255, 255, 0)), to(rgba(255, 255, 255, 0.3)));
background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.3) 100%);
-webkit-transform: skewX(-25deg);
transform: skewX(-25deg);
}
élément {
}
.card-img-flash {
position: relative;
overflow: hidden;
}

a{
-webkit-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
}

a {
color: var(--primary);
text-decoration: none;
}

.card, .overflow-hidden {
will-change: transform;
}

.card .card-element-hover {
visibility: hidden;
margin-top: 30px;
opacity: 0;
-webkit-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
z-index: 9;
}

.card:hover .card-element-hover {
visibility: visible;
margin-top: 0px;
opacity: 1;
}

.card.card-overlay-bottom {
overflow: hidden;
}

.card.card-overlay-bottom:before {
content: "";
position: absolute;
height: 50%;
width: 100%;
bottom: 0;
left: 0;
right: 0;
background-image: -webkit-gradient(linear, left top, left bottom, from(transparent), to(black));
background-image: linear-gradient(180deg, transparent, black);
z-index: 1;
}

.card .card-img-overlay {
z-index: 2;
}

.card.card-overlay-top {
overflow: hidden;
}

.card.card-overlay-top:before {
content: "";
position: absolute;
height: 50%;
width: 100%;
top: 0;
left: 0;
right: 0;
background-image: -webkit-gradient(linear, left bottom, left top, from(transparent), to(black));
background-image: linear-gradient(0deg, transparent, black);
}

.card-img-scale .card-img {
-webkit-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
-webkit-transform: scale(1);
transform: scale(1);
}

.card-img-scale:hover .card-img {
-webkit-transform: scale(1.08);
transform: scale(1.08);
}

.card-bg-scale {
z-index: 99;
}

.card-bg-scale::after {
content: "";
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
background: inherit;
-webkit-transition: all 1s !important;
transition: all 1s !important;
z-index: -2;
}

.card-bg-scale:hover::after {
-webkit-transform: scale(1.1);
transform: scale(1.1);
-webkit-transition: all 1s !important;
transition: all 1s !important;
}

.card-featured {
position: absolute;
z-index: 99;
background: var(--primary);
color: #fff;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
text-align: center;
top: -8px;
right: -48px;
width: 120px;
padding: 16px 0 3px 0;
}

.card-img-flash {
position: relative;
overflow: hidden;
}

.card-img-flash::before {
content: '';
position: absolute;
top: 0;
z-index: 2;
left: -80%;
width: 50%;
height: 100%;
display: block;
background: -webkit-gradient(linear, left top, right top, from(rgba(255, 255, 255, 0)), to(rgba(255, 255, 255, 0.3)));
background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.3) 100%);
-webkit-transform: skewX(-25deg);
transform: skewX(-25deg);
}

.card-img-flash:hover::before {
-webkit-animation: imgflash 1s;
animation: imgflash 1s;
}

@-webkit-keyframes imgflash {
100% {
left: 125%;
}
}

@keyframes imgflash {
100% {
left: 125%;
}
}
:root{
--bs-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));
}




.made-with-mk {
  width: 50px;
  height: 50px;
  display: block;
  position: fixed;
  z-index: 555;
  bottom: 40px;
  right: 40px;
  border-radius: 30px;
  background-color: rgba(16, 16, 16, 0.35);
  border: 1px solid rgba(255, 255, 255, 0.15);
  color: #FFFFFF;
  cursor: pointer;
  padding: 10px 12px;
  white-space: nowrap;
  overflow: hidden;
  -webkit-transition: 0.55s cubic-bezier(0.6, 0, 0.4, 1);
  -moz-transition: 0.55s cubic-bezier(0.6, 0, 0.4, 1);
  -o-transition: 0.55s cubic-bezier(0.6, 0, 0.4, 1);
  transition: 0.55s cubic-bezier(0.6, 0, 0.4, 1); }
  .made-with-mk:hover, .made-with-mk:active, .made-with-mk:focus {
    width: 218px;
    color: #FFFFFF;
    transition-duration: .55s;
    padding: 10px 19px; }
    .made-with-mk:hover .made-with, .made-with-mk:active .made-with, .made-with-mk:focus .made-with {
      opacity: 1; }
    .made-with-mk:hover .brand, .made-with-mk:active .brand, .made-with-mk:focus .brand {
      left: 0; }
  .made-with-mk .brand,
  .made-with-mk .made-with {
    float: left; }
  .made-with-mk .brand {
    position: relative;
    top: 4px;
    left: -1px;
    letter-spacing: 1px;
    vertical-align: middle;
    font-size: 16px;
    font-weight: 600; }
  .made-with-mk .made-with {
    color: rgba(255, 255, 255, 0.6);
    position: absolute;
    left: 58px;
    top: 14px;
    opacity: 0;
    margin: 0;
    -webkit-transition: 0.55s cubic-bezier(0.6, 0, 0.4, 1);
    -moz-transition: 0.55s cubic-bezier(0.6, 0, 0.4, 1);
    -o-transition: 0.55s cubic-bezier(0.6, 0, 0.4, 1);
    transition: 0.55s cubic-bezier(0.6, 0, 0.4, 1); }
    .made-with-mk .made-with strong {
      font-weight: 400;
      color: rgba(255, 255, 255, 0.9); }

