@charset "UTF-8";
@-webkit-keyframes hvr-bob {
  0% {
    -webkit-transform: translateY(-8px);
    transform: translateY(-8px);
  }
  50% {
    -webkit-transform: translateY(-4px);
    transform: translateY(-4px);
  }
  100% {
    -webkit-transform: translateY(-8px);
    transform: translateY(-8px);
  }
}
@keyframes hvr-bob {
  0% {
    -webkit-transform: translateY(-8px);
    transform: translateY(-8px);
  }
  50% {
    -webkit-transform: translateY(-4px);
    transform: translateY(-4px);
  }
  100% {
    -webkit-transform: translateY(-8px);
    transform: translateY(-8px);
  }
}

@-webkit-keyframes hvr-bob-float {
  100% {
    -webkit-transform: translateY(-8px);
    transform: translateY(-8px);
  }
}

@keyframes hvr-bob-float {
  100% {
    -webkit-transform: translateY(-8px);
    transform: translateY(-8px);
  }
}

@-webkit-keyframes sliderZoom {
  0% {
    -webkit-transform: scale(1);
            transform: scale(1);
    -webkit-transition: -webkit-transform 20000ms linear 0s;
    transition: -webkit-transform 20000ms linear 0s;
    transition: transform 20000ms linear 0s;
    transition: transform 20000ms linear 0s, -webkit-transform 20000ms linear 0s;
  }
  100% {
    -webkit-transform: scale(1.2);
            transform: scale(1.2);
    -webkit-transition: -webkit-transform 20000ms linear 0s;
    transition: -webkit-transform 20000ms linear 0s;
    transition: transform 20000ms linear 0s;
    transition: transform 20000ms linear 0s, -webkit-transform 20000ms linear 0s;
  }
}

@keyframes sliderZoom {
  0% {
    -webkit-transform: scale(1);
            transform: scale(1);
    -webkit-transition: -webkit-transform 20000ms linear 0s;
    transition: -webkit-transform 20000ms linear 0s;
    transition: transform 20000ms linear 0s;
    transition: transform 20000ms linear 0s, -webkit-transform 20000ms linear 0s;
  }
  100% {
    -webkit-transform: scale(1.2);
            transform: scale(1.2);
    -webkit-transition: -webkit-transform 20000ms linear 0s;
    transition: -webkit-transform 20000ms linear 0s;
    transition: transform 20000ms linear 0s;
    transition: transform 20000ms linear 0s, -webkit-transform 20000ms linear 0s;
  }
}

@-webkit-keyframes sliderZoomOut {
  from {
    -webkit-transform: scale3d(1.5, 1.5, 1.5);
            transform: scale3d(1.5, 1.5, 1.5);
  }
  to {
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
  }
}

@keyframes sliderZoomOut {
  from {
    -webkit-transform: scale3d(1.5, 1.5, 1.5);
            transform: scale3d(1.5, 1.5, 1.5);
  }
  to {
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
  }
}

@-webkit-keyframes nudge {
  0% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
  30% {
    -webkit-transform: translateX(-5px);
            transform: translateX(-5px);
  }
  50% {
    -webkit-transform: translateX(5px);
            transform: translateX(5px);
  }
  70% {
    -webkit-transform: translateX(-2px);
            transform: translateX(-2px);
  }
  100% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
}

@keyframes nudge {
  0% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
  30% {
    -webkit-transform: translateX(-5px);
            transform: translateX(-5px);
  }
  50% {
    -webkit-transform: translateX(5px);
            transform: translateX(5px);
  }
  70% {
    -webkit-transform: translateX(-2px);
            transform: translateX(-2px);
  }
  100% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1.0;
  }
  50% {
    opacity: 0.0;
  }
  100% {
    opacity: 1.0;
  }
}

@keyframes blink {
  0% {
    opacity: 1.0;
  }
  50% {
    opacity: 0.0;
  }
  100% {
    opacity: 1.0;
  }
}

@-webkit-keyframes shake-anim {
  0%,
  100%,
  50% {
    -o-transform: rotate(0) scale(1) skew(1deg);
  }
  10%,
  30% {
    -o-transform: rotate(-25deg) scale(1) skew(1deg);
  }
  20%,
  40% {
    -o-transform: rotate(25deg) scale(1) skew(1deg);
  }
}

@keyframes shake-anim {
  0%,
  100%,
  50% {
    -o-transform: rotate(0) scale(1) skew(1deg);
  }
  10%,
  30% {
    -o-transform: rotate(-25deg) scale(1) skew(1deg);
  }
  20%,
  40% {
    -o-transform: rotate(25deg) scale(1) skew(1deg);
  }
}

/* Font */
@font-face {
  font-family: 'Main';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url("../fonts/NotoSans-Black.ttf");
}

@font-face {
  font-family: 'Main';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/NotoSans-Bold.ttf");
}

@font-face {
  font-family: 'Main';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url("../fonts/NotoSans-ExtraBold.ttf");
}

@font-face {
  font-family: 'Main';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/NotoSans-Medium.ttf");
}

@font-face {
  font-family: 'Main';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/NotoSans-Regular.ttf");
}

:root {
  --color-red: #ec2d3f;
  --color-medium-red: #cc2c32;
  --color-dark-red: #c31829;
  --color-green: #28a745;
  --color-dark-green: #207d36;
  --color-black: #212529;
  --color-gray: #6c757d;
  --color-main: #34469A;
  --color-hover: #8CCD03;
}

/* Main */
body {
  font-size: 14px;
  font-family: 'Main', sans-serif;
  font-weight: 400;
}

img {
  max-width: 100%;
  height: auto;
  vertical-align: top;
  display: inline;
}

a {
  text-decoration: none;
}

a,
input,
textarea {
  outline: none;
  padding: 0px;
}

input[type=number]::-webkit-outer-spin-button, input[type=number]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.🐷 {
  margin-bottom: 50px;
}

.content-main img {
  height: auto !important;
}

.content-main iframe {
  width: 100% !important;
  height: auto !important;
}

.w-clear:after {
  display: block;
  content: "";
  clear: both;
}

.hidden {
  display: none;
}

.clear {
  clear: both;
}

.none {
  display: none;
}

.hidden-seoh {
  visibility: hidden;
  height: 0px;
  margin: 0px;
  overflow: hidden;
}

.wrap-content {
  width: calc(100% - 20px);
  max-width: 1300px;
  margin: 40px auto;
}

.wrap-home {
  width: 100%;
  max-width: 100%;
  padding: 0px;
  margin: 0;
}

.wrap-content {
  margin: auto;
}

/* Transition All */
.transition {
  -webkit-transition: 0.3s ease-out;
  transition: 0.3s ease-out;
}

/* Scroll */
.scroll-maded {
  overflow-y: scroll;
  overflow-x: hidden;
}

.scroll-maded::-webkit-scrollbar {
  width: 2px;
}

.scroll-maded::-webkit-scrollbar-thumb {
  width: 2px;
  background: var(--color-main);
}

.scroll-maded::-webkit-scrollbar-thumb:hover, .scroll-maded::-webkit-scrollbar-thumb:active {
  width: 2px;
}

/* Hover */
.trangden img {
  -webkit-filter: grayscale(100%);
  filter: grayscale(100%);
}

.trangden:hover img {
  -webkit-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
  -webkit-filter: grayscale(0%);
  filter: grayscale(0%);
}

.xoaytronhinh:hover {
  -webkit-transform: scale(1) rotate(360deg);
  transform: scale(1) rotate(360deg);
}

.xoaytronhinh {
  transition: all 0.9s ease 0s;
  -moz-transition: all 0.9s ease 0s;
  -webkit-transition: all 0.9s ease 0s;
  -o-transition: all 0.9s ease 0s;
}

.zoomhinh {
  overflow: hidden;
}

.zoomhinh img {
  -webkit-transition: all 1s ease 0s;
  transition: all 1s ease 0s;
}

.zoomhinh:hover img {
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
}

.duongcheosang {
  -webkit-transform: scale(1, 1);
  transform: scale(1, 1);
  overflow: hidden;
  -webkit-transition: width 2s, height 2s, -webkit-transform 2s;
  transition: width 2s, height 2s, -webkit-transform 2s;
  transition: width 2s, height 2s, transform 2s;
  transition: width 2s, height 2s, transform 2s, -webkit-transform 2s;
  cursor: pointer;
}

.duongcheosang: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);
}

.duongcheosang: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: -webkit-transform 0.6s;
  transition: transform 0.6s;
  transition: transform 0.6s, -webkit-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);
}

.duongcheosang2 {
  overflow: hidden;
  position: relative;
}

.duongcheosang2:before {
  position: absolute;
  content: "";
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 1;
  background: rgba(67, 69, 113, 0);
  -webkit-transition: all 0.6s ease-in-out;
  transition: all 0.6s ease-in-out;
  -moz-transition: all 0.6s ease-in-out;
  -ms-transition: all 0.6s ease-in-out;
  -o-transition: all 0.6s ease-in-out;
}

.duongcheosang2:after {
  position: absolute;
  content: "";
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background: rgba(67, 69, 113, 0);
  -webkit-transition: all 0.6s ease-in-out;
  transition: all 0.6s ease-in-out;
  -moz-transition: all 0.6s ease-in-out;
  -ms-transition: all 0.6s ease-in-out;
  -o-transition: all 0.6s ease-in-out;
}

.duongcheosang2:hover:before {
  right: 50%;
  left: 50%;
  width: 0;
  background: rgba(255, 255, 255, 0.5);
}

.duongcheosang2:hover:after {
  height: 0;
  top: 50%;
  bottom: 50%;
  background: rgba(255, 255, 255, 0.5);
}

.hvr-bob {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-box-shadow: 0 0 1px rgba(0, 0, 0, 0);
          box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -moz-osx-font-smoothing: grayscale;
}

.hvr-bob:active, .hvr-bob:focus, .hvr-bob:hover {
  -webkit-animation-name: hvr-bob-float, hvr-bob;
  animation-name: hvr-bob-float, hvr-bob;
  -webkit-animation-duration: 0.3s, 1.5s;
  animation-duration: 0.3s, 1.5s;
  -webkit-animation-delay: 0s, 0.3s;
  animation-delay: 0s, 0.3s;
  -webkit-animation-timing-function: ease-out, ease-in-out;
  animation-timing-function: ease-out, ease-in-out;
  -webkit-animation-iteration-count: 1, infinite;
  animation-iteration-count: 1, infinite;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  -webkit-animation-direction: normal, alternate;
  animation-direction: normal, alternate;
}

/* Loading */
.mask {
  width: 100%;
  height: 100vh;
  position: fixed;
  left: 0;
  top: 0;
  z-index: 999999999;
  overflow: hidden;
}

