:root {
    --color-yellow: #FDC928;
    --color-pink: #FF7FC0;
  }
.hv-button:before {content: "";position: absolute;z-index: -1;top: 0;bottom: 0;left: 0;right: 0;-webkit-transform: scaleX(1);transform: scaleX(1);-webkit-transform-origin: 50%;transform-origin: 50%;-webkit-transition-property: transform;transition-property: transform;-webkit-transition-duration: 0.3s;transition-duration: 0.3s;-webkit-transition-timing-function: ease-out;transition-timing-function: ease-out;}
.hv-button {vertical-align: middle;-webkit-transform: perspective(1px) translateZ(0);transform: perspective(1px) translateZ(0);position: relative;-webkit-transition-property: color;transition-property: color;-webkit-transition-duration: 0.3s;
transition-duration: 0.3s;text-decoration: none;}
.hv-button:hover:before{-webkit-transform: scaleX(0);transform: scaleX(0);}

.hvr-rectangle-in {display: inline-block;vertical-align: middle;-webkit-transform: perspective(1px) translateZ(0);transform: perspective(1px) translateZ(0);box-shadow: 0 0 1px rgba(0, 0, 0, 0);position: relative;-webkit-transition-property: color;transition-property: color;-webkit-transition-duration: 0.3s;
transition-duration: 0.3s;}
.hvr-rectangle-in:before {content: "";position: absolute;z-index: -1;top: 0;left: 0;right: 0;bottom: 0;-webkit-transform: scale(1);transform: scale(1);-webkit-transition-property: transform;transition-property: transform;-webkit-transition-duration: 0.3s;transition-duration: 0.3s;-webkit-transition-timing-function: ease-out;transition-timing-function: ease-out;}
.hvr-rectangle-in:hover:before, .hvr-rectangle-in:focus:before {-webkit-transform: scale(0);transform: scale(0);}

.hvr-overline-reveal {display: inline-block;vertical-align: middle;-webkit-transform: perspective(1px) translateZ(0);transform: perspective(1px) translateZ(0);box-shadow: 0 0 1px rgba(0, 0, 0, 0);position: relative;overflow: hidden;}
.hvr-overline-reveal:before {content: "";position: absolute;z-index: -1;left: 0;right: 0;top: 0;background: var(--color-yellow);height: 4px;-webkit-transform: translateY(-4px);transform: translateY(-4px);-webkit-transition-property: transform;transition-property: transform;-webkit-transition-duration: 0.3s;transition-duration: 0.3s;-webkit-transition-timing-function: ease-out;transition-timing-function: ease-out;}
.hvr-overline-reveal:hover:before, .hvr-overline-reveal:focus:before, .hvr-overline-reveal.active:before {-webkit-transform: translateY(0);transform: translateY(0);}

.hv-transparent{background-color: var(--color-pink);}
.hv-transparent:before{background-color: white;}
.hv-transparent:hover{color: #fff;}

.hv-pink{background-color: var(--color-pink);}
.hv-pink:before{background-color: var(--color-yellow);border-radius: 2rem;}
.hv-pink:hover{color: #fff;}

.hv-white:before{background-color: #fff;border-radius: 2rem;}
.hv-white:hover{color: #fff!important;}

.hv-main{background-color: white;}
.hv-main:before{background-color: var(--color-pink);}
.hv-main:hover{color: var(--color-blue)!important;box-shadow: 0px 0px 2px 1px var(--color-blue);}
.hv-rounded:before{border-radius: 0.375rem;}

.hv-left::before {content: "";position: absolute;top: 0; left: 0;width:0; height: 100%;
background: #FF7FC0;transition: width 0.3s ease;z-index: -1;}
.hv-left:hover::before{width: 100%;}
.white:hover{color: #fff;}
/*IMG*/
.hover_img{position:relative; overflow:hidden;}
.hover_img:before{position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: rgba(255,255,255,0.5);content: '';z-index:10;-webkit-transition: -webkit-transform 0.6s;transition: transform 0.6s;-webkit-transform: scale3d(2.2,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,-120%,0);
transform: scale3d(2.2,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,-120%,0);}
.hover_img:hover:before {webkit-transform: scale3d(2.2,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,120%,0);transform: scale3d(2.2,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,120%,0);}
.hover_img img{transition:all 1s ease 0s;}
.hover_img:hover img{transform:scale(1.2);}

.xoay_hinh{position: relative; overflow:hidden;}
.xoay_hinh img{transition:all 1s ease 0s;}
.xoay_hinh:hover img{transform:rotate(360deg);}

.zoom_hinh{ position: relative; overflow:hidden;}
.zoom_hinh img{transition:all 1s ease 0s;}
.zoom_hinh:hover img{transform:scale(1.1);}
/*Icon*/
.icon-lift {display: inline-block;transition: transform 0.4s ease;}
.icon-lift:hover {transform: translateY(-6px);}
.icon-bounce {display: inline-block;transition: transform 0.6s ease;}
.icon-bounce:hover {animation: bounceUp 0.6s ease;}
@keyframes bounceUp {
  0%   { transform: translateY(0); }
  50%  { transform: translateY(-3px); }
  70%  { transform: translateY(-5px); }
  100% { transform: translateY(-8px); }
}
.icon-zoom {display: inline-block;transition: transform 0.4s ease;}
.icon-zoom:hover {transform: scale(1.3) rotate(360deg);}