/*Hiệu ứng menu*/
.centery,
.centery-after:after,
.centery-before:before {
  -moz-transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}
.ease-in-200 {
  -webkit-transition: all 500ms ease-in;
  -moz-transition: all 500ms ease-in;
  -ms-transition: all 500ms ease-in;
  -o-transition: all 500ms ease-in;
  transition: all 500ms ease-in;
}
@-webkit-keyframes slideInDown1 {
  0% {
    -webkit-transform: translate3d(0, -30px, 0);
    transform: translate3d(0, -30px, 0);
    visibility: visible;
  }
  100% {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes slideInDown1 {
  0% {
    -webkit-transform: translate3d(0, -30px, 0);
    transform: translate3d(0, -30px, 0);
    visibility: visible;
  }
  100% {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
.slideInDown1 {
  -webkit-animation-name: slideInDown1;
  animation-name: slideInDown1;
}
/**/
.fixed {
  position: fixed !important;
  left: 0;
  right: 0;
  top: 0;
  z-index: 999;
  animation: slideInDown1 1s 0s; /* min-width: 1366px; */
  margin: auto;
}
/*Hieu ung*/
.hvr-float-shadow {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px transparent;
  position: relative;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: transform;
  transition-property: transform;
}
.hvr-float-shadow:before {
  pointer-events: none;
  position: absolute;
  z-index: -1;
  content: "";
  top: 100%;
  left: 5%;
  height: 10px;
  width: 90%;
  opacity: 0;
  background: -webkit-radial-gradient(
    center,
    ellipse,
    rgba(0, 0, 0, 0.35) 0,
    transparent 80%
  );
  background: radial-gradient(
    ellipse at center,
    rgba(0, 0, 0, 0.35) 0,
    transparent 80%
  );
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: transform, opacity;
  transition-property: transform, opacity;
}
.hvr-float-shadow:active,
.hvr-float-shadow:focus,
.hvr-float-shadow:hover {
  -webkit-transform: translateY(-5px);
  transform: translateY(-5px);
}
.hvr-float-shadow:active:before,
.hvr-float-shadow:focus:before,
.hvr-float-shadow:hover:before {
  opacity: 1;
  -webkit-transform: translateY(5px);
  transform: translateY(5px);
}

.hover_sang2 {
  position: relative;
  overflow: hidden;
}
.hover_sang2:before {
  position: absolute;
  top: 0;
  left: -85%;
  z-index: 10;
  display: block;
  content: "";
  width: 50%;
  height: 100%;
  background: -webkit-linear-gradient(
    left,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 0.3) 100%
  );
  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);
}
.hover_sang2:hover:before {
  transition: 1s;
  left: 100%;
}
.hover_sang {
  display: block;
  position: relative;
  overflow: hidden;
}
.hover_sang:hover:before {
  left: 0;
  top: 0;
}
.hover_sang:before {
  left: -100%;
  top: -100%;
}
.hover_sang:after {
  bottom: -100%;
  right: -100%;
}
.hover_sang:before,
.hover_sang:after {
  display: block;
}
.hover_sang:before,
.hover_sang:after {
  background: rgba(255, 255, 255, 0.3) none repeat scroll 0 0;
  content: "";
  height: 100%;
  position: absolute;
  -webkit-transition: all 0.5s ease 0s;
  transition: all 0.5s ease 0s;
  width: 100%;
  z-index: 8;
}
.hover_sang:hover img {
  -webkit-transform: scale(1.2, 1.2);
  -moz-transform: scale(1.2, 1.2);
  -o-transform: scale(1.2, 1.2);
  -ms-transform: scale(1.2, 1.2);
  transform: scale(1.2, 1.2);
}
.hover_sang img {
  transition: 0.7s;
}
.hover_sang:hover:after {
  right: 0;
  bottom: 0;
}
/*Xoay*/
.dichvu__item:hover .dichvu__img {
  transform: rotateY(360deg);
  transition: all 0.6s linear;
}
/*Phone anima*/
.animate__animated.animate__infinite {
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
}

.animate__tada {
  -webkit-animation-name: tada;
  animation-name: tada;
}
.animate__animated {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-duration: var(--animate-duration);
  animation-duration: var(--animate-duration);
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}
/*Nhấp nháy*/
.blink_me {
  -webkit-animation-name: blinker;
  -webkit-animation-duration: 1s;
  -webkit-animation-timing-function: linear;
  -webkit-animation-iteration-count: infinite;
  -moz-animation-name: blinker;
  -moz-animation-duration: 1s;
  -moz-animation-timing-function: linear;
  -moz-animation-iteration-count: infinite;
  animation-name: blinker;
  animation-duration: 1s;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
}
@-moz-keyframes blinker {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@-webkit-keyframes blinker {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes blinker {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

.hvr-double-box {
  position: relative;
  overflow: hidden;
  display: block;
}

.hvr-double-box:before {
  content: "";
  background: rgba(255, 255, 255, 0.5);
  bottom: 0;
  left: 0;
  position: absolute;
  -webkit-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  transform: rotate(90deg);
  -khtml-opacity: 1;
  -o-opacity: 1;
  -ms-opacity: 1;
  -webkit-opacity: 1;
  -moz-opacity: 1;
  opacity: 1;
  width: 0;
  height: 0;
  z-index: 1;
}

.hvr-double-box:after {
  content: "";
  background: rgba(255, 255, 255, 0.5);
  top: 0;
  right: 0;
  position: absolute;
  -webkit-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  transform: rotate(90deg);
  -khtml-opacity: 1;
  -o-opacity: 1;
  -ms-opacity: 1;
  -webkit-opacity: 1;
  -moz-opacity: 1;
  opacity: 1;
  width: 0;
  height: 0;
  z-index: 2;
}

.hvr-double-box:hover:before,
.hvr-double-box:hover:after {
  -webkit-transform: rotateY(180deg);
  -moz-transform: rotateY(180deg);
  -ms-transform: rotateY(180deg);
  -o-transform: rotateY(180deg);
  transform: rotateY(180deg);
  -webkit-transition-duration: 1.3s;
  -moz-transition-duration: 1.3s;
  -ms-transition-duration: 1.3s;
  -o-transition-duration: 1.3s;
  transition-duration: 1.3s;
  -khtml-opacity: 0;
  -o-opacity: 0;
  -ms-opacity: 0;
  -webkit-opacity: 0;
  -moz-opacity: 0;
  opacity: 0;
  height: 100%;
  width: 100%;
}

.hvr-float-shadow {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px transparent;
  position: relative;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: transform;
  transition-property: transform;
}

.hvr-float-shadow:before {
  pointer-events: none;
  position: absolute;
  z-index: -1;
  content: "";
  top: 100%;
  left: 5%;
  height: 10px;
  width: 90%;
  opacity: 0;
  background: -webkit-radial-gradient(
    center,
    ellipse,
    rgba(0, 0, 0, 0.35) 0,
    transparent 80%
  );
  background: radial-gradient(
    ellipse at center,
    rgb(221 221 221 / 35%) 0,
    transparent 80%
  );
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: transform, opacity;
  transition-property: transform, opacity;
}

.hvr-float-shadow:active,
.hvr-float-shadow:focus,
.hvr-float-shadow:hover {
  -webkit-transform: translateY(-5px);
  transform: translateY(-5px);
}

.hvr-float-shadow:active:before,
.hvr-float-shadow:focus:before,
.hvr-float-shadow:hover:before {
  opacity: 1;
  -webkit-transform: translateY(5px);
  transform: translateY(5px);
}

.hvr-flash-shape {
  position: relative;
  overflow: hidden;
}

.hvr-flash-shape:before {
  position: absolute;
  top: 0;
  left: -85%;
  z-index: 10;
  display: block;
  content: "";
  width: 50%;
  height: 100%;
  background: -webkit-linear-gradient(
    left,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 0.3) 100%
  );
  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);
}

.hvr-flash-shape:hover:before {
  transition: 1s;
  left: 100%;
}

.hrv-flash-box {
  display: block;
  position: relative;
  overflow: hidden;
}

.hrv-flash-box:hover:before {
  left: 0;
  top: 0;
}

.hrv-flash-box:before {
  left: -100%;
  top: -100%;
}

.hrv-flash-box:after {
  bottom: -100%;
  right: -100%;
}

.hrv-flash-box:before,
.hrv-flash-box:after {
  display: block;
}

.hrv-flash-box:before,
.hrv-flash-box:after {
  background: rgba(255, 255, 255, 0.3) none repeat scroll 0 0;
  content: "";
  height: 100%;
  position: absolute;
  -webkit-transition: all 0.5s ease 0s;
  transition: all 0.5s ease 0s;
  width: 100%;
  z-index: 8;
}

.hrv-flash-box:hover img {
  -webkit-transform: scale(1.2, 1.2);
  -moz-transform: scale(1.2, 1.2);
  -o-transform: scale(1.2, 1.2);
  -ms-transform: scale(1.2, 1.2);
  transform: scale(1.2, 1.2);
}

.hrv-flash-box img {
  transition: 0.7s;
}

.hrv-flash-box:hover:after {
  right: 0;
  bottom: 0;
}

.wrap-hinhanh .card {
  position: relative;
  transition-duration: 300ms;
  transition-property: transform, box-shadow;
  transition-timing-function: ease-out;
  transform: rotate3d(0);
  border-radius: 10px;
}
.wrap-hinhanh .card:hover {
  transition-duration: 150ms;
}
.wrap-hinhanh .card .glow {
  background-image: radial-gradient(circle at 50% -20%, #ffffff22, #0000000f);
}