.mask span {
  width: 100%;
  position: absolute;
  right: 0;
  background: -webkit-gradient(linear, left top, right top, color-stop(0, #fff), to(#fff));
  background: linear-gradient(90deg, #fff 0, #fff 100%);
  -webkit-transition: width 0.9s ease-in-out;
  transition: width 0.9s ease-in-out;
}

.mask span:nth-child(1) {
  height: 30vh;
  top: 0;
  -webkit-transition-delay: 0.3s;
  transition-delay: 0.3s;
}

.mask span:nth-child(2) {
  height: 40vh;
  top: 30vh;
  -webkit-transition-delay: 0.5s;
  transition-delay: 0.5s;
}

.mask span:nth-child(3) {
  height: 30vh;
  top: 70vh;
  -webkit-transition-delay: 0.6s;
  transition-delay: 0.6s;
}

.mask.hideg {
  pointer-events: none;
}

.mask.hideg span {
  width: 0;
}

.loadicon {
  position: fixed;
  top: 50%;
  left: 50%;
  width: 200px;
  height: 140px;
  margin: -70px 0 0 -100px;
  z-index: 110000;
}

#loading {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 999999999999;
}

#loading.finish {
  z-index: -9999;
}

#loading.finish .logo_2 span,
#loading.finish .logo_2 img {
  display: none;
}

#loading .logo_2 {
  width: 100%;
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-transition: all ease 0.5s;
  transition: all ease 0.5s;
}

#loading .logo_2 img {
  max-width: 250px;
}

.text-shadow {
  text-shadow: 1px 0 0 #fff, -1px 0 0 #fff, 0 1px 0 #fff, 0 -1px 0 #fff, 1px 1px #fff, -1px -1px 0 #fff, 1px -1px 0 #fff, -1px 1px 0 #fff, 0px 3px 3px #333;
}

/* General */
.title-main {
  text-align: center;
  position: absolute;
  width: 100%;
  left: 0;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  z-index: 9;
}

.title-main span {
  text-transform: uppercase;
  font-weight: 800;
  font-size: 28px;
  color: var(--color-main);
}

.time-main {
  margin-bottom: 0.75rem;
  color: #999999;
}

.time-main i {
  vertical-align: top;
  margin: 3px 7px 0px 0px;
}

.time-main span {
  vertical-align: top;
  display: inline-block;
}

.share {
  padding: 17px 15px 10px 15px;
  line-height: normal;
  background: rgba(128, 128, 128, 0.15);
  margin-top: 15px;
  border-radius: 5px;
}

.share b {
  display: block;
  margin-bottom: 5px;
}

/* Lazyload */
img.lazy {
  opacity: 0;
}

img:not(.initial) {
  -webkit-transition: opacity 1s;
  transition: opacity 1s;
}

img.initial, img.loaded, img.error {
  opacity: 1;
}

img:not([src]) {
  visibility: hidden;
}

/* Header */
.header-fixed {
  background-color: #ffffff;
  padding: 15px 0;
}

.header-fixed.fixed {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  z-index: 999;
  -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
          box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
  padding: 0;
}

/* Menu */
.menu {
  width: 65%;
  position: relative;
  z-index: 10;
}

.menu ul {
  width: 100%;
  padding: 0px;
  margin: auto;
  list-style: none;
}

.menu ul li:not(.lien-he) {
  position: relative;
  z-index: 99;
  -ms-flex: 1 1 auto;
  -webkit-box-flex: 1;
          flex: 1 1 auto;
  text-align: center;
}

.menu ul li.lien-he {
  text-align: center;
  width: 159px;
  height: 44px;
  background: linear-gradient(281.04deg, #34469A -30.57%, #6184FF 108.31%);
  border: 4px solid rgba(213, 213, 213, 0.7);
  -webkit-box-shadow: 0px 100px 80px rgba(0, 0, 0, 0.0196802), 0px 41.7776px 33.4221px rgba(0, 0, 0, 0.0282725), 0px 22.3363px 17.869px rgba(0, 0, 0, 0.035), 0px 12.5216px 10.0172px rgba(0, 0, 0, 0.0417275), 0px 6.6501px 5.32008px rgba(0, 0, 0, 0.0503198), 0px 2.76726px 2.21381px rgba(0, 0, 0, 0.07);
          box-shadow: 0px 100px 80px rgba(0, 0, 0, 0.0196802), 0px 41.7776px 33.4221px rgba(0, 0, 0, 0.0282725), 0px 22.3363px 17.869px rgba(0, 0, 0, 0.035), 0px 12.5216px 10.0172px rgba(0, 0, 0, 0.0417275), 0px 6.6501px 5.32008px rgba(0, 0, 0, 0.0503198), 0px 2.76726px 2.21381px rgba(0, 0, 0, 0.07);
  border-radius: 12px;
  margin-left: 30px;
}

.menu ul li.lien-he a {
  font-weight: 700;
  font-size: 19px;
  line-height: 36px;
  height: 36px;
  color: #fff;
  text-transform: uppercase;
}

.menu ul li.lien-he:hover {
  background: #FFBC00;
  border: 4px solid rgba(255, 255, 255, 0.7);
}

.menu ul li.lien-he:hover a {
  color: #fff;
}

.menu ul li a {
  display: inline-block;
  position: relative;
  z-index: 1;
  text-decoration: none !important;
  font-weight: 500;
  font-size: 16px;
  color: var(--color-main);
  margin: 0px;
  line-height: 50px;
  height: 50px;
  text-transform: capitalize;
}

.menu ul li a#menu-ve-dinh-duong {
  padding-left: 35px;
  background: url(../images/m1.png) no-repeat center left;
}

.menu ul li a#menu-ve-medidrink {
  padding-left: 35px;
  background: url(../images/m2.png) no-repeat center left;
}

.menu ul li a#menu-chtg {
  padding-left: 35px;
  background: url(../images/m3.png) no-repeat center left;
}

.menu ul li a.active, .menu ul li a:hover {
  color: var(--color-hover);
}

.menu ul li a.active#menu-ve-dinh-duong, .menu ul li a:hover#menu-ve-dinh-duong {
  background-image: url(../images/mh1.png);
}

.menu ul li a.active#menu-ve-medidrink, .menu ul li a:hover#menu-ve-medidrink {
  background-image: url(../images/mh2.png);
}

.menu ul li a.active#menu-chtg, .menu ul li a:hover#menu-chtg {
  background-image: url(../images/mh3.png);
}

.menu ul li ul {
  position: absolute;
  min-width: 200px;
  background: #fff;
  -webkit-box-shadow: 0 3px 11px 0 rgba(0, 0, 0, 0.1);
          box-shadow: 0 3px 11px 0 rgba(0, 0, 0, 0.1);
  -webkit-transform: perspective(600px) rotateX(-90deg);
  transform: perspective(600px) rotateX(-90deg);
  -webkit-transform-origin: 0 0 0;
  transform-origin: 0 0 0;
  opacity: 0;
  visibility: hidden;
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
}

.menu ul li:hover > ul {
  -webkit-transform: perspective(600px) rotateX(0);
  transform: perspective(600px) rotateX(0);
  -webkit-transform-origin: 0 0 0;
  opacity: 1;
  visibility: visible;
  -webkit-transition: all .7s;
  transition: all .7s;
}

.menu ul li ul li a {
  text-align: left;
  border-bottom: 1px solid rgba(0, 0, 0, 0.2);
  font-size: 14px;
  padding: 7px 15px;
  line-height: 23px;
  height: auto;
  display: block;
  width: 100%;
}

.menu ul li ul li:last-child > a {
  border-bottom: 0px;
}

.menu ul li ul li ul {
  top: 0;
  left: 100%;
  margin-top: 0px;
}

/* Menu RP */
.menu-res {
  display: none;
  height: 60px;
  z-index: 10;
  background: #fff;
  position: relative;
  line-height: normal;
  -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
          box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
}

.menu-res.fixed {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  z-index: 999;
}

.menu-res .lien-he {
  padding: 4px 42px 7px;
  background: linear-gradient(281.04deg, #34469A -30.57%, #6184FF 108.31%);
  border: 4px solid rgba(213, 213, 213, 0.7);
  -webkit-box-shadow: 0px 100px 80px rgba(0, 0, 0, 0.0196802), 0px 41.7776px 33.4221px rgba(0, 0, 0, 0.0282725), 0px 22.3363px 17.869px rgba(0, 0, 0, 0.035), 0px 12.5216px 10.0172px rgba(0, 0, 0, 0.0417275), 0px 6.6501px 5.32008px rgba(0, 0, 0, 0.0503198), 0px 2.76726px 2.21381px rgba(0, 0, 0, 0.07);
          box-shadow: 0px 100px 80px rgba(0, 0, 0, 0.0196802), 0px 41.7776px 33.4221px rgba(0, 0, 0, 0.0282725), 0px 22.3363px 17.869px rgba(0, 0, 0, 0.035), 0px 12.5216px 10.0172px rgba(0, 0, 0, 0.0417275), 0px 6.6501px 5.32008px rgba(0, 0, 0, 0.0503198), 0px 2.76726px 2.21381px rgba(0, 0, 0, 0.07);
  border-radius: 12px;
}

.menu-res .lien-he a {
  font-weight: 700;
  font-size: 10.6352px;
  line-height: 13px;
  color: #fff;
  text-transform: uppercase;
}

.menu-res .lien-he:hover:hover {
  background: #FFBC00;
  border: 4px solid rgba(255, 255, 255, 0.7);
}

.menu-bar-res {
  height: 60px;
  padding: 0px 10px;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

#menu {
  display: none;
}

#hamburger {
  display: block;
  width: 45px;
  height: 23px;
  position: relative;
}

#hamburger:before, #hamburger:after,
#hamburger span {
  background: var(--color-main);
  content: "";
  display: block;
  width: 100%;
  height: 5px;
  position: absolute;
  left: 0px;
  border-radius: 5px;
}

#hamburger:before {
  top: 0px;
}

#hamburger span {
  top: 10px;
  width: 60%;
}

#hamburger:after {
  top: 20px;
}

#hamburger:before, #hamburger:after,
#hamburger span {
  -webkit-transition: none 0.5s ease 0.5s;
  transition: none 0.5s ease 0.5s;
  -webkit-transition-property: transform, top, bottom, left, opacity;
  -webkit-transition-property: top, bottom, left, opacity, -webkit-transform;
  transition-property: top, bottom, left, opacity, -webkit-transform;
  transition-property: transform, top, bottom, left, opacity;
  transition-property: transform, top, bottom, left, opacity, -webkit-transform;
}

.mm-wrapper_opening #hamburger:before, .mm-wrapper_opening #hamburger:after {
  top: 10px;
}

.mm-wrapper_opening #hamburger span {
  left: -50px;
  opacity: 0;
}

.mm-wrapper_opening #hamburger:before {
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
}

.mm-wrapper_opening #hamburger:after {
  -webkit-transform: rotate(-45deg);
          transform: rotate(-45deg);
}

.mm-menu_opened {
  display: block !important;
}

.mm-slideout {
  z-index: unset;
}

/* Search RP */
.search-res {
  position: relative;
}

.search-res .icon-search {
  width: 40px;
  height: 40px;
  cursor: pointer;
  text-align: center;
  line-height: 42px;
  color: #fff;
  font-size: 17px;
  margin: 0px;
}

.search-res .icon-search.active {
  color: var(--color-main);
  background: #fff;
  border-radius: 100%;
}

