.hover-scale {
  -webkit-transition: all 0.5s;
  -moz-transition: all 0.5s;
  -ms-transition: all 0.5s;
  -o-transition: all 0.5s;
  transition: all 0.5s;
  transform: scale(1);
}

.hover-scale:hover {
  transform: scale(1.05);
}

.hover-slide {
  position: relative;
  overflow: hidden;
}

.hover-slide:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgb(194, 6, 69) !important;
  background: -moz-linear-gradient(45deg, var(--color2) 0%, var(--color) 100%) !important;
  background: -webkit-linear-gradient(45deg, var(--color2) 0%, var(--color) 100%) !important;
  background: linear-gradient(45deg, var(--color2) 0%, var(--color) 100%) !important;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#c20645", endColorstr="#fdaf24", GradientType=1);
  z-index: -1;
  width: 0;
  -webkit-transition: all 0.5s;
  -moz-transition: all 0.5s;
  -ms-transition: all 0.5s;
  -o-transition: all 0.5s;
  transition: all 0.5s;
  opacity: 0;
}

.hover-slide:hover:before {
  width: 100%;
  opacity: 0.2;
}








.hover-border {
border:1px solid transparent!important;
-webkit-transition: all 0.5s;
-moz-transition: all 0.5s;
-ms-transition: all 0.5s;
-o-transition: all 0.5s;
transition: all 0.5s;

}

.hover-border:hover {
  border:1px dashed var(--color-darker)!important;
}