/*============================================================================
   #Webcms
==============================================================================*/
*{
  padding: 0px;
  margin: 0px ;
  box-sizing: border-box;
  font-family: 'Roboto Condensed', sans-serif;
}
.wrapper {
  position: relative;
 
}
/* Header absolute*/
.heades {
  position: absolute !important;
  z-index: 99;
}
.heades:hover {
  background-color: #fff !important;
}
.heades #mainMenu .menu-li a{
  padding: 0;
  position: relative;
  display: inline-block;
  text-decoration: none;
  color: #fff;
}
.heades:hover a{
   color: #231f20 !important;
}
.heades .logo-header .logo img{
  filter: brightness(20);
}
.heades:hover .logo img {
   filter: brightness(0) !important;
}
.heades .input-text {
  border-color: #fff !important;
}
.heades:hover .input-text {
  border-color: #212529 !important;
}

.heades .div-child a{
  color: #fff !important;
}
.heades:hover .div-child a{
  color: #212529 !important;
}
.heades .div-child .label {
  color: #fff !important;
}
.heades:hover .div-child .label{
  color: #212529 !important;
}

/* Header relative*/
.header {
  position: relative;
  z-index: 99;
}
.header8 {
  margin-bottom: 20px;
  width: 100%;
  background-color: rgba(255,255,255,0);
}
#mainMenu {
  display: flex;
  flex-wrap: wrap;
}
.nav-ul {
  list-style: none;
  padding-left: 0;
  margin-bottom: 0;
}
#mainMenu .menu-li{
  padding: 25px 15px;
  cursor: pointer;
  position: static;
}
#mainMenu .menu-li:first-of-type {
  padding-left: 0;
}
#mainMenu .menu-li a{
  padding: 0;
  position: relative;
  display: inline-block;
  text-decoration: none;
  color: #231f20;
}
.text-uppercase {
  text-transform: uppercase !important;
}
.menu-li .dropdown-togglee::after {
  content: "";
  width: 100%;
  height: 1px;
  display: block;
  background-color: #231f20;
  transform: scale(0);
  transition: .3s;
}
.menu-li:hover .dropdown-togglee::after{
  transform: scale(1);
}
.promotion .dropdown-togglee::after {
  background-color: #be2c15;
}
.li-children .level0::after {
  content: "";
  width: 100%;
  height: 1px;
  display: block;
  background-color: #231f20;
  transform: scale(0);
  transition: .3s;
}
.li-children:hover .level0::after{
  transform: scale(1);
}
.dropdown-menu {
  position: absolute;
  top: 90%;
  z-index: 1000;
  font-size: 14px;
  text-align: left;

}
#mainMenu .menu-li:hover .dropdown-menu {
  opacity: 1;
  visibility: visible;
  transition: 1s;
}
#mainMenu .menu-li .dropdown-menu {
  display: flex;
  padding: 0 15px;
  left: 0;
  width: 100%;
  height: 205px;
  opacity: 0;
  visibility: hidden;
  z-index: 99;
}
#mainMenu .dropdown-menu {
  margin: 0;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  float: none;
  min-width: auto;
}
#mainMenu .dropdown-menu ul {
  display: flex;
  list-style: none;
  padding-left: 0;
  margin-bottom: 0;
}
.dropdown-menu ul .li-children {
  display: block;
  padding: 10px 30px 10px 0;
  position: relative;
}
#mainMenu .dropdown-submenu .dropdown-menu1 {
  top: 100%;
  flex-direction: column;
  flex-wrap: wrap;
  width: 150%;
  height: 160px;
  font-weight: 300;
  opacity: 1;
  visibility: visible;
  left: 0;
  position: absolute;
  display: none;
}
.dropdown-menu1 .livi{
  padding: 5px 20px 5px 0;
}
#mainMenu .dropdown-submenu:hover .dropdown-menu1 {
  display: flex;
}
.dropdown-submenu .dropdown-menu .livi{
  display: block;
  padding: 5px 20px 5px 0;
}
.dropdown-menu .livi a{
  font-size: 16px;
  font-weight: 300;
  padding: 0;
  position: relative;
  display: inline-block;

}
#mainMenu .promotion .dropdown-togglee{
  color: #be2c15 !important;
}
.header .logo-header .logo {
  display: flex;
  text-align: center;
  justify-content: center;
  align-items: center;
  margin: 15px 0;
}
.header .logo-header .logo img {
  height: auto;
  width: auto;
  max-width: 100%;
  max-height: 51px;
}
.middle-header-content .header-right {
  display: flex;
  align-items: center;
  position: static;
  justify-content: flex-end;
}
.header .parent_search {
  width: 100%;
  max-width: 289px;
}
.header .header-right .table-icon-menu {
  position: static;
}
.header .table-icon-menu {
  display: table;
}
.pull-right {
  float: right;
}
.header .search-form .form-search {
  position: fixed;
  top: 10%;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 9;
  background: #fff;
  opacity: 0;
  visibility: hidden;
  
}
.header .form-search .search-close {
  position: absolute;
  right: 0;
  top: 40px;
  color: #231f20;
  width: 60px;
  height: 60px;
  background: 0 0;
  border: none;
  font-size: 60px;
}
.search-close i {
  font-size: 2rem;
}
.header .form-search .minisearch {
  position: relative;
  max-width: 580px;
  color: #231f20;
  margin: 0 auto;
  padding: 15px;
  margin-top: 100px;
}
.header .search-form .minisearch .input-text {
  color: #231f20;
  position: unset;
}
.header .search-form .form-search .minisearch .input-text {
  border: 0;
  background: 0 0;
  border-bottom: 1px solid #231f20;
  padding: 0;
  text-align: center;
  font-size: 20px;
  color: #231f20;
  box-shadow: none;
  padding-right: 40px;
  border-radius: 0;
}
.header .search-form .form-search .minisearch .input-text {
  left: 0;
  right: 0;
}
.header .search-form .form-search .minisearch .button {
  position: absolute;
  right: 20px;
  border: 0;
  bottom: 11px;
  background: 0 0;
  font-size: 22px;
  z-index: 9;
}