.search-res .search-grid {
  position: absolute;
  top: 50px;
  right: 0px;
  width: 0px;
  height: 40px;
  overflow: hidden;
  background: #fff;
  border: 1px solid var(--color-main);
  z-index: 2;
  opacity: 0;
  border-radius: 25px;
  line-height: normal;
}

.search-res .search-grid p {
  float: left;
  width: 35px;
  height: 38px;
  cursor: pointer;
  outline: none;
  border: none;
  margin: 0px;
  font-size: 17px;
  display: block;
  color: var(--color-main);
  line-height: 40px;
  text-align: center;
}

.search-res .search-grid input {
  width: calc(100% - 35px);
  float: right;
  line-height: 38px;
  outline: none;
  border: none;
  color: var(--color-main);
}

.search-res .search-grid input::-webkit-input-placeholder, .search-res .search-grid input:-moz-placeholder, .search-res .search-grid input::-moz-placeholder, .search-res .search-grid input:-ms-input-placeholder {
  color: #ccc;
}

/* Slideshow */
.slideshow {
  overflow: hidden;
  position: relative;
}

.slideshow .items {
  position: relative;
}

.slideshow .items .info {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  left: 0;
  width: 100%;
  z-index: 9;
}

.slideshow .swiper-slide-active .items .info label {
  -webkit-animation-name: fadeInDown;
          animation-name: fadeInDown;
  -webkit-animation-duration: 1s;
          animation-duration: 1s;
}

.slideshow .swiper-slide-active .items .info span {
  -webkit-animation-name: fadeInLeft;
          animation-name: fadeInLeft;
  -webkit-animation-duration: 1s;
          animation-duration: 1s;
}

.slideshow .swiper-slide-active .items .info p {
  -webkit-animation-name: fadeInRight;
          animation-name: fadeInRight;
  -webkit-animation-duration: 1s;
          animation-duration: 1s;
}

.slideshow .swiper-slide-active .items .info a {
  -webkit-animation-name: fadeInUp;
          animation-name: fadeInUp;
  -webkit-animation-duration: 1s;
          animation-duration: 1s;
  display: inline-block;
}

.slideshow .swiper-button-prev,
.slideshow .swiper-button-next {
  opacity: 0;
  height: 46px;
  width: 46px;
  display: inline-block;
  padding: 0;
  text-align: center;
  border-radius: 50%;
  font-size: 16px;
  position: absolute;
  top: calc(50% - 46px / 2);
  z-index: 98;
  color: #222;
  background: #ebebeb;
  transition: all 0.5s ease-out 0s;
  -webkit-transition: all 0.5s ease-out 0s;
  outline: none !important;
}

.slideshow .swiper-button-prev:hover,
.slideshow .swiper-button-next:hover {
  background-color: var(--color-main);
}

.slideshow .swiper-button-prev:hover:after,
.slideshow .swiper-button-next:hover:after {
  color: #fff;
}

.slideshow .swiper-button-prev:after,
.slideshow .swiper-button-next:after {
  font-size: 25px;
  line-height: 46px;
}

.swiper-slider:hover .swiper-button-prev,
.swiper-slider:hover .swiper-button-next {
  opacity: 1;
}

.swiper-slider .swiper-button-prev {
  left: -100px;
}

.swiper-slider .swiper-button-next {
  right: -100px;
}

.swiper-slider:hover .swiper-button-prev {
  left: 15px;
}

.swiper-slider:hover .swiper-button-next {
  right: 15px;
}

/* Breadcrumb */
.breadCrumbs .wrap-content {
  padding: 0.75rem 0px;
}

.breadCrumbs .wrap-content .breadcrumb {
  padding: 0;
  margin-bottom: 0;
  background-color: transparent;
  border-radius: 0;
}

.breadCrumbs .wrap-content .breadcrumb-item a {
  font-weight: 500;
  font-size: 16px;
  line-height: 24px;
  color: #616161;
}

.breadCrumbs .wrap-content .breadcrumb-item.active a {
  color: #8CCD03;
}

.video-main {
  position: relative;
  height: 400px;
}

.video-main iframe {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0px;
  left: 0px;
}

.listvideos {
  width: 100%;
  height: 40px;
  padding: 0px 10px;
  border: 1px solid #ccc;
  color: var(--color-main);
  margin-top: 10px;
  cursor: pointer;
}

#video-right .main {
  position: relative;
  width: calc(100% - 150px);
  max-height: calc(100% - 10px);
  min-height: 350px;
}

#video-right .main iframe {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0px;
  left: 0px;
}

#video-right .right {
  width: 140px;
}

#video-right .right .box-video {
  cursor: pointer;
}

#video-right .right .box-video img {
  height: 95px;
  -o-object-fit: cover;
     object-fit: cover;
}

#video-bottom {
  height: 100%;
}

#video-bottom .main {
  height: 100%;
}

#video-bottom .main .video-bottom {
  position: relative;
  min-height: 300px;
  margin-bottom: 10px;
}

#video-bottom .main .video-bottom iframe {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0px;
  left: 0px;
}

#video-bottom .main .swiper-video-bottom .box {
  cursor: pointer;
}

#video-bottom .main .swiper-video-bottom .box img {
  height: 120px;
  width: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

/* Video */
.video {
  cursor: pointer;
  margin-bottom: 1rem;
}

.video-name {
  text-align: center;
  font-size: 16px;
  color: var(--color-black);
  margin-bottom: 0px;
}

.videoPlay {
  position: absolute;
  top: 50%;
  margin-top: -40px;
  left: 50%;
  margin-left: -40px;
  z-index: 1;
}

.videoPlay svg {
  width: 80px;
  height: 80px;
}

.videoPlay .circle {
  stroke: #ffffff;
  stroke-dasharray: 650;
  stroke-dashoffset: 650;
  -webkit-transition: all 0.5s ease-in-out;
  opacity: 0.3;
}

.videoPlay .playBut {
  display: inline-block;
  -webkit-transition: all 0.5s ease;
}

.videoPlay .playBut .triangle {
  -webkit-transition: all 0.7s ease-in-out;
  stroke-dasharray: 240;
  stroke-dashoffset: 480;
  stroke: #fff;
  -webkit-transform: translateY(0);
          transform: translateY(0);
}

.video-image {
  position: relative;
  margin-bottom: 0.75rem;
}

.video-image:hover .triangle {
  stroke-dashoffset: 0;
  opacity: 1;
  stroke: #ffffff;
  -webkit-animation: nudge 0.7s ease-in-out;
          animation: nudge 0.7s ease-in-out;
}

.video-image:hover .circle {
  stroke-dashoffset: 0;
  opacity: 1;
}

/* Album */
.album {
  cursor: pointer;
  margin-bottom: 1rem;
}

.album-image {
  margin-bottom: 0.75rem;
}

.album-name {
  margin-bottom: 0px;
  text-align: center;
}

.album-name a {
  display: block;
  font-size: 16px;
  color: var(--color-black);
  margin-bottom: 0px;
}

/* Product */
.wrap-product {
  margin-bottom: 50px;
}

.box-product {
  position: relative;
  display: block;
}

.pic-product {
  background: #ffffff;
}

.pic-product img {
  width: 100%;
}

.name-product {
  font-size: 16px;
  color: var(--color-black);
}

.price-product {
  margin-bottom: 0px;
}

.price-product span {
  font-weight: 700;
}

.price-new {
  font-size: 15px;
  font-weight: 500;
  color: var(--color-red);
}

.price-old {
  padding-left: 10px;
  font-size: 12px;
  color: var(--color-gray);
}

.price-per {
  position: absolute;
  top: 15px;
  right: 15px;
  color: #ffffff;
  background: var(--color-red);
  font-size: 11px;
  border-radius: 2px;
  width: 45px;
  height: 25px;
  text-align: center;
  line-height: 25px;
}

.cart-product {
  margin-bottom: 0px;
}

.cart-product span {
  cursor: pointer;
  width: 49%;
  float: left;
  color: #ffffff;
  text-transform: capitalize;
  text-align: center;
  padding: 7px 5px;
  border-radius: 3px;
}

.cart-add {
  margin-right: 2%;
  background-color: var(--color-red);
}

.cart-add:hover {
  background-color: var(--color-dark-red);
}

.cart-buy {
  background-color: var(--color-green);
}

.cart-buy:hover {
  background-color: var(--color-dark-green);
}

/* Product Detail */
.grid-pro-detail {
  margin-bottom: 3rem;
}

.left-pro-detail {
  position: relative;
  text-align: center;
}

.left-pro-detail .MagicZoom {
  border: 1px solid #eee;
  padding: 7px;
  border-radius: 5px;
  background-color: #ffffff;
}

.gallery-thumb-pro {
  position: relative;
  margin-top: 10px;
}

.swiper-thumb-pro {
  margin: 0px 40px;
}

.thumb-pro-detail {
  display: block !important;
  border: 1px solid #eee;
  padding: 5px;
  border-radius: 3px;
  cursor: pointer;
}

.thumb-pro-detail.mz-thumb.mz-thumb-selected {
  border-color: #cecfd2;
}

.thumb-pro-detail img {
  -webkit-box-shadow: none !important;
          box-shadow: none !important;
  -webkit-filter: brightness(100%) !important;
          filter: brightness(100%) !important;
  border-bottom: 0px !important;
  padding-bottom: 0px !important;
}

.control-carousel {
  position: absolute;
  top: calc(50% - 30px / 2);
  margin-bottom: 0px;
  width: 30px;
  height: 30px;
  text-align: center;
  line-height: 30px;
  border: 1px solid #eee;
  z-index: 2;
  background-color: #fff;
  color: #ccc;
  cursor: pointer;
}

.control-carousel:hover {
  background-color: var(--color-main);
  border-color: var(--color-main);
  color: #fff;
}

.prev-carousel {
  left: 0px;
}

.next-carousel {
  right: 0px;
}

.title-pro-detail {
  text-transform: capitalize;
  font-size: 20px;
  display: block;
  font-weight: 700;
}

.comment-pro-detail {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
}

.social-plugin-pro-detail {
  margin-bottom: 1rem;
  margin-top: 0px !important;
}

.desc-pro-detail {
  margin-bottom: 1rem;
}

.attr-pro-detail {
  list-style: none;
  padding: 0px;
}

.attr-pro-detail li {
  margin-bottom: 0.5rem;
}

.attr-label-pro-detail {
  margin: 0px 5px 0px 0px;
}

.attr-label-pro-detail.d-block {
  display: block;
  margin: 0px 0px 5px 0px;
}

.attr-content-pro-detail {
  display: inline-block;
  margin-bottom: 0px;
}

.price-new-pro-detail {
  font-weight: 700;
  font-size: 20px;
  color: var(--color-red);
}

.price-old-pro-detail {
  font-weight: 500;
  color: var(--color-gray);
  text-decoration: line-through;
  padding-left: 10px;
}

.color-pro-detail {
  cursor: pointer;
  display: inline-block;
  vertical-align: top;
  position: relative;
  width: 35px;
  height: 30px;
  margin: 0px 0px 3px 0px;
  border: 1px solid transparent;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center center;
}

