body,
body#sab {
  --padding-container: 0 18%;
  --padding-containerx1440: 0 14%;
  --padding-containerx1200: 0 10%;
  --padding-containerx960: 0 10%;
  --padding-containerx720: 0 10%;
  --padding-containerx560: 0 5%;
  --text-red: #ff0101;
  --icon-size: 20px;
  --header-size: 96px;
  --icon-topmenu-color: #fff;
  --icon-footer-color: #000;
  --primary-color: #003600;
  --theme-bg: #f9f9f9;
  --theme-txt: #003600;
  --menu-bg: linear-gradient(180deg, #1d2c25 0%, #1b553a 100%);
  --menu-txt: #000000;
  --theme-slide-dot-active: #003600;
  --countdown-txt: #003600;
  --countdown-unit-txt: #1b553a;
  --promotion-bg: #fff;
  --countdown-bg: #f9f9f9;
  --tracking-bg: url(../images/fe/theme_iam/hennessy_xo_3caae61a-546d-4906-8033-e10b31820f53_2048x.webp);
  --tracking-mb-bg: url(../images/fe/theme_iam/Shipping-Website-IAM-750x947.jpg);
  --tracking-bg-color: $white;
  --order-bg: #1d2c25;
  --sale-time-bgd: #1d2c25;
  --sale-time-txt: #020202;
  --sale-detail-bg: #020202;
  --sale-title: #fff;
  --sale-detail-txt: #fff;
  --sale-order-color: #1d2c25;
  --sale-i-line: url(../images/fe/icons/o-line.png);
  --sale-i-bottle: url(../images/fe/icons/o-bottle.png);
  --sale-i-van: url(../images/fe/icons/o-van.png);
  --sale-i-box: url(../images/fe/icons/o-box.png);
  --sale-i-money: url(../images/fe/icons/o-money.png);
  --sale-i-delivery: url(../images/fe/icons/o-delivery.png);
  --sale-theme-bg: #020202;
  --icon-menu-hover: url(../images/fe/icons/menu-hover.png);
  --icon-account: url(../images/fe/icons/i_account.png);
  --icon-cart: url(../images/fe/icons/i_cart.png);
  --icon-cart-primary: url(../images/fe/icons/i_cart2.png);
  --font-family-light: Mitr-Light, sans-serif;
  --font-family-bold: Gotham-Bold, sans-serif;
  --font-family-medium: serif, Gotham, sans-serif;
  font-family: var(--font-family-light);
  --full-height: calc(100vh - (var(--header-size) + 40px)); }

