@font-face {
    font-family: longthien;
    src: url(http://longthien.vn/fonts/longthien.ttf);
}
/**/

/**/

/*index.php*/
  /*desktop*/
  a:hover, a:visited, a:link, a:active{text-decoration: none;color: red;}
  a:hover{background-color: #ED2E2E;}
  /*rgba(105, 0, 31, 1);*/
  h1{color:#2e2e2e;}
  #content div p{font-size: 20px;}
  #gioi-thieu::first-letter {font-size: 35px;font-weight: bolder;}
  li{font-size: 18px;color: #313131;background-color: none;}
  ul{list-style: square outside url("/img/list.png");}

  body{overflow-x: hidden;background-color: white;font-family: longthien;}
  #debug{display: block;}
  #wrapper{width: 100vw;background-color: white;position: static;}
  #addition-bar{width: 100vw;height: 5px;background-color: #222222}
  #topbar{width: 100vw;height: 50px;background-color: #222222;margin: auto;display: -webkit-flex;display: flex;flex-direction: row;position: relative;}
    #shape{z-index: 0}
    #shapebg{position: absolute;z-index: 1;width: 51vw;height: 200px;}
    #topbar-wrap{width: 1200px;height: 50px;background-color: #222222;margin: auto;z-index: 2;}
      #info-bar{width: 600px;height: 50px;background-color: none;z-index: 4;position: absolute;left: 50%;display: flex;display: -webkit-flex; flex-wrap: nowrap;justify-content: center;align-items: center;}
        #lang-bar{width: 100px;height: 30px;background-color: none;display: flex;display: -webkit-flex;justify-content: space-around;padding-top: 5px;}
        #search-bar{width: 350px;height: 30px;background-color: none;display: flex;display: -webkit-flex;justify-content: space-around;}
          #search-text{width: 350px;height: 28px;border: none;padding-left: 5px;}
          #search_img{padding-top: 3px;}
        #social-bar{width: 100px;height: 30px;background-color: none;display: flex;display: -webkit-flex;justify-content: space-around;align-items: center;}
          #fb_link:hover{background-color: transparent;}
  #header{width: 1200px;height: 160px;background-color: none;margin: auto;position: relative;}
    #logo{float: left;width: 350px;height: 128px;background-color: none;background-image: url('/img/logo/logo.png');background-repeat: no-repeat;background-position: center;background-size: cover;}
    #banner{height: 128px;background-color: white;align-content: center;text-align: center;display: -webkit-flex;display: flex;flex-direction: row;margin: auto;}
      #slogan{background-color: none;width:820px;height: 50px;margin-top: 50px;display: block;font-size: 20px;font-weight: bold;color: black;display: flex;display: -webkit-flex;justify-content: space-around;}
      #slogan p{background-color: none;overflow: hidden;height: 45px;font-size: 20px;text-align: left;border-left: 1px #313131 solid;color: #313131;padding-left: 5px;}
  #topnav-wrap{background-color: #222222;width:100vw;height: 63px;margin: auto;}
  #nav-mobile{display: none;}
    #diviser-home{background-color: ;width:50px;}
    #diviser-other{background-color: none;width: 1150px;display: flex;display: -webkit-flex;}
  .sticky {position: fixed;top: 0;max-height: 50px;z-index: 2;height: 200px;}
  .small{height: 50px;}
    #topnav{background-color: none;height: 100%;width: 1200px;margin: auto;display: -webkit-flex;display: flex;position:relative;}
    .topnav_a{background-color:none;height: 100%;text-align: center;width: 100%;display: -webkit-flex;display: flex;align-items: center;justify-content: center;color: white;}
    .active{background-color: #ED2E2E;}
      #home-icon{border: 1px white solid;}
    .big-button{width: 25%;background-color: none;}
    .nav-item-icon{background-color:white;height: 100%;text-align: center;width: 100%;display: -webkit-flex;display: flex;align-items: center;justify-content: center;color: white;overflow: hidden;}
    .nav-item-icon:hover{background-color: #E8C248}
    .nav-item{width: 100%;border-left: 1px white solid;font-size: 18px;}
    .big-button:last-child .nav-item {border-right: 1px white solid;}
    .submenu{display: none;background: rgba(0, 0, 0, 0.9);width: 1150px;position: absolute;top:63px;z-index: 10;box-sizing: border-box;overflow: hidden;border: 1px #e1e1e1 solid;}
    .submenustick{display: none;background: rgba(0, 0, 0, 0.9);width: 1200px;position: absolute;top:50px;z-index: 10;}
      .mega-container{border: 0px white solid;flex: 2;}
        .mega-container a{height:20px;}
        .mega-cat{color: white;font-size: 20px;font-weight: bold;padding: 10px;border: 0px white solid;text-align: center;border-bottom: 1px white solid;border-left: 1px white solid;margin-left: -1px;}
        .mega-type{color: white;font-size: 15;font-weight: lighter;padding: 10px;}
        .mega-type:hover{background-color: #E8C248;}
        /*new*/
        #submenu-left{width: 25%; background-color:white ;}
        #submenu-left2{width: 25%; background-color:white ;}
          .submenu-left-cat{width: 90%;height: 40px;background-color: #e5e5e5;margin: 5%;display: flex;justify-content: center;align-items: center;cursor: pointer;}
          .submenu-left-cat:hover{background-color: #ED2E2E;}
        #submenu-right{width: 75%;background-color: white;}
        #submenu-right2{width: 75%;background-color: white;}
          .submenu_a{color: #313131 !important;}
          .submenu_a:hover{background-color: transparent;}
          .submenu-item-wrapper{width: 192px;height: 232px;background-color: none;display: inline-block;margin:10px;overflow: hidden;}
          .submenu-item-wrapper:hover{animation-name: light-zoom;animation-duration: 1s;transform: scale(1.04);}
          @keyframes light-zoom {
            0% {transform: scale(1);}
            50% {transform: scale(1.06);}
            100% {transform: scale(1.04);}
          }
          .submenu-item-wrapper:hover .submenu-item-name{color: #ED2E2E;}
          .submenu-item-img-img{width: 100%;height: 100%;}
          .submenu-item-name{background-color: #e5e5e5;width: 192px;height: 40px;color: #313131;display: flex;display: -webkit-flex;justify-content: center;align-items: center;font-size: 17px;}
    #sanpham-big-button a{color: white;font-weight: bolder;font-size: 20px;}
    #giaiphap-big-button a{color: white;font-weight: bolder;font-size: 20px;}
    #doitac-big-button a{color: white;font-weight: bolder;font-size: 20px;}
    #lienhe-big-button a{color: white;font-weight: bolder;font-size: 20px;}

    #sanpham-big-button:hover +#sanpham-submenu{display: flex;display: -webkit-flex;align-content:stretch;animation-name: showdrop;animation-duration: 0.1s;}
    #giaiphap-big-button:hover +#giaiphap-submenu{display: flex;display: -webkit-flex;animation-name: showdrop;animation-duration: 0.1s;}
    #doitac-big-button:hover +#doitac-submenu{display: flex;display: -webkit-flex;animation-name: showdrop;animation-duration: 0.1s;}

    #sanpham-submenu:hover {display: flex;display: -webkit-flex;animation-name: showdrop;animation-duration: 0.1s;}
    #giaiphap-submenu:hover {display: flex;display: -webkit-flex;animation-name: showdrop;animation-duration: 0.1s;}
    #doitac-submenu:hover {display: flex;display: -webkit-flex;animation-name: showdrop;animation-duration: 0.1s;}
    #lienhe-submenu:hover {display: flex;display: -webkit-flex;animation-name: showdrop;animation-duration: 0.1s;}
    @keyframes showdrop {
      0% {height: 0%;}
      100% {height: 100%;}
    }
  #news{width: 100vw;height: 38px;background-color: rgba(18, 22, 22, 0.4);top: 0px;display: none;margin: auto;color: white;padding-top: 5px;font-size: 25px;}
  #page-heading{width: 100%;height: 170px;margin:auto;font-size: 35px;font-weight: bolder;color: #2E2E2E;background-color:#f4f6f9;position: relative;text-shadow: -1px 2px #222222;}
    .content-header{position: absolute;}
    #page-heading-text-wrapper{width: 1200px;margin: auto;}
    #page-heading-text{background-color: none;width: 1200px;height: 100%;margin: auto;padding-top: 50px;position: absolute;display: inline-block;color: white;padding-left:10px;}
  .fullwidth-content{width: 100%;height: 100%;background-color: none;display: flex;display: -webkit-flex;flex-wrap: wrap;justify-content: space-between;}
  /*lien he*/
  .halfwidth{width: 50%;background-color: none;display: inline-block;}
    #thong-tin-hoa-don{border: 2px #ED2E2E solid;font-size: 14px;padding-top: 5px;padding-bottom: 5px;}
    #thong-tin-hoa-don-title{text-align: center;font-weight: bolder;font-size: 20px;}
    .thong-tin-hoa-don-field{font-weight: bold;width: 19%;display: inline-block;padding-left: 2%;font-style: italic;}
    .thong-tin-hoa-don-data{font-weight:normal;;text-align: left;width: 78%;display: inline-block;font-size: 15px;}
  .full a:hover{background-color: white;}
  #content{width: 1200px;background-color: white;margin: auto;overflow: hidden;margin-top: 30px;}
    #side-menu{background-color: rgba(0, 0, 0, 0.1);display: inline-block;width: 300px;float: left;margin-top: 12px;min-height: 676px;}
      #side-menu-header{font-weight: bolder;height: 50px !important;display: flex;display: -webkit-flex;align-items: center;justify-content: center;color:white;font-size: 25px;background-color: #2e2e2e;}
      .side-menu_a:visited, .side-menu_a:link, .side-menu_a:active{text-decoration: none;color: rgba(0, 0, 0, 0.6);}
      #side-menu div{height: 30px;}
      #side-menu li>*{color: #313131;}
      #side-menu li>*:hover{color: #ED2E2E;}
      .menu-item{background-color: none;height: 35px;font-size: 20px;color: rgba(0, 0, 0, 0.8);}
      .menu-item:hover{color: #ED2E2E;}
    #main-content{background-color: none;display: inline-block;width: 900px;display: flex;display: -webkit-flex;flex-wrap: wrap;}
    #main-content a:hover{background-color: white;}
      .item-detail-container{width: 900px;background-color: none;position: relative;margin-left: 10px;padding-top: 12px;}
        .item-detail-image{width: 400px;background-color: none;display: inline-block;float: left;}
        .item-detail-info{width: 480px;background-color: none;display:inline-block;}
          .item-detail-info-title{width: 100%;height: 100px;background-color: none;font-weight: bolder;font-size: 35px;text-align: left;color: #2E2E2E;padding-left: 20px;}
          .item-detail-info-price{width: 100%;background-color: none;padding-left: 20px; color:#777777;font-weight: bolder;font-size: 25px;}
            .price-title{color: #222222;display: inline-block;}
            .price{color: #ED2E2E;display: inline-block;}
          .item-detail-info-description{width: 100%;background-color: none;padding-left: 20px;color: #2E2E2E;font-size: 20px;}
      .fullwidth-content a:hover{background-color: white;}
      .item-box-homepage{background-color: none;width: 340px;margin: 30px;}
      /*san-pham*/
      .item-box{background-color: none;width: 275px;height: 325px;border: 2px rgba(239, 239, 239, 0.9) solid;margin: 10px;overflow: hidden;}
        .item-img-border{width: 100%;height: 85%;overflow: hidden;}
        .item-img{width: 100%;height: 100%;background-color: none;transition: 0.5s;display: flex;display: -webkit-flex;justify-content: center;align-items: center;background-size: cover;}
        .item-img:hover{transform: scale(1.25);}
        .item-name{width: 100%;height: 15%;background-color: rgba(0, 0, 0, 0.1);color: #313131;font-weight: bolder;display: flex;display: -webkit-flex;justify-content: center;align-items: center;font-size: 20px;text-align: center;}
        .item-name:hover{color: #ED2E2E;}
      /*doi-tac*/

      @keyframes newanimation {
        0% {border: 5px #ED2E2E solid;}
        60% {border: 5px #222222 solid;}
      }
      .doitac-box{background-color: none;width: 200px;height: 220px;border: 2px rgba(239, 239, 239, 0.9) solid;margin: 10px;overflow: hidden;padding: 5px;position: relative; cursor: pointer;box-sizing: border-box;}
        .doitac-img-border{width: 85%;height: 75%;overflow: hidden;margin:auto;animation-name: newanimation;animation-duration: 1.5s;animation-iteration-count:infinite;border: 5px #ED2E2E solid;}
        .doitac-img{width: 100%;height: 100%;background-color: none;transition: 0.5s;display: flex;display: -webkit-flex;justify-content: center;align-items: center;background-size: cover;}
        .doitac-img:hover{transform: rotate(10deg) scale(1.15);}
        .doitac-name{width: 90%;height: 30px;margin-left: 5%;background-color: rgba(0, 0, 0, 0.1);color: black;font-weight: bolder;display: flex;display: -webkit-flex;justify-content: center;align-items: center;}
        .doitac-name:hover{color: #ED2E2E;}

      #ban-do{width: 600px; height: 700px;}

    #post-title{background-color: none;}
    #post-content{background-color: lime;}
  #footer{width: 100vw;height: 350px;background-color: rgba(17, 17, 15, 0.9);margin: auto;color: white;text-align: center;}
    #footer-wrapper{width: 1200px;margin: auto;overflow: hidden;height: 350px;}
    #footer-left{background-color:none;width: 38%;height: 300px;display: inline-block;float: left;border-radius: 10px;margin-top: 10px;position: relative;}
      #footer-left-title{text-align: left;font-weight: bold;font-size: 20px;}
      #facebook-box{border: 1px white solid; background-color: white;width: 450;margin-top: 20px;}
      #footer-left-counter{color:white; display: flex;display: -webkit-flex;align-items:flex-start; margin-top: 20px;flex-direction: column;position: absolute;bottom: 80px;}
      #counter-title{font-weight: bolder;}
      #counter-number{margin-top: 10px;}
      #copyright{ margin-top: 20px;position: absolute;bottom: 30px;}
    #footer-right{background-color:none ;width: 59%;height: 300px;display: inline-block;margin-left: 2%;}
      #mini-nav{display: flex;display: -webkit-flex;flex-wrap: nowrap;color: white; background-color: none;justify-content: space-between;margin-top: 10px;}
      #mini-nav div {background-color: none;border-left: 1px white solid;border-right: 1px white solid;width: 25%;}
      #mini-nav a {color: white;font-weight: bold;font-size: 20px;}
      #mini-nav a:hover{background-color: transparent;color: #ED2E2E;}
      #mini-address h3{text-align: left;}
      #mini-address p{text-align: left;}
      #mini-info h3{text-align: left;}
      #mini-info div{display: flex;display: -webkit-flex;flex-wrap: nowrap;color: white; background-color: none;justify-content: space-between;}


/* desktop 1366 */
  @media only screen and (max-width: 1366px) {

    a:hover, a:visited, a:link, a:active{text-decoration: none;color: red;}
    a:hover{background-color: #ED2E2E;}
    /*rgba(105, 0, 31, 1);*/
    h1{color:#2e2e2e;}
    #content div p{font-size: 20px;}
    #gioi-thieu::first-letter {font-size: 35px;font-weight: bolder;}
    li{font-size: 18px;color: #313131;background-color: none;}
    ul{list-style: square outside url("/img/list.png");}
    body{overflow-x: hidden;background-color: white;font-family: longthien;}
    #debug{display: block;}
    #wrapper{width: 100vw;background-color: white;position: static;}
    #addition-bar{width: 100vw;height: 5px;background-color: #222222}
    #topbar{width: 100vw;height: 50px;background-color: #222222;margin: auto;display: -webkit-flex;display: flex;flex-direction: row;position: relative;}
      #shape{z-index: 0}
      #shapebg{position: absolute;z-index: 1;width: 51vw;height: 200px;}
      #topbar-wrap{width: 1200px;height: 50px;background-color: #222222;margin: auto;z-index: 2;}
        #info-bar{width: 600px;height: 50px;background-color: none;z-index: 4;position: absolute;left: 50%;display: flex;display: -webkit-flex; flex-wrap: nowrap;justify-content: center;align-items: center;}
          #lang-bar{width: 100px;height: 30px;background-color: none;display: flex;display: -webkit-flex;justify-content: space-around;padding-top: 5px;}
          #search-bar{width: 350px;height: 30px;background-color: none;display: flex;display: -webkit-flex;justify-content: space-around;}
            #search-text{width: 350px;height: 28px;border: none;padding-left: 5px;}
            #search_img{padding-top: 3px;}
          #social-bar{width: 100px;height: 30px;background-color: none;display: flex;display: -webkit-flex;justify-content: space-around;align-items: center;}
            #fb_link:hover{background-color: transparent;}
    #header{width: 1200px;height: 160px;background-color: none;margin: auto;position: relative;}
      #logo{float: left;width: 350px;height: 128px;background-color: none;background-image: url('/img/logo/logo.png');background-repeat: no-repeat;background-position: center;background-size: cover;}
      #banner{height: 128px;background-color: white;align-content: center;text-align: center;display: -webkit-flex;display: flex;flex-direction: row;margin: auto;}
        #slogan{background-color: none;width:820px;height: 50px;margin-top: 50px;display: block;font-size: 20px;font-weight: bold;color: black;display: flex;display: -webkit-flex;justify-content: space-around;}
        #slogan p{background-color: none;overflow: hidden;height: 45px;font-size: 15px;text-align: left;border-left: 1px #313131 solid;color: #313131;padding-left: 5px;}
    #topnav-wrap{background-color: #222222;width:100vw;height: 63px;margin: auto;}
    #nav-mobile{display: none;}
      #diviser-home{background-color: ;width:50px;}
      #diviser-other{background-color: none;width: 1150px;display: flex;display: -webkit-flex;}
    .sticky {position: fixed;top: 0;max-height: 50px;z-index: 2;height: 200px;}
    .small{height: 50px;}
      #topnav{background-color: none;height: 100%;width: 1200px;margin: auto;display: -webkit-flex;display: flex;position:relative;}
      .topnav_a{background-color:none;height: 100%;text-align: center;width: 100%;display: -webkit-flex;display: flex;align-items: center;justify-content: center;color: white;}
      .active{background-color: #ED2E2E;}
        #home-icon{border: 1px white solid;}
      .big-button{width: 25%;background-color: none;}
      .nav-item-icon{background-color:white;height: 100%;text-align: center;width: 100%;display: -webkit-flex;display: flex;align-items: center;justify-content: center;color: white;overflow: hidden;}
      .nav-item-icon:hover{background-color: #E8C248}
      .nav-item{width: 100%;border-left: 1px white solid;font-size: 15px;}
      .big-button:last-child .nav-item {border-right: 1px white solid;}
      .submenu{display: none;background: rgba(0, 0, 0, 0.9);width: 1150px;position: absolute;top:63px;z-index: 10;box-sizing: border-box;overflow: hidden;border: 1px #e1e1e1 solid;}
      .submenustick{display: none;background: rgba(0, 0, 0, 0.9);width: 1200px;position: absolute;top:50px;z-index: 10;}
        .mega-container{border: 0px white solid;flex: 2;}
          .mega-container a{height:20px;}
          .mega-cat{color: white;font-size: 20px;font-weight: bold;padding: 10px;border: 0px white solid;text-align: center;border-bottom: 1px white solid;border-left: 1px white solid;margin-left: -1px;}
          .mega-type{color: white;font-size: 15;font-weight: lighter;padding: 10px;}
          .mega-type:hover{background-color: #E8C248;}
          /*new*/
          #submenu-left{width: 25%; background-color:white ;}
          #submenu-left2{width: 25%; background-color:white ;}
            .submenu-left-cat{width: 90%;height: 40px;background-color: #e5e5e5;margin: 5%;display: flex;justify-content: center;align-items: center;cursor: pointer;}
            .submenu-left-cat:hover{background-color: #ED2E2E;}
          #submenu-right{width: 75%;background-color: white;}
          #submenu-right2{width: 75%;background-color: white;}
            .submenu_a{color: #313131 !important;}
            .submenu_a:hover{background-color: transparent;}
            .submenu-item-wrapper{width: 192px;height: 232px;background-color: none;display: inline-block;margin:10px;overflow: hidden;}
            .submenu-item-wrapper:hover{animation-name: light-zoom;animation-duration: 1s;transform: scale(1.04);}
            @keyframes light-zoom {
              0% {transform: scale(1);}
              50% {transform: scale(1.06);}
              100% {transform: scale(1.04);}
            }
            .submenu-item-wrapper:hover .submenu-item-name{color: #ED2E2E;}
            .submenu-item-img-img{width: 100%;height: 100%;}
            .submenu-item-name{background-color: #e5e5e5;width: 192px;height: 40px;color: #313131;display: flex;display: -webkit-flex;justify-content: center;align-items: center;font-size: 17px;}
      #sanpham-big-button a{color: white;font-weight: bolder;font-size: 20px;}
      #giaiphap-big-button a{color: white;font-weight: bolder;font-size: 20px;}
      #doitac-big-button a{color: white;font-weight: bolder;font-size: 20px;}
      #lienhe-big-button a{color: white;font-weight: bolder;font-size: 20px;}

      #sanpham-big-button:hover +#sanpham-submenu{display: flex;display: -webkit-flex;align-content:stretch;animation-name: showdrop;animation-duration: 0.1s;}
      #giaiphap-big-button:hover +#giaiphap-submenu{display: flex;display: -webkit-flex;animation-name: showdrop;animation-duration: 0.1s;}
      #doitac-big-button:hover +#doitac-submenu{display: flex;display: -webkit-flex;animation-name: showdrop;animation-duration: 0.1s;}

      #sanpham-submenu:hover {display: flex;display: -webkit-flex;animation-name: showdrop;animation-duration: 0.1s;}
      #giaiphap-submenu:hover {display: flex;display: -webkit-flex;animation-name: showdrop;animation-duration: 0.1s;}
      #doitac-submenu:hover {display: flex;display: -webkit-flex;animation-name: showdrop;animation-duration: 0.1s;}
      #lienhe-submenu:hover {display: flex;display: -webkit-flex;animation-name: showdrop;animation-duration: 0.1s;}
      @keyframes showdrop {
        0% {height: 0%;}
        100% {height: 100%;}
      }
    #news{width: 100vw;height: 38px;background-color: rgba(18, 22, 22, 0.4);top: 0px;display: none;margin: auto;color: white;padding-top: 5px;font-size: 25px;}
    #page-heading{width: 100%;height: 170px;margin:auto;font-size: 35px;font-weight: bolder;color: #2E2E2E;background-color:#f4f6f9;position: relative;text-shadow: -1px 2px #222222;}
      .content-header{position: absolute;}
      #page-heading-text-wrapper{width: 1200px;margin: auto;}
      #page-heading-text{background-color: none;width: 1200px;height: 100%;margin: auto;padding-top: 50px;position: absolute;display: inline-block;color: white;padding-left:10px;}
    .fullwidth-content{width: 100%;height: 100%;background-color: none;display: flex;display: -webkit-flex;flex-wrap: wrap;justify-content: space-between;}
    /*lien he*/
    .halfwidth{width: 50%;background-color: none;display: inline-block;}
      #thong-tin-hoa-don{border: 2px #ED2E2E solid;font-size: 14px;padding-top: 5px;padding-bottom: 5px;}
      #thong-tin-hoa-don-title{text-align: center;font-weight: bolder;font-size: 20px;}
      .thong-tin-hoa-don-field{font-weight: bold;width: 19%;display: inline-block;padding-left: 2%;font-style: italic;}
      .thong-tin-hoa-don-data{font-weight:normal;;text-align: left;width: 78%;display: inline-block;font-size: 15px;}
    .full a:hover{background-color: white;}
    #content{width: 1200px;background-color: white;margin: auto;overflow: hidden;margin-top: 30px;}
      #side-menu{background-color: rgba(0, 0, 0, 0.1);display: inline-block;width: 300px;float: left;margin-top: 12px;min-height: 676px;}
        #side-menu-header{font-weight: bolder;height: 50px !important;display: flex;display: -webkit-flex;align-items: center;justify-content: center;color:white;font-size: 20px;background-color: #2e2e2e;}
        .side-menu_a:visited, .side-menu_a:link, .side-menu_a:active{text-decoration: none;color: rgba(0, 0, 0, 0.6);}
        #side-menu div{height: 30px;}
        #side-menu li>*{color: #313131;}
        #side-menu li>*:hover{color: #ED2E2E;}
        .menu-item{background-color: none;height: 35px;font-size: 20px;color: rgba(0, 0, 0, 0.8);}
        .menu-item:hover{color: #ED2E2E;}
      #main-content{background-color: none;display: inline-block;width: 900px;display: flex;display: -webkit-flex;flex-wrap: wrap;}
      #main-content a:hover{background-color: white;}
        .item-detail-container{width: 900px;background-color: none;position: relative;margin-left: 10px;padding-top: 12px;}
          .item-detail-image{width: 400px;background-color: none;display: inline-block;float: left;}
          .item-detail-info{width: 480px;background-color: none;display:inline-block;}
            .item-detail-info-title{width: 100%;height: 100px;background-color: none;font-weight: bolder;font-size: 25px;text-align: left;color: #2E2E2E;padding-left: 20px;}
            .item-detail-info-price{width: 100%;background-color: none;padding-left: 20px; color:#777777;font-weight: bolder;font-size: 20px;}
              .price-title{color: #222222;display: inline-block;}
              .price{color: #ED2E2E;display: inline-block;}
            .item-detail-info-description{width: 100%;background-color: none;padding-left: 20px;color: #2E2E2E;font-size: 18px;}
        .fullwidth-content a:hover{background-color: white;}
        .item-box-homepage{background-color: none;width: 340px;margin: 30px;}
        /*san-pham*/
        .item-box{background-color: none;width: 275px;height: 325px;border: 2px rgba(239, 239, 239, 0.9) solid;margin: 10px;overflow: hidden;}
          .item-img-border{width: 100%;height: 85%;overflow: hidden;}
          .item-img{width: 100%;height: 100%;background-color: none;transition: 0.5s;display: flex;display: -webkit-flex;justify-content: center;align-items: center;background-size: cover;}
          .item-img:hover{transform: scale(1.25);}
          .item-name{width: 100%;height: 15%;background-color: rgba(0, 0, 0, 0.1);color: #313131;font-weight: bolder;display: flex;display: -webkit-flex;justify-content: center;align-items: center;font-size: 16px;text-align: center;}
          .item-name:hover{color: #ED2E2E;}
        /*doi-tac*/

        @keyframes newanimation {
          0% {border: 5px #ED2E2E solid;}
          60% {border: 5px #222222 solid;}
        }
        .doitac-box{background-color: none;width: 200px;height: 220px;border: 2px rgba(239, 239, 239, 0.9) solid;margin: 10px;overflow: hidden;padding: 5px;position: relative; cursor: pointer;box-sizing: border-box;}
          .doitac-img-border{width: 85%;height: 75%;overflow: hidden;margin:auto;animation-name: newanimation;animation-duration: 1.5s;animation-iteration-count:infinite;border: 5px #ED2E2E solid;}
          .doitac-img{width: 100%;height: 100%;background-color: none;transition: 0.5s;display: flex;display: -webkit-flex;justify-content: center;align-items: center;background-size: cover;}
          .doitac-img:hover{transform: rotate(10deg) scale(1.15);}
          .doitac-name{width: 90%;height: 30px;margin-left: 5%;background-color: rgba(0, 0, 0, 0.1);color: black;font-weight: bolder;display: flex;display: -webkit-flex;justify-content: center;align-items: center;font-size: 14px;}
          .doitac-name:hover{color: #ED2E2E;}

        #ban-do{width: 600px; height: 700px;}

      #post-title{background-color: none;}
      #post-content{background-color: lime;}
    #footer{width: 100vw;height: 350px;background-color: rgba(17, 17, 15, 0.9);margin: auto;color: white;text-align: center;}
      #footer-wrapper{width: 1200px;margin: auto;overflow: hidden;height: 350px;}
      #footer-left{background-color:none;width: 38%;height: 300px;display: inline-block;float: left;border-radius: 10px;margin-top: 10px;position: relative;}
        #footer-left-title{text-align: left;font-weight: bold;font-size: 16px;}
        #facebook-box{border: 1px white solid; background-color: white;width: 450;margin-top: 20px;}
        #footer-left-counter{color:white; display: flex;display: -webkit-flex;align-items:flex-start; margin-top: 20px;flex-direction: column;position: absolute;bottom: 80px;}
        #counter-title{font-weight: bolder;}
        #counter-number{margin-top: 10px;}
        #copyright{ margin-top: 20px;position: absolute;bottom: 30px;}
      #footer-right{background-color:none ;width: 59%;height: 300px;display: inline-block;margin-left: 2%;}
        #mini-nav{display: flex;display: -webkit-flex;flex-wrap: nowrap;color: white; background-color: none;justify-content: space-between;margin-top: 10px;}
        #mini-nav div {background-color: none;border-left: 1px white solid;border-right: 1px white solid;width: 25%;}
        #mini-nav a {color: white;font-weight: bold;font-size: 16px;}
        #mini-nav a:hover{background-color: transparent;color: #ED2E2E;}
        #mini-address h3{text-align: left;font-size: 16px;}
        #mini-address p{text-align: left;font-size: 15px;}
        #mini-info h3{text-align: left;}
        #mini-info div{display: flex;display: -webkit-flex;flex-wrap: nowrap;color: white; background-color: none;justify-content: space-between;font-size: 16px;}
  }


  /*tablet*/
  @media only screen and (max-width: 1024px) {
    a:hover, a:visited, a:link, a:active{text-decoration: none;color: red;}
    a:hover{background-color: #ED2E2E;}
    /*rgba(105, 0, 31, 1);*/
    h1{color:#2e2e2e;}
    #content div p{font-size: 20px;}
    #gioi-thieu::first-letter {font-size: 35px;font-weight: bolder;}
    #gioi-thieu{width: 1000px;}
    li{font-size: 15px;color: #313131;background-color: none;}
    ul{list-style: square outside url("");}

    body{overflow-x: hidden;background-color: white;}
    #debug{display: block;}
    #wrapper{width: 1024px;background-color: white;position: static;}
    #addition-bar{width: 100vw;height: 5px;background-color: #222222}
    #topbar{width: 100vw;height: 50px;background-color: #222222;margin: auto;display: -webkit-flex;display: flex;flex-direction: row;position: relative;}
      #shape{z-index: 0}
      #shapebg{position: absolute;z-index: 1;width: 51vw;height: 0px;}
      #topbar-wrap{width: 1024px;height: 50px;background-color: #222222;margin: auto;z-index: 2;overflow: hidden;}
        #info-bar{width: 400px;height: 50px;background-color: none;z-index: 4;position: absolute;left: 50%;display: flex;display: -webkit-flex; flex-wrap: nowrap;justify-content: center;align-items: center;}
          #lang-bar{width: 100px;height: 30px;background-color: none;display: flex;display: -webkit-flex;justify-content: space-around;}
          #search-bar{width: 350px;height: 30px;background-color: none;display: flex;display: -webkit-flex;justify-content: space-around;}
            #search-text{width: 350px;height: 28px;border: none;}
          #social-bar{width: 100px;height: 30px;background-color: none;display: flex;display: -webkit-flex;justify-content: space-around;align-items: center;}
    #header{width: 1024px;height: 160px;background-color: none;margin: auto;position: relative;}
      #logo{float: left;width: 350px;height: 128px;background-color: none;background-image: url('/img/logo/logo.png');background-repeat: no-repeat;background-position: center;background-size: cover;}
      #banner{height: 128px;background-color: white;align-content: center;text-align: center;display: -webkit-flex;display: flex;flex-direction: row;margin: auto;}
        #slogan{background-color: none;width:820px;height: 50px;margin-top: 50px;display: block;font-size: 20px;font-weight: bold;color: black;display: flex;display: -webkit-flex;justify-content: space-around;}
        #slogan p{background-color: none;overflow: hidden;height: 35px;font-size: 15px;text-align: left;border-left: 1px #313131 solid;color: #313131;padding-left: 5px;line-height: 1 !important;}
    #topnav-wrap{background-color: #222222;width:100%;height: 63px;margin: auto;}
      #diviser-home{background-color: ;width:50px;}
      #diviser-other{background-color: none;width: 974px;display: flex;display: -webkit-flex;}
    .sticky {position: fixed;top: 0;max-height: 50px;z-index: 2;height: 200px;}
    .small{height: 50px;}
      #topnav{background-color: none;height: 100%;width: 1024px;margin: auto;display: -webkit-flex;display: flex;position:relative;}
      .topnav_a{background-color:none;height: 100%;text-align: center;width: 100%;display: -webkit-flex;display: flex;align-items: center;justify-content: center;color: white;}
      .active{background-color: #ED2E2E;}
        #home-icon{border: 1px white solid;}
      .big-button{width: 25%;background-color: none;}
      .nav-item-icon{background-color:white;height: 100%;text-align: center;width: 100%;display: -webkit-flex;display: flex;align-items: center;justify-content: center;color: white;overflow: hidden;}
      .nav-item-icon:hover{background-color: #E8C248}
      .nav-item{width: 100%;border-left: 1px white solid;font-size: 18px;}
      .big-button:last-child .nav-item {border-right: 1px white solid;}
      .submenu{display: none;background: rgba(0, 0, 0, 0.9);width: 100%;position: absolute;top:63px;z-index: 10;box-sizing: border-box;overflow: hidden;border: 1px #e1e1e1 solid;left: 0px;}
      .submenustick{display: none;background: rgba(0, 0, 0, 0.9);width: 1024px;position: absolute;top:50px;z-index: 10;}
        .mega-container{border: 0px white solid;flex: 2;}
          .mega-container a{height:20px;}
          .mega-cat{color: white;font-size: 20px;font-weight: bold;padding: 10px;border: 0px white solid;text-align: center;border-bottom: 1px white solid;border-left: 1px white solid;margin-left: -1px;}
          .mega-type{color: white;font-size: 15;font-weight: lighter;padding: 10px;}
          .mega-type:hover{background-color: #E8C248;}
          /*new*/
          #submenu-left{width: 28.5%; background-color:white ;padding-left: 3.3%;}
          #submenu-left2{width: 28.5%; background-color:white ;padding-left: 3.3%;}
            .submenu-left-cat{width: 90%;height: 40px;background-color: #e5e5e5;margin: 5%;display: flex;justify-content: center;align-items: center;cursor: pointer;font-size: 15px;}
            .submenu-left-cat:hover{background-color: #ED2E2E;}
          #submenu-right{width: 75%;background-color: white;}
          #submenu-right2{width: 75%;background-color: white;}
            .submenu_a{color: #313131 !important;}
            .submenu_a:hover{background-color: transparent;}
            .submenu-item-wrapper{width: 192px;height: 232px;background-color: none;display: inline-block;margin:10px;overflow: hidden;}
            .submenu-item-wrapper:hover{animation-name: light-zoom;animation-duration: 1s;transform: scale(1.04);}
            @keyframes light-zoom {
              0% {transform: scale(1);}
              50% {transform: scale(1.06);}
              100% {transform: scale(1.04);}
            }
            .submenu-item-wrapper:hover .submenu-item-name{color: #ED2E2E;}
            .submenu-item-img-img{width: 100%;height: 100%;}
            .submenu-item-name{background-color: #e5e5e5;width: 192px;height: 40px;color: #313131;display: flex;display: -webkit-flex;justify-content: center;align-items: center;font-size: 17px;}
      #sanpham-big-button a{color: white;font-weight: bolder;font-size: 20px;}
      #giaiphap-big-button a{color: white;font-weight: bolder;font-size: 20px;}
      #doitac-big-button a{color: white;font-weight: bolder;font-size: 20px;}
      #lienhe-big-button a{color: white;font-weight: bolder;font-size: 20px;}

      #sanpham-big-button:hover +#sanpham-submenu{display: flex;display: -webkit-flex;align-content:stretch;animation-name: showdrop;animation-duration: 0.1s;}
      #giaiphap-big-button:hover +#giaiphap-submenu{display: flex;display: -webkit-flex;animation-name: showdrop;animation-duration: 0.1s;}
      #doitac-big-button:hover +#doitac-submenu{display: flex;display: -webkit-flex;animation-name: showdrop;animation-duration: 0.1s;}

      #sanpham-submenu:hover {display: flex;display: -webkit-flex;animation-name: showdrop;animation-duration: 0.1s;}
      #giaiphap-submenu:hover {display: flex;display: -webkit-flex;animation-name: showdrop;animation-duration: 0.1s;}
      #doitac-submenu:hover {display: flex;display: -webkit-flex;animation-name: showdrop;animation-duration: 0.1s;}
      #lienhe-submenu:hover {display: flex;display: -webkit-flex;animation-name: showdrop;animation-duration: 0.1s;}
      @keyframes showdrop {
        0% {height: 0px;}
        1%   {height: 1px;top: 185px;}
        100% {height: 200px;top: 85px;}
      }
    #page-heading{width: 100%;height: 100px;margin:auto;font-size: 35px;font-weight: bolder;color: #2E2E2E;background-color:#f4f6f9;position: relative;text-shadow: -1px 2px #222222;}
      .content-header{position: absolute;}
      #page-heading-text-wrapper{width: 1024px;margin: auto;}
      #page-heading-text{background-color: none;width: 1024px;height: 100%;margin: auto;padding-top: 25px;position: absolute;display: inline-block;color: white;padding-left:10px;}
    .fullwidth-content{width: 1000px;height: 100%;background-color: none;display: flex;display: -webkit-flex;flex-wrap: wrap;justify-content: space-between;}
      #gioithieu{width: 500px;}
      .item-box-homepage{background-color: none;width: 230px;margin: 5px;}
      #slideshow{width: 1000px;background-color: none;}
    /*lien he*/
    .halfwidth{width: 1024px;background-color: none;display: inline-block;}
      #thong-tin-hoa-don{border: 2px #ED2E2E solid;font-size: 14px;padding-top: 5px;padding-bottom: 5px;}
      #thong-tin-hoa-don-title{text-align: center;font-weight: bolder;font-size: 20px;}
      .thong-tin-hoa-don-field{font-weight: bold;width: 19%;display: inline-block;padding-left: 2%;font-style: italic;}
      .thong-tin-hoa-don-data{font-weight:normal;;text-align: left;width: 78%;display: inline-block;font-size: 15px;}
    .full a:hover{background-color: white;}
    #content{width:1024px;background-color: white;margin: auto;overflow: hidden;margin-top: 30px;}
      #side-menu{background-color: rgba(0, 0, 0, 0.1);display: inline-block;width: 294px;float: left;margin-top: 12px;min-height: 675px;}
        #side-menu-header{font-weight: bolder;height: 50px !important;display: flex;display: -webkit-flex;align-items: center;justify-content: center;color:white;font-size: 15px;background-color: #2e2e2e;}
        .side-menu_a:visited, .side-menu_a:link, .side-menu_a:active{text-decoration: none;color: rgba(0, 0, 0, 0.6);}
        #side-menu div{height: 30px;}
        #side-menu li>*{color: #313131;font-size: 15px;}
        #side-menu li>*:hover{color: #ED2E2E;font-size: 15px;}
        .menu-item{background-color: none;height: 15px;font-size: 20px;color: rgba(0, 0, 0, 0.8);}
        .menu-item:hover{color: #ED2E2E;}
      #main-content{background-color: none;display: inline-block;width: 724px;display: flex;display: -webkit-flex;flex-wrap: wrap;}

      #main-content a:hover{background-color: white;}
        .item-detail-container{width: 724px;background-color: none;position: relative;margin-left: 10px;padding-top: 12px;}
          .item-detail-image{width: 300px;height: 300px;background-color: none;display: inline-block;float: left;}
          .item-detail-info{width: 400px;background-color: none;display:inline-block;}
            .item-detail-info-title{width: 100%;height: 100px;background-color: none;font-weight: bolder;font-size: 25px;text-align: left;color: #2E2E2E;padding-left: 20px;}
            .item-detail-info-price{width: 100%;background-color: none;padding-left: 20px; color:#777777;font-weight: bolder;font-size: 25px;}
              .price-title{color: #222222;display: inline-block;}
              .price{color: #ED2E2E;display: inline-block;}
            .item-detail-info-description{width: 100%;background-color: none;padding-left: 20px;color: #2E2E2E;font-size: 20px;}
        .fullwidth-content a:hover{background-color: white;}
        /*san-pham*/
        .item-box{background-color: none;width: 210px;height: 235px;border: 2px rgba(239, 239, 239, 0.9) solid;margin: 10px;overflow: hidden;}
          .item-img-border{width: 100%;height: 85%;overflow: hidden;}
          .item-img{width: 100%;height: 100%;background-color: none;transition: 0.5s;display: flex;display: -webkit-flex;justify-content: center;align-items: center;background-size: cover;}
          .item-img:hover{transform: scale(1.25);}
          .item-name{width: 100%;height: 15%;background-color: rgba(0, 0, 0, 0.1);color: #313131;font-weight: bolder;display: flex;display: -webkit-flex;justify-content: center;align-items: center;font-size: 15px;text-align: center;}
          .item-name:hover{color: #ED2E2E;}
        /*doi-tac*/

        @keyframes newanimation {
          0% {border: 5px #ED2E2E solid;}
          60% {border: 5px #222222 solid;}
        }
        .doitac-box{background-color: none;width: 210px;height: 220px;border: 2px rgba(239, 239, 239, 0.9) solid;margin: 10px;overflow: hidden;padding: 5px;position: relative; cursor: pointer;box-sizing: border-box;}
          .doitac-img-border{width: 85%;height: 75%;overflow: hidden;margin:auto;animation-name: newanimation;animation-duration: 1.5s;animation-iteration-count:infinite;border: 5px #ED2E2E solid;}
          .doitac-img{width: 100%;height: 100%;background-color: none;transition: 0.5s;display: flex;display: -webkit-flex;justify-content: center;align-items: center;background-size: cover;}
          .doitac-img:hover{transform: rotate(10deg) scale(1.15);}
          .doitac-name{width: 90%;height: 30px;margin-left: 5%;background-color: rgba(0, 0, 0, 0.1);color: black;font-weight: bolder;display: flex;display: -webkit-flex;justify-content: center;align-items: center;}
          .doitac-name:hover{color: #ED2E2E;}

        #ban-do{width: 1000px; height: 700px;}

      #post-title{background-color: none;}
      #post-content{background-color: lime;}
    #footer{width: 100%;height: 350px;background-color: rgba(17, 17, 15, 0.9);margin: auto;color: white;text-align: center;}
      #footer-wrapper{width: 100%;overflow: hidden;height: 300px;}
      #footer-left{background-color:none;width: 34%;height: 300px;display: inline-block;float: left;border-radius: 10px;margin-top: 10px;position: relative;}
        #footer-left-title{text-align: left;font-weight: bold;font-size: 20px;}
        #facebook-box{border: 1px white solid; background-color: white;width: 450;margin-top: 20px;overflow: hidden;}
        #footer-left-counter{color:white; display: flex;display: -webkit-flex;align-items:flex-start; margin-top: 20px;flex-direction: column;position: absolute;bottom: 80px;}
        #counter-title{font-weight: bolder;}
        #counter-number{margin-top: 10px;}
        #copyright{ margin-top: 20px;position: absolute;bottom: 30px;}
      #footer-right{background-color:none ;width: 59%;height: 300px;display: inline-block;margin-left: 1%;}
        #mini-nav{display: flex;display: -webkit-flex;flex-wrap: nowrap;color: white; background-color: none;justify-content: space-between;margin-top: 10px;}
        #mini-nav div {background-color: none;border-left: 1px white solid;border-right: 1px white solid;width: 25%;}
        #mini-nav a {color: white;font-weight: bold;font-size: 20px;}
        #mini-nav a:hover{background-color: transparent;color: #ED2E2E;}
        #mini-address h3{text-align: left;}
        #mini-address p{text-align: left;}
        #mini-info h3{text-align: left;}
        #mini-info div{display: flex;display: -webkit-flex;flex-wrap: nowrap;color: white; background-color: none;justify-content: space-between;}
  }

  /*tablet*/
  @media only screen and (max-width: 800px) {
    a:hover, a:visited, a:link, a:active{text-decoration: none;color: red;}
    a:hover{background-color: #ED2E2E;}
    /*rgba(105, 0, 31, 1);*/
    h1{color:#2e2e2e;}
    #content div p{font-size: 20px;}
    #gioi-thieu::first-letter {font-size: 35px;font-weight: bolder;}
    #gioi-thieu{width: 1000px;}
    li{font-size: 15px;color: #313131;background-color: none;}
    ul{list-style: square outside url("");}

    body{overflow-x: hidden;background-color: white;}
    #debug{display: block;}
    #wrapper{width: 1024px;background-color: white;position: static;}
    #addition-bar{width: 100vw;height: 5px;background-color: #222222}
    #topbar{width: 100vw;height: 50px;background-color: #222222;margin: auto;display: -webkit-flex;display: flex;flex-direction: row;position: relative;}
      #shape{z-index: 0}
      #shapebg{position: absolute;z-index: 1;width: 51vw;height: 0px;}
      #topbar-wrap{width: 1024px;height: 50px;background-color: #222222;margin: auto;z-index: 2;overflow: hidden;}
        #info-bar{width: 400px;height: 50px;background-color: none;z-index: 4;position: absolute;left: 50%;display: flex;display: -webkit-flex; flex-wrap: nowrap;justify-content: center;align-items: center;}
          #lang-bar{width: 100px;height: 30px;background-color: none;display: flex;display: -webkit-flex;justify-content: space-around;}
          #search-bar{width: 350px;height: 30px;background-color: none;display: flex;display: -webkit-flex;justify-content: space-around;}
            #search-text{width: 350px;height: 28px;border: none;}
          #social-bar{width: 100px;height: 30px;background-color: none;display: flex;display: -webkit-flex;justify-content: space-around;align-items: center;}
    #header{width: 1024px;height: 160px;background-color: none;margin: auto;position: relative;}
      #logo{float: left;width: 350px;height: 128px;background-color: none;background-image: url('/img/logo/logo.png');background-repeat: no-repeat;background-position: center;background-size: cover;}
      #banner{height: 128px;background-color: white;align-content: center;text-align: center;display: -webkit-flex;display: flex;flex-direction: row;margin: auto;}
        #slogan{background-color: none;width:820px;height: 50px;margin-top: 50px;display: block;font-size: 20px;font-weight: bold;color: black;display: flex;display: -webkit-flex;justify-content: space-around;}
        #slogan p{background-color: none;overflow: hidden;height: 35px;font-size: 15px;text-align: left;border-left: 1px #313131 solid;color: #313131;padding-left: 5px;line-height: 1 !important;}
    #topnav-wrap{background-color: #222222;width:100%;height: 63px;margin: auto;}
      #diviser-home{background-color: ;width:50px;}
      #diviser-other{background-color: none;width: 974px;display: flex;display: -webkit-flex;}
    .sticky {position: fixed;top: 0;max-height: 50px;z-index: 2;height: 200px;}
    .small{height: 50px;}
      #topnav{background-color: none;height: 100%;width: 1024px;margin: auto;display: -webkit-flex;display: flex;position:relative;}
      .topnav_a{background-color:none;height: 100%;text-align: center;width: 100%;display: -webkit-flex;display: flex;align-items: center;justify-content: center;color: white;}
      .active{background-color: #ED2E2E;}
        #home-icon{border: 1px white solid;}
      .big-button{width: 25%;background-color: none;}
      .nav-item-icon{background-color:white;height: 100%;text-align: center;width: 100%;display: -webkit-flex;display: flex;align-items: center;justify-content: center;color: white;overflow: hidden;}
      .nav-item-icon:hover{background-color: #E8C248}
      .nav-item{width: 100%;border-left: 1px white solid;font-size: 18px;}
      .big-button:last-child .nav-item {border-right: 1px white solid;}
      .submenu{display: none;background: rgba(0, 0, 0, 0.9);width: 100%;position: absolute;top:63px;z-index: 10;box-sizing: border-box;overflow: hidden;border: 1px #e1e1e1 solid;left: 0px;}
      .submenustick{display: none;background: rgba(0, 0, 0, 0.9);width: 1024px;position: absolute;top:50px;z-index: 10;}
        .mega-container{border: 0px white solid;flex: 2;}
          .mega-container a{height:20px;}
          .mega-cat{color: white;font-size: 20px;font-weight: bold;padding: 10px;border: 0px white solid;text-align: center;border-bottom: 1px white solid;border-left: 1px white solid;margin-left: -1px;}
          .mega-type{color: white;font-size: 15;font-weight: lighter;padding: 10px;}
          .mega-type:hover{background-color: #E8C248;}
          /*new*/
          #submenu-left{width: 28.5%; background-color:white ;padding-left: 3.3%;}
          #submenu-left2{width: 28.5%; background-color:white ;padding-left: 3.3%;}
            .submenu-left-cat{width: 90%;height: 40px;background-color: #e5e5e5;margin: 5%;display: flex;justify-content: center;align-items: center;cursor: pointer;font-size: 15px;}
            .submenu-left-cat:hover{background-color: #ED2E2E;}
          #submenu-right{width: 75%;background-color: white;}
          #submenu-right2{width: 75%;background-color: white;}
            .submenu_a{color: #313131 !important;}
            .submenu_a:hover{background-color: transparent;}
            .submenu-item-wrapper{width: 192px;height: 232px;background-color: none;display: inline-block;margin:10px;overflow: hidden;}
            .submenu-item-wrapper:hover{animation-name: light-zoom;animation-duration: 1s;transform: scale(1.04);}
            @keyframes light-zoom {
              0% {transform: scale(1);}
              50% {transform: scale(1.06);}
              100% {transform: scale(1.04);}
            }
            .submenu-item-wrapper:hover .submenu-item-name{color: #ED2E2E;}
            .submenu-item-img-img{width: 100%;height: 100%;}
            .submenu-item-name{background-color: #e5e5e5;width: 192px;height: 40px;color: #313131;display: flex;display: -webkit-flex;justify-content: center;align-items: center;font-size: 17px;}
      #sanpham-big-button a{color: white;font-weight: bolder;font-size: 20px;}
      #giaiphap-big-button a{color: white;font-weight: bolder;font-size: 20px;}
      #doitac-big-button a{color: white;font-weight: bolder;font-size: 20px;}
      #lienhe-big-button a{color: white;font-weight: bolder;font-size: 20px;}

      #sanpham-big-button:hover +#sanpham-submenu{display: flex;display: -webkit-flex;align-content:stretch;animation-name: showdrop;animation-duration: 0.1s;}
      #giaiphap-big-button:hover +#giaiphap-submenu{display: flex;display: -webkit-flex;animation-name: showdrop;animation-duration: 0.1s;}
      #doitac-big-button:hover +#doitac-submenu{display: flex;display: -webkit-flex;animation-name: showdrop;animation-duration: 0.1s;}

      #sanpham-submenu:hover {display: flex;display: -webkit-flex;animation-name: showdrop;animation-duration: 0.1s;}
      #giaiphap-submenu:hover {display: flex;display: -webkit-flex;animation-name: showdrop;animation-duration: 0.1s;}
      #doitac-submenu:hover {display: flex;display: -webkit-flex;animation-name: showdrop;animation-duration: 0.1s;}
      #lienhe-submenu:hover {display: flex;display: -webkit-flex;animation-name: showdrop;animation-duration: 0.1s;}
      @keyframes showdrop {
        0% {height: 0px;}
        1%   {height: 1px;top: 185px;}
        100% {height: 200px;top: 85px;}
      }
    #page-heading{width: 100%;height: 100px;margin:auto;font-size: 35px;font-weight: bolder;color: #2E2E2E;background-color:#f4f6f9;position: relative;text-shadow: -1px 2px #222222;}
      .content-header{position: absolute;}
      #page-heading-text-wrapper{width: 1024px;margin: auto;}
      #page-heading-text{background-color: none;width: 1024px;height: 100%;margin: auto;padding-top: 25px;position: absolute;display: inline-block;color: white;padding-left:10px;}
    .fullwidth-content{width: 1000px;height: 100%;background-color: none;display: flex;display: -webkit-flex;flex-wrap: wrap;justify-content: space-between;}
      #gioithieu{width: 500px;}
      .item-box-homepage{background-color: none;width: 430px;margin: 30px;}
      #slideshow{width: 1000px;background-color: none;}
    /*lien he*/
    .halfwidth{width: 1024px;background-color: none;display: inline-block;}
      #thong-tin-hoa-don{border: 2px #ED2E2E solid;font-size: 14px;padding-top: 5px;padding-bottom: 5px;}
      #thong-tin-hoa-don-title{text-align: center;font-weight: bolder;font-size: 20px;}
      .thong-tin-hoa-don-field{font-weight: bold;width: 19%;display: inline-block;padding-left: 2%;font-style: italic;}
      .thong-tin-hoa-don-data{font-weight:normal;;text-align: left;width: 78%;display: inline-block;font-size: 15px;}
    .full a:hover{background-color: white;}
    #content{width:1024px;background-color: white;margin: auto;overflow: hidden;margin-top: 30px;}
      #side-menu{background-color: rgba(0, 0, 0, 0.1);display: inline-block;width: 294px;float: left;margin-top: 12px;min-height: 675px;}
        #side-menu-header{font-weight: bolder;height: 50px !important;display: flex;display: -webkit-flex;align-items: center;justify-content: center;color:white;font-size: 15px;background-color: #2e2e2e;}
        .side-menu_a:visited, .side-menu_a:link, .side-menu_a:active{text-decoration: none;color: rgba(0, 0, 0, 0.6);}
        #side-menu div{height: 30px;}
        #side-menu li>*{color: #313131;font-size: 15px;}
        #side-menu li>*:hover{color: #ED2E2E;font-size: 15px;}
        .menu-item{background-color: none;height: 15px;font-size: 20px;color: rgba(0, 0, 0, 0.8);}
        .menu-item:hover{color: #ED2E2E;}
      #main-content{background-color: none;display: inline-block;width: 724px;display: flex;display: -webkit-flex;flex-wrap: wrap;}

      #main-content a:hover{background-color: white;}
        .item-detail-container{width: 724px;background-color: none;position: relative;margin-left: 10px;padding-top: 12px;}
          .item-detail-image{width: 300px;height: 300px;background-color: none;display: inline-block;float: left;}
          .item-detail-info{width: 400px;background-color: none;display:inline-block;}
            .item-detail-info-title{width: 100%;height: 100px;background-color: none;font-weight: bolder;font-size: 25px;text-align: left;color: #2E2E2E;padding-left: 20px;}
            .item-detail-info-price{width: 100%;background-color: none;padding-left: 20px; color:#777777;font-weight: bolder;font-size: 25px;}
              .price-title{color: #222222;display: inline-block;}
              .price{color: #ED2E2E;display: inline-block;}
            .item-detail-info-description{width: 100%;background-color: none;padding-left: 20px;color: #2E2E2E;font-size: 20px;}
        .fullwidth-content a:hover{background-color: white;}
        /*san-pham*/
        .item-box{background-color: none;width: 320px;height: 325px;border: 2px rgba(239, 239, 239, 0.9) solid;margin: 10px;overflow: hidden;}
          .item-img-border{width: 100%;height: 85%;overflow: hidden;}
          .item-img{width: 100%;height: 100%;background-color: none;transition: 0.5s;display: flex;display: -webkit-flex;justify-content: center;align-items: center;background-size: cover;}
          .item-img:hover{transform: scale(1.25);}
          .item-name{width: 100%;height: 15%;background-color: rgba(0, 0, 0, 0.1);color: #313131;font-weight: bolder;display: flex;display: -webkit-flex;justify-content: center;align-items: center;font-size: 15px;text-align: center;}
          .item-name:hover{color: #ED2E2E;}
        /*doi-tac*/

        @keyframes newanimation {
          0% {border: 5px #ED2E2E solid;}
          60% {border: 5px #222222 solid;}
        }
        .doitac-box{background-color: none;width: 210px;height: 220px;border: 2px rgba(239, 239, 239, 0.9) solid;margin: 10px;overflow: hidden;padding: 5px;position: relative; cursor: pointer;box-sizing: border-box;}
          .doitac-img-border{width: 85%;height: 75%;overflow: hidden;margin:auto;animation-name: newanimation;animation-duration: 1.5s;animation-iteration-count:infinite;border: 5px #ED2E2E solid;}
          .doitac-img{width: 100%;height: 100%;background-color: none;transition: 0.5s;display: flex;display: -webkit-flex;justify-content: center;align-items: center;background-size: cover;}
          .doitac-img:hover{transform: rotate(10deg) scale(1.15);}
          .doitac-name{width: 90%;height: 30px;margin-left: 5%;background-color: rgba(0, 0, 0, 0.1);color: black;font-weight: bolder;display: flex;display: -webkit-flex;justify-content: center;align-items: center;}
          .doitac-name:hover{color: #ED2E2E;}

        #ban-do{width: 1000px; height: 700px;}

      #post-title{background-color: none;}
      #post-content{background-color: lime;}
    #footer{width: 100%;height: 350px;background-color: rgba(17, 17, 15, 0.9);margin: auto;color: white;text-align: center;}
      #footer-wrapper{width: 100%;margin: auto;overflow: hidden;height: 300px;}
      #footer-left{background-color:none;width: 34%;height: 300px;display: inline-block;float: left;border-radius: 10px;margin-top: 10px;position: relative;}
        #footer-left-title{text-align: left;font-weight: bold;font-size: 20px;}
        #facebook-box{border: 1px white solid; background-color: white;width: 450;margin-top: 20px;overflow: hidden;}
        #footer-left-counter{color:white; display: flex;display: -webkit-flex;align-items:flex-start; margin-top: 20px;flex-direction: column;position: absolute;bottom: 80px;}
        #counter-title{font-weight: bolder;}
        #counter-number{margin-top: 10px;}
        #copyright{ margin-top: 20px;position: absolute;bottom: 30px;}
      #footer-right{background-color:none ;width: 59%;height: 300px;display: inline-block;margin-left: 1%;}
        #mini-nav{display: flex;display: -webkit-flex;flex-wrap: nowrap;color: white; background-color: none;justify-content: space-between;margin-top: 10px;}
        #mini-nav div {background-color: none;border-left: 1px white solid;border-right: 1px white solid;width: 25%;}
        #mini-nav a {color: white;font-weight: bold;font-size: 20px;}
        #mini-nav a:hover{background-color: transparent;color: #ED2E2E;}
        #mini-address h3{text-align: left;}
        #mini-address p{text-align: left;}
        #mini-info h3{text-align: left;}
        #mini-info div{display: flex;display: -webkit-flex;flex-wrap: nowrap;color: white; background-color: none;justify-content: space-between;}
  }

    /*ipad doc */
    @media only screen and (max-width: 768px) {
      a:hover, a:visited, a:link, a:active{text-decoration: none;color: red;}
      a:hover{background-color: #ED2E2E;}
      /*rgba(105, 0, 31, 1);*/
      h1{color:#2e2e2e;}
      #content div p{font-size: 20px;max-width: 740px;}
      #gioi-thieu::first-letter {font-size: 35px;font-weight: bolder;}
      #gioi-thieu{width: 768px;}
      li{font-size: 15px;color: #313131;background-color: none;}
      ul{list-style: square outside url("");}

      body{overflow-x: hidden;background-color: white;}
      #debug{display: block;}
      #wrapper{width: 767px;background-color: white;position: static;}
      #addition-bar{width: 100vw;height: 5px;background-color: #222222}
      #topbar{width: 100vw;height: 50px;background-color: #222222;margin: auto;display: -webkit-flex;display: flex;flex-direction: row;position: relative;}
        #shape{z-index: 0}
        #shapebg{position: absolute;z-index: 1;width: 51vw;height: 0px;}
        #topbar-wrap{width: 768px;height: 50px;background-color: #222222;margin: auto;z-index: 2;overflow: hidden;}
          #info-bar{width: 400px;height: 50px;background-color: none;z-index: 4;position: absolute;left: 50%;display: flex;display: -webkit-flex; flex-wrap: nowrap;justify-content: center;align-items: center;}
            #lang-bar{width: 50px;height: 30px;background-color: none;display: flex;display: -webkit-flex;justify-content: space-around;padding-right: 10px;}
              .lang_img{width: 30px; height: 20px; padding-top: 5px;padding-right: 5px;}
            #search-bar{width: 200px;height: 30px;background-color: none;display: flex;display: -webkit-flex;justify-content: space-around;}
              #search-text{width: 200px;height: 18px;border: none;margin-top: 3px;}
              .search_img{width: 25px;height: 25px;}
            #social-bar{width: 50px;height: 30px;background-color: none;display: flex;display: -webkit-flex;justify-content: space-around;align-items: center;}
      #header{width: 768px;height: 160px;background-color: none;margin: auto;position: relative;}
        #logo{float: left;width: 350px;height: 128px;background-color: none;background-image: url('/img/logo/logo.png');background-repeat: no-repeat;background-position: center;background-size: cover;}
        #banner{height: 128px;background-color: white;align-content: center;text-align: center;display: -webkit-flex;display: flex;flex-direction: row;margin: auto;display: none;}
          #slogan{background-color: none;width:820px;height: 50px;margin-top: 50px;display: block;font-size: 20px;font-weight: bold;color: black;display: flex;display: -webkit-flex;justify-content: space-around;}
          #slogan p{background-color: none;overflow: hidden;height: 35px;font-size: 15px;text-align: left;border-left: 1px #313131 solid;color: #313131;padding-left: 5px;}
      #topnav-wrap{background-color: #222222;height: 33px;margin: auto;width: 100%;}
      #nav-mobile{width: 100%;height: 0px;background-color: green;display: none;}
        .navbar{min-height: 55px !important;}
        #diviser-home{background-color: ;width:7%;box-sizing :initial !important;}
        #diviser-other{background-color: none;width: 93%;display: flex;display: -webkit-flex;}
      .sticky {position: fixed;top: 0;max-height: 50px;z-index: 2;height: 200px;}
      .small{height: 50px;}
        #topnav{background-color: none;height: 100%;width: 100%;margin: auto;display: -webkit-flex;display: flex;position:relative;}
        .topnav_a{background-color:none;height: 100%;text-align: center;width: 100%;display: -webkit-flex;display: flex;align-items: center;justify-content: center;color: white;}
        .active{background-color: #ED2E2E;}
          #home-icon{border: 1px white solid;}
        .big-button{width: 25%;background-color: none;}
        .nav-item-icon{background-color:white;height: 100%;text-align: center;width: 100%;display: -webkit-flex;display: flex;align-items: center;justify-content: center;color: white;overflow: hidden;}
        .nav-item-icon:hover{background-color: #E8C248}
        .nav-item{width: 100%;border-left: 1px white solid;font-size: 18px;}
        .big-button:last-child .nav-item {border-right: 1px white solid;}
        .submenu{display: none;background: rgba(0, 0, 0, 0.9);width: 768px;position: absolute;top:33px;z-index: 10;box-sizing: border-box;overflow: hidden;border: 1px #e1e1e1 solid;left: 0px;}
        .submenustick{display: none;background: rgba(0, 0, 0, 0.9);width: 768px;position: absolute;top:50px;z-index: 10;}
          .mega-container{border: 0px white solid;flex: 2;}
            .mega-container a{height:20px;}
            .mega-cat{color: white;font-size: 20px;font-weight: bold;padding: 10px;border: 0px white solid;text-align: center;border-bottom: 1px white solid;border-left: 1px white solid;margin-left: -1px;}
            .mega-type{color: white;font-size: 15;font-weight: lighter;padding: 10px;}
            .mega-type:hover{background-color: #E8C248;}
            /*new*/
            #submenu-left{width: 28.5%; background-color:white ;padding-left: 4.3%;text-align: center;}
            #submenu-left2{width: 28.5%; background-color:white ;padding-left: 4.3%;text-align: center;}
              .submenu-left-cat{width: 90%;height: 40px;background-color: #e5e5e5;margin: 5%;display: flex;justify-content: center;align-items: center;cursor: pointer;font-size: 15px;}
              .submenu-left-cat:hover{background-color: #ED2E2E;}
            #submenu-right{width: 75%;background-color: white;}
            #submenu-right2{width: 75%;background-color: white;max-height: 464px;overflow: scroll;}
              .submenu_a{color: #313131 !important;}
              .submenu_a:hover{background-color: transparent;}
              .submenu-item-wrapper{width: 192px;height: 232px;background-color: none;display: inline-block;margin:10px;overflow: hidden;}
              .submenu-item-wrapper:hover{animation-name: light-zoom;animation-duration: 1s;transform: scale(1.04);}
              @keyframes light-zoom {
                0% {transform: scale(1);}
                50% {transform: scale(1.06);}
                100% {transform: scale(1.04);}
              }
              .submenu-item-wrapper:hover .submenu-item-name{color: #ED2E2E;}
              .submenu-item-img-img{width: 100%;height: 100%;}
              .submenu-item-name{background-color: #e5e5e5;width: 192px;height: 40px;color: #313131;display: flex;display: -webkit-flex;justify-content: center;align-items: center;font-size: 17px;}
        #sanpham-big-button a{color: white;font-weight: bolder;font-size: 20px;}
        #giaiphap-big-button a{color: white;font-weight: bolder;font-size: 20px;}
        #doitac-big-button a{color: white;font-weight: bolder;font-size: 20px;}
        #lienhe-big-button a{color: white;font-weight: bolder;font-size: 20px;}

        #sanpham-big-button:hover +#sanpham-submenu{display: flex;display: -webkit-flex;align-content:stretch;animation-name: showdrop;animation-duration: 0.1s;}
        #giaiphap-big-button:hover +#giaiphap-submenu{display: flex;display: -webkit-flex;animation-name: showdrop;animation-duration: 0.1s;}
        #doitac-big-button:hover +#doitac-submenu{display: flex;display: -webkit-flex;animation-name: showdrop;animation-duration: 0.1s;}

        #sanpham-submenu:hover {display: flex;display: -webkit-flex;animation-name: showdrop;animation-duration: 0.1s;}
        #giaiphap-submenu:hover {display: flex;display: -webkit-flex;animation-name: showdrop;animation-duration: 0.1s;}
        #doitac-submenu:hover {display: flex;display: -webkit-flex;animation-name: showdrop;animation-duration: 0.1s;}
        #lienhe-submenu:hover {display: flex;display: -webkit-flex;animation-name: showdrop;animation-duration: 0.1s;}
        @keyframes showdrop {
          0% {height: 0px;}
          1%   {height: 1px;top: 185px;}
          100% {height: 200px;top: 85px;}
        }
      #page-heading{width: 100%;height: 80px;margin:auto;font-size: 35px;font-weight: bolder;color: #2E2E2E;background-color:#f4f6f9;position: relative;text-shadow: -1px 2px #222222;}
        .content-header{position: absolute;}
        #page-heading-text-wrapper{width: 100%;margin: auto;}
        #page-heading-text{background-color: none;width: 768px;height: 100%;margin: auto;padding-top: 25px;position: absolute;display: inline-block;color: white;padding-left:10px;}
      .fullwidth-content{width: 760px;height: 100%;background-color: none;display: flex;display: -webkit-flex;flex-wrap: wrap;justify-content: space-between;}
        #gioithieu{width: 760px;background-color: none}
        .item-box-homepage{background-color: none;width: 230px;margin: 5px;}
        #slideshow{width: 760px;background-color: none;display: none;}
      /*lien he*/
      .halfwidth{width: 768px;background-color: none;display: inline-block;}
        #thong-tin-hoa-don{border: 2px #ED2E2E solid;font-size: 14px;padding-top: 5px;padding-bottom: 5px;}
        #thong-tin-hoa-don-title{text-align: center;font-weight: bolder;font-size: 20px;}
        .thong-tin-hoa-don-field{font-weight: bold;width: 19%;display: inline-block;padding-left: 2%;font-style: italic;}
        .thong-tin-hoa-don-data{font-weight:normal;;text-align: left;width: 78%;display: inline-block;font-size: 15px;}
      .full a:hover{background-color: white;}
      #content{width:768px;background-color: white;margin: auto;overflow: hidden;margin-top: 30px;}
        /* .search-result{width: 100%;background-color: red;} */
        #searh_result_page{background-color: red;}
        #side-menu{background-color: rgba(0, 0, 0, 0.1);display: inline-block;width: 294px;float: left;margin-top: 12px;display: none;}
          #side-menu-header{font-weight: bolder;height: 50px !important;display: flex;display: -webkit-flex;align-items: center;justify-content: center;color:white;font-size: 15px;background-color: #2e2e2e;}
          .side-menu_a:visited, .side-menu_a:link, .side-menu_a:active{text-decoration: none;color: rgba(0, 0, 0, 0.6);}
          #side-menu div{height: 30px;}
          #side-menu li>*{color: #313131;font-size: 15px;}
          #side-menu li>*:hover{color: #ED2E2E;font-size: 15px;}
          .menu-item{background-color: none;height: 15px;font-size: 20px;color: rgba(0, 0, 0, 0.8);}
          .menu-item:hover{color: #ED2E2E;}
        #main-content{background-color: none;display: inline-block;width: 765px;display: flex;display: -webkit-flex;flex-wrap: wrap;padding-bottom: 50px;}

        #main-content a:hover{background-color: white;}
          .item-detail-container{width: 724px;background-color: none;position: relative;margin-left: 10px;padding-top: 12px;}
            .item-detail-image{width: 300px;height: 300px;background-color: none;display: inline-block;float: left;}
            .item-detail-info{width: 400px;background-color: none;display:inline-block;}
              .item-detail-info-title{width: 100%;height: 100px;background-color: none;font-weight: bolder;font-size: 25px;text-align: left;color: #2E2E2E;padding-left: 20px;}
              .item-detail-info-price{width: 100%;background-color: none;padding-left: 20px; color:#777777;font-weight: bolder;font-size: 25px;}
                .price-title{color: #222222;display: inline-block;}
                .price{color: #ED2E2E;display: inline-block;}
              .item-detail-info-description{width: 100%;background-color: none;padding-left: 20px;color: #2E2E2E;font-size: 20px;}
          .fullwidth-content a:hover{background-color: white;}
          /*san-pham*/
          .item-box{background-color: none;width: 225px;height: 235px;border: 2px rgba(239, 239, 239, 0.9) solid;margin-right:5px;overflow: hidden;}
            .item-img-border{width: 100%;height: 85%;overflow: hidden;}
            .item-img{width: 100%;height: 100%;background-color: none;transition: 0.5s;display: flex;display: -webkit-flex;justify-content: center;align-items: center;background-size: cover;}
            .item-img:hover{transform: scale(1.25);}
            .item-name{width: 100%;height: 15%;background-color: rgba(0, 0, 0, 0.1);color: #313131;font-weight: bolder;display: flex;display: -webkit-flex;justify-content: center;align-items: center;font-size: 15px;text-align: center;}
            .item-name:hover{color: #ED2E2E;}
          /*doi-tac*/

          @keyframes newanimation {
            0% {border: 5px #ED2E2E solid;}
            60% {border: 5px #222222 solid;}
          }
          .doitac-box{background-color: none;width: 215px;height: 225px;border: 2px rgba(239, 239, 239, 0.9) solid;margin: 10px;overflow: hidden;padding: 5px;position: relative; cursor: pointer;box-sizing: border-box;}
            .doitac-img-border{width: 85%;height: 75%;overflow: hidden;margin:auto;animation-name: newanimation;animation-duration: 1.5s;animation-iteration-count:infinite;border: 5px #ED2E2E solid;}
            .doitac-img{width: 100%;height: 100%;background-color: none;transition: 0.5s;display: flex;display: -webkit-flex;justify-content: center;align-items: center;background-size: cover;}
            .doitac-img:hover{transform: rotate(10deg) scale(1.15);}
            .doitac-name{width: 90%;height: 30px;margin-left: 5%;background-color: rgba(0, 0, 0, 0.1);color: black;font-weight: bolder;display: flex;display: -webkit-flex;justify-content: center;align-items: center;}
            .doitac-name:hover{color: #ED2E2E;}

          #ban-do{width: 765px; height: 400px;}

        #post-title{background-color: none;}
        #post-content{background-color: lime;}
      #footer{width: 100%;height: 440px;background-color: rgba(17, 17, 15, 0.9);color: white;text-align: center;}
        #footer-wrapper{width: 100%;margin: auto;overflow: hidden;height: 400px;}
        #footer-left{background-color:none;width: 100%;height: 100px;border-radius: 10px;margin-top: 10px;position: relative;}
          #footer-left-title{text-align: left;font-weight: bold;font-size: 20px;}
          #facebook-box{width: 61%;background-color: none;position: absolute;top:10px;left: 0px;}
          #footer-left-counter{width: 30%;background-color: none;position: absolute;top:-20px;right: 0px;height: 50px;}
          #counter-title{font-weight: bolder;}
          #counter-number{margin-top: 10px;}
          #copyright{ margin-top: 20px;position: absolute;bottom: 10px;}
        #footer-right{background-color:none ;width: 100%;height: 300px;}
          #mini-nav{display: flex;display: -webkit-flex;flex-wrap: nowrap;color: white; background-color: none;justify-content: space-between;margin-top: 5px;}
          #mini-nav div {background-color: none;border-left: 1px white solid;border-right: 1px white solid;width: 25%;}
          #mini-nav a {color: white;font-weight: bold;font-size: 20px;}
          #mini-nav a:hover{background-color: none;color: #ED2E2E;}
          #mini-address h3{text-align: left;background-color: none;}
          #mini-address p{text-align: left;background-color: none;}
          #mini-info h3{text-align: left;background-color: none}
          #mini-info div{display: flex;display: -webkit-flex;flex-wrap: nowrap;color: white; background-color: none;justify-content: space-between;padding-right: 35px;}
    }

          /*mobile ngang */
          @media only screen and (max-width: 640px) {
            a:hover, a:visited, a:link, a:active{text-decoration: none;color: red;}
            a:hover{background-color: #ED2E2E;}
            /*rgba(105, 0, 31, 1);*/
            h1{color:#2e2e2e;}
            #content div p{font-size: 20px;max-width: 100%;}
            #gioi-thieu::first-letter {font-size: 35px;font-weight: bolder;}
            #gioi-thieu{width: 100%;}
            li{font-size: 15px;color: #313131;background-color: none;}
            ul{list-style: square outside url("");}

            body{overflow-x: hidden;background-color: white;}
            #debug{display: block;}
            #wrapper{width: 100%;background-color: none;position: static;overflow: hidden;}
            #addition-bar{width: 100%;height: 5px;background-color: #222222}
            #topbar{width: 100%;height: 50px;background-color: #222222;margin: auto;display: -webkit-flex;display: flex;flex-direction: row;position: relative;display: none;}
              #shape{z-index: 0}
              #shapebg{position: absolute;z-index: 1;width: 51vw;height: 0px;}
              #topbar-wrap{width: 100%;height: 50px;background-color: #222222;margin: auto;z-index: 2;overflow: hidden;}
                #info-bar{width: 400px;height: 50px;background-color: none;z-index: 4;position: absolute;left: 50%;display: flex;display: -webkit-flex; flex-wrap: nowrap;justify-content: center;align-items: center;}
                  #lang-bar{width: 50px;height: 30px;background-color: none;display: flex;display: -webkit-flex;justify-content: space-around;padding-right: 10px;}
                    .lang_img{width: 30px; height: 20px; padding-top: 5px;padding-right: 5px;}
                  #search-bar{width: 200px;height: 30px;background-color: none;display: flex;display: -webkit-flex;justify-content: space-around;}
                    #search-text{width: 200px;height: 18px;border: none;margin-top: 3px;}
                    .search_img{width: 25px;height: 25px;}
                  #social-bar{width: 50px;height: 30px;background-color: none;display: flex;display: -webkit-flex;justify-content: space-around;align-items: center;}
            #header{width: 100%;height: 100px;background-color: none;margin: auto;position: relative;}
              #logo{width: 70%;height: 70px;background-color: none;background-image: url('/img/logo/logo.png');background-repeat: no-repeat;background-position: center;background-size: cover;padding-top: 20px;}
              #banner{width: 100%height: 128px;background-color: white;align-content: center;text-align: center;display:none;}
                #slogan{background-color: none;width:100%;height: 50px;margin-top: 50px;display: block;font-size: 20px;font-weight: bold;color: black;display: flex;display: -webkit-flex;justify-content: space-around;}
                #slogan p{background-color: none;overflow: hidden;height: 35px;font-size: 15px;text-align: left;border-left: 1px #313131 solid;color: #313131;padding-left: 5px;}
            #topnav-wrap{background-color: red;width:100vw;height: 33px;margin: auto;display: none;}
            /*NAV*/
            #nav-mobile{color: #313131;position: relative;cursor: pointer;display: block;z-index: 10;width: 100%;height: 30px;background-color: #222222;}
            #status{display: none;}
            #mobile-search{position: absolute;top: 4.5px;left: 4px;z-index: 11;height: 20px;width: 70%;}
            #mobile-search-button{position: absolute;top: 8px;right: 55px;background-image: url("/img/search.png");height: 18px;width: 18px;background-repeat: no-repeat;background-size: cover;}
            #mobile-fb-button{width: 10px;height: 18px;position: absolute;top: 8px;right: 35px;}
            #open-button{width: 30px;height: 30px;background-color: #222222;position: absolute;top: 0px;right: 0px;text-align: center;cursor: pointer;color: white;display: flex;display: -webkit-flex;justify-content: center;align-items: center;z-index: 12;}
            #close-button{border: 1px #dddddd solid;width: 100px;font-size: 15px;height: 25px;background-color: #EEEEEE;color: #313131;padding-top: 5px;}
            label +#menu-content label {width: 100%;height: 30px;background-color: #F7F7F7;color: #ED2E2E;opacity: 0;font-weight: bolder;position: absolute;bottom: 0px;left: 0px;-webkit-transition: opacity 0.5s;transition: opacity 0.5s;transition-delay: 0.5s;text-align: center;display: flex;display: -webkit-flex;justify-content: center;align-items: center;}
            #status:checked +label +#menu-content{height: 395px;}
            #status:checked +label +#menu-content label {opacity: 100;}
            #menu-content{width: 100%;height: 0px;background-color: white;overflow: hidden;-webkit-transition: height .5s;transition: height .5s;position: absolute;top:30px;left: 0px;border: 1px #313131 solid;}
            #menu-content a div{display: flex;display: -webkit-flex;align-items: center;}
            .parent-active{color: #ED2E2E!important;}
            .child-active{color: #ED2E2E !important;}
            .parent-list{color: #313131;width: 100%;height: 30px;background-color: #EEEEEE;padding: 3px;padding-left: 10px;font-weight: bold;border-top:1px #E0E0E0 solid;display: flex;display: -webkit-flex;align-items: center;}
            .parent-list:hover{color: #ED2E2E}
            .child-list{color: #313131;width: 100%;height: 25px;background-color: #F7F7F7;padding: 2px;padding-left: 20px;font-size: 14px;}
            .child-list:hover{color: #ED2E2E}
            /*NAV */
              .navbar{min-height: 55px !important;}
              #diviser-home{background-color: ;width:60px;box-sizing :initial !important;}
              #diviser-other{background-color: none;width: 974px;display: flex;display: -webkit-flex;}
            .sticky {position: fixed;top: 0;max-height: 50px;z-index: 2;height: 200px;}
            .small{height: 50px;}
              #topnav{background-color: none;height: 100%;width: 100%;margin: auto;display: -webkit-flex;display: flex;position:relative;}
              .topnav_a{background-color:none;height: 100%;text-align: center;width: 100%;display: -webkit-flex;display: flex;align-items: center;justify-content: center;color: white;}
              .active{background-color: #ED2E2E;}
                #home-icon{border: 1px white solid;}
              .big-button{width: 25%;background-color: none;}
              .nav-item-icon{background-color:white;height: 100%;text-align: center;width: 100%;display: -webkit-flex;display: flex;align-items: center;justify-content: center;color: white;overflow: hidden;}
              .nav-item-icon:hover{background-color: #E8C248}
              .nav-item{width: 100%;border-left: 1px white solid;font-size: 18px;}
              .big-button:last-child .nav-item {border-right: 1px white solid;}
              .submenu{display: none;background: rgba(0, 0, 0, 0.9);width: 100%;position: absolute;top:33px;z-index: 10;box-sizing: border-box;overflow: hidden;border: 1px #e1e1e1 solid;left: 0px;}
              .submenustick{display: none;background: rgba(0, 0, 0, 0.9);width: 100%;position: absolute;top:50px;z-index: 10;}
                .mega-container{border: 0px white solid;flex: 2;}
                  .mega-container a{height:20px;}
                  .mega-cat{color: white;font-size: 20px;font-weight: bold;padding: 10px;border: 0px white solid;text-align: center;border-bottom: 1px white solid;border-left: 1px white solid;margin-left: -1px;}
                  .mega-type{color: white;font-size: 15;font-weight: lighter;padding: 10px;}
                  .mega-type:hover{background-color: #E8C248;}
                  /*new*/
                  #submenu-left{width: 28.5%; background-color:white ;padding-left: 4.3%;text-align: center;}
                  #submenu-left2{width: 28.5%; background-color:white ;padding-left: 4.3%;text-align: center;}
                    .submenu-left-cat{width: 90%;height: 40px;background-color: #e5e5e5;margin: 5%;display: flex;justify-content: center;align-items: center;cursor: pointer;font-size: 15px;}
                    .submenu-left-cat:hover{background-color: #ED2E2E;}
                  #submenu-right{width: 75%;background-color: white;}
                  #submenu-right2{width: 75%;background-color: white;max-height: 464px;overflow: scroll;}
                    .submenu_a{color: #313131 !important;}
                    .submenu_a:hover{background-color: transparent;}
                    .submenu-item-wrapper{width: 192px;height: 232px;background-color: none;display: inline-block;margin:10px;overflow: hidden;}
                    .submenu-item-wrapper:hover{animation-name: light-zoom;animation-duration: 1s;transform: scale(1.04);}
                    @keyframes light-zoom {
                      0% {transform: scale(1);}
                      50% {transform: scale(1.06);}
                      100% {transform: scale(1.04);}
                    }
                    .submenu-item-wrapper:hover .submenu-item-name{color: #ED2E2E;}
                    .submenu-item-img-img{width: 100%;height: 100%;}
                    .submenu-item-name{background-color: #e5e5e5;width: 192px;height: 40px;color: #313131;display: flex;display: -webkit-flex;justify-content: center;align-items: center;font-size: 17px;}
              #sanpham-big-button a{color: white;font-weight: bolder;font-size: 20px;}
              #giaiphap-big-button a{color: white;font-weight: bolder;font-size: 20px;}
              #doitac-big-button a{color: white;font-weight: bolder;font-size: 20px;}
              #lienhe-big-button a{color: white;font-weight: bolder;font-size: 20px;}

              #sanpham-big-button:hover +#sanpham-submenu{display: flex;display: -webkit-flex;align-content:stretch;animation-name: showdrop;animation-duration: 0.1s;}
              #giaiphap-big-button:hover +#giaiphap-submenu{display: flex;display: -webkit-flex;animation-name: showdrop;animation-duration: 0.1s;}
              #doitac-big-button:hover +#doitac-submenu{display: flex;display: -webkit-flex;animation-name: showdrop;animation-duration: 0.1s;}

              #sanpham-submenu:hover {display: flex;display: -webkit-flex;animation-name: showdrop;animation-duration: 0.1s;}
              #giaiphap-submenu:hover {display: flex;display: -webkit-flex;animation-name: showdrop;animation-duration: 0.1s;}
              #doitac-submenu:hover {display: flex;display: -webkit-flex;animation-name: showdrop;animation-duration: 0.1s;}
              #lienhe-submenu:hover {display: flex;display: -webkit-flex;animation-name: showdrop;animation-duration: 0.1s;}
              @keyframes showdrop {
                0% {height: 0px;}
                1%   {height: 1px;top: 185px;}
                100% {height: 200px;top: 85px;}
              }
              #page-heading{width: 100%;height: 40px;margin:auto;font-size: 35px;font-weight: bolder;color: #2E2E2E;background-color:#f4f6f9;position: relative;text-shadow: -1px 2px #222222;}
                .content-header{position: absolute;}
                #page-heading-text-wrapper{width: 100%;margin: auto;}
                #page-heading-text{background-color: none;width: 100%;height: 100%;margin: auto;padding-top: 10px;position: absolute;display: inline-block;color: white;padding-left:10px;font-size: 20px;}
            .fullwidth-content{width: 100%;height: 100%;background-color: none;display: flex;display: -webkit-flex;flex-wrap: wrap;justify-content: space-between;}
              #gioithieu{width: 100%;background-color: red}
              .item-box-homepage{background-color: none;width: 40vw;margin: 5px;}
              #slideshow{width: 100%;background-color: none;display: none;}
            /*lien he*/
            .halfwidth{width: 100%;background-color: none;display: inline-block;}
            #thong-tin-hoa-don{border: 2px #ED2E2E solid;font-size: 14px;padding-top: 5px;padding-bottom: 5px;}
            #thong-tin-hoa-don-title{text-align: center;font-weight: bolder;font-size: 20px;}
            .thong-tin-hoa-don-field{font-weight: bolder;width: 25%;display: inline-block;padding-left: 2%;font-style: italic;font-size: 13px;}
            .thong-tin-hoa-don-data{font-weight:normal;text-align: center;width: 70%;display: inline-block;font-size: 13px;}
            .full a:hover{background-color: white;}
            #content{width:100%;background-color: white;margin: auto;overflow: hidden;margin-top: 30px;}
              #side-menu{background-color: rgba(0, 0, 0, 0.1);display: inline-block;width: 294px;float: left;margin-top: 12px;display: none;}
                #side-menu-header{font-weight: bolder;height: 50px !important;display: flex;display: -webkit-flex;align-items: center;justify-content: center;color:white;font-size: 15px;background-color: #2e2e2e;}
                .side-menu_a:visited, .side-menu_a:link, .side-menu_a:active{text-decoration: none;color: rgba(0, 0, 0, 0.6);}
                #side-menu div{height: 30px;}
                #side-menu li>*{color: #313131;font-size: 15px;}
                #side-menu li>*:hover{color: #ED2E2E;font-size: 15px;}
                .menu-item{background-color: none;height: 15px;font-size: 20px;color: rgba(0, 0, 0, 0.8);}
                .menu-item:hover{color: #ED2E2E;}
              #main-content{background-color: none;display: inline-block;width: 100%;display: flex;display: -webkit-flex;flex-wrap: wrap;padding-bottom: 50px;}

              #main-content a:hover{background-color: white;}
                .item-detail-container{width: 100%;background-color: none;position: relative;margin-left: 10px;padding-top: 12px;}
                  .item-detail-image{width: 40%;height: 300px;background-color: none;display: inline-block;float: left;}
                  .item-detail-info{width: 55%;background-color: none;display:inline-block;}
                    .item-detail-info-title{width: 100%;height: 100px;background-color: none;font-weight: bolder;font-size: 25px;text-align: left;color: #2E2E2E;padding-left: 20px;}
                    .item-detail-info-price{width: 100%;background-color: none;padding-left: 20px; color:#777777;font-weight: bolder;font-size: 25px;}
                      .price-title{color: #222222;display: inline-block;}
                      .price{color: #ED2E2E;display: inline-block;}
                    .item-detail-info-description{width: 100%;background-color: none;padding-left: 20px;color: #2E2E2E;font-size: 20px;}
                .fullwidth-content a:hover{background-color: white;}
                /*san-pham*/
                .item-box{background-color: none;width: 43vw;height: 240px;border: 2px rgba(239, 239, 239, 0.9) solid;margin-right:5px;overflow: hidden;}
                  .item-img-border{width: 100%;height: 85%;overflow: hidden;}
                  .item-img{width: 100%;height: 100%;background-color: none;transition: 0.5s;display: flex;display: -webkit-flex;justify-content: center;align-items: center;background-size: cover;}
                  .item-img:hover{transform: scale(1.25);}
                  .item-name{width: 100%;height: 15%;background-color: rgba(0, 0, 0, 0.1);color: #313131;font-weight: bolder;display: flex;display: -webkit-flex;justify-content: center;align-items: center;font-size: 15px;text-align: center;}
                  .item-name:hover{color: #ED2E2E;}
                /*doi-tac*/

                @keyframes newanimation {
                  0% {border: 5px #ED2E2E solid;}
                  60% {border: 5px #222222 solid;}
                }
                .doitac-box{background-color: none;width: 37vw;height: 155px;border: 2px rgba(239, 239, 239, 0.9) solid;margin: 5px;overflow: hidden;position: relative; cursor: pointer;box-sizing: border-box;}
                  .doitac-img-border{width: 85%;height: 75%;overflow: hidden;margin:auto;animation-name: newanimation;animation-duration: 1.5s;animation-iteration-count:infinite;border: 5px #ED2E2E solid;}
                  .doitac-img{width: 100%;height: 100%;background-color: none;transition: 0.5s;display: flex;display: -webkit-flex;justify-content: center;align-items: center;background-size: cover;}
                  .doitac-img:hover{transform: rotate(10deg) scale(1.15);}
                  .doitac-name{width: 90%;height: 30px;margin-left: 5%;background-color: rgba(0, 0, 0, 0.1);color: black;font-weight: bolder;display: flex;display: -webkit-flex;justify-content: center;align-items: center;}
                  .doitac-name:hover{color: #ED2E2E;}

                #ban-do{width: 765px; height: 400px;}

              #post-title{background-color: none;}
              #post-content{background-color: lime;}
              #footer{width: 100%;height: 580px;background-color: rgba(17, 17, 15, 0.9);color: white;text-align: center;}
                #footer-wrapper{width: 100%;overflow: hidden;height: 580px;}
                #footer-left{background-color:none;width: 100%;height: 230px;border-radius: 10px;margin-top: 10px;display: flex;display: -webkit-flex;}
                  #footer-left-title{text-align: left;font-weight: bold;font-size: 20px;}
                  #facebook-box{width: 100%;background-color: none;}
                  #footer-left-counter{width: 100%;background-color: none;position: absolute;top:90px;}
                  #counter-title{font-weight: bolder;}
                  #counter-number{margin-top: 10px;width: 30%;}
                  #copyright{position: absolute;top: 180px;}
                #footer-right{background-color:none ;width: 100%;height: 320px;}
                  #mini-nav{display: none;}
                  #mini-nav div {background-color: none;border-left: 1px white solid;border-right: 1px white solid;width: 25%;}
                  #mini-nav a {color: white;font-weight: bold;font-size: 20px;}
                  #mini-nav a:hover{background-color: none;color: #ED2E2E;}
                  #mini-address h3{text-align: left;background-color: none;height:10px; }
                  #mini-address p{text-align: left;background-color: none;max-width: 330px;}
                  #mini-info h3{text-align: left;background-color: none;height: 0px;}
                  #mini-info div{display: flex;display: -webkit-flex;flex-wrap: wrap;color: white;}
                  #mini-info div p{background-color: none;width: 100%;text-align: left;height: 0px;padding-left: 10px;}
          }

                /*mobile doc */
                @media only screen and (max-width: 360px) {
                  a:hover, a:visited, a:link, a:active{text-decoration: none;color: red;}
                  a:hover{background-color: #ED2E2E;}
                  /*rgba(105, 0, 31, 1);*/
                  h1{color:#2e2e2e;}
                  #content div p{font-size: 15px;max-width: 100%;padding-left: 5px;}
                  #gioi-thieu::first-letter {font-size: 35px;font-weight: bolder;}
                  #gioi-thieu{width: 100%;}
                  li{font-size: 15px;color: #313131;background-color: none;}
                  ul{list-style: square outside url("");}

                  body{overflow-x: hidden;background-color: white;}
                  #debug{display: block;}
                  #wrapper{width: 100%;background-color: white;position: static;}
                  #addition-bar{width: 100vw;height: 5px;background-color: #222222}
                  #topbar{width: 100vw;height: 50px;background-color: #222222;margin: auto;display: -webkit-flex;display: flex;flex-direction: row;position: relative;display: none;}
                    #shape{z-index: 0}
                    #shapebg{position: absolute;z-index: 1;width: 51vw;height: 0px;}
                    #topbar-wrap{width: 100%;height: 50px;background-color: #222222;margin: auto;z-index: 2;overflow: hidden;}
                      #info-bar{width: 400px;height: 50px;background-color: none;z-index: 4;position: absolute;left: 50%;display: flex;display: -webkit-flex; flex-wrap: nowrap;justify-content: center;align-items: center;}
                        #lang-bar{width: 50px;height: 30px;background-color: none;display: flex;display: -webkit-flex;justify-content: space-around;padding-right: 10px;}
                          .lang_img{width: 30px; height: 20px; padding-top: 5px;padding-right: 5px;}
                        #search-bar{width: 200px;height: 30px;background-color: none;display: flex;display: -webkit-flex;justify-content: space-around;}
                          #search-text{width: 200px;height: 18px;border: none;margin-top: 3px;}
                          .search_img{width: 25px;height: 25px;}
                        #social-bar{width: 50px;height: 30px;background-color: none;display: flex;display: -webkit-flex;justify-content: space-around;align-items: center;}
                  #header{width: 100%;height: 60px;background-color: none;margin: auto;position: relative;}
                    #logo{float: left;width: 50%;height: 40px;background-color: none;background-image: url('/img/logo/logo.png');background-repeat: no-repeat;background-position: center;background-size: cover;}
                    #banner{height: 128px;background-color: white;align-content: center;text-align: center;display: -webkit-flex;display: flex;flex-direction: row;margin: auto;display: none;}
                      #slogan{background-color: none;width:820px;height: 50px;margin-top: 50px;display: block;font-size: 20px;font-weight: bold;color: black;display: flex;display: -webkit-flex;justify-content: space-around;}
                      #slogan p{background-color: none;overflow: hidden;height: 35px;font-size: 15px;text-align: left;border-left: 1px #313131 solid;color: #313131;padding-left: 5px;}
                      #topnav-wrap{background-color: red;width:100vw;height: 33px;margin: auto;display: none;}
                      #nav-mobile{width: 100%;height: 30px;background-color: #222222;display: block;}
                        /*NAV*/
                        #nav-mobile{color: #313131;position: relative;cursor: pointer;display: block;z-index: 10;width: 100%;}
                        #status{display: none;}
                        #mobile-search{position: absolute;top: 4.5px;left: 4px;z-index: 11;height: 20px;width: 70%;}
                        #mobile-search-button{position: absolute;top: 8px;right: 55px;background-image: url("http://longthien.vn/img/search.png");height: 18px;width: 18px;background-repeat: no-repeat;background-size: cover;}
                        #mobile-fb-button{width: 10px;height: 18px;position: absolute;top: 8px;right: 35px;}
                        #open-button{width: 30px;height: 30px;background-color: #222222;position: absolute;top: 0px;right: 0px;text-align: center;cursor: pointer;color: white;display: flex;display: -webkit-flex;justify-content: center;align-items: center;z-index: 12;}
                        #close-button{border: 1px #dddddd solid;width: 100px;font-size: 15px;height: 25px;background-color: #EEEEEE;color: #313131;padding-top: 5px;}
                        label +#menu-content label {width: 100%;height: 30px;background-color: #F7F7F7;color: #ED2E2E;opacity: 0;font-weight: bolder;position: absolute;bottom: 0px;left: 0px;-webkit-transition: opacity 0.5s;transition: opacity 0.5s;transition-delay: 0.5s;text-align: center;display: flex;display: -webkit-flex;justify-content: center;align-items: center;}
                        #status:checked +label +#menu-content{height: 395px;}
                        #status:checked +label +#menu-content label {opacity: 100;}
                        #menu-content{width: 100%;height: 0px;background-color: white;overflow: hidden;-webkit-transition: height .5s;transition: height .5s;position: absolute;top:30px;left: 0px;border: 1px #313131 solid;}
                        #menu-content a div{display: flex;display: -webkit-flex;align-items: center;}
                        .parent-active{color: #ED2E2E!important;}
                        .child-active{color: #ED2E2E !important;}
                        .parent-list{color: #313131;width: 100%;height: 30px;background-color: #EEEEEE;padding: 3px;padding-left: 10px;font-weight: bold;border-top:1px #E0E0E0 solid;display: flex;display: -webkit-flex;align-items: center;}
                        .parent-list:hover{color: #ED2E2E}
                        .child-list{color: #313131;width: 100%;height: 25px;background-color: #F7F7F7;padding: 2px;padding-left: 20px;font-size: 14px;}
                        .child-list:hover{color: #ED2E2E}
                        /*NAV */
                    .navbar{min-height: 55px !important;}
                    #diviser-home{background-color: ;width:60px;box-sizing :initial !important;}
                    #diviser-other{background-color: none;width: 974px;display: flex;display: -webkit-flex;}
                  .sticky {position: fixed;top: 0;max-height: 50px;z-index: 2;height: 200px;}
                  .small{height: 50px;}
                    #topnav{background-color: none;height: 100%;width: 100%;margin: auto;display: -webkit-flex;display: flex;position:relative;}
                    .topnav_a{background-color:none;height: 100%;text-align: center;width: 100%;display: -webkit-flex;display: flex;align-items: center;justify-content: center;color: white;}
                    .active{background-color: #ED2E2E;}
                      #home-icon{border: 1px white solid;}
                    .big-button{width: 25%;background-color: none;}
                    .nav-item-icon{background-color:white;height: 100%;text-align: center;width: 100%;display: -webkit-flex;display: flex;align-items: center;justify-content: center;color: white;overflow: hidden;}
                    .nav-item-icon:hover{background-color: #E8C248}
                    .nav-item{width: 100%;border-left: 1px white solid;font-size: 18px;}
                    .big-button:last-child .nav-item {border-right: 1px white solid;}
                    .submenu{display: none;background: rgba(0, 0, 0, 0.9);width: 768px;position: absolute;top:33px;z-index: 10;box-sizing: border-box;overflow: hidden;border: 1px #e1e1e1 solid;left: 0px;}
                    .submenustick{display: none;background: rgba(0, 0, 0, 0.9);width: 768px;position: absolute;top:50px;z-index: 10;}
                      .mega-container{border: 0px white solid;flex: 2;}
                        .mega-container a{height:20px;}
                        .mega-cat{color: white;font-size: 20px;font-weight: bold;padding: 10px;border: 0px white solid;text-align: center;border-bottom: 1px white solid;border-left: 1px white solid;margin-left: -1px;}
                        .mega-type{color: white;font-size: 15;font-weight: lighter;padding: 10px;}
                        .mega-type:hover{background-color: #E8C248;}
                        /*new*/
                        #submenu-left{width: 28.5%; background-color:white ;padding-left: 4.3%;text-align: center;}
                        #submenu-left2{width: 28.5%; background-color:white ;padding-left: 4.3%;text-align: center;}
                          .submenu-left-cat{width: 90%;height: 40px;background-color: #e5e5e5;margin: 5%;display: flex;justify-content: center;align-items: center;cursor: pointer;font-size: 15px;}
                          .submenu-left-cat:hover{background-color: #ED2E2E;}
                        #submenu-right{width: 75%;background-color: white;}
                        #submenu-right2{width: 75%;background-color: white;max-height: 464px;overflow: scroll;}
                          .submenu_a{color: #313131 !important;}
                          .submenu_a:hover{background-color: transparent;}
                          .submenu-item-wrapper{width: 192px;height: 232px;background-color: none;display: inline-block;margin:10px;overflow: hidden;}
                          .submenu-item-wrapper:hover{animation-name: light-zoom;animation-duration: 1s;transform: scale(1.04);}
                          @keyframes light-zoom {
                            0% {transform: scale(1);}
                            50% {transform: scale(1.06);}
                            100% {transform: scale(1.04);}
                          }
                          .submenu-item-wrapper:hover .submenu-item-name{color: #ED2E2E;}
                          .submenu-item-img-img{width: 100%;height: 100%;}
                          .submenu-item-name{background-color: #e5e5e5;width: 192px;height: 40px;color: #313131;display: flex;display: -webkit-flex;justify-content: center;align-items: center;font-size: 17px;}
                    #sanpham-big-button a{color: white;font-weight: bolder;font-size: 20px;}
                    #giaiphap-big-button a{color: white;font-weight: bolder;font-size: 20px;}
                    #doitac-big-button a{color: white;font-weight: bolder;font-size: 20px;}
                    #lienhe-big-button a{color: white;font-weight: bolder;font-size: 20px;}

                    #sanpham-big-button:hover +#sanpham-submenu{display: flex;display: -webkit-flex;align-content:stretch;animation-name: showdrop;animation-duration: 0.1s;}
                    #giaiphap-big-button:hover +#giaiphap-submenu{display: flex;display: -webkit-flex;animation-name: showdrop;animation-duration: 0.1s;}
                    #doitac-big-button:hover +#doitac-submenu{display: flex;display: -webkit-flex;animation-name: showdrop;animation-duration: 0.1s;}

                    #sanpham-submenu:hover {display: flex;display: -webkit-flex;animation-name: showdrop;animation-duration: 0.1s;}
                    #giaiphap-submenu:hover {display: flex;display: -webkit-flex;animation-name: showdrop;animation-duration: 0.1s;}
                    #doitac-submenu:hover {display: flex;display: -webkit-flex;animation-name: showdrop;animation-duration: 0.1s;}
                    #lienhe-submenu:hover {display: flex;display: -webkit-flex;animation-name: showdrop;animation-duration: 0.1s;}
                    @keyframes showdrop {
                      0% {height: 0px;}
                      1%   {height: 1px;top: 185px;}
                      100% {height: 200px;top: 85px;}
                    }
                  #page-heading{width: 100%;height: 40px;margin:auto;font-size: 35px;font-weight: bolder;color: #2E2E2E;background-color:#f4f6f9;position: relative;text-shadow: -1px 2px #222222;}
                    .content-header{position: absolute;}
                    #page-heading-text-wrapper{width: 100%;margin: auto;}
                    #page-heading-text{background-color: none;width: 100%;height: 100%;margin: auto;padding-top: 5px;position: absolute;display: inline-block;color: white;padding-left:10px;font-size: 15px;}
                  .fullwidth-content{width: 100%;height: 100%;background-color: none;display: flex;display: -webkit-flex;flex-wrap: wrap;justify-content: space-between;}
                    #gioithieu{width: 100%;background-color: red;}
                    .item-box-homepage{background-color: none;width: 36vw;margin: 5px;}
                    #slideshow{width: 100%;background-color: none;display: none;}
                  /*lien he*/
                  .halfwidth{width: 100%;background-color: none;display: inline-block;}
                    #thong-tin-hoa-don{border: 2px #ED2E2E solid;font-size: 14px;padding-top: 5px;padding-bottom: 5px;}
                    #thong-tin-hoa-don-title{text-align: center;font-weight: bolder;font-size: 20px;}
                    .thong-tin-hoa-don-field{font-weight: bolder;width: 25%;display: inline-block;padding-left: 2%;font-style: italic;font-size: 11px;}
                    .thong-tin-hoa-don-data{font-weight:normal;text-align: center;width: 70%;display: inline-block;font-size: 11px;}
                  .full a:hover{background-color: white;}
                  #content{width:100%;background-color: white;margin: auto;overflow: hidden;margin-top: 0;}
                    #side-menu{background-color: rgba(0, 0, 0, 0.1);display: inline-block;width: 294px;float: left;margin-top: 12px;display: none;}
                      #side-menu-header{font-weight: bolder;height: 50px !important;display: flex;display: -webkit-flex;align-items: center;justify-content: center;color:white;font-size: 15px;background-color: #2e2e2e;}
                      .side-menu_a:visited, .side-menu_a:link, .side-menu_a:active{text-decoration: none;color: rgba(0, 0, 0, 0.6);}
                      #side-menu div{height: 30px;}
                      #side-menu li>*{color: #313131;font-size: 15px;}
                      #side-menu li>*:hover{color: #ED2E2E;font-size: 15px;}
                      .menu-item{background-color: none;height: 15px;font-size: 20px;color: rgba(0, 0, 0, 0.8);}
                      .menu-item:hover{color: #ED2E2E;}
                    #main-content{background-color: none;display: inline-block;width: 100%;display: flex;display: -webkit-flex;flex-wrap: wrap;padding-bottom: 50px;}

                    #main-content a:hover{background-color: white;}
                      .item-detail-container{width: 100%;background-color: none;position: relative;margin-left: 10px;padding-top: 12px;}
                        .item-detail-image{width: 40%;background-color: none;display: inline-block;float: left;}
                        .item-detail-info{width: 60%;background-color: none;display:inline-block;}
                          .item-detail-info-title{width: 100%;height: 30px;background-color: none;font-weight: bolder;font-size: 13px;text-align: left;color: #2E2E2E;padding-left: 5px;}
                          .item-detail-info-price{width: 100%;background-color: none;padding-left: 5px; color:#777777;font-weight: bolder;font-size: 13px;}
                            .price-title{color: #222222;display: inline-block;}
                            .price{color: #ED2E2E;display: inline-block;}
                          .item-detail-info-description{width: 100%;background-color: none;padding-left: 5px;color: #2E2E2E;font-size: 13px;}
                      .fullwidth-content a:hover{background-color: white;}
                      /*san-pham*/
                      .item-box{background-color: none;width: 37vw;height: 140px;border: 2px rgba(239, 239, 239, 0.9) solid;margin-right:5px;overflow: hidden;}
                        .item-img-border{width: 100%;height: 85%;overflow: hidden;}
                        .item-img{width: 100%;height: 100%;background-color: none;transition: 0.5s;display: flex;display: -webkit-flex;justify-content: center;align-items: center;background-size: cover;}
                        .item-img:hover{transform: scale(1.25);}
                        .item-name{width: 100%;height: 15%;background-color: rgba(0, 0, 0, 0.1);color: #313131;font-weight: bolder;display: flex;display: -webkit-flex;justify-content: center;align-items: center;font-size: 10px;text-align: center;}
                        .item-name:hover{color: #ED2E2E;}
                      /*doi-tac*/

                      @keyframes newanimation {
                        0% {border: 5px #ED2E2E solid;}
                        60% {border: 5px #222222 solid;}
                      }
                      .doitac-box{background-color: none;width: 36vw;height: 140px;border: 2px rgba(239, 239, 239, 0.9) solid;margin: 5px;overflow: hidden;position: relative; cursor: pointer;box-sizing: border-box;}
                        .doitac-img-border{width: 85%;height: 75%;overflow: hidden;margin:auto;animation-name: newanimation;animation-duration: 1.5s;animation-iteration-count:infinite;border: 5px #ED2E2E solid;}
                        .doitac-img{width: 100%;height: 100%;background-color: none;transition: 0.5s;display: flex;display: -webkit-flex;justify-content: center;align-items: center;background-size: cover;}
                        .doitac-img:hover{transform: rotate(10deg) scale(1.15);}
                        .doitac-name{width: 90%;height: 30px;background-color: rgba(0, 0, 0, 0.1);color: black;font-weight: bolder;display: flex;display: -webkit-flex;justify-content: center;align-items: center;text-align: center;font-size: 13px;}
                        .doitac-name:hover{color: #ED2E2E;text-align: center;font-size: 13px;}

                      #ban-do{width: 100vw; height: 50vh;}

                    #post-title{background-color: none;}
                    #post-content{background-color: lime;}
                  #footer{width: 100%;height: 620px;background-color: rgba(17, 17, 15, 0.9);color: white;text-align: center;}
                    #footer-wrapper{width: 100%;overflow: hidden;height: 620px;}
                    #footer-left{background-color:none;width: 100%;height: 230px;border-radius: 10px;margin-top: 10px;display: flex;display: -webkit-flex;}
                      #footer-left-title{text-align: left;font-weight: bold;font-size: 20px;}
                      #facebook-box{width: 100%;background-color: none;}
                      #footer-left-counter{width: 100%;background-color: none;position: absolute;top:90px;}
                      #counter-title{font-weight: bolder;}
                      #counter-number{margin-top: 10px;width: 30%;}
                      #copyright{position: absolute;top: 180px;}
                    #footer-right{background-color:none ;width: 100%;height: 320px;}
                      #mini-nav{display: none;}
                      #mini-nav div {background-color: none;border-left: 1px white solid;border-right: 1px white solid;width: 25%;}
                      #mini-nav a {color: white;font-weight: bold;font-size: 20px;}
                      #mini-nav a:hover{background-color: none;color: #ED2E2E;}
                      #mini-address h3{text-align: left;background-color: none;height:10px; }
                      #mini-address p{text-align: left;background-color: none;max-width: 330px;}
                      #mini-info h3{text-align: left;background-color: none;height: 0px;}
                      #mini-info div{display: flex;display: -webkit-flex;flex-wrap: wrap;color: white;}
                      #mini-info div p{background-color: none;width: 100%;text-align: left;height: 0px;padding-left: 10px;}
                }