.size-pro-detail {
  cursor: pointer;
  border: 1px solid #ccc;
  padding: 3px 10px 4px 10px;
  display: inline-block;
  position: relative;
}

.size-pro-detail.active {
  border-color: #e5101d;
  color: #e5101d;
}

.color-pro-detail.active {
  border-color: #e5101d;
  color: #e5101d;
}

.size-pro-detail.active:after {
  content: '';
  position: absolute;
  bottom: 0px;
  right: 0px;
  width: 13px;
  height: 13px;
  background-repeat: no-repeat;
  background-image: url(../images/check-cart.png);
}

.color-pro-detail.active:after {
  content: '';
  position: absolute;
  bottom: 0px;
  right: 0px;
  width: 13px;
  height: 13px;
  background-repeat: no-repeat;
  background-image: url(../images/check-cart.png);
}

.color-pro-detail input[type=radio] {
  display: none;
}

.size-pro-detail input[type=radio] {
  display: none;
}

.quantity-pro-detail {
  width: 100%;
  max-width: 110px;
  line-height: normal;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  text-align: center;
}

.quantity-pro-detail span {
  line-height: 25px;
  padding: 0px;
  width: 30px;
  height: 30px;
  color: #5f5f5f;
  cursor: pointer;
  font-size: 22px;
  border: 1px solid #cccccc;
}

.quantity-pro-detail span.quantity-plus-pro-detail {
  border-left: 0px;
}

.quantity-pro-detail span.quantity-minus-pro-detail {
  border-right: 0px;
}

.quantity-pro-detail input {
  height: 30px;
  border: 1px solid #cccccc;
  width: calc(100% - 60px);
  text-align: center;
  font-size: 14px;
  padding: 5px;
}

.cart-pro-detail {
  margin-bottom: 1rem;
}

.cart-pro-detail a {
  font-size: 14px;
  color: #ffffff !important;
  text-transform: uppercase;
}

.tags-pro-detail a {
  float: left;
  font-size: 13px;
  padding-bottom: 0.375rem;
  margin: 0px 5px 5px 0px;
}

.tags-pro-detail a i {
  font-size: 11px;
  margin: 5px 5px 0px 0px;
}

.tabs-pro-detail {
  margin-top: 2rem;
}

.tabs-pro-detail .nav-tabs .nav-link {
  border-top-width: 3px;
  font-size: 13px;
}

.tabs-pro-detail .nav-tabs .nav-link.active {
  border-top-color: #555555;
}

.tabs-pro-detail .nav-tabs .nav-item.show .nav-link {
  border-top-color: #555555;
}

/* News */
.news {
  padding: 8px;
}

.news:hover {
  background: rgba(255, 255, 255, 0.95);
  -webkit-box-shadow: 0px 100px 80px rgba(0, 0, 0, 0.07), 0px 41.7776px 33.4221px rgba(0, 0, 0, 0.0503198), 0px 22.3363px 17.869px rgba(0, 0, 0, 0.0417275), 0px 12.5216px 10.0172px rgba(0, 0, 0, 0.035), 0px 6.6501px 5.32008px rgba(0, 0, 0, 0.0282725), 0px 2.76726px 2.21381px rgba(0, 0, 0, 0.0196802);
          box-shadow: 0px 100px 80px rgba(0, 0, 0, 0.07), 0px 41.7776px 33.4221px rgba(0, 0, 0, 0.0503198), 0px 22.3363px 17.869px rgba(0, 0, 0, 0.0417275), 0px 12.5216px 10.0172px rgba(0, 0, 0, 0.035), 0px 6.6501px 5.32008px rgba(0, 0, 0, 0.0282725), 0px 2.76726px 2.21381px rgba(0, 0, 0, 0.0196802);
  border-radius: 8px;
}

.news:hover .news-name a {
  color: #8CCD03;
}

.news:hover .news-view {
  background: #8CCD03;
}

.news-image {
  border-radius: 8px;
}

.news-name {
  margin-bottom: 0.5rem;
}

.news-name a {
  font-weight: 700;
  font-size: 16px;
  line-height: 24px;
  color: #323232;
  height: 48px;
}

.news-time {
  font-weight: 500;
  font-size: 11px;
  line-height: 16px;
  color: #616161;
  padding-left: 20px;
  background: url(../images/i_time.png) no-repeat center left;
}

.news-desc {
  font-weight: 500;
  font-size: 11px;
  line-height: 16px;
  color: #616161;
  height: 64px;
}

.news-view {
  width: 101px;
  height: 24px;
  background: var(--color-main);
  border-radius: 8px;
  text-align: center;
  font-weight: 700;
  font-size: 11px;
  line-height: 24px;
  color: #FFFFFF;
}

.title-news {
  text-align: center;
  margin-bottom: 2rem;
  font-weight: 800;
  font-size: 28px;
  line-height: 40px;
}

.title-othernews {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 24px;
  font-weight: 700;
  font-size: 16px;
  line-height: 24px;
  color: #616161;
  margin-bottom: 2rem;
}

.title-othernews:after {
  content: '';
  height: 1px;
  background: #616161;
  -webkit-box-flex: 1;
      -ms-flex: 1 1 0px;
          flex: 1 1 0;
}

/* Contact */
.contact-article {
  margin-bottom: 3rem;
}

.contact-input {
  position: relative;
  margin-bottom: 15px;
}

.contact-input textarea {
  resize: none;
  height: 150px;
}

.contact-input .custom-file-label::after {
  content: attr(title);
}

.contact-map {
  position: relative;
  height: 500px;
}

.contact-map iframe {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100% !important;
  height: 100% !important;
}

/* Footer */
.footer {
  background: linear-gradient(106.72deg, #EBBB32 -70.05%, #002DFF 133.5%);
  position: relative;
}

.footer .wrap-content {
  padding: 25px 0px;
}

.footer-ul {
  list-style: none;
  padding: 0px;
  margin: 0px;
}

.footer-ul li {
  margin-bottom: 10px;
}

.footer-ul li:last-child {
  margin-bottom: 0px;
}

.footer-ul li a {
  color: #fff;
  text-decoration: none;
  font-weight: 500;
  font-size: 12px;
}

.footer-ul li a:hover {
  color: #FFE7A3;
}

.footer-copyright {
  font-weight: 500;
  font-size: 11px;
  line-height: 16px;
  max-width: 645px;
  color: #fff;
}

/* Like Share */
.social-plugin {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  margin-top: 10px;
}

.social-plugin .at-share-btn {
  margin-bottom: 0px !important;
}

.social-plugin .zalo-share-button {
  margin-left: 3px;
}

/* Paging */
.pagination-home {
  margin-top: 1.5rem;
}

.pagination-home .pagination .page-item .page-link {
  color: #555555;
  font-size: .875rem;
}

.pagination-home .pagination .page-item.active .page-link {
  color: #ffffff;
  background-color: #555555;
  border-color: #555555;
}

/* Phân Trang Ajax */
.pagination-ajax {
  text-align: center;
  margin-top: 2rem;
}

.pagination-ajax a {
  display: inline-block;
  vertical-align: top;
  color: #333;
  font-size: 15px;
  cursor: pointer;
  margin: 0px 10px 5px;
  padding: 0px 5px;
  -webkit-transition: 0.3s ease-out;
  transition: 0.3s ease-out;
  text-decoration: none;
}

.pagination-ajax a:hover {
  color: var(--color-main);
}

.pagination-ajax a.current {
  color: var(--color-red);
  border-bottom: 1px solid var(--color-red);
  -webkit-box-shadow: 0px 1px 0px #fff, 0px 2px 0px var(--color-red);
          box-shadow: 0px 1px 0px #fff, 0px 2px 0px var(--color-red);
  position: relative;
  top: -10px;
}

/* Popup */
#popup .modal-body {
  padding: 0px;
}

/* Hidden Google Captcha */
.grecaptcha-badge {
  display: none !important;
  width: 0px !important;
  height: 0px !important;
  visibility: hidden !important;
  overflow: hidden;
}

/* Hidden Check Grammar Coccoc */
coccocgrammar {
  display: none;
}

/* Scroll Top */
.scrollToTop {
  text-decoration: none;
  position: absolute;
  top: -7px;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  display: none;
  z-index: 10;
  cursor: pointer;
  -webkit-box-shadow: 0px 100px 80px rgba(0, 0, 0, 0.0196802), 0px 41.7776px 33.4221px rgba(0, 0, 0, 0.0282725), 0px 22.3363px 17.869px rgba(0, 0, 0, 0.035), 0px 12.5216px 10.0172px rgba(0, 0, 0, 0.0417275), 0px 6.6501px 5.32008px rgba(0, 0, 0, 0.0503198), 0px 2.76726px 2.21381px rgba(0, 0, 0, 0.07);
          box-shadow: 0px 100px 80px rgba(0, 0, 0, 0.0196802), 0px 41.7776px 33.4221px rgba(0, 0, 0, 0.0282725), 0px 22.3363px 17.869px rgba(0, 0, 0, 0.035), 0px 12.5216px 10.0172px rgba(0, 0, 0, 0.0417275), 0px 6.6501px 5.32008px rgba(0, 0, 0, 0.0503198), 0px 2.76726px 2.21381px rgba(0, 0, 0, 0.07);
  background: #FFFFFF;
  padding: 4px 16px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 8px;
  font-weight: 700;
  font-size: 11px;
  line-height: 16px;
  color: var(--color-main);
  border-bottom-left-radius: 5px;
  border-bottom-right-radius: 5px;
}

/* Text Hide */
.text-split {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: normal;
  -webkit-box-orient: vertical;
  display: -webkit-box;
  -webkit-line-clamp: 1;
}

/* Scale IMG */
.scale-img {
  overflow: hidden;
  display: block;
}

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

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

/* Scale IMG */
.scale-img-2 {
  overflow: hidden;
  display: block;
}

.scale-img-2 img {
  -webkit-transition: all 0.6s;
  transition: all 0.6s;
}

.scale-img-2:hover img {
  -webkit-transform: translateX(5px) rotate(5deg) translateY(5px) scale(1.2);
          transform: translateX(5px) rotate(5deg) translateY(5px) scale(1.2);
}

/* Blink */
.blink {
  -webkit-animation-name: blink;
  -webkit-animation-duration: 1s;
  -webkit-animation-timing-function: linear;
  -webkit-animation-iteration-count: infinite;
  -moz-animation-name: blink;
  -moz-animation-duration: 1s;
  -moz-animation-timing-function: linear;
  -moz-animation-iteration-count: infinite;
  animation-name: blink;
  animation-duration: 1s;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
}

/* Button Frame */
.btn-frame {
  display: block;
  width: 50px;
  height: 50px;
  position: fixed;
  right: 20px;
  z-index: 10;
  cursor: pointer;
}

.btn-frame i {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  display: -ms-flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
          align-items: center;
  -ms-flex-align: center;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  background: #1182FC;
  position: relative;
  z-index: 1;
}

.btn-frame i img {
  vertical-align: middle;
  width: 70%;
}