.blog-container h1 {
  font-size: 22px;
  font-family: var(--font-family-medium);
  color: #000000; }
.blog-container .blog-lists .row div:nth-child(1) .blog-image,
.blog-container .blog-lists .row div:nth-child(2) .blog-image {
  display: flex;
  flex-direction: row; }
  .blog-container .blog-lists .row div:nth-child(1) .blog-image .b-img,
  .blog-container .blog-lists .row div:nth-child(2) .blog-image .b-img {
    flex: 1;
    padding-right: 32px;
    border-radius: 4px;
    min-width: 50%;
    max-width: 50% !important; }
  .blog-container .blog-lists .row div:nth-child(1) .blog-image div,
  .blog-container .blog-lists .row div:nth-child(2) .blog-image div {
    flex: 1; }
.blog-container .blog-lists div.blog-image {
  position: relative;
  overflow: hidden;
  display: block; }
  .blog-container .blog-lists div.blog-image .b-img {
    margin-bottom: 8px;
    border-radius: 4px;
    -webkit-transform: perspective(1px) translateZ(0);
    transform: perspective(1px) translateZ(0);
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: transform;
    transition-property: transform;
    width: 100%;
    object-fit: cover;
    height: 220px; }
  .blog-container .blog-lists div.blog-image p.p-name {
    font-size: 20px;
    font-weight: 600;
    color: #000000;
    font-family: var(--font-family-medium);
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    margin-bottom: 8px;
    width: 100%;
    white-space: nowrap;
    line-height: normal; }
  .blog-container .blog-lists div.blog-image p.p-desc {
    font-family: var(--font-family-light);
    font-style: normal;
    font-weight: 100;
    font-size: 16px;
    line-height: 131.7%;
    color: #000000;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    text-align: justify;
    margin-bottom: 0px;
    max-height: 60px; }
  .blog-container .blog-lists div.blog-image .create-by {
    font-family: var(--font-family-light);
    font-size: 11px;
    color: white;
    padding: 8px 16px;
    background-color: var(--primary-color);
    margin: 0 0 8px;
    display: inline-block;
    border-radius: 4px; }

.blog-container-home h1 {
  font-size: 28px;
  font-family: var(--font-family-medium);
  color: var(--primary-color); }
.blog-container-home .blog-lists {
  margin: 32px 10% 0; }
  .blog-container-home .blog-lists a.blog-image {
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: row;
    margin-bottom: 30px; }
    .blog-container-home .blog-lists a.blog-image .b-img {
      margin-bottom: 8px;
      border-radius: 4px;
      -webkit-transform: perspective(1px) translateZ(0);
      transform: perspective(1px) translateZ(0);
      -webkit-transition-duration: 0.3s;
      transition-duration: 0.3s;
      -webkit-transition-property: transform;
      transition-property: transform;
      width: 100%;
      object-fit: cover;
      height: 320px;
      margin-right: 24px;
      flex: 1; }
    .blog-container-home .blog-lists a.blog-image div {
      flex: 1;
      height: 310px; }
    .blog-container-home .blog-lists a.blog-image p.p-name {
      font-size: 20px;
      font-weight: 600;
      line-height: 131.7%;
      color: #231f20;
      font-family: var(--font-family-medium);
      overflow: hidden;
      text-overflow: ellipsis;
      display: -webkit-box;
      -webkit-line-clamp: 1;
      -webkit-box-orient: vertical;
      margin-bottom: 8px;
      text-align: left; }
    .blog-container-home .blog-lists a.blog-image p.p-desc {
      font-size: 18px;
      font-weight: 100;
      font-family: var(--font-family-light);
      color: #231f20;
      text-indent: 16px;
      overflow: hidden;
      text-overflow: ellipsis;
      display: -webkit-box;
      -webkit-line-clamp: 3;
      -webkit-box-orient: vertical;
      text-align: justify; }
    .blog-container-home .blog-lists a.blog-image .create-by {
      font-family: var(--font-family-light);
      font-size: 11px;
      color: white;
      padding: 8px 16px;
      background-color: var(--primary-color);
      margin: 0 0 8px;
      display: inline-block;
      border-radius: 4px; }

.blog-detail-container h1 {
  font-weight: 700;
  font-size: 30px;
  line-height: 31px;
  color: #555555; }
.blog-detail-container .blog-img {
  width: 400px;
  max-width: 400px;
  margin: 0 auto 30px auto;
  display: table; }
.blog-detail-container .blog-content {
  font-size: unset;
  color: #555555;
  font-family: var(--font-family-medium);
  text-indent: 24px; }
.blog-detail-container ul li {
  list-style: disc;
  font-weight: 300;
  color: #231f20; }
.blog-detail-container .blog-content .image-style-side,
.blog-detail-container .blog-content .image-style-align-left,
.blog-detail-container .blog-content .image-style-align-center,
.blog-detail-container .blog-content .image-style-align-right {
  max-width: 50%;
  margin-bottom: 20px; }
.blog-detail-container .blog-content .image {
  max-width: 50%;
  margin: 0 auto 20px auto; }
.blog-detail-container .blog-content .image-style-side {
  float: right;
  margin-left: 20px; }
.blog-detail-container .blog-content .image-style-align-left {
  float: left;
  margin-right: 20px; }
.blog-detail-container .blog-content .image-style-align-center {
  margin-left: auto;
  margin-right: auto; }
.blog-detail-container .blog-content .image-style-align-right {
  float: right;
  margin-left: 20px; }

a {
  color: #212121 !important; }

.btn-read-more {
  border-radius: 0;
  background: #ffffff;
  border: 1px solid #cecece;
  display: flex;
  padding: 8px;
  color: #212121 !important; }
  .btn-read-more div {
    font-size: 12px;
    font-weight: 600;
    line-height: 16px;
    color: #212121 !important;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: 'Mitr-Regular'; }
  .btn-read-more:hover {
    background-color: #212121;
    color: #ffffff !important; }
    .btn-read-more:hover div {
      color: #ffffff !important; }

.blog-img {
  width: 50%; }

@media (max-width: 1440px) {
  .blog-container-home .blog-lists {
    margin: 0 5%; }

  .sec-blogs {
    margin: var(--padding-containerx1440); } }
@media (max-width: 1200px) {
  .sec-blogs {
    margin: var(--padding-containerx1200); } }
@media (max-width: 960px) {
  .blog-lists .row div:nth-child(1) .blog-image .b-img,
  .blog-lists .row div:nth-child(2) .blog-image .b-img {
    max-width: 100% !important;
    min-width: 100%;
    max-width: 100% !important; }

  div.sec-blogs.mt-5.mb-5 > div.blog-container > div > div > div:nth-child(1),
  div.sec-blogs.mt-5.mb-5 > div.blog-container > div > div > div:nth-child(2) {
    flex: 0 0 50%;
    max-width: 50%; }
    div.sec-blogs.mt-5.mb-5 > div.blog-container > div > div > div:nth-child(1) .blog-image,
    div.sec-blogs.mt-5.mb-5 > div.blog-container > div > div > div:nth-child(2) .blog-image {
      flex-direction: column !important; }
      div.sec-blogs.mt-5.mb-5 > div.blog-container > div > div > div:nth-child(1) .blog-image .b-img,
      div.sec-blogs.mt-5.mb-5 > div.blog-container > div > div > div:nth-child(2) .blog-image .b-img {
        padding-right: 0px !important;
        max-height: 220px !important;
        min-width: 100%;
        max-width: 100% !important; }

  .sec-blogs {
    margin: var(--padding-containerx960); } }
@media (max-width: 767px) {
  .sec-blogs {
    margin: var(--padding-containerx720); }

  div.sec-blogs.mt-5.mb-5 > div.blog-container > div > div > div:nth-child(1),
  div.sec-blogs.mt-5.mb-5 > div.blog-container > div > div > div:nth-child(2) {
    flex: 0 0 100%;
    max-width: 100%; }
    div.sec-blogs.mt-5.mb-5 > div.blog-container > div > div > div:nth-child(1) .blog-image,
    div.sec-blogs.mt-5.mb-5 > div.blog-container > div > div > div:nth-child(2) .blog-image {
      flex-direction: row !important; }
      div.sec-blogs.mt-5.mb-5 > div.blog-container > div > div > div:nth-child(1) .blog-image .b-img,
      div.sec-blogs.mt-5.mb-5 > div.blog-container > div > div > div:nth-child(2) .blog-image .b-img {
        padding-right: 32px !important;
        max-height: 220px !important;
        min-width: 180px;
        max-width: 50% !important; }

  .blog-image {
    display: flex !important;
    flex-direction: row !important; }
    .blog-image .b-img {
      padding-right: 32px !important;
      max-height: 220px !important;
      flex: 1;
      max-width: 50%; }
    .blog-image .b-detail {
      flex: 1; } }
@media (max-width: 560px) {
  .blog-lists .row div:nth-child(1) .blog-image .b-img,
  .blog-lists .row div:nth-child(2) .blog-image .b-img {
    min-width: 50% !important;
    max-width: 180px !important; }

  .sec-blogs {
    margin: var(--padding-containerx560); }

  .text-open-c {
    justify-content: flex-start; }

  .blog-container .blog-lists div.blog-image .b-img {
    height: 120px;
    max-width: 50%;
    min-width: 50%; } }