@charset "UTF-8";
@media all and (max-width: 991px) {
  header {
    padding-top: 10px; }
    header .logo img {
      max-height: 40px; }
  .search-form {
    margin: 12px 0; }
  .main-bar {
    position: relative;
    border-bottom: solid 1px #eee }
    .main-bar .sm-static {
      position: static; }
  .menu-btn {
    display: inline-block;
    vertical-align: middle;
    width: 40px;
    height: 40px;
    border-radius: 100%;
    background: #ff5000;
    position: absolute;
    right: 15px;
    top: 50%;
    margin-top: -20px;
    z-index: 11; }
    .menu-btn i {
      display: block;
      margin: auto;
      border-top: solid 2px #fff;
      width: 17px;
      border-bottom: double 7px #fff;
      height: 12px; }
    .menu-btn.active i {
      width: auto;
      height: auto;
      border: none; }
      .menu-btn.active i:after, .menu-btn.active i:before {
        content: '';
        display: block;
        margin: auto;
        width: 17px;
        border-bottom: solid 2px #fff; }
      .menu-btn.active i:after {
        -webkit-transform: rotate(-45deg);
        transform: rotate(-45deg);
        margin-top: -2px; }
      .menu-btn.active i:before {
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg); }
  .main-nav {
    border-top: none;
    margin-top: 0;
    text-align: left; }
    .main-nav > ul {
      background: #FF5000;
      position: absolute;
      top: 100%;
      left: 0;
      right: 0;
      max-height: 95vh;
      overflow: auto;
      display: none;
      z-index: 2; }
      .main-nav > ul > li {
        float: none;
        display: block;
        margin: 0; }
        .main-nav > ul > li > a {
          display: block;
          padding: 10px 20px;
          border-top: solid 1px rgba(255, 255, 255, 0.2);
          font-size: 12px;
          color: #fff; }
          .main-nav > ul > li > a:not(:only-child):after {
            content: none; }
          .main-nav > ul > li > a:before, .main-nav > ul > li > a:after {
            content: none; }
        .main-nav > ul > li:hover > a {
          color: #fff; }
      .main-nav > ul ul {
        display: none;
        position: static;
        background: rgba(0, 0, 0, 0.1);
        -webkit-transition: none;
        transition: none;
        opacity: 1;
        pointer-events: all;
        margin: 0;
        padding: 0; }
        .main-nav > ul ul a {
          padding: 10px 20px 9px 40px;
          font-size: 12px;
          background: none;
          display: block;
          border-top: solid 1px rgba(255, 255, 255, 0.2);
          border-bottom: none; }
        .main-nav > ul ul ul {
          padding-left: 0; }
          .main-nav > ul ul ul a {
            padding-left: 60px; }
        .main-nav > ul ul li:hover > a {
          background: none; }
    .main-nav li i {
      width: 38px;
      height: 38px;
      float: right;
      font-size: 18px;
      line-height: 42px;
      text-align: center;
      top: 0;
      position: relative;
      z-index: 1;
      cursor: pointer;
      background: rgba(0, 0, 0, 0.15);
      font-style: normal;
      color: #fff; }
      .main-nav li i:after {
        font-family: "FontAwesome";
        content: ""; }
      .main-nav li i.active:after {
        content: "\f106"; }
  .category > ul {
    width: 230px;
    display: none; }
    .category ul li {
     height: auto; 
    }
    .category > ul > li > a { }
  .category li:hover > .sub {
    display: none; }
  .category .sub {
    display: block;
    position: static;
    -webkit-box-shadow: none;
            box-shadow: none;
    width: auto;
    padding: 0;
    display: none; }
    .category .sub ul {
    	max-height: 300px;
    overflow-y: scroll;
      display: none; }
      .category .sub ul li {
        display: block;
        margin-bottom: 0; }
        .category .sub ul li a {
          display: block;
          padding: 0px 15px;
          border-bottom: solid 1px #e1e1e1; }
    .category .sub .title {
      margin-bottom: 0; }
      .category .sub .title a {
        display: block;
        padding: 0px 15px;
        border-bottom: solid 1px #e1e1e1; }
    .category .sub .cate-drop {
      display: block;
      padding-top: 2px;
      height: 30px;
    line-height: 30px; }
  .category .cate-drop {
    height: 35px;
    line-height: 35px; }
  .item_foot {
    height: auto;
  }
  .h-foot .table {
    padding: 5px 15px;
    border-top: solid 1px #e1e1e1;
    border-right: none;
    border-left: none; }
    #slider .slick-list{
      margin: 0px;
      } }
@media all and (max-width: 767px) {
  .h-account {
    margin: 0 10px;
    font-size: 13px; }
  .h-ctrl {
    margin: 0 10px; }
  header {
    padding-bottom: 10px; }
    header .logo {
      max-width: 50%; }
  .sl-service .table {
    font-size: 0;
    display: block; }
  .sl-service .item {
    display: inline-block;
    vertical-align: top;
    text-align: left;
    width: 50%;
    font-size: 14px; }
    .attr-left{
      padding: 0;
    }
    .attr-right{
      padding: 0;
    }
    .title_attr{
    float: left;
    font-weight: bold;
    text-align: left;
    width: auto;
    text-transform: uppercase;
    font-size: 10px;
    margin-right: 10px;
     }
     .dathang{
      position: fixed;
      bottom: 0;
      z-index: 999999999999;
      width: 100%;
      left: 0;
      right: 0;
     }
     .dathang .gio-hang{
      width: 50%;
      display: inline-block;
      text-align: center;
      background: #c0c0c0;
      line-height: 45px;
      color: #fff;
      font-size: 14px;
      text-transform: uppercase;
      border: none;
     }
     .dathang .dat-hang{
      width: 50%;
      display: inline-block;
      text-align: center;
      background: #f40;
      line-height: 45px;
      color: #fff;
      font-size: 14px;
      text-transform: uppercase;
      border: none;
     }
     .button-close{
        right: 0;
        position: absolute;
        border: none;
        width: 25px;
        height: 25px;
        background: #ccc;
     }
     #myModal .panel-body{
      border: none;
      padding:15px;
     }
     .menu-tab ul li{
        margin: 5px 5px;
        border-radius: 3px;
        width: 45%;
     }
     .category.page-inside {
		    position: fixed;
		    display: inline-block;
		    top: 85px;
		    left: 7px;
		    z-index: 999;
		}
	.category.page-inside.fixed-page-inside {
	    top: 36px;
	}
		.category.page-inside .i-title i {
		    color: #fff;
		}

		.category.page-inside .i-title {
		    padding: 5px;
		}
      .category > ul {
      	    max-height: 500px;
    	overflow-y: scroll;
    	overflow-x: hidden;
      width: 270px; }
     img.video-product{
      top: 145px;
     }
     .sort-wr .sort span{
      width: 50%;
      display: inline-block;
     }
     .status-flash-sale:not(.v2){
      font-size: 14px;
     }
     .status-flash-sale .countdown{
      font-size: 14px;
     }
     .product .table .cell > strong{
      display: block;
      font-size: 15px;
     }
     .product .table .cell del strong{
      color: #7d7d7d;
      font-size: 12px;
     }
     .sinh-nhat{
      height: 70px;
      line-height: inherit;
     }
     .sinh-nhat .control-label {
        color: #fff;
        width: 100%;
        text-align: center !important;
        margin-top: 10px;
    }
    }
@media all and (max-width: 480px) {
  .h-account {
    margin: 0 10px; }
  .h-ctrl {
    margin: 0 10px; }
  .sl-service .item {
    width: 100%; } 
  .col-mar-10 > div[class^="col-"] {
      padding-left: 2px;
      padding-right: 2px;
  }
  .product .table strong {
        font-size: 13px;
        color: #FF5000; }
  .product .table .text-right{
    font-size: 12px;
  }
  .user-p .cart-order{
    margin: 0 auto;
    display: block;
    }
    .cart-info{
      margin-bottom: 10px;
    }
    .ic-search{
          width: 16px;
      height: 16px;
    }
    .h-ctrl{
      max-width: 40px !important;
    }
  }
@media all and (max-width: 419px){
  .flw{
    flex-wrap: wrap;
  }
}
@media all and (max-width: 350px){
  .flw{
    flex-wrap: wrap;
  }
 

}
#size_product, #color_product{
  width: 100%;
    overflow-x: auto;
}