.btn-frame .animated.infinite {
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
}

.btn-frame .kenit-alo-circle {
  width: 60px;
  height: 60px;
  top: -5px;
  right: -5px;
  position: absolute;
  background-color: transparent;
  border-radius: 100%;
  border: 2px solid rgba(7, 41, 103, 0.8);
  opacity: .1;
  border-color: #1182FC;
  opacity: .5;
}

.btn-frame .zoomIn {
  -webkit-animation-name: zoomIn;
          animation-name: zoomIn;
}

.btn-frame .animated {
  -webkit-animation-duration: 1s;
          animation-duration: 1s;
  -webkit-animation-fill-mode: both;
          animation-fill-mode: both;
}

.btn-frame .kenit-alo-circle-fill {
  width: 70px;
  height: 70px;
  top: -10px;
  right: -10px;
  position: absolute;
  -webkit-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  border-radius: 100%;
  border: 2px solid transparent;
  -webkit-transition: all .5s;
  transition: all .5s;
  background-color: rgba(7, 41, 103, 0.35);
  opacity: .4;
}

.btn-frame .pulse {
  -webkit-animation-name: pulse;
          animation-name: pulse;
}

/* Zalo */
.btn-zalo {
  bottom: 315px;
}

/* Phone */
.btn-phone {
  bottom: 230px;
}

/* Messenger */
.js-facebook-messenger-container.closed {
  display: none !important;
}

.js-facebook-messenger-tooltip {
  bottom: 97px;
  right: 97px;
  color: #404040;
  background: #fff;
}

.js-facebook-messenger-tooltip.closed {
  display: none !important;
}

.js-facebook-messenger-box,
.js-facebook-messenger-button {
  z-index: 999;
}

.js-facebook-messenger-tooltip {
  z-index: 999;
  display: none;
  position: fixed;
  text-align: center;
  border-radius: 10px;
  overflow: hidden;
  font-size: 12px;
  line-height: 1;
  padding: 10px;
  border: 1px solid rgba(0, 0, 0, 0.1);
  -webkit-box-shadow: rgba(0, 0, 0, 0.15) 0 2pt 10pt;
          box-shadow: rgba(0, 0, 0, 0.15) 0 2pt 10pt;
  z-index: 31E;
}

.js-facebook-messenger-close-tooltip {
  width: 10px;
  height: 10px;
  display: inline-block;
  cursor: pointer;
  margin-left: 10px;
}

.js-facebook-messenger-box {
  z-index: 999;
}

.js-facebook-messenger-box.rubberBand {
  -webkit-animation-name: rubberBand;
  animation-name: rubberBand;
}

.js-facebook-messenger-box.animated {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

.js-facebook-messenger-button,
.js-facebook-messenger-tooltip {
  z-index: 999;
}

.js-facebook-messenger-box {
  display: block;
  position: fixed;
  cursor: pointer;
  bottom: 150px;
  right: 17px;
  width: 56px;
  height: 56px;
  text-align: center;
  background: #1182FC;
  border-radius: 100%;
  overflow: hidden;
  z-index: 99;
  -webkit-box-shadow: 1px 1px 4px 0 rgba(0, 0, 0, 0.3);
  box-shadow: 1px 1px 4px 0 rgba(0, 0, 0, 0.3);
}

.js-facebook-messenger-box.rotate svg#fb-msng-icon {
  -webkit-transform: rotate(0deg);
          transform: rotate(0deg);
}

.js-facebook-messenger-box svg#fb-msng-icon {
  width: 32px;
  height: 33px;
  position: absolute;
  top: 13px;
  left: 12px;
  opacity: 1;
  overflow: hidden;
  -webkit-transition: opacity 160ms ease-in-out, transform 160ms ease-in-out;
  -webkit-transition: opacity 160ms ease-in-out, -webkit-transform 160ms ease-in-out;
  transition: opacity 160ms ease-in-out, -webkit-transform 160ms ease-in-out;
  transition: opacity 160ms ease-in-out, transform 160ms ease-in-out;
  transition: opacity 160ms ease-in-out, transform 160ms ease-in-out, -webkit-transform 160ms ease-in-out;
}

.js-facebook-messenger-box.rotate svg#close-icon {
  -webkit-transform: rotate(-45deg);
          transform: rotate(-45deg);
}

.js-facebook-messenger-box svg#close-icon {
  opacity: 0;
  width: 19px;
  height: 20px;
  position: absolute;
  top: 19px;
  left: 19px;
  -webkit-transition: opacity 160ms ease-in-out, transform 160ms ease-in-out;
  -webkit-transition: opacity 160ms ease-in-out, -webkit-transform 160ms ease-in-out;
  transition: opacity 160ms ease-in-out, -webkit-transform 160ms ease-in-out;
  transition: opacity 160ms ease-in-out, transform 160ms ease-in-out;
  transition: opacity 160ms ease-in-out, transform 160ms ease-in-out, -webkit-transform 160ms ease-in-out;
}

.js-facebook-messenger-container,
.js-facebook-messenger-container-button {
  z-index: 1000;
}

.js-facebook-messenger-container {
  position: fixed;
  opacity: 0;
  -webkit-transform: translateY(50px);
          transform: translateY(50px);
  bottom: 110px;
  right: 90px;
  border-radius: 10px;
  pointer-events: none;
  -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.06), 0 2px 32px rgba(0, 0, 0, 0.16);
          box-shadow: 0 1px 6px rgba(0, 0, 0, 0.06), 0 2px 32px rgba(0, 0, 0, 0.16);
  -webkit-transition: transform 160ms ease-in-out, opacity 160ms ease-in-out;
  -webkit-transition: opacity 160ms ease-in-out, -webkit-transform 160ms ease-in-out;
  transition: opacity 160ms ease-in-out, -webkit-transform 160ms ease-in-out;
  transition: transform 160ms ease-in-out, opacity 160ms ease-in-out;
  transition: transform 160ms ease-in-out, opacity 160ms ease-in-out, -webkit-transform 160ms ease-in-out;
}

.js-facebook-messenger-top-header {
  width: 220px;
  color: #ffffff;
  background: #1182FC;
  display: block;
  position: relative;
  width: 220px;
  background: #1182FC;
  color: #ffffff;
  text-align: center;
  line-height: 1;
  padding: 10px;
  font-size: 14px;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
}

.js-facebook-messenger-container iframe,
.js-facebook-messenger-container-button iframe {
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
}

.js-facebook-messenger-box,
.js-facebook-messenger-button,
.js-facebook-messenger-tooltip {
  z-index: 999;
}

.js-facebook-messenger-container,
.js-facebook-messenger-container-button {
  z-index: 1000;
}

.js-facebook-messenger-top-header {
  color: #ffffff;
  background: #1182FC;
  width: 220px;
}

.js-facebook-messenger-tooltip {
  color: #404040;
  background: #fff;
}

.js-facebook-messenger-container.open {
  -webkit-transform: translateY(0px);
          transform: translateY(0px);
  opacity: 1;
  pointer-events: all;
}

.js-facebook-messenger-tooltip {
  bottom: 97px;
  right: 97px;
}

.js-facebook-messenger-box.open svg#fb-msng-icon {
  opacity: 0;
}

.js-facebook-messenger-box.rotate.open svg#close-icon {
  -webkit-transform: rotate(0deg);
          transform: rotate(0deg);
}

.js-facebook-messenger-box.open svg#close-icon {
  opacity: 1;
}