.header .search-form .actions-search .action-search {
  background: 0 0;
  border: none;
  color: #231f20;
  font-size: 24px;
  line-height: 1;
  display: block;
}
.div-child a:hover{
  color: #231f20;
}
.header .table-icon-menu .div-child {
  display: table-cell;
  vertical-align: middle;
  padding: 25px 5px;
  /*position: relative;*/
}
.div-child .level1::after{
  content: "";
  width: 100%;
  height: 1px;
  display: block;
  background-color: #231f20;
  transform: scale(0);
  transition: .3s;
}
.div-child:hover .level1::after {
  transform: scale(1);
}
.level2::after {
  content: "";
  width: 100%;
  height: 1px;
  display: block;
  background-color: #231f20;
  transform: scale(0);
  transition: .3s;
}
.neam:hover .level2::after {
  transform: scale(1);
}
.cals-title h3::after {
  content: "";
  width: 100%;
  height: 1px;
  display: block;
  background-color: #231f20;
  transform: scale(0);
  transition: .3s;
}
.cals-title:hover h3::after {
  transform: scale(1);
}

.header a, .header .label,
.header label {
  color: #231f20;
  text-transform: uppercase;
  text-decoration: none;
}

.minicart-wrapper .showcart {
  white-space: nowrap;
  cursor: pointer;
  text-decoration: none;
  color: #000;
  display: block;
  line-height: 1;
}
.middle-header-content .container {
  max-width: 100% !important;
}
.support ul {
  list-style: none;
  margin: 0;
}
.header .header-right .support .support-content {
  display: flex;
  position: absolute;
  padding: 0 35px;
  width: 100%;
  right: 0;
  top: 85%;
  opacity: 0;
  visibility: hidden;
  justify-content: flex-end;
  text-align: right;
  height: 240px;
  background-color: transparent;
  background-color: #fff;
}
.header .header-right .support:hover .support-content {
  opacity: 1;
  visibility: visible;
  transition: 1s;
}
.header .header-right .support-content li {
  margin-left: 50px;
  margin-top: 15px;
  position: relative;
}
.support-content .cals-title h3 {
  font-size: 16px;
  text-transform: uppercase;
  position: relative;
  margin: 0;
}
.support-content .cals-content {
  font-weight: 300;
  opacity: 0;
  visibility: hidden;
  right: 0;
  position: absolute;
 
}
.support-content li:hover .cals-content {
  opacity: 1;
  visibility: visible;
}
/* Header mobi */
.text-right {
  text-align: right;
}
.text-left {
  text-align: left;
}
.nav-toggle i {
  font-size: 25px;
}
.hidden-md button {
  border: none;
}
.header .nav-toggle {
  border: none;
  background: 0 0;
  padding: 5px 0;
}
.header .pd {
  padding: 25px 0;
}
.minicart-wrapper .action_1 {
  position: relative;
}
.minicart-wrapper .action_1 i{
  font-size: 25px;
}
.minicart-wrapper .action_1 .counter {
  position: absolute;
  width: 20px;
  height: 20px;
  background-color: red;
  color: #fff;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;  
  top: -14px;
  right: -15px;
}

/* Header cuộn */
@keyframes stick{
  from{
    transform: translateY(-100%);
    -webkit-transform: translateY(-100%);
    -moz-transform: translateY(-100%);
    -ms-transform: translateY(-100%);
    -o-transform: translateY(-100%);
  }
  to{
    transform: translateY(0%);
    -webkit-transform: translateY(0%);
    -moz-transform: translateY(0%);
    -ms-transform: translateY(0%);
    -o-transform: translateY(0%);
  }
}

.stuck {
top: 0 !important;
position: fixed !important;
left: 0;
right: 0;
margin: 0 auto;
z-index: 9999;
animation-name:stick;
animation-duration:0.5s;
transition: top 0.5s linear 0s;
box-shadow: 0 0 10px rgb(0 0 0 / 20%);
box-shadow: 0 0 10px rgb(0 0 0 / 20%);
background-color: #fff;

}
.div-child .logout{
  position: absolute;
  bottom: 0;
  opacity: 0;
  visibility: hidden;
}
.div-child:hover .logout {
  opacity: 1;
  visibility: visible;
}