/* Cart Fix */
.cart-fixed {
  position: fixed;
  right: 20px;
  bottom: 390px;
  z-index: 10;
  background: #4b4f56;
  width: 50px;
  height: 50px;
  text-align: center;
  color: #fff !important;
  border-radius: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.cart-fixed i {
  font-size: 20px;
}

.cart-fixed span {
  position: absolute;
  top: 0px;
  right: -5px;
  color: #ffffff;
  width: 25px;
  height: 25px;
  background: var(--color-red);
  text-align: center;
  line-height: 25px;
  font-size: 11px;
  border-radius: 100%;
}

/* Toolbar */
.toolbar {
  background: linear-gradient(281.04deg, #34469A -30.57%, #6184FF 108.31%);
  width: 100%;
  padding: 5px 10px 0px;
  bottom: 0px;
  position: fixed;
  z-index: 500;
  height: auto;
  left: 0px;
}

.toolbar ul {
  list-style: none;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  padding: 0px;
  margin: 0px;
}

.toolbar ul li {
  text-align: center;
  width: 25%;
}

.toolbar ul li a {
  display: block;
  width: 100%;
  cursor: pointer;
  text-decoration: none;
}

.toolbar ul li a i {
  display: block;
  color: #fff;
  font-size: 20px;
}

.toolbar ul li a img {
  height: 20px;
  width: auto;
}

.toolbar ul li a span {
  font-weight: 400;
  color: #fff;
  font-size: 12px;
}

/* Fixbar */
.fixbar {
  bottom: 0;
  display: block;
  background: #f0eff4;
  border-top: 1px solid #ddd;
  width: 100%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  position: fixed;
  margin: 0;
  z-index: 500;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  height: 50px;
}

.fixbar ul {
  margin: 0px;
  padding: 0px;
  list-style: none;
}

.fixbar ul li {
  display: inline-block;
  margin: 0 auto 10px;
  text-align: center;
  width: 25%;
  float: left;
}

.fixbar .icon-cart-mobile,
.fixbar .icon-cart-new,
.fixbar .icon-home-new,
.fixbar .icon-hotdeal-new {
  width: 20px;
  height: 20px;
  display: block;
  margin: 8px auto 0;
}

.fixbar .icon-cart-mobile {
  background: url(../images/cart-mobile.png) no-repeat;
}

.cart-total-header-mobile {
  font-size: 10px;
  position: absolute;
  background: red;
  color: #fff !important;
  border-radius: 50%;
  height: 15px;
  width: 15px;
  line-height: 15px;
  top: 5px;
  margin-left: 5px;
}

.fixbar ul li a {
  font-size: 11px;
  text-decoration: none;
  color: #333;
}

.fixbar ul li a i {
  font-size: 20px;
}

/* Plugbar */
.plugbar {
  position: fixed;
  bottom: 0;
  left: 0;
  border-top: 1px solid #eae6e6;
  width: 100%;
  right: 0;
  max-width: 767px;
  margin: 0 auto;
  background: #ffffff;
  padding: 9px 10px 10px 7px;
  z-index: 10;
}

.plugbar ul {
  list-style: none;
  padding: 0;
  margin: 0px;
  display: -moz-flex;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.plugbar ul li {
  width: 20%;
  float: left;
}

.plugbar ul li a {
  display: block;
  color: #696969;
  font-size: 12px;
  text-align: center;
  position: relative;
}

.plugbar ul li a i {
  font-size: 20px;
  color: #696969;
}

.plugbar ul li a span {
  position: absolute;
  width: 50px;
  height: 50px;
  top: -40px;
  left: calc(50% - 50px/2);
  font-size: 14px;
  display: block;
  border: 1px solid rgba(234, 230, 230, 0.5);
  border-radius: 100%;
}

/* Combo Phone */
.support-online {
  position: fixed;
  z-index: 999;
  left: 10px;
  bottom: 0px;
}

.support-online a {
  position: relative;
  margin: 20px 10px;
  text-align: left;
  width: 40px;
  height: 40px;
}

.support-online i {
  width: 40px;
  height: 40px;
  background: #43a1f3;
  color: #ffffff;
  border-radius: 100%;
  font-size: 20px;
  text-align: center;
  line-height: 1.9;
  position: relative;
  z-index: 999;
}

.support-online a {
  display: block;
}

.support-online a span {
  border-radius: 2px;
  text-align: center;
  background: #67b634;
  padding: 9px;
  display: none;
  width: 180px;
  margin-left: 10px;
  position: absolute;
  color: #ffffff;
  z-index: 999;
  top: 0px;
  left: 40px;
  -webkit-transition: all 0.2s ease-in-out 0s;
  transition: all 0.2s ease-in-out 0s;
  -webkit-animation: headerAnimation 0.7s 1;
  animation: headerAnimation 0.7s 1;
}

.support-online a:hover span {
  display: block;
}

.support-online a span:before {
  content: "";
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 10px 10px 10px 0;
  border-color: transparent #67b634 transparent transparent;
  position: absolute;
  left: -10px;
  top: 10px;
}

.support-online .kenit-alo-circle-fill {
  width: 60px;
  height: 60px;
  top: -10px;
  position: absolute;
  -webkit-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  border-radius: 100%;
  border: 2px solid transparent;
  -webkit-transition: all .5s;
  transition: all .5s;
  background-color: rgba(0, 175, 242, 0.5);
  opacity: .75;
  right: -10px;
}

.support-online .kenit-alo-circle {
  width: 50px;
  height: 50px;
  top: -5px;
  right: -5px;
  position: absolute;
  background-color: transparent;
  border-radius: 100%;
  border: 2px solid rgba(30, 30, 30, 0.4);
  opacity: .1;
  border-color: #0089B9;
  opacity: .5;
}

.support-online .support-online .btn-support {
  cursor: pointer;
}

.support-online .mes i {
  background: orange;
}

.support-online .sms i {
  background: red;
}

.support-online .call-now i {
  background: green;
}

/* Phone Switch */
.widget-mobile {
  position: fixed;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  bottom: 10px;
  z-index: 9999999;
}

#my-phone-circle {
  position: relative;
  width: 50px !important;
  height: 50px !important;
}

.wcircle-open .wcircle-icon i:before {
  content: '\f00d';
}

.wcircle-icon {
  background: #1282fc;
  border-radius: 50%;
  display: -webkit-box !important;
  display: -ms-flexbox !important;
  display: flex !important;
  display: -ms-flex !important;
  -webkit-box-align: center;
          align-items: center;
  -ms-flex-align: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  position: relative !important;
}

.wcircle-icon:before {
  position: absolute;
  content: '';
  width: 60px;
  height: 60px;
  background: rgba(18, 130, 252, 0.5);
  border: 1px solid #ffffff;
  border-radius: 50%;
  left: -5px;
  top: -5px;
  -webkit-animation: pulse 1s infinite ease-in-out;
  animation: pulse 1s infinite ease-in-out;
}

.wcircle-icon:after {
  position: absolute;
  content: '';
  width: 80px;
  height: 80px;
  background: rgba(18, 130, 252, 0.5);
  border-radius: 50%;
  left: -15px;
  top: -15px;
  -webkit-animation: zoomIn 2s infinite ease-in-out;
  animation: zoomIn 2s infinite ease-in-out;
}

.wcircle-menu {
  position: absolute !important;
  left: 0;
  top: 0;
  display: none;
}

.wcircle-menu-item {
  width: 50px;
  height: 50px;
  background: #1282fc;
  border-radius: 50%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  display: -ms-flex;
  -webkit-box-align: center;
          align-items: center;
  -ms-flex-align: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}

.wcircle-menu-item img {
  width: 50px;
  height: 50px;
  display: block;
  border-radius: 50%;
}

.wcircle-menu-item i {
  font-size: 25px;
  color: #ffffff;
  position: relative;
  z-index: 9999;
}

.wcircle-icon i {
  font-size: 25px;
  color: #ffffff;
  position: relative;
  z-index: 9999;
}

.shake-anim {
  -webkit-animation: shake-anim 1s infinite ease-in-out;
  animation: shake-anim 1s infinite ease-in-out;
  -webkit-transform-origin: 50% 50%;
  transform-origin: 50% 50%;
}

.section-1 {
  padding: 30px 0;
}

.section-2 .items:not(:first-child) {
  margin-top: -180px;
}

.section-2 .items .info {
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  text-align: right;
  max-width: 470px;
}

.section-2 .items .info .desc {
  font-size: 40px;
  line-height: 56px;
  color: var(--color-main);
  text-shadow: 0px 100px 80px rgba(0, 0, 0, 0.0196802), 0px 41.7776px 33.4221px rgba(0, 0, 0, 0.0282725), 0px 22.3363px 17.869px rgba(0, 0, 0, 0.035), 0px 12.5216px 10.0172px rgba(0, 0, 0, 0.0417275), 0px 6.6501px 5.32008px rgba(0, 0, 0, 0.0503198), 0px 2.76726px 2.21381px rgba(0, 0, 0, 0.07);
}

.section-2 .items .info .name {
  padding: 16px 42px;
  display: inline-block;
  background: linear-gradient(106.72deg, #EBBB32 -70.05%, #002DFF 133.5%);
  border: 4px solid rgba(213, 213, 213, 0.7);
  -webkit-box-shadow: 0px 100px 80px rgba(0, 0, 0, 0.0196802), 0px 41.7776px 33.4221px rgba(0, 0, 0, 0.0282725), 0px 22.3363px 17.869px rgba(0, 0, 0, 0.035), 0px 12.5216px 10.0172px rgba(0, 0, 0, 0.0417275), 0px 6.6501px 5.32008px rgba(0, 0, 0, 0.0503198), 0px 2.76726px 2.21381px rgba(0, 0, 0, 0.07);
          box-shadow: 0px 100px 80px rgba(0, 0, 0, 0.0196802), 0px 41.7776px 33.4221px rgba(0, 0, 0, 0.0282725), 0px 22.3363px 17.869px rgba(0, 0, 0, 0.035), 0px 12.5216px 10.0172px rgba(0, 0, 0, 0.0417275), 0px 6.6501px 5.32008px rgba(0, 0, 0, 0.0503198), 0px 2.76726px 2.21381px rgba(0, 0, 0, 0.07);
  border-radius: 12px;
}

.section-2 .items .info .name h3 {
  margin-bottom: 0;
  font-weight: 700;
  font-size: 19px;
  line-height: 24px;
  color: #fff;
  padding-right: 30px;
  background: url(../images/i_list.png) no-repeat center right;
}

.section-2 .items .info .name:hover {
  background: #FFBC00;
  border: 4px solid rgba(255, 255, 255, 0.7);
}

.section-2 .items:nth-child(even) .info {
  right: 0;
  max-width: 600px;
}

.section-3 {
  padding: 30px 0 60px;
}

.section-3 .title {
  font-size: 40px;
  line-height: 56px;
  color: var(--color-main);
  text-shadow: 0px 100px 80px rgba(0, 0, 0, 0.0196802), 0px 41.7776px 33.4221px rgba(0, 0, 0, 0.0282725), 0px 22.3363px 17.869px rgba(0, 0, 0, 0.035), 0px 12.5216px 10.0172px rgba(0, 0, 0, 0.0417275), 0px 6.6501px 5.32008px rgba(0, 0, 0, 0.0503198), 0px 2.76726px 2.21381px rgba(0, 0, 0, 0.07);
  max-width: 890px;
  margin: 0px auto 1rem;
}

.section-3 .desc {
  font-weight: 700;
  font-size: 19px;
  line-height: 24px;
  background: linear-gradient(106.72deg, #EBBB32 -70.05%, #002DFF 133.5%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  text-fill-color: transparent;
  text-shadow: 0px 100px 80px rgba(0, 0, 0, 0.0196802), 0px 41.7776px 33.4221px rgba(0, 0, 0, 0.0282725), 0px 22.3363px 17.869px rgba(0, 0, 0, 0.035), 0px 12.5216px 10.0172px rgba(0, 0, 0, 0.0417275), 0px 6.6501px 5.32008px rgba(0, 0, 0, 0.0503198), 0px 2.76726px 2.21381px rgba(0, 0, 0, 0.07);
  max-width: 540px;
  margin: 0 auto 45px;
}

.section-3 .view {
  display: inline-block;
  text-align: center;
  width: 262px;
  height: 56px;
  background: linear-gradient(106.72deg, #EBBB32 -70.05%, #002DFF 133.5%);
  border: 4px solid rgba(213, 213, 213, 0.7);
  -webkit-box-shadow: 0px 100px 80px rgba(0, 0, 0, 0.0196802), 0px 41.7776px 33.4221px rgba(0, 0, 0, 0.0282725), 0px 22.3363px 17.869px rgba(0, 0, 0, 0.035), 0px 12.5216px 10.0172px rgba(0, 0, 0, 0.0417275), 0px 6.6501px 5.32008px rgba(0, 0, 0, 0.0503198), 0px 2.76726px 2.21381px rgba(0, 0, 0, 0.07);
          box-shadow: 0px 100px 80px rgba(0, 0, 0, 0.0196802), 0px 41.7776px 33.4221px rgba(0, 0, 0, 0.0282725), 0px 22.3363px 17.869px rgba(0, 0, 0, 0.035), 0px 12.5216px 10.0172px rgba(0, 0, 0, 0.0417275), 0px 6.6501px 5.32008px rgba(0, 0, 0, 0.0503198), 0px 2.76726px 2.21381px rgba(0, 0, 0, 0.07);
  border-radius: 12px;
  font-weight: 700;
  font-size: 19px;
  line-height: 50px;
  color: #FFFFFF;
}

.section-3 .view i {
  margin-left: 25px;
  font-size: 15px;
}

.section-3 .view:hover {
  background: #FFBC00;
  border: 4px solid rgba(255, 255, 255, 0.7);
}

.section-4 {
  padding-bottom: 65px;
}

.section-4 .title {
  font-weight: 800;
  font-size: 48px;
  line-height: 64px;
  background: linear-gradient(106.72deg, #EBBB32 -70.05%, #002DFF 133.5%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  text-fill-color: transparent;
  text-shadow: 0px 100px 80px rgba(0, 0, 0, 0.0196802), 0px 41.7776px 33.4221px rgba(0, 0, 0, 0.0282725), 0px 22.3363px 17.869px rgba(0, 0, 0, 0.035), 0px 12.5216px 10.0172px rgba(0, 0, 0, 0.0417275), 0px 6.6501px 5.32008px rgba(0, 0, 0, 0.0503198), 0px 2.76726px 2.21381px rgba(0, 0, 0, 0.07);
  max-width: 666px;
  margin: 0px auto 1.5rem;
  text-align: center;
}

.ve-medidrink .title-medidrink {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-bottom: 55px;
  gap: 8px;
}

.ve-medidrink .title-medidrink span {
  display: inline-block;
  padding: 8px 24px;
  border: 1px solid #000000;
  border-radius: 60px;
  font-weight: 900;
  font-size: 24px;
  line-height: 40px;
  text-transform: uppercase;
  background: linear-gradient(281.04deg, #34469A -30.57%, #6184FF 108.31%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  text-fill-color: transparent;
}

.ve-medidrink .title-medidrink:after, .ve-medidrink .title-medidrink:before {
  content: '';
  -webkit-box-flex: 1;
      -ms-flex: 1 1 0px;
          flex: 1 1 0;
  height: 1px;
  background: #616161;
}

.ve-medidrink .uu-diem {
  margin-bottom: 70px;
}

.ve-medidrink .uu-diem .info {
  position: relative;
  font-size: 24px;
  line-height: 40px;
  background: linear-gradient(106.72deg, #EBBB32 -70.05%, #002DFF 133.5%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  text-fill-color: transparent;
  text-shadow: 0px 100px 80px rgba(0, 0, 0, 0.0196802), 0px 41.7776px 33.4221px rgba(0, 0, 0, 0.0282725), 0px 22.3363px 17.869px rgba(0, 0, 0, 0.035), 0px 12.5216px 10.0172px rgba(0, 0, 0, 0.0417275), 0px 6.6501px 5.32008px rgba(0, 0, 0, 0.0503198), 0px 2.76726px 2.21381px rgba(0, 0, 0, 0.07);
}

.ve-medidrink .uu-diem .info::after {
  content: '';
  position: absolute;
  width: 131px;
  height: 35px;
  right: -20px;
  bottom: 0;
  background: url(../images/arrow.png) no-repeat center;
}

.ve-medidrink .uu-diem .right {
  padding: 40px;
  background-color: var(--color-main);
  border-radius: 16px;
  color: white;
  height: 100%;
}

.ve-medidrink .uu-diem .right .scroll-maded {
  max-height: 320px;
  height: 100%;
}

.ve-medidrink .uu-diem-file a {
  font-size: 24px;
  line-height: 40px;
  -webkit-text-decoration-line: underline;
          text-decoration-line: underline;
}

.ve-medidrink .uu-diem-file a:hover {
  color: #8CCD03;
}

.ve-medidrink .icon {
  margin-bottom: 65px;
}

.ve-medidrink .icon .name {
  font-weight: 700;
  font-size: 16px;
  line-height: 24px;
  color: var(--color-main);
}

.ve-medidrink .icon .desc {
  margin-bottom: 0;
  font-weight: 500;
  font-size: 13px;
  line-height: 24px;
}

.ve-medidrink .view a {
  display: inline-block;
  text-align: center;
  width: 100%;
  max-width: 420px;
  height: 50px;
  background: linear-gradient(106.72deg, #EBBB32 -70.05%, #002DFF 133.5%);
  border: 4px solid rgba(213, 213, 213, 0.7);
  -webkit-box-shadow: 0px 100px 80px rgba(0, 0, 0, 0.0196802), 0px 41.7776px 33.4221px rgba(0, 0, 0, 0.0282725), 0px 22.3363px 17.869px rgba(0, 0, 0, 0.035), 0px 12.5216px 10.0172px rgba(0, 0, 0, 0.0417275), 0px 6.6501px 5.32008px rgba(0, 0, 0, 0.0503198), 0px 2.76726px 2.21381px rgba(0, 0, 0, 0.07);
          box-shadow: 0px 100px 80px rgba(0, 0, 0, 0.0196802), 0px 41.7776px 33.4221px rgba(0, 0, 0, 0.0282725), 0px 22.3363px 17.869px rgba(0, 0, 0, 0.035), 0px 12.5216px 10.0172px rgba(0, 0, 0, 0.0417275), 0px 6.6501px 5.32008px rgba(0, 0, 0, 0.0503198), 0px 2.76726px 2.21381px rgba(0, 0, 0, 0.07);
  border-radius: 12px;
  font-weight: 700;
  font-size: 17px;
  line-height: 42px;
  color: #FFFFFF;
}

.ve-medidrink .view a i {
  margin-left: 25px;
  font-size: 15px;
}

.ve-medidrink .view a:hover {
  background: #FFBC00;
  border: 4px solid rgba(255, 255, 255, 0.7);
}

.cau-hoi-thuong-gap .title span {
  display: inline-block;
  font-size: 40px;
  background: linear-gradient(106.72deg, #EBBB32 -70.05%, #002DFF 133.5%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  text-fill-color: transparent;
  text-shadow: 0px 100px 80px rgba(0, 0, 0, 0.0196802), 0px 41.7776px 33.4221px rgba(0, 0, 0, 0.0282725), 0px 22.3363px 17.869px rgba(0, 0, 0, 0.035), 0px 12.5216px 10.0172px rgba(0, 0, 0, 0.0417275), 0px 6.6501px 5.32008px rgba(0, 0, 0, 0.0503198), 0px 2.76726px 2.21381px rgba(0, 0, 0, 0.07);
  margin-bottom: 32px;
}

.cau-hoi-thuong-gap .title p {
  font-size: 19px;
  color: #616161;
  text-shadow: 0px 100px 80px rgba(0, 0, 0, 0.0196802), 0px 41.7776px 33.4221px rgba(0, 0, 0, 0.0282725), 0px 22.3363px 17.869px rgba(0, 0, 0, 0.035), 0px 12.5216px 10.0172px rgba(0, 0, 0, 0.0417275), 0px 6.6501px 5.32008px rgba(0, 0, 0, 0.0503198), 0px 2.76726px 2.21381px rgba(0, 0, 0, 0.07);
  margin-bottom: 32px;
}

.cau-hoi-thuong-gap .title a {
  display: inline-block;
  text-align: center;
  width: 293px;
  height: 56px;
  background: linear-gradient(106.72deg, #EBBB32 -70.05%, #002DFF 133.5%);
  border: 4px solid rgba(213, 213, 213, 0.7);
  -webkit-box-shadow: 0px 100px 80px rgba(0, 0, 0, 0.0196802), 0px 41.7776px 33.4221px rgba(0, 0, 0, 0.0282725), 0px 22.3363px 17.869px rgba(0, 0, 0, 0.035), 0px 12.5216px 10.0172px rgba(0, 0, 0, 0.0417275), 0px 6.6501px 5.32008px rgba(0, 0, 0, 0.0503198), 0px 2.76726px 2.21381px rgba(0, 0, 0, 0.07);
          box-shadow: 0px 100px 80px rgba(0, 0, 0, 0.0196802), 0px 41.7776px 33.4221px rgba(0, 0, 0, 0.0282725), 0px 22.3363px 17.869px rgba(0, 0, 0, 0.035), 0px 12.5216px 10.0172px rgba(0, 0, 0, 0.0417275), 0px 6.6501px 5.32008px rgba(0, 0, 0, 0.0503198), 0px 2.76726px 2.21381px rgba(0, 0, 0, 0.07);
  border-radius: 12px;
  font-weight: 700;
  font-size: 19px;
  line-height: 50px;
  color: #FFFFFF;
}

.cau-hoi-thuong-gap .title a i {
  margin-left: 25px;
  font-size: 15px;
}

.cau-hoi-thuong-gap .title a:hover {
  background: #FFBC00;
  border: 4px solid rgba(255, 255, 255, 0.7);
}

.cau-hoi-thuong-gap .main .accordion-item {
  border: 0;
  margin-bottom: 20px;
  -webkit-box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.17);
          box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.17);
  border-radius: 16px;
  overflow: hidden;
  border: 1px solid transparent;
}

.cau-hoi-thuong-gap .main .accordion-item:focus-within {
  border: 1px solid var(--color-main);
}

.cau-hoi-thuong-gap .main .accordion-item .accordion-button {
  font-weight: 700;
  font-size: 16px;
  line-height: 24px;
  color: #616161;
  padding: 25px;
  -webkit-transition: all .3s linear;
  transition: all .3s linear;
}

.cau-hoi-thuong-gap .main .accordion-item .accordion-button:hover {
  background-color: #FFFAEC;
}

.cau-hoi-thuong-gap .main .accordion-item .accordion-button:after {
  -webkit-box-shadow: 0px 3.59903px 11.5169px rgba(8, 15, 52, 0.06);
          box-shadow: 0px 3.59903px 11.5169px rgba(8, 15, 52, 0.06);
  width: 42px;
  height: 42px;
  border-radius: 50%;
  background: url(../images/after_bt_ch.png) no-repeat center, #ffff;
}

.cau-hoi-thuong-gap .main .accordion-item .accordion-button:not(.collapsed) {
  background-color: #fff;
  -webkit-box-shadow: none;
          box-shadow: none;
  padding: 10px 25px;
}

.cau-hoi-thuong-gap .main .accordion-item .accordion-button:not(.collapsed)::after {
  background: url(../images/after_bt_ch_a.png) no-repeat center, var(--color-main);
  -webkit-transform: rotate(0);
          transform: rotate(0);
}

.cau-hoi-thuong-gap .main .accordion-body {
  padding: 0px 25px 25px;
  font-weight: 500;
  font-size: 16px;
  line-height: 24px;
  color: #6F6C90;
}

.san-pham .title span {
  display: block;
  font-weight: 800;
  font-size: 56px;
  color: var(--color-main);
  line-height: 64px;
}

.san-pham .title p {
  background: linear-gradient(281.04deg, #34469A -30.57%, #6184FF 108.31%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  font-weight: 800;
  font-size: 56px;
  color: var(--color-main);
  line-height: 64px;
}

.san-pham .title a {
  display: inline-block;
  text-align: center;
  width: 233px;
  height: 56px;
  background: linear-gradient(106.72deg, #EBBB32 -70.05%, #002DFF 133.5%);
  border: 4px solid rgba(213, 213, 213, 0.7);
  -webkit-box-shadow: 0px 100px 80px rgba(0, 0, 0, 0.0196802), 0px 41.7776px 33.4221px rgba(0, 0, 0, 0.0282725), 0px 22.3363px 17.869px rgba(0, 0, 0, 0.035), 0px 12.5216px 10.0172px rgba(0, 0, 0, 0.0417275), 0px 6.6501px 5.32008px rgba(0, 0, 0, 0.0503198), 0px 2.76726px 2.21381px rgba(0, 0, 0, 0.07);
          box-shadow: 0px 100px 80px rgba(0, 0, 0, 0.0196802), 0px 41.7776px 33.4221px rgba(0, 0, 0, 0.0282725), 0px 22.3363px 17.869px rgba(0, 0, 0, 0.035), 0px 12.5216px 10.0172px rgba(0, 0, 0, 0.0417275), 0px 6.6501px 5.32008px rgba(0, 0, 0, 0.0503198), 0px 2.76726px 2.21381px rgba(0, 0, 0, 0.07);
  border-radius: 12px;
  font-weight: 700;
  font-size: 19px;
  line-height: 50px;
  color: #fff;
  text-transform: uppercase;
}

.san-pham .title a img {
  margin-left: 16px;
  vertical-align: middle;
}

.san-pham .title a:hover {
  background: #FFBC00;
  border: 4px solid rgba(255, 255, 255, 0.7);
}

#popup-lienhe .modal-content {
  border-radius: 24px;
  position: relative;
  overflow: hidden;
  background: url(../images/bg_lh.png) no-repeat center/cover, #fff;
  border: 0;
}

#popup-lienhe .modal-content .modal-body {
  padding: 20px 40px 40px;
}

#popup-lienhe .modal-content .modal-body .btn-dong {
  display: block;
  width: 100%;
  border: 0;
  outline: 0;
  -webkit-box-shadow: 0;
          box-shadow: 0;
  text-align: right;
  font-weight: 700;
  font-size: 19px;
  line-height: 24px;
  margin-bottom: 30px;
  background: none;
  color: #616161;
}

#popup-lienhe .modal-content .modal-body .qr .name {
  text-align: center;
  font-weight: 500;
  font-size: 16px;
  line-height: 24px;
  color: #616161;
}

#popup-lienhe .modal-content .modal-body .top .info span {
  font-weight: 700;
  font-size: 19px;
  line-height: 24px;
  color: var(--color-main);
}

#popup-lienhe .modal-content .modal-body .top .info p {
  font-weight: 700;
  font-size: 19px;
  line-height: 24px;
  background: linear-gradient(281.04deg, #34469A -30.57%, #6184FF 108.31%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

#popup-lienhe .modal-content .modal-body .top .content {
  margin: .5rem 0px 1.5rem;
  text-align: center;
  font-weight: 500;
  font-size: 16px;
  line-height: 24px;
  color: #616161;
}

#popup-lienhe .modal-content .modal-body .center {
  margin-bottom: 1.5rem;
}

#popup-lienhe .modal-content .modal-body .center a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  text-align: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 1rem;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  height: 56px;
  background: linear-gradient(106.72deg, #EBBB32 -70.05%, #002DFF 133.5%);
  border: 4px solid rgba(213, 213, 213, 0.7);
  -webkit-box-shadow: 0px 100px 80px rgba(0, 0, 0, 0.0196802), 0px 41.7776px 33.4221px rgba(0, 0, 0, 0.0282725), 0px 22.3363px 17.869px rgba(0, 0, 0, 0.035), 0px 12.5216px 10.0172px rgba(0, 0, 0, 0.0417275), 0px 6.6501px 5.32008px rgba(0, 0, 0, 0.0503198), 0px 2.76726px 2.21381px rgba(0, 0, 0, 0.07);
          box-shadow: 0px 100px 80px rgba(0, 0, 0, 0.0196802), 0px 41.7776px 33.4221px rgba(0, 0, 0, 0.0282725), 0px 22.3363px 17.869px rgba(0, 0, 0, 0.035), 0px 12.5216px 10.0172px rgba(0, 0, 0, 0.0417275), 0px 6.6501px 5.32008px rgba(0, 0, 0, 0.0503198), 0px 2.76726px 2.21381px rgba(0, 0, 0, 0.07);
  border-radius: 12px;
  font-weight: 700;
  font-size: 19px;
  line-height: 24px;
  color: #fff;
}

#popup-lienhe .modal-content .modal-body .center a:hover {
  background: #FFBC00;
  border: 4px solid rgba(255, 255, 255, 0.7);
}

#popup-lienhe .modal-content .modal-body .bottom p {
  padding-left: 30px;
  font-weight: 500;
  font-size: 12px;
  line-height: 25px;
  color: #616161;
}

#popup-lienhe .modal-content .modal-body .bottom p:nth-child(1) {
  background: url(../images/l_1.png) no-repeat center left;
}

#popup-lienhe .modal-content .modal-body .bottom p:nth-child(2) {
  background: url(../images/l_2.png) no-repeat center left;
}

#popup-lienhe .modal-content .modal-body .bottom p:nth-child(3) {
  background: url(../images/l_3.png) no-repeat center left;
}

.dinh-duong .list {
  border-bottom: 4px solid #34469A;
  border-radius: 8px;
  margin-bottom: 1rem;
  padding-bottom: 0.25rem;
}

.dinh-duong .list .items {
  border: 1px solid #616161;
  border-radius: 12px;
  padding: 16px;
  font-weight: 500;
  font-size: 16px;
  line-height: 24px;
  text-transform: uppercase;
  color: #616161;
  text-align: center;
  display: block;
}

.dinh-duong .list .items span {
  padding-right: 35px;
  background: url(../images/d_2.png) no-repeat center right 1px;
  display: inline-block;
}

.dinh-duong .list .items:hover {
  border-color: #8CCD03;
  color: #8CCD03;
}

.dinh-duong .list .items:hover span {
  background-image: url(../images/d_3.png);
}

.dinh-duong .list .items.active {
  color: #fff;
  background: linear-gradient(106.72deg, #EBBB32 -70.05%, #002DFF 133.5%);
}

.dinh-duong .list .items.active span {
  background-image: url(../images/d_1.png);
}

.product-detail .info {
  margin-bottom: 40px;
}

.product-detail .info span {
  font-weight: 800;
  font-size: 28px;
  line-height: 40px;
}

.product-detail .info p {
  font-weight: 800;
  font-size: 28px;
  line-height: 40px;
  background: linear-gradient(281.04deg, #34469A -30.57%, #6184FF 108.31%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  margin-bottom: 0;
}

.product-detail .info a {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 16px 42px;
  gap: 16px;
  background: linear-gradient(106.72deg, #EBBB32 -70.05%, #002DFF 133.5%);
  border: 4px solid rgba(213, 213, 213, 0.7);
  -webkit-box-shadow: 0px 100px 80px rgba(0, 0, 0, 0.0196802), 0px 41.7776px 33.4221px rgba(0, 0, 0, 0.0282725), 0px 22.3363px 17.869px rgba(0, 0, 0, 0.035), 0px 12.5216px 10.0172px rgba(0, 0, 0, 0.0417275), 0px 6.6501px 5.32008px rgba(0, 0, 0, 0.0503198), 0px 2.76726px 2.21381px rgba(0, 0, 0, 0.07);
          box-shadow: 0px 100px 80px rgba(0, 0, 0, 0.0196802), 0px 41.7776px 33.4221px rgba(0, 0, 0, 0.0282725), 0px 22.3363px 17.869px rgba(0, 0, 0, 0.035), 0px 12.5216px 10.0172px rgba(0, 0, 0, 0.0417275), 0px 6.6501px 5.32008px rgba(0, 0, 0, 0.0503198), 0px 2.76726px 2.21381px rgba(0, 0, 0, 0.07);
  border-radius: 12px;
  font-weight: 700;
  font-size: 19px;
  line-height: 24px;
  color: #FFFFFF;
  margin-top: 24px;
}

.product-detail .info a:hover {
  background: #FFBC00;
  border: 4px solid rgba(255, 255, 255, 0.7);
}

.product-detail .box {
  margin-bottom: 24px;
}

.product-detail .box .title {
  border-bottom: 0.5px dashed #616161;
  margin-bottom: 24px;
  padding: 8px 0;
}

.product-detail .box .title span {
  font-weight: 700;
  font-size: 19px;
  line-height: 24px;
  background: linear-gradient(106.72deg, #EBBB32 -70.05%, #002DFF 133.5%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  text-fill-color: transparent;
}

@media (max-width: 991px) {
  .header,
  .btn-zalo,
  .btn-phone {
    display: none;
  }
  .menu-res {
    display: block;
  }
  .section-2 .items:not(:first-child) {
    margin-top: 0;
  }
  .section-2 .items .info .desc {
    font-size: 20px;
    line-height: 25px;
  }
}

@media (max-width: 767px) {
  .row {
    --bs-gutter-x: 0.5rem !important;
  }
  .name-product {
    -webkit-line-clamp: 2;
  }
  .section-2 .items {
    padding: 20px 0;
  }
  .section-2 .items .info {
    position: relative;
    top: 0;
    -webkit-transform: translateY(0%);
            transform: translateY(0%);
    text-align: center;
    max-width: 100%;
  }
  .section-2 .items .info .name {
    padding: 5px 10px;
  }
  .section-2 .items .info .name h3 {
    font-size: 15px;
  }
  .section-3 .title {
    font-size: 20px;
    line-height: 30px;
  }
  .section-3 .desc {
    font-size: 15px;
    line-height: 22px;
  }
  .section-3 .view {
    height: 40px;
    font-size: 15px;
    line-height: 30px;
    width: 100%;
  }
  .section-4 .title {
    font-size: 25px;
    line-height: 35px;
  }
  .ve-medidrink .uu-diem .info::after {
    display: none;
  }
  .ve-medidrink .uu-diem .info {
    font-size: 19px;
    line-height: 25px;
  }
  .ve-medidrink .icon .name {
    font-size: 14px;
    line-height: 22px;
  }
  .ve-medidrink .view a {
    height: 40px;
    font-size: 15px;
    line-height: 30px;
  }
  .cau-hoi-thuong-gap .title span {
    font-size: 25px;
  }
  .cau-hoi-thuong-gap .title p {
    font-size: 17px;
  }
  .cau-hoi-thuong-gap .title a {
    display: block;
    width: 100%;
    height: 40px;
    font-size: 15px;
    line-height: 30px;
  }
  .cau-hoi-thuong-gap .main .accordion-item .accordion-button,
  .cau-hoi-thuong-gap .main .accordion-item .accordion-button:not(.collapsed) {
    padding: 5px 10px;
  }
  .cau-hoi-thuong-gap .main .accordion-body {
    padding: 0px 10px 20px;
  }
  .san-pham .title span,
  .san-pham .title p {
    font-size: 30px;
    line-height: 40px;
  }
  .san-pham .title a,
  .product-detail .info a {
    height: 40px;
    font-size: 15px;
    line-height: 30px;
  }
  .slidehome .pic img {
    height: 175px;
    -o-object-fit: cover;
       object-fit: cover;
  }
  .title-main span {
    font-size: 22px;
  }
  .dinh-duong .banner {
    display: none;
  }
  .dinh-duong .list .items {
    padding: 5px;
    font-size: 14px;
  }
  .breadCrumbs .wrap-content .breadcrumb-item a {
    font-size: 14px;
  }
  .ve-medidrink .title-medidrink span {
    font-size: 15px;
    line-height: 20px;
  }
  .ve-medidrink .uu-diem-file a {
    font-size: 16px;
  }
  #popup-lienhe .modal-content .modal-body {
    padding: 20px 15px;
  }
  #popup-lienhe .modal-content .modal-body .top .info p {
    font-size: 19px;
    line-height: 30px;
  }
}

@media (max-width: 576px) {
  .news-image {
    margin-bottom: 1rem;
  }
}

@media (max-width: 369px) {
  .cart-pro-detail a {
    width: 100%;
  }
  .cart-pro-detail a:first-child {
    margin-right: 0px;
    margin-bottom: 0.5rem;
  }
  .cart-pro-detail a i {
    display: none;
  }
}