@charset "UTF-8";
@font-face {
  font-family: 'Prompt';
  src: url("../fonts/Prompt-Regular.ttf") format("truetype"); }

@font-face {
  font-family: 'Prompt-Bold';
  src: url("../fonts/Prompt-Bold.ttf") format("truetype"); }

@font-face {
  font-family: 'Sarabun';
  src: url("../fonts/Sarabun-Regular.ttf") format("truetype"); }

body {
  overflow-x: hidden;
  font-family: "Prompt", sans-serif;
  font-size: 16px; }

a {
  cursor: pointer; }

/* ----------------- ANIMATION THINGS -----------------*/
.modal-backdrop.in {
  filter: alpha(opacity=70);
  opacity: .7; }

.cart-animation-helper {
  margin: 0 20%;
  width: 0;
  height: 0; }
  .cart-animation-helper:after {
    opacity: 0;
    border-radius: 0%;
    max-height: 250px;
    max-width: 200px;
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    margin: 0 auto;
    display: block;
    height: 250px;
    width: 200px;
    background-color: #ff9a9e;
    transition: transform 0.8s ease-out, margin 0.8s ease-out, opacity 0.8s ease-out, border-radius 0.4s ease-out, max-height 0.4s ease-out, max-width 0.4s ease-out; }

/**/
#fc_frame {
  bottom: 57px !important;
  /* left: 5px;*/
  z-index: 1049 !important; }

.bottom-top-area {
  position: fixed;
  bottom: 50px;
  right: 0px;
  z-index: 1100 !important;
  width: 100%; }
  .bottom-top-area .bottom-content-area {
    width: 100%;
    position: relative;
    /*   bottom: 50px;
        right: 0px;*/
    z-index: 1100 !important; }
  .bottom-top-area #custom_fc_button {
    position: absolute;
    bottom: 0px;
    right: 0px;
    background-color: #00b28d !important;
    color: #ffffff !important;
    border-color: transparent #00b28d transparent transparent;
    border-radius: 34px 8px 34px 34px;
    box-shadow: 0 5px 4px 0 rgba(0, 0, 0, 0.26);
    color: #fff;
    cursor: pointer;
    height: 56px;
    width: 56px;
    margin-right: 15px;
    margin-bottom: 15px;
    float: right;
    z-index: 1049 !important; }

@media only screen and (min-width: 992px) {
  #custom_fc_button {
    right: 30px; } }

.icon-ic_chat_icon:before {
  content: "\f108"; }

#open_fc_widget {
  cursor: pointer;
  font-size: 30px;
  text-align: center;
  color: white; }
  #open_fc_widget img {
    margin-left: 22%;
    margin-top: 22%;
    width: 35px;
    height: 35px; }

*, h1, h2, h3, h4, h5, h6 {
  padding: 0;
  margin: 0;
  box-sizing: border-box; }

.inner-addon {
  position: relative;
  display: flex;
  align-items: center; }
  .inner-addon .icon {
    position: absolute;
    padding: 10px;
    pointer-events: none;
    z-index: 200; }

.left-addon .icon {
  left: 8px; }

.left-addon input {
  padding-left: 40px; }

.right-addon .icon {
  right: 8px; }

.right-addon input {
  padding-right: 40px; }

.position-relative {
  position: relaticve; }

.height-100 {
  height: 100%; }

.width-100 {
  width: 100%;
  min-width: 100%; }

.flex-center {
  display: flex;
  align-items: center;
  justify-content: center; }

.disable-bottom-padding {
  padding-bottom: 0 !important; }

.fk-avatar-circle {
  width: 40px;
  height: 40px;
  display: flex;
  overflow: hidden;
  position: relative;
  font-size: 1.25rem;
  align-items: center;
  flex-shrink: 0;
  line-height: 1;
  user-select: none;
  border-radius: 50%;
  justify-content: center; }
  .fk-avatar-circle.avatar-large {
    width: 56px;
    height: 56px; }
  .fk-avatar-circle.avatar-small {
    width: 24px;
    height: 24px; }
  .fk-avatar-circle .avatar-image {
    color: transparent;
    width: 100%;
    height: 100%;
    object-fit: cover;
    text-align: center;
    text-indent: 10000px; }

ul.fk-header-list-custome {
  padding: 16px !important; }

ul.fk-link-list a {
  text-decoration: none; }

ul.fk-link-list li > a {
  color: inherit; }

ul.fk-link-list li:not(.active) a:focus {
  color: inherit; }

ul.fk-link-list li.active > a {
  color: #008065; }
  ul.fk-link-list li.active > a svg > path {
    stroke: #008065; }
  ul.fk-link-list li.active > a:focus,
  ul.fk-link-list li.active > a span {
    color: inherit; }
  ul.fk-link-list li.active > a::after {
    content: " ";
    position: absolute;
    margin-top: 0;
    margin-left: 0;
    background-color: #008065;
    height: 6px;
    width: 6px;
    border-radius: 50%;
    display: inline-block; }

ul.fk-link-list li.open a.nav-link {
  background: #F0FBF7 !important;
  color: #008065; }
  ul.fk-link-list li.open a.nav-link svg {
    transform: rotate(-90deg); }
    ul.fk-link-list li.open a.nav-link svg path {
      fill: #008065; }

ul.fk-link-list li a.nav-link svg {
  transform: rotate(90deg); }

ul.fk-link-list li > a {
  border-radius: 6px;
  position: relative !important; }
  ul.fk-link-list li > a svg {
    float: right; }

ul.fk-link-list .fk-nav-item-dropdown > div {
  background: #F0FBF7;
  border-radius: 6px;
  position: static;
  float: none;
  box-shadow: none !important;
  border: none !important; }
  ul.fk-link-list .fk-nav-item-dropdown > div .dropdown-item {
    display: block;
    padding: 10px 16px !important;
    white-space: nowrap;
    font-size: 16px !important; }
  ul.fk-link-list .fk-nav-item-dropdown > div .active {
    color: #008065; }
    ul.fk-link-list .fk-nav-item-dropdown > div .active svg > path {
      stroke: #008065; }
    ul.fk-link-list .fk-nav-item-dropdown > div .active:focus,
    ul.fk-link-list .fk-nav-item-dropdown > div .active span {
      color: inherit; }
    ul.fk-link-list .fk-nav-item-dropdown > div .active::after {
      content: " ";
      position: absolute;
      margin-top: 0;
      margin-left: 0;
      background-color: #008065;
      height: 6px;
      width: 6px;
      border-radius: 50%;
      display: inline-block; }

/* ---------------------------------------------------
    MAIN NAVBAR STYLE
----------------------------------------------------- */
.fk-main-navbar {
  display: flex;
  align-items: center;
  box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.1);
  height: 60px;
  -webkit-transition: background-color 0.3s ease-out;
  -moz-transition: background-color 0.3s ease-out;
  -o-transition: background-color 0.3s ease-out;
  transition: background-color 0.3s ease-out; }
  .fk-main-navbar.inverse {
    background-image: none;
    background-color: transparent;
    color: #ffffff;
    border: none;
    box-shadow: none; }
    .fk-main-navbar.inverse li:not(.active) {
      color: #ffffff; }
      .fk-main-navbar.inverse li:not(.active) a:not(:hover) {
        color: inherit; }
      .fk-main-navbar.inverse li:not(.active) a:focus {
        color: #008065; }
    .fk-main-navbar.inverse div > a:not(:hover) {
      color: #ffffff; }
  .fk-main-navbar .fk-brand {
    padding-left: 16px; }
    .fk-main-navbar .fk-brand img {
      height: 20px; }
  .fk-main-navbar .between-list {
    padding: 12px 0px; }
  .fk-main-navbar .container {
    display: flex;
    align-items: center; }
    .fk-main-navbar .container .navbar-brand {
      padding-top: 8px;
      padding-bottom: 8px; }
  .fk-main-navbar .subtitle {
    font-size: 12px;
    font-weight: 500px;
    padding: 0px 8px;
    color: #5e6166; }
  .fk-main-navbar a:not(.btn) {
    text-decoration: none;
    box-shadow: none !important;
    background: none !important;
    background-image: none !important; }
  .fk-main-navbar .navbar-right {
    display: flex;
    margin-left: auto;
    align-items: center;
    margin-right: 0; }
    .fk-main-navbar .navbar-right > a {
      display: flex;
      align-items: center;
      justify-content: center;
      position: relative;
      margin-left: 32px; }
  .fk-main-navbar__toolbar {
    display: flex;
    flex: 1;
    margin-left: 45px;
    margin-right: 45px;
    /*.navbar-nav > li > a.nav-link:focus {
            background: #F8F9FA !important;

            svg {
                transform: rotate(-90deg);
            }
        }*/ }
    .fk-main-navbar__toolbar--main {
      display: flex;
      flex: 1;
      flex-direction: column; }
      .fk-main-navbar__toolbar--main .nav-actions {
        display: flex;
        align-items: center;
        justify-content: space-between; }
        .fk-main-navbar__toolbar--main .nav-actions .locale-between {
          margin-top: 8px; }
        .fk-main-navbar__toolbar--main .nav-actions ul li:nth-child(1) > a {
          padding-left: 0; }
        .fk-main-navbar__toolbar--main .nav-actions ul li > a {
          padding-bottom: 8px;
          font-size: 14px;
          padding-top: 10px !important; }
        .fk-main-navbar__toolbar--main .nav-actions .locale-menu__icon {
          margin-top: 8px; }
    .fk-main-navbar__toolbar .navbar-nav > li.open a.nav-link {
      background: #F8F9FA !important; }
      .fk-main-navbar__toolbar .navbar-nav > li.open a.nav-link svg {
        transform: rotate(-90deg); }
        .fk-main-navbar__toolbar .navbar-nav > li.open a.nav-link svg path {
          fill: #008065; }
    .fk-main-navbar__toolbar .navbar-nav > li > a {
      border-radius: 6px;
      position: relative !important; }
      .fk-main-navbar__toolbar .navbar-nav > li > a svg {
        float: right; }
    .fk-main-navbar__toolbar .dropdown-menu {
      width: 180px;
      border-radius: 6px !important; }
      .fk-main-navbar__toolbar .dropdown-menu ul {
        list-style: none;
        margin: 0;
        padding: 0;
        box-shadow: 0px 4px 24px rgba(122, 172, 193, 0.16); }
        .fk-main-navbar__toolbar .dropdown-menu ul li {
          border-bottom: 1px solid #F8F9FA;
          height: 50px; }
          .fk-main-navbar__toolbar .dropdown-menu ul li a {
            font-size: 14px;
            padding: 16px !important;
            display: block; }
          .fk-main-navbar__toolbar .dropdown-menu ul li a:hover {
            color: #008065; }
          .fk-main-navbar__toolbar .dropdown-menu ul li svg {
            transform: rotate(0deg) !important;
            float: right; }
  .fk-main-navbar__height {
    height: 60px; }
  @media only screen and (min-width: 992px) {
    .fk-main-navbar {
      padding: 16px 8px;
      height: auto; }
      .fk-main-navbar__height {
        height: 103px; }
      .fk-main-navbar__toolbar li > a {
        padding-top: 8px; }
      .fk-main-navbar .fk-brand {
        padding-left: 0; }
        .fk-main-navbar .fk-brand img {
          width: 130px;
          margin-top: -10px; }
      .fk-main-navbar .navbar-right__account--profile a {
        justify-content: flex-end; }
      .fk-main-navbar .navbar-right__account--icon {
        display: flex;
        align-items: center; }
      .fk-main-navbar .navbar-right a {
        padding: 8px 32px;
        border: none;
        margin-left: 0px; }
        .fk-main-navbar .navbar-right a .fk-badges {
          top: -4px;
          right: 22px;
          font-size: 12px; } }
  @media only screen and (max-width: 768px) {
    .fk-main-navbar .container {
      margin-left: 0;
      margin-right: 0;
      flex: 1; } }

.fk-main-content {
  overflow: auto;
  position: relative; }

.fk-bottom-navbar {
  flex: 1;
  display: flex;
  height: 48px; }
  .fk-bottom-navbar.navbar-fixed-bottom {
    bottom: 0; }
  .fk-bottom-navbar a:not(.btn) {
    text-decoration: none;
    box-shadow: none !important;
    background: none !important;
    background-image: none !important; }
  .fk-bottom-navbar ul,
  .fk-bottom-navbar li {
    display: flex;
    flex: 1;
    justify-content: center;
    align-items: center; }
    .fk-bottom-navbar ul a,
    .fk-bottom-navbar li a {
      display: flex;
      flex-direction: column;
      align-items: center; }
      .fk-bottom-navbar ul a span,
      .fk-bottom-navbar li a span {
        font-size: 12px; }
      .fk-bottom-navbar ul a::after,
      .fk-bottom-navbar li a::after {
        margin-right: -50% !important; }
  .fk-bottom-navbar__height {
    height: 48px; }

.fk-search .input-group-addon {
  background: #ebeff7; }

.fk-search input {
  background-color: #ebeff7;
  border: none; }
  .fk-search input:focus {
    box-shadow: 0 0 0 2px #008065; }
    .fk-search input:focus::placeholder {
      color: transparent; }

.fk-search .tt-menu {
  width: 100%;
  max-height: 300px;
  border-radius: 8px;
  border: none !important;
  overflow-x: hidden;
  overflow-y: auto; }
  .fk-search .tt-menu .tt-dataset {
    width: 100%;
    height: 100%; }
    .fk-search .tt-menu .tt-dataset > a {
      display: flex;
      flex-direction: column;
      justify-content: center;
      width: 100%;
      color: inherit;
      text-decoration: none; }
      .fk-search .tt-menu .tt-dataset > a > span {
        display: block;
        width: 100%;
        max-width: 100%;
        overflow: hidden;
        text-overflow: ellipsis;
        color: inherit; }
        .fk-search .tt-menu .tt-dataset > a > span.text-hint {
          color: #A4AAB9; }

.fk-search__tt-menu--full-width {
  left: -16px;
  width: 100vh;
  top: 16px; }

.fk-search .tt-suggestion {
  display: flex !important;
  align-items: center;
  height: 48px;
  padding: 16px 8px;
  border-bottom: 1px solid #f7f8fb; }
  .fk-search .tt-suggestion:hover {
    background-color: #008065 !important;
    color: #ffffff !important; }

.fk-search .tt-cursor {
  background-color: #008065 !important;
  color: #ffffff; }

.fk-search .tt-empty,
.fk-search .tt-pending {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 16px;
  height: 100%;
  color: #a4aab9;
  margin: auto; }

.fk-modal .modal-content {
  padding: 0px !important;
  height: 100%;
  overflow-y: auto; }

.fk-modal .modal-body {
  padding: 15px 15px 80px; }

.fk-modal.modal .modal-dialog {
  position: fixed;
  margin: auto;
  width: 320px;
  height: 100%;
  /* -webkit-transform: translate3d(0%, 0, 0);
            -ms-transform: translate3d(0%, 0, 0);
            -o-transform: translate3d(0%, 0, 0);
            transform: translate3d(0%, 0, 0);*/ }
  .fk-modal.modal .modal-dialog .modal-content__modal-header {
    display: flex;
    background-color: #f7f8fb;
    border-bottom: none;
    align-items: center;
    width: 100%; }
    .fk-modal.modal .modal-dialog .modal-content__modal-header.header-fixed {
      position: fixed;
      top: 0;
      left: 0; }
    .fk-modal.modal .modal-dialog .modal-content__modal-header--content {
      flex: 1;
      margin-right: 16px; }
    .fk-modal.modal .modal-dialog .modal-content__modal-header--close {
      display: flex;
      align-items: center;
      justify-content: flex-end; }
  .fk-modal.modal .modal-dialog .modal-content__modal-body {
    height: calc(100vh - 64px);
    overflow-x: hidden;
    overflow-y: auto; }

.fk-modal.modal.center.fade .modal-dialog {
  top: 15%;
  -webkit-transition: opacity 0.3s linear, top 0.3s ease-out;
  -moz-transition: opacity 0.3s linear, top 0.3s ease-out;
  -o-transition: opacity 0.3s linear, top 0.3s ease-out;
  transition: opacity 0.3s linear, top 0.3s ease-out; }

@media only screen and (max-width: 768px) {
  .fk-modal.modal.center.fade.in .modal-dialog {
    left: 0;
    top: 0; } }

.fk-modal.modal.center.fade.in {
  display: flex !important;
  justify-content: center;
  margin: auto;
  padding-right: 0px !important;
  margin-top: 10%; }
  .fk-modal.modal.center.fade.in .modal-dialog {
    /*left: 35%;
                        top: 10%;*/
    /* left:0;
                        right: 0;
                        top:0;
                        margin: auto;*/ }

.fk-modal.modal.left.fade .modal-dialog {
  left: -320px;
  -webkit-transition: opacity 0.3s linear, left 0.3s ease-out;
  -moz-transition: opacity 0.3s linear, left 0.3s ease-out;
  -o-transition: opacity 0.3s linear, left 0.3s ease-out;
  transition: opacity 0.3s linear, left 0.3s ease-out; }

.fk-modal.modal.left.fade.in .modal-dialog {
  left: 0; }

.fk-modal.modal.right.fade .modal-dialog {
  right: -320px;
  -webkit-transition: opacity 0.3s linear, right 0.3s ease-out;
  -moz-transition: opacity 0.3s linear, right 0.3s ease-out;
  -o-transition: opacity 0.3s linear, right 0.3s ease-out;
  transition: opacity 0.3s linear, right 0.3s ease-out; }

.fk-modal.modal.right.fade.in .modal-dialog {
  right: 0; }

.fk-modal.modal.bottom.fade .modal-dialog {
  bottom: -100vh;
  -webkit-transition: opacity 0.3s linear, bottom 0.3s ease-out;
  -moz-transition: opacity 0.3s linear, bottom 0.3s ease-out;
  -o-transition: opacity 0.3s linear, bottom 0.3s ease-out;
  transition: opacity 0.3s linear, bottom 0.3s ease-out; }

.fk-modal.modal.bottom.fade.in .modal-dialog {
  bottom: 0; }

.fk-modal.modal.top.fade .modal-dialog {
  top: -100vh;
  -webkit-transition: opacity 0.3s linear, top 0.3s ease-out;
  -moz-transition: opacity 0.3s linear, top 0.3s ease-out;
  -o-transition: opacity 0.3s linear, top 0.3s ease-out;
  transition: opacity 0.3s linear, top 0.3s ease-out; }

.fk-modal.modal.top.fade.in .modal-dialog {
  top: 0; }

.fk-modal__dialog--full-width {
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  max-width: none !important; }

.fk-modal__dialog--default {
  width: 30% !important;
  height: 50% !important;
  margin: 0 !important;
  padding: 0 !important;
  max-width: none !important; }

.fk-modal__dialog--default40 {
  width: 40% !important;
  height: 50% !important;
  margin: 0 !important;
  padding: 0 !important;
  max-width: none !important; }

@media only screen and (max-width: 768px) {
  .fk-modal__dialog--default {
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    max-width: none !important; }
  .fk-modal__dialog--default40 {
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    max-width: none !important; } }

.fk-modal__content--full-width {
  height: auto !important;
  min-height: 100% !important;
  border-radius: 0 !important;
  border: none; }

.fk-modal__content--default {
  height: auto !important;
  min-height: 100% !important;
  border-radius: 0 !important; }

.fk-modal__content--default40 {
  height: auto !important;
  min-height: 100% !important;
  border-radius: 0 !important; }

.fk-modal__header--full-width {
  border-bottom: 1px solid #f7f8fb !important; }

.fk-modal__header--default {
  border-bottom: 1px solid #f7f8fb !important; }

.fk-modal__header--default40 {
  border-bottom: 1px solid #f7f8fb !important; }

.fk-modal__footer--full-width {
  border-top: 1px solid #f7f8fb !important; }

.fk-modal__footer--default {
  border-top: 1px solid #f7f8fb !important; }

.fk-modal__footer--default40 {
  border-top: 1px solid #f7f8fb !important; }

.fk-badges {
  position: absolute;
  top: -16px;
  right: -10px;
  font-size: 0.8em;
  background: #ED1516;
  border-radius: 50%;
  padding: 2px;
  color: #fff;
  height: 19px;
  width: 19px;
  text-align: center; }

/* ---------------------------------------------------
    SIDEBAR STYLE
----------------------------------------------------- */
.fk-main-sidebar {
  width: 100vw;
  position: fixed;
  display: flex;
  flex-direction: column;
  top: 0;
  right: -100vw;
  height: 100vh;
  z-index: 1200;
  transition: all 0.3s ease-out;
  overflow-y: scroll;
  background-color: #ffffff;
  max-width: 100vw;
  overflow-x: hidden;
  overflow-y: auto; }
  .fk-main-sidebar.active {
    right: 0; }
  .fk-main-sidebar a {
    text-decoration: none; }
  .fk-main-sidebar #dismiss {
    width: 35px;
    height: 35px;
    line-height: 35px;
    text-align: center;
    position: absolute;
    top: 16px;
    right: 10px;
    cursor: pointer;
    -webkit-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out; }
    .fk-main-sidebar #dismiss:hover {
      background: #fff;
      color: #7386d5; }
  .fk-main-sidebar ul.main-page > li {
    /*font-size: 22px;*/ }
  .fk-main-sidebar ul.components {
    padding: 16px 0px;
    border-bottom: 1px solid #f7f8fb; }
  .fk-main-sidebar ul li > a {
    padding-left: 16px;
    padding-right: 16px; }
  .fk-main-sidebar__header {
    padding: 16px;
    height: 60px; }
    .fk-main-sidebar__header img {
      max-height: 20px; }
  .fk-main-sidebar__footer {
    display: flex;
    flex-grow: 1;
    flex-direction: column;
    padding: 16px; }
    .fk-main-sidebar__footer .between-list {
      padding: 8px 10px; }
    .fk-main-sidebar__footer .locale-menu {
      display: flex;
      margin: 0;
      justify-content: space-between;
      align-items: center; }
      .fk-main-sidebar__footer .locale-menu .locale-label {
        display: flex; }
        .fk-main-sidebar__footer .locale-menu .locale-label span {
          margin-left: 8px; }
      .fk-main-sidebar__footer .locale-menu .locale-data {
        display: flex; }
    .fk-main-sidebar__footer .auth-menu {
      display: flex;
      flex-direction: column; }
      .fk-main-sidebar__footer .auth-menu a {
        margin-top: 24px; }
      .fk-main-sidebar__footer .auth-menu .login-btn {
        display: flex;
        align-items: center;
        justify-content: space-between; }

.fk-overlay {
  display: none;
  position: fixed;
  top: 0;
  width: 100vw;
  height: 100vh;
  background: rgba(0, 0, 0, 0.7);
  z-index: 1199;
  opacity: 0;
  transition: all 0.3s ease-in-out; }
  .fk-overlay.active {
    display: block;
    opacity: 1; }

/* ---------------------------------------------------
    NAV TABS STYLE
----------------------------------------------------- */
/* ---------------------------------------------------
    HOME STYLE
----------------------------------------------------- */
.section-margin {
  margin-top: 32px; }
  @media only screen and (min-width: 992px) {
    .section-margin {
      margin-top: 56px; } }

.section-padding {
  padding: 48px 0; }

.fk-what {
  width: 100%;
  position: relative;
  z-index: 100;
  background: rgba(0, 0, 0, 0.2);
  overflow: hidden; }
  .fk-what__item {
    position: relative;
    width: 100%;
    margin: auto; }
    .fk-what__item--content {
      display: flex;
      flex-direction: column;
      justify-content: flex-end;
      min-height: calc(100vh - 48px);
      max-height: 100%; }
      .fk-what__item--content .content-title {
        position: relative;
        max-width: 100%;
        z-index: 100;
        color: #ffffff; }
        .fk-what__item--content .content-title .jumbotron {
          background-color: transparent;
          margin-bottom: 0; }
        .fk-what__item--content .content-title h1 {
          font-size: 40px; }
        .fk-what__item--content .content-title .header-title, .fk-what__item--content .content-title .header-subtitle {
          margin-bottom: 12px; }
        .fk-what__item--content .content-title a.vedio-preview-link {
          margin-top: 16px;
          display: inline-flex;
          align-items: center;
          color: #ffffff;
          text-decoration: none;
          width: auto; }
          .fk-what__item--content .content-title a.vedio-preview-link:hover {
            color: #008065; }
            .fk-what__item--content .content-title a.vedio-preview-link:hover svg {
              stroke: #008065; }
              .fk-what__item--content .content-title a.vedio-preview-link:hover svg circle {
                stroke: #008065; }
              .fk-what__item--content .content-title a.vedio-preview-link:hover svg path {
                stroke: #008065;
                fill: #008065; }
          .fk-what__item--content .content-title a.vedio-preview-link svg {
            margin-right: 8px; }
      .fk-what__item--content .background-vedio-container {
        max-width: 100%;
        inset: 0px;
        pointer-events: none;
        position: absolute !important; }
        .fk-what__item--content .background-vedio-container .background-vedio {
          position: absolute;
          z-index: 48;
          width: 100%;
          height: calc(100vh - 48px); }
          .fk-what__item--content .background-vedio-container .background-vedio > video {
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            min-width: 100%;
            min-height: 100%; }
  .fk-what .vedio-filter {
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 49;
    left: 0;
    top: 0;
    background: rgba(0, 0, 0, 0.1); }
  @media only screen and (min-width: 992px) {
    .fk-what .vedio-filter {
      background: rgba(0, 0, 0, 0.2); }
    .fk-what__item--content {
      width: 100%;
      min-height: 100vh; }
      .fk-what__item--content .background-vedio-container .background-vedio > video {
        min-width: 100%;
        min-height: 100%; } }

.fk-reputation {
  display: flex;
  align-items: center;
  background-color: #FAFBFF; }
  .fk-reputation .content-justify-center {
    justify-content: center; }
  .fk-reputation .content-column {
    display: flex;
    justify-content: center;
    align-items: center; }
    .fk-reputation .content-column:last-child {
      margin-top: 24px; }
  .fk-reputation__header {
    margin-bottom: 56px; }
    .fk-reputation__header--title {
      font-weight: 600;
      font-size: 32px;
      text-align: center;
      margin-bottom: 0; }
    .fk-reputation__header--subtitle {
      font-size: 16px;
      text-align: center;
      margin-top: 8px;
      font-family: "Sarabun", sans-serif; }
  .fk-reputation .rate-content {
    display: flex; }
    .fk-reputation .rate-content__icon {
      margin-right: 12px; }
    .fk-reputation .rate-content__description {
      display: flex;
      flex-direction: column; }
      .fk-reputation .rate-content__description--number {
        font-weight: 600;
        font-size: 38px;
        line-height: 40px;
        color: #008065;
        margin-bottom: 0; }
      .fk-reputation .rate-content__description--label {
        font-weight: 500;
        font-size: 14px;
        line-height: 32px;
        margin-bottom: 0; }
  @media only screen and (min-width: 992px) {
    .fk-reputation .content-column:last-child {
      margin-top: 0; }
    .fk-reputation__header {
      margin-bottom: 80px; }
      .fk-reputation__header--title {
        font-weight: 600;
        font-size: 60px; }
      .fk-reputation__header--subtitle {
        font-weight: normal;
        font-size: 20px; }
    .fk-reputation .rate-content {
      display: flex; }
      .fk-reputation .rate-content__icon {
        margin-right: 12px; }
      .fk-reputation .rate-content__description--number {
        font-size: 52px; }
      .fk-reputation .rate-content__description--label {
        font-size: 20px; } }

.fk-testsimonial__header--title {
  font-weight: 600;
  font-size: 32px;
  margin-bottom: 0; }

.fk-testsimonial__header--subtitle {
  font-weight: 500;
  font-size: 16px;
  font-family: "Sarabun", sans-serif;
  margin-top: 8px; }

.fk-testsimonial__brands {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin-left: auto;
  margin-right: auto;
  max-width: 100%;
  padding-top: 56px;
  padding-bottom: 56px; }
  .fk-testsimonial__brands--logo {
    width: 100%;
    max-width: 64px;
    max-height: 64px;
    margin: 24px 16px; }

.fk-testsimonial__slider .slick-list {
  overflow-y: visible;
  overflow-x: hidden;
  padding-top: 10% !important;
  padding-bottom: 10% !important; }

.fk-testsimonial__slider .slick-slide {
  margin-left: 8px;
  margin-right: 8px; }

.fk-testsimonial__slider--slide.slick-current .description-footer svg,
.fk-testsimonial__slider--slide.slick-current .description-footer path {
  fill: #008065; }

.fk-testsimonial__slider--slide .child-element {
  display: block;
  width: 100%;
  height: 100%;
  background: #ffffff;
  box-shadow: 0px 10px 24px rgba(0, 0, 0, 0.1);
  border-radius: 40px;
  text-align: center; }
  .fk-testsimonial__slider--slide .child-element .badge-root {
    display: inline-flex;
    position: relative;
    flex-shrink: 0;
    margin-top: -4%;
    justify-content: center; }
    .fk-testsimonial__slider--slide .child-element .badge-root .badge-top-right-circle {
      right: 14%;
      top: 14%;
      transform: scale(1) translate(50%, 50%); }
    .fk-testsimonial__slider--slide .child-element .badge-root .avatar-badge {
      background-color: #00ce7c;
      color: #00ce7c;
      boxshadow: 0 0 0 2px #008065;
      margin-left: -32%;
      margin-top: -10%; }
      .fk-testsimonial__slider--slide .child-element .badge-root .avatar-badge::after {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        border-radius: 50%;
        animation: ripple 1.2s infinite ease-in-out;
        border: 1px solid currentColor;
        content: ""; }
    .fk-testsimonial__slider--slide .child-element .badge-root .badge-dot {
      height: 14px;
      padding: 0;
      min-width: 14px;
      border-radius: 50%;
      border: 3px solid #ffffff; }

@keyframes ripple {
  0% {
    transform: scale(0.8);
    opacity: 1; }
  100% {
    transform: scale(2.4);
    opacity: 0; } }
  .fk-testsimonial__slider--slide .child-element__content {
    display: flex;
    flex-direction: column;
    height: auto; }
    .fk-testsimonial__slider--slide .child-element__content--header {
      font-weight: 600;
      font-size: 16px;
      text-align: center;
      margin-bottom: 12px; }
    .fk-testsimonial__slider--slide .child-element__content--subheader {
      font-weight: 500;
      font-size: 16px;
      padding: 0 16px;
      color: #a4aab9;
      text-align: center;
      margin-bottom: 12px; }
    .fk-testsimonial__slider--slide .child-element__content--description {
      padding: 16px;
      text-align: center;
      font-weight: 300;
      font-size: 16px;
      line-height: 32px;
      color: #191e28;
      height: 208px;
      overflow: hidden;
      margin-top: 16px;
      margin-bottom: 16px;
      overflow: hidden;
      flex-grow: 1;
      font-family: "Sarabun", sans-serif; }
    .fk-testsimonial__slider--slide .child-element__content .description-footer {
      color: #008065;
      text-align: center;
      padding: 32px; }

@media only screen and (min-width: 992px) {
  .fk-testsimonial__brands {
    max-width: 860px; }
    .fk-testsimonial__brands--logo {
      width: 100%;
      max-width: 120px;
      max-height: 120px;
      margin: 24px; } }

@media only screen and (min-width: 1200px) {
  .fk-testsimonial__header--title {
    font-size: 60px; }
  .fk-testsimonial__header--subtitle {
    font-size: 20px; }
  .fk-testsimonial__brands {
    max-width: 960px; }
    .fk-testsimonial__brands--logo {
      width: 100%;
      max-width: 120px;
      max-height: 120px;
      margin: 24px; }
  .fk-testsimonial__slider {
    width: 700px;
    margin: 0 auto;
    max-width: 80%; }
    .fk-testsimonial__slider .slick-slide {
      margin-left: -12%;
      margin-right: -12%; }
    .fk-testsimonial__slider .slick-list {
      padding-top: 10% !important;
      padding-bottom: 10% !important;
      padding-left: 15% !important;
      padding-right: 15% !important;
      overflow: visible; }
    .fk-testsimonial__slider .slick-dots {
      text-align: right;
      position: absolute;
      bottom: 0;
      left: 0;
      right: 0; }
    .fk-testsimonial__slider .slick-track {
      max-width: 100% !important;
      transform: translate3d(0, 0, 0) !important;
      perspective: 100px; }
    .fk-testsimonial__slider .slick-slide {
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      margin: auto;
      opacity: 0;
      width: 100% !important;
      transform: translate3d(0, 0, 0);
      transition: transform 1s, opacity 1s; }
    .fk-testsimonial__slider--slide.slick-snext,
    .fk-testsimonial__slider--slide .slick-sprev {
      display: block; }
    .fk-testsimonial__slider--slide.slick-current {
      opacity: 1;
      position: relative;
      display: block;
      z-index: 2; }
      .fk-testsimonial__slider--slide.slick-current .child-element {
        width: 100%;
        height: 100%; }
        .fk-testsimonial__slider--slide.slick-current .child-element .fk-avatar-circle {
          width: 67px;
          height: 67px; }
        .fk-testsimonial__slider--slide.slick-current .child-element .badge-dot {
          height: 20px;
          padding: 0;
          min-width: 20px;
          border-radius: 50%;
          border: 6px solid #ffffff; }
        .fk-testsimonial__slider--slide.slick-current .child-element__content--description {
          font-weight: 300;
          font-size: 20px;
          line-height: 36px; }
    .fk-testsimonial__slider--slide.slick-snext {
      opacity: 1;
      z-index: 1;
      perspective: 1000px;
      -webkit-transform: translate3d(80%, 0, -16px);
      -moz-transform: translate3d(80%, 0, -16px);
      transform: translate3d(80%, 0, -16px); }
    .fk-testsimonial__slider--slide.slick-sprev {
      opacity: 1;
      -webkit-transform: translate3d(-80%, 0, -16px);
      -moz-transform: translate3d(-80%, 0, -16px);
      transform: translate3d(-80%, 0, -16px); }
    .fk-testsimonial__slider--slide .child-element .fk-avatar-circle {
      width: 52px;
      height: 52px; }
    .fk-testsimonial__slider--slide .child-element .badge-root {
      display: inline-flex;
      position: relative;
      flex-shrink: 0;
      margin-top: -4%;
      justify-content: center; }
      .fk-testsimonial__slider--slide .child-element .badge-root .badge-top-right-circle {
        right: 14%;
        top: 14%;
        transform: scale(1) translate(50%, 50%); }
      .fk-testsimonial__slider--slide .child-element .badge-root .avatar-badge {
        background-color: #00ce7c;
        color: #00ce7c;
        boxshadow: 0 0 0 2px #008065;
        margin-left: -32%;
        margin-top: -10%; }
        .fk-testsimonial__slider--slide .child-element .badge-root .avatar-badge::after {
          position: absolute;
          top: 0;
          left: 0;
          width: 100%;
          height: 100%;
          border-radius: 50%;
          animation: ripple 1.2s infinite ease-in-out;
          border: 1px solid currentColor;
          content: ""; }
      .fk-testsimonial__slider--slide .child-element .badge-root .badge-dot {
        height: 14px;
        padding: 0;
        min-width: 14px;
        border-radius: 50%;
        border: 3px solid #ffffff; }
    .fk-testsimonial__slider--slide .child-element__content--header {
      font-weight: 600;
      font-size: 22px; }
    .fk-testsimonial__slider--slide .child-element__content--subheader {
      font-weight: 500;
      font-size: 16px;
      padding: 0 16px;
      color: #a4aab9; }
    .fk-testsimonial__slider--slide .child-element__content--description {
      font-weight: 300;
      font-size: 18px;
      line-height: 32px;
      color: #191e28;
      height: 302px;
      margin-top: 8px;
      margin-bottom: 8px;
      padding: 8px 40px;
      overflow: hidden; }
    .fk-testsimonial__slider--slide .child-element__content .description-footer {
      color: #008065;
      text-align: center;
      padding: 8px 32px 32px 32px; } }

.fk-why {
  overflow-x: hidden; }
  .fk-why__title {
    font-weight: 600;
    font-size: 32px; }
  .fk-why > ul {
    list-style-type: none; }
    .fk-why > ul.disable-gutter {
      padding: 0;
      margin: 0; }
    .fk-why > ul > li {
      background-size: 100vw 100vw;
      background-repeat: no-repeat;
      background-position: left top; }
      .fk-why > ul > li .item-content__item {
        width: 100%;
        max-width: 100%; }
        .fk-why > ul > li .item-content__item--contents {
          padding: calc( 100vw + 16px) 0 16px 0; }
          .fk-why > ul > li .item-content__item--contents .fk-nav-tabs {
            border: none;
            display: flex;
            align-items: center; }
            .fk-why > ul > li .item-content__item--contents .fk-nav-tabs > li {
              width: 100%; }
              .fk-why > ul > li .item-content__item--contents .fk-nav-tabs > li:not(:last-child) {
                margin-right: 4px; }
              .fk-why > ul > li .item-content__item--contents .fk-nav-tabs > li > a {
                text-align: center;
                border: none;
                box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.1);
                border-radius: 16px;
                width: 100%;
                font-size: 16px; }
          .fk-why > ul > li .item-content__item--contents .tab-content {
            padding: 48px 0 24px 0; }
            .fk-why > ul > li .item-content__item--contents .tab-content .tab-content-title {
              margin-top: 0;
              font-weight: 600;
              font-size: 16px;
              line-height: 24px;
              margin-bottom: 8px; }
            .fk-why > ul > li .item-content__item--contents .tab-content ul {
              list-style-type: none;
              padding: 0; }
              .fk-why > ul > li .item-content__item--contents .tab-content ul li {
                display: flex; }
                .fk-why > ul > li .item-content__item--contents .tab-content ul li::before {
                  content: "\2022";
                  color: #008065;
                  font-weight: bold;
                  display: inline-block;
                  width: 1em;
                  min-width: 1em;
                  max-width: 1em;
                  font-size: 24px;
                  line-height: 1em; }
            .fk-why > ul > li .item-content__item--contents .tab-content p {
              font-family: "Sarabun", sans-serif;
              font-size: 16px;
              font-weight: 300;
              line-height: 24px; }
            .fk-why > ul > li .item-content__item--contents .tab-content > .active.fk-why-tab-pane {
              display: flex;
              flex-direction: column; }
              .fk-why > ul > li .item-content__item--contents .tab-content > .active.fk-why-tab-pane .tab-description {
                display: flex;
                flex-grow: 1;
                min-height: 256px; }
                .fk-why > ul > li .item-content__item--contents .tab-content > .active.fk-why-tab-pane .tab-description .icon-container {
                  margin-right: 16px; }
            .fk-why > ul > li .item-content__item--contents .tab-content .tab-actions {
              padding-top: 32px;
              display: flex;
              justify-content: flex-end; }
              .fk-why > ul > li .item-content__item--contents .tab-content .tab-actions .register-link {
                display: inline-flex;
                align-items: center;
                color: #008065; }
                .fk-why > ul > li .item-content__item--contents .tab-content .tab-actions .register-link svg {
                  margin-left: 24px; }
      .fk-why > ul > li:nth-child(1) {
        position: relative;
        background-image: url(https://freshket-share-bucket.s3-ap-southeast-1.amazonaws.com/rewamp2021/images/fk_why-product-bg-m.png);
        background-position: left 74px; }
        .fk-why > ul > li:nth-child(1)::before {
          content: " ";
          position: absolute;
          right: -74px;
          z-index: -1;
          transform: rotate(-45deg);
          width: 148px;
          height: 74px;
          background-color: #00B28D;
          border-top-left-radius: 84px;
          border-top-right-radius: 84px;
          border-bottom: 0; }
        .fk-why > ul > li:nth-child(1)::after {
          content: " ";
          position: absolute;
          bottom: 0;
          left: -74px;
          z-index: -1;
          transform: rotate(45deg);
          width: 148px;
          height: 74px;
          background-color: #00B28D;
          border-top-left-radius: 84px;
          border-top-right-radius: 84px;
          border-bottom: 0; }
        .fk-why > ul > li:nth-child(1) .item-content__item--contents {
          padding-top: calc( 100vw + 16px + 74px); }
      .fk-why > ul > li:nth-child(2) {
        background-image: url(https://res.cloudinary.com/freshketimage001/image/upload/f_auto/v1636462275/freshket/landing/fk_why-service-bg-m.png); }
  @media only screen and (min-width: 992px) {
    .fk-why__title {
      font-weight: 600;
      font-size: 72px;
      line-height: 109px;
      margin-bottom: 56px; }
    .fk-why > ul > li {
      height: 902px;
      max-height: 902px;
      overflow: hidden;
      background-size: cover;
      background-position: center center;
      background-repeat: no-repeat; }
      .fk-why > ul > li .container {
        height: 100%; }
      .fk-why > ul > li .item-content {
        flex: 1;
        display: flex; }
        .fk-why > ul > li .item-content__item {
          z-index: 1;
          text-align: left;
          width: 602px;
          height: 500px; }
          .fk-why > ul > li .item-content__item--contents {
            padding: 32px 24px !important;
            background-color: #ffffff;
            border-radius: 40px;
            height: 100%; }
            .fk-why > ul > li .item-content__item--contents .fk-nav-tabs {
              border-bottom: 1px solid #D2D8E5; }
              .fk-why > ul > li .item-content__item--contents .fk-nav-tabs > li > a {
                background-color: #ffffff;
                border-radius: 0;
                box-shadow: none;
                font-weight: 500;
                font-size: 26px; }
              .fk-why > ul > li .item-content__item--contents .fk-nav-tabs > li.active > a {
                color: #008065;
                border-bottom: 3px solid #008065;
                border-radius: 1.5px; }
            .fk-why > ul > li .item-content__item--contents .tab-content {
              height: 100%; }
              .fk-why > ul > li .item-content__item--contents .tab-content > .active.fk-why-tab-pane {
                height: 100%; }
                .fk-why > ul > li .item-content__item--contents .tab-content > .active.fk-why-tab-pane .tab-description {
                  min-height: unset; }
              .fk-why > ul > li .item-content__item--contents .tab-content .tab-actions {
                padding: 32px 0 48px 0; }
              .fk-why > ul > li .item-content__item--contents .tab-content .tab-content-title {
                font-size: 20px; }
              .fk-why > ul > li .item-content__item--contents .tab-content p {
                font-size: 18px; }
          .fk-why > ul > li .item-content__item--description {
            padding-top: 0; }
      .fk-why > ul > li:nth-child(even) .item-content {
        justify-content: flex-end;
        height: 100%; }
        .fk-why > ul > li:nth-child(even) .item-content__item::after {
          content: " ";
          position: absolute;
          bottom: 0;
          margin-bottom: -370px;
          right: -296px;
          z-index: -1;
          transform: rotate(90deg);
          width: 592px;
          height: 296px;
          background-color: #00B28D;
          border-top-left-radius: 306px;
          border-top-right-radius: 306px;
          border-bottom: 0; }
      .fk-why > ul > li:nth-child(odd) .item-content__item::before {
        content: " ";
        position: absolute;
        bottom: 0;
        margin-bottom: -370px;
        left: -296px;
        z-index: -1;
        transform: rotate(-90deg);
        width: 592px;
        height: 296px;
        background-color: #00B28D;
        border-top-left-radius: 306px;
        border-top-right-radius: 306px;
        border-bottom: 0; }
      .fk-why > ul > li .item-content {
        align-items: center;
        height: 100%; }
        .fk-why > ul > li .item-content a.register-link {
          display: inline-flex;
          align-items: center;
          color: #008065;
          text-decoration: none; }
          .fk-why > ul > li .item-content a.register-link .link-icon {
            margin-left: 32px; }
      .fk-why > ul > li:nth-child(1) {
        background-image: url(https://freshket-share-bucket.s3-ap-southeast-1.amazonaws.com/rewamp2021/images/fk_why-product-bg.png);
        background-position: left top; }
        .fk-why > ul > li:nth-child(1) .item-content__item--contents {
          padding-top: 0; }
        .fk-why > ul > li:nth-child(1)::before {
          display: none; }
        .fk-why > ul > li:nth-child(1)::after {
          display: none; }
      .fk-why > ul > li:nth-child(2) {
        background-image: url(https://freshket-share-bucket.s3-ap-southeast-1.amazonaws.com/rewamp2021/images/fk_why-service-bg.png); } }

/* ---------------------------------------------------
    SKELETON STYLE
----------------------------------------------------- */
.fk-skeleton {
  width: 100%;
  height: 100%; }
  .fk-skeleton__bar {
    display: inline-block;
    height: 0.8em;
    position: relative;
    overflow: hidden;
    background-color: #edeff2;
    max-width: 100%; }
    .fk-skeleton__bar::after {
      position: absolute;
      top: 0;
      right: 0;
      bottom: 0;
      left: 0;
      transform: translateX(-100%);
      background-image: linear-gradient(90deg, rgba(247, 249, 252, 0) 0, rgba(247, 249, 252, 0.2) 20%, rgba(247, 249, 252, 0.5) 60%, rgba(247, 249, 252, 0));
      animation: shimmer 1s infinite;
      content: ''; }

@keyframes shimmer {
  100% {
    transform: translateX(100%); } }
  .fk-skeleton__minibar {
    display: inline-block;
    height: auto;
    position: relative;
    overflow: hidden;
    background-color: #edeff2;
    max-width: 100%;
    margin-right: 10px; }
    .fk-skeleton__minibar::after {
      position: absolute;
      top: 0;
      right: 0;
      bottom: 0;
      left: 0;
      transform: translateX(-100%);
      background-image: linear-gradient(90deg, rgba(247, 249, 252, 0) 0, rgba(247, 249, 252, 0.2) 20%, rgba(247, 249, 252, 0.5) 60%, rgba(247, 249, 252, 0));
      animation: shimmer 1s infinite;
      content: ''; }

@keyframes shimmer {
  100% {
    transform: translateX(100%); } }
  .fk-skeleton__recommend_container {
    width: 400px;
    max-width: 100%;
    padding: 8px;
    border-radius: 16px;
    margin-bottom: 0px;
    overflow: hidden; }
  .fk-skeleton__container {
    width: 400px;
    max-width: 100%;
    padding: 8px;
    border-radius: 16px;
    margin-bottom: 24px;
    overflow: hidden; }
  .fk-skeleton.product-container {
    min-height: 300px;
    box-shadow: 0px 8px 24px rgba(0, 0, 0, 0.1); }
  .fk-skeleton.product-recommend-container {
    min-height: 30px;
    box-shadow: 0px 8px 24px rgba(0, 0, 0, 0.1); }
  .fk-skeleton.product-detail-container {
    min-height: 500px; }

.vertical-spacing > * + * {
  margin-top: 0.75em; }

.vertical-spacing--line > * + * {
  margin-top: 2em; }

.lds-ellipsis {
  display: inline-block;
  position: relative;
  width: 80px;
  height: 80px;
  z-index: 10000; }

.lds-ellipsis div {
  position: absolute;
  top: 33px;
  width: 13px;
  height: 13px;
  border-radius: 50%;
  background: #008065;
  animation-timing-function: cubic-bezier(0, 1, 1, 0); }

.lds-ellipsis div:nth-child(1) {
  left: 8px;
  animation: lds-ellipsis1 0.6s infinite; }

.lds-ellipsis div:nth-child(2) {
  left: 8px;
  animation: lds-ellipsis2 0.6s infinite; }

.lds-ellipsis div:nth-child(3) {
  left: 32px;
  animation: lds-ellipsis2 0.6s infinite; }

.lds-ellipsis div:nth-child(4) {
  left: 56px;
  animation: lds-ellipsis3 0.6s infinite; }

@keyframes lds-ellipsis1 {
  0% {
    transform: scale(0); }
  100% {
    transform: scale(1); } }

@keyframes lds-ellipsis3 {
  0% {
    transform: scale(1); }
  100% {
    transform: scale(0); } }

@keyframes lds-ellipsis2 {
  0% {
    transform: translate(0, 0); }
  100% {
    transform: translate(24px, 0); } }

.lds__position--center {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%); }

.fk-pageloading-container {
  position: fixed;
  z-index: 1000000;
  height: 100%;
  width: 100%;
  background-color: white; }

.incomplete-head {
  background-image: src(); }

/* ---------------------------------------------------
    HOME STYLE
----------------------------------------------------- */
.section-margin {
  margin-top: 32px; }
  @media only screen and (min-width: 992px) {
    .section-margin {
      margin-top: 56px; } }

.section-padding {
  padding: 48px 0; }

.fk-what {
  width: 100%;
  position: relative;
  z-index: 100;
  background: rgba(0, 0, 0, 0.1);
  overflow: hidden; }
  .fk-what__bt-custom {
    font-size: 18px;
    padding: 12px 40px; }
  .fk-what__item {
    position: relative;
    width: 100%;
    margin: auto; }
    .fk-what__item--content {
      display: flex;
      flex-direction: column;
      justify-content: flex-end;
      min-height: calc(100vh - 48px);
      max-height: 100%;
      background-image: none; }
      .fk-what__item--content .content-title-covid {
        position: relative;
        max-width: 100%;
        z-index: 100;
        color: #ffffff; }
        .fk-what__item--content .content-title-covid .jumbotron {
          background-color: transparent;
          margin-bottom: 0; }
        .fk-what__item--content .content-title-covid h1 {
          font-size: 32px; }
        .fk-what__item--content .content-title-covid h3 {
          font-size: 20px; }
        .fk-what__item--content .content-title-covid .header-title, .fk-what__item--content .content-title-covid .header-subtitle {
          margin-bottom: 12px; }
      .fk-what__item--content .content-title {
        position: relative;
        max-width: 100%;
        z-index: 100;
        color: #ffffff; }
        .fk-what__item--content .content-title .jumbotron {
          background-color: transparent;
          margin-bottom: 0; }
        .fk-what__item--content .content-title h1 {
          font-size: 40px; }
        .fk-what__item--content .content-title h3 {
          font-size: 20px; }
        .fk-what__item--content .content-title .header-title, .fk-what__item--content .content-title .header-subtitle {
          margin-bottom: 12px; }
        .fk-what__item--content .content-title a.vedio-preview-link {
          font-size: 14px;
          margin-top: 16px;
          display: inline-flex;
          align-items: center;
          color: #ffffff;
          text-decoration: none;
          width: auto; }
          .fk-what__item--content .content-title a.vedio-preview-link:hover {
            color: #008065; }
            .fk-what__item--content .content-title a.vedio-preview-link:hover svg {
              stroke: #008065; }
              .fk-what__item--content .content-title a.vedio-preview-link:hover svg circle {
                stroke: #008065; }
              .fk-what__item--content .content-title a.vedio-preview-link:hover svg path {
                stroke: #008065;
                fill: #008065; }
          .fk-what__item--content .content-title a.vedio-preview-link svg {
            margin-right: 8px; }
      .fk-what__item--content .background-vedio-container {
        max-width: 100%;
        inset: 0px;
        pointer-events: none;
        position: absolute !important; }
        .fk-what__item--content .background-vedio-container .background-vedio {
          position: absolute;
          z-index: 48;
          width: 100%;
          height: calc(100vh - 48px); }
          .fk-what__item--content .background-vedio-container .background-vedio > video {
            position: absolute;
            top: 50%;
            left: 50%;
            /*   -moz-transform: translate(-50%, -50%);
                        -webkit-transform: translate(-50%, -50%);*/
            transform: translate(-50%, -50%);
            min-width: 100%;
            min-height: 100%; }
      .fk-what__item--content .covid-text-content {
        width: 100%; }
      .fk-what__item--content .content-covid-left {
        z-index: 48;
        height: calc(75vh);
        background-image: url("https://res.cloudinary.com/freshketimage001/image/upload/f_auto/v1639469108/freshket/landing/fk_bg_resturant_mobile.png");
        background-repeat: no-repeat;
        background-size: cover;
        display: flex;
        flex-direction: column;
        justify-content: flex-end;
        padding-bottom: 5%; }
      .fk-what__item--content .content-covid-right {
        z-index: 48;
        height: calc(75vh);
        background-repeat: no-repeat;
        background-image: url("https://res.cloudinary.com/freshketimage001/image/upload/f_auto/v1639469376/freshket/landing/fk_bg_enduser_mobile.png");
        background-size: cover;
        display: flex;
        flex-direction: column;
        justify-content: flex-end;
        padding-bottom: 5%; }
  .fk-what .vedio-filter {
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 49;
    left: 0;
    top: 0;
    background: rgba(0, 0, 0, 0.1); }
  @media only screen and (min-width: 768px) and (max-device-width: 768px) {
    .fk-what__item--content {
      width: 100%;
      min-height: 100vh;
      background-image: url("https://freshket-share-bucket.s3-ap-southeast-1.amazonaws.com/rewamp2021/images/fk_bg_ipad.png");
      background-size: contain;
      background-position: center;
      background-repeat: no-repeat;
      min-height: calc(75vh); }
      .fk-what__item--content .covid-text-content {
        width: 90%; }
      .fk-what__item--content .content-covid-left {
        height: calc(75vh);
        background-size: cover;
        background-image: none;
        padding-bottom: 5%; }
      .fk-what__item--content .content-covid-right {
        z-index: 48;
        height: calc(75vh);
        background-image: none;
        padding-bottom: 5%; } }
  @media only screen and (min-width: 992px) {
    .fk-what .vedio-filter {
      background: rgba(0, 0, 0, 0.1); }
    .fk-what__item--content {
      width: 100%;
      min-height: 100vh;
      background-image: url("https://freshket-share-bucket.s3-ap-southeast-1.amazonaws.com/rewamp2021/images/fk_bg_desktop.png");
      background-size: contain;
      background-position: center;
      min-height: calc(100vh - 48px); }
      .fk-what__item--content .background-vedio-container .background-vedio > video {
        min-width: 100%;
        min-height: 100%; }
      .fk-what__item--content .covid-text-content {
        width: 60%; }
      .fk-what__item--content .content-covid-left {
        height: calc(100vh- 48px);
        background-size: cover;
        background-image: none;
        padding-bottom: 7%; }
      .fk-what__item--content .content-covid-right {
        z-index: 48;
        height: calc(100vh- 48px);
        background-image: none;
        padding-bottom: 7%; } }
  @media only screen and (min-device-width: 1024px) and (max-device-width: 1366px) and (-webkit-min-device-pixel-ratio: 2) {
    .fk-what__item--content {
      width: 100%;
      min-height: 100vh;
      background-image: url("https://freshket-share-bucket.s3-ap-southeast-1.amazonaws.com/rewamp2021/images/fk_bg_ipad.png");
      background-size: contain;
      background-position: center;
      background-repeat: no-repeat;
      min-height: calc(75vh); }
      .fk-what__item--content .covid-text-content {
        width: 90%; }
      .fk-what__item--content .content-covid-left {
        height: calc(75vh);
        background-size: cover;
        background-image: none;
        padding-bottom: 10%; }
      .fk-what__item--content .content-covid-right {
        z-index: 48;
        height: calc(75vh);
        background-image: none;
        padding-bottom: 10%; } }

.fk-reputation {
  display: flex;
  align-items: center;
  background-color: #FAFBFF;
  height: 500px;
  padding: 48px 0px 0px 0px; }
  .fk-reputation .content-justify-center {
    justify-content: center; }
  .fk-reputation .content-column {
    display: flex;
    justify-content: center;
    align-items: center; }
    .fk-reputation .content-column:last-child {
      margin-top: 42px; }
  .fk-reputation--icon {
    width: 18px; }
  .fk-reputation__header {
    margin-bottom: 56px; }
    .fk-reputation__header--title {
      font-weight: 600;
      font-size: 30px;
      text-align: center;
      margin-bottom: 0; }
    .fk-reputation__header--subtitle {
      font-size: 16px;
      text-align: center;
      margin-top: 8px;
      font-family: "Sarabun", sans-serif; }
  .fk-reputation .rate-content {
    display: flex; }
    .fk-reputation .rate-content__icon {
      margin-right: 8px; }
    .fk-reputation .rate-content__description {
      display: flex;
      flex-direction: column; }
      .fk-reputation .rate-content__description--number {
        font-weight: 600;
        font-size: 24px;
        line-height: 40px;
        color: #008065;
        margin-bottom: 0;
        margin-top: -3px; }
      .fk-reputation .rate-content__description--label {
        font-weight: 500;
        font-size: 14px;
        line-height: 32px;
        margin-bottom: 0;
        margin-top: -12px; }
  @media only screen and (min-width: 992px) {
    .fk-reputation {
      height: 425px;
      padding: 48px 0px; }
    .fk-reputation .content-column:last-child {
      margin-top: 0; }
    .fk-reputation__header {
      margin-bottom: 80px; }
      .fk-reputation__header--title {
        font-weight: 600;
        font-size: 46px; }
      .fk-reputation__header--subtitle {
        font-weight: normal;
        font-size: 16px; }
    .fk-reputation .rate-content {
      display: flex; }
      .fk-reputation .rate-content__icon {
        margin-right: 12px; }
      .fk-reputation .rate-content__description--number {
        font-size: 40px; }
      .fk-reputation .rate-content__description--label {
        font-size: 16px;
        margin: 0px; } }

.fk-testsimonial {
  padding: 80px 0px; }
  .fk-testsimonial__header--title {
    font-weight: 600;
    font-size: 30px;
    margin-bottom: 0; }
  .fk-testsimonial__header--subtitle {
    font-weight: 500;
    font-size: 16px;
    font-family: "Sarabun", sans-serif;
    margin-top: 8px; }
  .fk-testsimonial__brands {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin-left: auto;
    margin-right: auto;
    max-width: 100%;
    padding-top: 56px;
    padding-bottom: 56px; }
    .fk-testsimonial__brands--logo {
      width: 100%;
      max-width: 64px;
      max-height: 64px;
      margin: 24px 16px; }
  .fk-testsimonial__slider .slick-list {
    overflow-y: visible;
    overflow-x: hidden;
    padding-top: 10% !important;
    padding-bottom: 10% !important; }
  .fk-testsimonial__slider .slick-slide {
    margin-left: 8px;
    margin-right: 8px; }
  .fk-testsimonial__slider--slide.slick-current .description-footer svg,
  .fk-testsimonial__slider--slide.slick-current .description-footer path {
    fill: #008065; }
  .fk-testsimonial__slider--slide .child-element {
    display: block;
    width: 100%;
    height: 100%;
    background: #ffffff;
    box-shadow: 0px 10px 24px rgba(0, 0, 0, 0.1);
    border-radius: 40px;
    text-align: center; }
    .fk-testsimonial__slider--slide .child-element .badge-root {
      display: inline-flex;
      position: relative;
      flex-shrink: 0;
      margin-top: -4%;
      justify-content: center; }
      .fk-testsimonial__slider--slide .child-element .badge-root .badge-top-right-circle {
        right: 14%;
        top: 14%;
        -moz-transform: scale(1) translate(50%, 50%);
        -webkit-transform: scale(1) translate(50%, 50%);
        transform: scale(1) translate(50%, 50%); }
      .fk-testsimonial__slider--slide .child-element .badge-root .avatar-badge {
        background-color: #00ce7c;
        color: #00ce7c;
        boxshadow: 0 0 0 2px #008065;
        margin-left: -32%;
        margin-top: -10%; }
        .fk-testsimonial__slider--slide .child-element .badge-root .avatar-badge::after {
          position: absolute;
          top: 0;
          left: 0;
          width: 100%;
          height: 100%;
          border-radius: 50%;
          animation: ripple 1.2s infinite ease-in-out;
          border: 1px solid currentColor;
          content: ""; }
      .fk-testsimonial__slider--slide .child-element .badge-root .badge-dot {
        height: 14px;
        padding: 0;
        min-width: 14px;
        border-radius: 50%;
        border: 3px solid #ffffff; }

@keyframes ripple {
  0% {
    -moz-transform: scale(0.8);
    -webkit-transform: scale(0.8);
    transform: scale(0.8);
    opacity: 1; }
  100% {
    -moz-transform: scale(2.4);
    -webkit-transform: scale(2.4);
    transform: scale(2.4);
    opacity: 0; } }
    .fk-testsimonial__slider--slide .child-element__content {
      display: flex;
      flex-direction: column;
      height: auto; }
      .fk-testsimonial__slider--slide .child-element__content--header {
        font-weight: 600;
        font-size: 16px;
        text-align: center;
        margin-bottom: 12px; }
      .fk-testsimonial__slider--slide .child-element__content--subheader {
        font-weight: 500;
        font-size: 16px;
        padding: 0 16px;
        color: #a4aab9;
        text-align: center;
        margin-bottom: 12px;
        height: 2.2em;
        overflow: hidden;
        text-overflow: ellipsis; }
      .fk-testsimonial__slider--slide .child-element__content--description {
        padding: 16px;
        text-align: center;
        font-weight: 300;
        font-size: 16px;
        line-height: 32px;
        color: #191e28;
        height: 208px;
        overflow: hidden;
        margin-top: 16px;
        margin-bottom: 16px;
        overflow: hidden;
        flex-grow: 1;
        font-family: "Sarabun", sans-serif; }
      .fk-testsimonial__slider--slide .child-element__content .description-footer {
        color: #008065;
        text-align: center;
        padding: 32px; }
  @media only screen and (min-width: 992px) {
    .fk-testsimonial__brands {
      max-width: 860px; }
      .fk-testsimonial__brands--logo {
        width: 100%;
        max-width: 120px;
        max-height: 120px;
        margin: 24px; }
    .fk-testsimonial__header--title {
      font-size: 40px; }
    .fk-testsimonial__header--subtitle {
      font-size: 16px; } }
  @media only screen and (min-width: 1200px) {
    .fk-testsimonial__brands {
      max-width: 960px; }
      .fk-testsimonial__brands--logo {
        width: 100%;
        max-width: 120px;
        max-height: 120px;
        margin: 24px; }
    .fk-testsimonial__slider {
      width: 700px;
      margin: 0 auto;
      max-width: 80%; }
      .fk-testsimonial__slider .slick-slide {
        margin-left: -12%;
        margin-right: -12%; }
      .fk-testsimonial__slider .slick-list {
        padding-top: 10% !important;
        padding-bottom: 10% !important;
        padding-left: 15% !important;
        padding-right: 15% !important;
        overflow: visible; }
      .fk-testsimonial__slider .slick-dots {
        text-align: right;
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0; }
      .fk-testsimonial__slider .slick-track {
        max-width: 100% !important;
        -moz-transform: translate3d(0, 0, 0) !important;
        -webkit-transform: translate3d(0, 0, 0) !important;
        transform: translate3d(0, 0, 0) !important;
        perspective: 100px; }
      .fk-testsimonial__slider .slick-slide {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        margin: auto;
        opacity: 0;
        width: 100% !important;
        -moz-transform: translate3d(0, 0, 0);
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
        -moz-transition: transform 1s, opacity 1s;
        -webkit-transition: transform 1s, opacity 1s;
        transition: transform 1s, opacity 1s; }
      .fk-testsimonial__slider--slide.slick-snext,
      .fk-testsimonial__slider--slide .slick-sprev {
        display: block; }
      .fk-testsimonial__slider--slide.slick-current {
        opacity: 1;
        position: relative;
        display: block;
        z-index: 2; }
        .fk-testsimonial__slider--slide.slick-current .child-element {
          width: 100%;
          height: 100%; }
          .fk-testsimonial__slider--slide.slick-current .child-element .fk-avatar-circle {
            width: 67px;
            height: 67px; }
          .fk-testsimonial__slider--slide.slick-current .child-element .badge-dot {
            height: 20px;
            padding: 0;
            min-width: 20px;
            border-radius: 50%;
            border: 6px solid #ffffff; }
          .fk-testsimonial__slider--slide.slick-current .child-element__content--description {
            font-weight: 300;
            font-size: 20px;
            line-height: 36px; }
      .fk-testsimonial__slider--slide.slick-snext {
        opacity: 1;
        z-index: 1;
        perspective: 1000px;
        -webkit-transform: translate3d(80%, 0, -16px);
        -moz-transform: translate3d(80%, 0, -16px);
        transform: translate3d(80%, 0, -16px); }
      .fk-testsimonial__slider--slide.slick-sprev {
        opacity: 1;
        -webkit-transform: translate3d(-80%, 0, -16px);
        -moz-transform: translate3d(-80%, 0, -16px);
        transform: translate3d(-80%, 0, -16px); }
      .fk-testsimonial__slider--slide .child-element .fk-avatar-circle {
        width: 52px;
        height: 52px; }
      .fk-testsimonial__slider--slide .child-element .badge-root {
        display: inline-flex;
        position: relative;
        flex-shrink: 0;
        margin-top: -4%;
        justify-content: center; }
        .fk-testsimonial__slider--slide .child-element .badge-root .badge-top-right-circle {
          right: 14%;
          top: 14%;
          -moz-transform: scale(1) translate(50%, 50%);
          -webkit-transform: scale(1) translate(50%, 50%);
          transform: scale(1) translate(50%, 50%); }
        .fk-testsimonial__slider--slide .child-element .badge-root .avatar-badge {
          background-color: #00ce7c;
          color: #00ce7c;
          boxshadow: 0 0 0 2px #008065;
          margin-left: -32%;
          margin-top: -10%; }
          .fk-testsimonial__slider--slide .child-element .badge-root .avatar-badge::after {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            border-radius: 50%;
            animation: ripple 1.2s infinite ease-in-out;
            border: 1px solid currentColor;
            content: ""; }
        .fk-testsimonial__slider--slide .child-element .badge-root .badge-dot {
          height: 14px;
          padding: 0;
          min-width: 14px;
          border-radius: 50%;
          border: 3px solid #ffffff; }
      .fk-testsimonial__slider--slide .child-element__content--header {
        font-weight: 600;
        font-size: 22px; }
      .fk-testsimonial__slider--slide .child-element__content--subheader {
        font-weight: 500;
        font-size: 16px;
        padding: 0 16px;
        color: #a4aab9; }
      .fk-testsimonial__slider--slide .child-element__content--description {
        font-weight: 300;
        font-size: 18px;
        line-height: 32px;
        color: #191e28;
        height: 302px;
        margin-top: 8px;
        margin-bottom: 8px;
        padding: 8px 40px;
        overflow: hidden; }
      .fk-testsimonial__slider--slide .child-element__content .description-footer {
        color: #008065;
        text-align: center;
        padding: 8px 32px 32px 32px; } }

.fk-why {
  overflow-x: hidden; }
  .fk-why__title {
    font-weight: 600;
    font-size: 30px; }
  .fk-why__content {
    font-size: 16px !important; }
  .fk-why__link {
    font-size: 16px !important; }
  .fk-why > ul {
    list-style-type: none; }
    .fk-why > ul.disable-gutter {
      padding: 0; }
    .fk-why > ul > li {
      background-size: 100vw 100vw;
      background-repeat: no-repeat;
      background-position: left top; }
      .fk-why > ul > li .item-content__item {
        width: 100%;
        max-width: 100%; }
        .fk-why > ul > li .item-content__item--contents {
          padding: calc( 100vw + 16px) 0 16px 0; }
          .fk-why > ul > li .item-content__item--contents .fk-nav-tabs {
            border: none;
            display: flex;
            align-items: center; }
            .fk-why > ul > li .item-content__item--contents .fk-nav-tabs > li {
              width: 100%; }
              .fk-why > ul > li .item-content__item--contents .fk-nav-tabs > li:not(:last-child) {
                margin-right: 4px; }
              .fk-why > ul > li .item-content__item--contents .fk-nav-tabs > li > a {
                text-align: center;
                border: none;
                box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.1);
                border-radius: 16px;
                width: 100%;
                font-size: 20px; }
          .fk-why > ul > li .item-content__item--contents .tab-content {
            padding: 48px 0 24px 0; }
            .fk-why > ul > li .item-content__item--contents .tab-content .tab-content-title {
              margin-top: 0;
              font-weight: 600;
              font-size: 16px;
              line-height: 24px;
              margin-bottom: 8px; }
            .fk-why > ul > li .item-content__item--contents .tab-content ul {
              list-style-type: none;
              padding: 0; }
              .fk-why > ul > li .item-content__item--contents .tab-content ul li {
                display: flex; }
                .fk-why > ul > li .item-content__item--contents .tab-content ul li::before {
                  content: "\2022";
                  color: #008065;
                  font-weight: bold;
                  display: inline-block;
                  width: 1em;
                  min-width: 1em;
                  max-width: 1em;
                  font-size: 24px;
                  line-height: 1em; }
            .fk-why > ul > li .item-content__item--contents .tab-content p {
              font-family: "Sarabun", sans-serif;
              font-size: 16px;
              font-weight: 300;
              line-height: 24px; }
            .fk-why > ul > li .item-content__item--contents .tab-content > .active.fk-why-tab-pane {
              display: flex;
              flex-direction: column; }
              .fk-why > ul > li .item-content__item--contents .tab-content > .active.fk-why-tab-pane .tab-description {
                display: flex;
                flex-grow: 1;
                min-height: 256px; }
                .fk-why > ul > li .item-content__item--contents .tab-content > .active.fk-why-tab-pane .tab-description .icon-container {
                  margin-right: 16px; }
            .fk-why > ul > li .item-content__item--contents .tab-content .tab-actions {
              padding-top: 32px;
              display: flex;
              justify-content: flex-end; }
              .fk-why > ul > li .item-content__item--contents .tab-content .tab-actions .register-link {
                display: inline-flex;
                align-items: center;
                color: #008065; }
                .fk-why > ul > li .item-content__item--contents .tab-content .tab-actions .register-link svg {
                  margin-left: 24px; }
      .fk-why > ul > li:nth-child(1) {
        position: relative;
        background-image: url(https://res.cloudinary.com/freshketimage001/image/upload/f_auto/v1636462275/freshket/landing/fk_why-product-bg-m.png);
        background-position: left 74px; }
        .fk-why > ul > li:nth-child(1)::before {
          content: " ";
          position: absolute;
          right: -74px;
          z-index: -1;
          -moz-transform: rotate(-45deg);
          -webkit-transform: rotate(-45deg);
          transform: rotate(-45deg);
          width: 148px;
          height: 74px;
          background-color: #00B28D;
          border-top-left-radius: 84px;
          border-top-right-radius: 84px;
          border-bottom: 0; }
        .fk-why > ul > li:nth-child(1)::after {
          content: " ";
          position: absolute;
          bottom: 0;
          left: -74px;
          z-index: -1;
          -moz-transform: rotate(45deg);
          -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
          width: 148px;
          height: 74px;
          background-color: #00B28D;
          border-top-left-radius: 84px;
          border-top-right-radius: 84px;
          border-bottom: 0; }
        .fk-why > ul > li:nth-child(1) .item-content__item--contents {
          padding-top: calc( 100vw + 16px + 74px); }
      .fk-why > ul > li:nth-child(2) {
        background-image: url(https://res.cloudinary.com/freshketimage001/image/upload/f_auto/v1636462275/freshket/landing/fk_why-service-bg-m.png); }
  @media only screen and (min-width: 992px) {
    .fk-why__title {
      font-weight: 600;
      font-size: 40px;
      line-height: 109px;
      margin-bottom: 56px; }
    .fk-why__tag {
      font-size: 24px !important; }
    .fk-why > ul > li {
      height: 902px;
      max-height: 902px;
      overflow: hidden;
      background-size: cover;
      background-position: center center;
      background-repeat: no-repeat; }
      .fk-why > ul > li .container {
        height: 100%; }
      .fk-why > ul > li .item-content {
        flex: 1;
        display: flex; }
        .fk-why > ul > li .item-content__item {
          z-index: 1;
          text-align: left;
          width: 602px;
          height: 500px; }
          .fk-why > ul > li .item-content__item--contents {
            padding: 32px 24px !important;
            background-color: #ffffff;
            border-radius: 40px;
            height: 100%; }
            .fk-why > ul > li .item-content__item--contents .fk-nav-tabs {
              border-bottom: 1px solid #D2D8E5; }
              .fk-why > ul > li .item-content__item--contents .fk-nav-tabs > li > a {
                background-color: #ffffff;
                border-radius: 0;
                box-shadow: none;
                font-weight: 500;
                font-size: 26px; }
              .fk-why > ul > li .item-content__item--contents .fk-nav-tabs > li.active > a {
                color: #008065;
                border-bottom: 3px solid #008065;
                border-radius: 1.5px; }
            .fk-why > ul > li .item-content__item--contents .tab-content {
              height: 100%; }
              .fk-why > ul > li .item-content__item--contents .tab-content > .active.fk-why-tab-pane {
                height: 100%; }
                .fk-why > ul > li .item-content__item--contents .tab-content > .active.fk-why-tab-pane .tab-description {
                  min-height: unset; }
              .fk-why > ul > li .item-content__item--contents .tab-content .tab-actions {
                padding: 32px 0 48px 0; }
              .fk-why > ul > li .item-content__item--contents .tab-content .tab-content-title {
                font-size: 20px; }
              .fk-why > ul > li .item-content__item--contents .tab-content p {
                font-size: 18px; }
          .fk-why > ul > li .item-content__item--description {
            padding-top: 0; }
      .fk-why > ul > li:nth-child(even) .item-content {
        justify-content: flex-end;
        height: 100%; }
        .fk-why > ul > li:nth-child(even) .item-content__item::after {
          content: " ";
          position: absolute;
          bottom: 0;
          margin-bottom: -370px;
          right: -296px;
          z-index: -1;
          -moz-transform: rotate(90deg);
          -webkit-transform: rotate(90deg);
          transform: rotate(90deg);
          width: 592px;
          height: 296px;
          background-color: #00B28D;
          border-top-left-radius: 306px;
          border-top-right-radius: 306px;
          border-bottom: 0; }
      .fk-why > ul > li:nth-child(odd) .item-content__item::before {
        content: " ";
        position: absolute;
        bottom: 0;
        margin-bottom: -370px;
        left: -296px;
        z-index: -1;
        -moz-transform: rotate(-90deg);
        -webkit-transform: rotate(-90deg);
        transform: rotate(-90deg);
        width: 592px;
        height: 296px;
        background-color: #00B28D;
        border-top-left-radius: 306px;
        border-top-right-radius: 306px;
        border-bottom: 0; }
      .fk-why > ul > li .item-content {
        align-items: center;
        height: 100%; }
        .fk-why > ul > li .item-content a.register-link {
          display: inline-flex;
          align-items: center;
          color: #008065;
          text-decoration: none; }
          .fk-why > ul > li .item-content a.register-link .link-icon {
            margin-left: 32px; }
      .fk-why > ul > li:nth-child(1) {
        background-image: url(https://freshket-share-bucket.s3-ap-southeast-1.amazonaws.com/rewamp2021/images/fk_why-product-bg.png);
        background-position: left top; }
        .fk-why > ul > li:nth-child(1) .item-content__item--contents {
          padding-top: 0; }
        .fk-why > ul > li:nth-child(1)::before {
          display: none; }
        .fk-why > ul > li:nth-child(1)::after {
          display: none; }
      .fk-why > ul > li:nth-child(2) {
        background-image: url(https://freshket-share-bucket.s3-ap-southeast-1.amazonaws.com/rewamp2021/images/fk_why-service-bg.png); } }

.fk-easystep {
  background: url(https://freshket-share-bucket.s3-ap-southeast-1.amazonaws.com/rewamp2021/images/landing/bg-how-mobile.png);
  background-repeat: no-repeat;
  background-size: 100% 1024px;
  font-family: "Prompt";
  /* [SLICK BOTTON LEFT-RIGHT] */
  /* [END] */ }
  .fk-easystep a {
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
    overflow: hidden;
    padding: 0px 5px;
    color: #fff;
    text-decoration: none; }
    .fk-easystep a img {
      display: block;
      width: 100%;
      height: auto;
      border-radius: 50%; }
    .fk-easystep a span {
      display: block;
      color: black;
      bottom: 0;
      left: 0;
      right: 0;
      padding: 10px 20px;
      text-align: center; }
    .fk-easystep a:visited {
      text-decoration: none; }
    .fk-easystep a:hover {
      text-decoration: none; }
    .fk-easystep a:active {
      text-decoration: none; }
    .fk-easystep a:link {
      text-decoration: none; }
  .fk-easystep p {
    font-family: "Sarabun", sans-serif; }
  .fk-easystep .js-3step-carousel {
    height: 630px; }
  .fk-easystep__center-block {
    display: flex;
    justify-content: center;
    align-items: center; }
  .fk-easystep__header {
    font-size: 30px;
    font-weight: 600;
    color: #ffffff;
    width: 95vw;
    margin-top: 56px;
    margin-bottom: 42px; }
  .fk-easystep__topic {
    font-size: 24px;
    font-weight: 500;
    color: #fff; }
  .fk-easystep__paragraph {
    font-size: 16px;
    font-weight: 400;
    color: #fff;
    line-height: 1.5em;
    height: 3em;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 100%; }
  .fk-easystep__container {
    display: flex;
    flex-direction: column;
    align-items: center;
    min-height: 1025px; }
  .fk-easystep__mobile__container {
    max-height: 0px;
    margin: auto;
    max-width: 0%; }
  .fk-easystep__content-container {
    margin: auto;
    margin-top: 32px; }
  .fk-easystep__content {
    font-size: 24px;
    font-weight: 400;
    coloe: #494f5f;
    max-width: 420px;
    margin: 8px 0px;
    line-height: 40px; }
  .fk-easystep__download {
    display: inline-flex;
    z-index: 1000;
    border-radius: 0px !important;
    height: 42px !important;
    width: auto !important; }
  .fk-easystep__wrapper {
    width: 95vw;
    padding: 0px 0px;
    overflow: hidden; }
  .fk-easystep__position {
    margin-bottom: 74px; }
  .fk-easystep .slick-dots {
    display: flex;
    justify-content: center;
    right: 0px;
    bottom: 0px;
    margin: auto;
    list-style-type: none;
    padding: 0px; }
    .fk-easystep .slick-dots li {
      -moz-transform: translateY(-40px);
      -webkit-transform: translateY(-40px);
      transform: translateY(-40px);
      list-style: none;
      display: inline-block;
      margin: 5px 18px; }
      .fk-easystep .slick-dots li svg {
        opacity: 0.7; }
        .fk-easystep .slick-dots li svg:hover {
          cursor: pointer; }
      .fk-easystep .slick-dots li.slick-active svg rect {
        stroke: #fff; }
      .fk-easystep .slick-dots li.slick-active div {
        color: #fff; }
      .fk-easystep .slick-dots li.slick-active svg {
        opacity: 1;
        fill: #fff; }
        .fk-easystep .slick-dots li.slick-active svg rect {
          fill: #fff; }
      .fk-easystep .slick-dots li.slick-active svg:first-child {
        fill: #00b28d; }
  .fk-easystep .slick-slider {
    display: flex;
    flex-wrap: wrap; }
  .fk-easystep .slick-list {
    width: 100%; }
  .fk-easystep .slick-slide {
    user-select: none; }
    .fk-easystep .slick-slide:focus,
    .fk-easystep .slick-slide a {
      outline: none; }
  .fk-easystep .step {
    margin: 0px 8px 32px 8px; }
  .fk-easystep img {
    width: auto;
    height: 380px;
    margin: auto; }
  .fk-easystep .slick-prev,
  .fk-easystep .slick-next {
    z-index: 1000;
    position: absolute;
    line-height: 0;
    top: 84%;
    width: 30px;
    height: 30px;
    display: block;
    padding: 0;
    -moz-transform: translate(0px, -50%);
    -webkit-transform: translate(0px, -50%);
    transform: translate(0px, -50%);
    cursor: pointer;
    color: transparent;
    border: none;
    outline: none;
    border-radius: 50px;
    background: transparent;
    -moz-filter: invert(89%) sepia(0%) saturate(0%) hue-rotate(172deg) brightness(102%) contrast(99%);
    -webkit-filter: invert(89%) sepia(0%) saturate(0%) hue-rotate(172deg) brightness(102%) contrast(99%);
    filter: invert(89%) sepia(0%) saturate(0%) hue-rotate(172deg) brightness(102%) contrast(99%); }
    @media only screen and (min-width: 991px) {
      .fk-easystep .slick-prev,
      .fk-easystep .slick-next {
        top: 56%; } }
    @media (hover: hover) {
      .fk-easystep .slick-prev:hover,
      .fk-easystep .slick-next:hover {
        -moz-filter: invert(0%) sepia(89%) saturate(4%) hue-rotate(314deg) brightness(84%) contrast(100%);
        -webkit-filter: invert(0%) sepia(89%) saturate(4%) hue-rotate(314deg) brightness(84%) contrast(100%);
        filter: invert(0%) sepia(89%) saturate(4%) hue-rotate(314deg) brightness(84%) contrast(100%); } }
  .fk-easystep .slick-slider {
    user-select: none; }
  .fk-easystep .slick-next {
    right: 14vw;
    -moz-transform: translateY(5vh);
    -webkit-transform: translateY(5vh);
    transform: translateY(5vh); }
  .fk-easystep .slick-prev {
    left: 16vw;
    -moz-transform: translateY(5vh);
    -webkit-transform: translateY(5vh);
    transform: translateY(5vh); }
  .fk-easystep .slick-slide:focus,
  .fk-easystep .slick-slide a {
    outline: none; }
  .fk-easystep .slick-next:before {
    content: "";
    display: block;
    background: url("https://freshket-share-bucket.s3-ap-southeast-1.amazonaws.com/rewamp2021/images/landing/arrow-alt.svg") no-repeat;
    -moz-filter: invert(100%) sepia(98%) saturate(8%) hue-rotate(170deg) brightness(101%) contrast(101%);
    -webkit-filter: invert(100%) sepia(98%) saturate(8%) hue-rotate(170deg) brightness(101%) contrast(101%);
    filter: invert(100%) sepia(98%) saturate(8%) hue-rotate(170deg) brightness(101%) contrast(101%);
    background-size: 42px 42px;
    height: 42px;
    width: 42px;
    -moz-transform: translate(0px, -50%);
    -webkit-transform: translate(0px, -50%);
    transform: translate(0px, -50%); }
  .fk-easystep .slick-prev:before {
    content: "";
    display: block;
    background: url("https://freshket-share-bucket.s3-ap-southeast-1.amazonaws.com/rewamp2021/images/landing/arrow-alt.svg") no-repeat;
    -moz-filter: invert(100%) sepia(98%) saturate(8%) hue-rotate(170deg) brightness(101%) contrast(101%);
    -webkit-filter: invert(100%) sepia(98%) saturate(8%) hue-rotate(170deg) brightness(101%) contrast(101%);
    filter: invert(100%) sepia(98%) saturate(8%) hue-rotate(170deg) brightness(101%) contrast(101%);
    background-size: 42px 42px;
    height: 42px;
    width: 42px;
    -moz-transform: translate(-50%, -50%) rotate(180deg);
    -webkit-transform: translate(-50%, -50%) rotate(180deg);
    transform: translate(-50%, -50%) rotate(180deg); }
  @media only screen and (max-width: 768px) {
    .fk-easystep .js-3step-carousel {
      height: 630px; }
    .fk-easystep__mobile__container {
      max-height: 400px;
      margin: auto;
      max-width: 100%; }
    .fk-easystep__content-container {
      margin: 32px; }
    .fk-easystep img {
      width: auto; }
    .fk-easystep .step {
      margin: 0px; }
    .fk-easystep .slick-next {
      top: 84%;
      right: 10vw;
      -moz-transform: translateY(5vh);
      -webkit-transform: translateY(5vh);
      transform: translateY(5vh); }
    .fk-easystep .slick-prev {
      top: 84%;
      left: 12vw;
      -moz-transform: translateY(5vh);
      -webkit-transform: translateY(5vh);
      transform: translateY(5vh); }
    .fk-easystep .slick-dots {
      padding: 0px; } }
  @media only screen and (min-width: 991px) {
    .fk-easystep {
      background: url(https://freshket-share-bucket.s3-ap-southeast-1.amazonaws.com/rewamp2021/images/fk-how-bg.png);
      background-repeat: no-repeat;
      background-size: 100% 1152px;
      background-position: center top; }
    .fk-easystep .js-3step-carousel {
      height: 800px;
      padding-top: 170px !important; }
    .fk-easystep__topic {
      color: #004c3c;
      text-align: left;
      width: 300px; }
      .fk-easystep__topic:hover {
        cursor: pointer; }
    .fk-easystep__paragraph {
      color: #004c3c;
      font-family: "Sarabun", sans-serif; }
      .fk-easystep__paragraph:hover {
        cursor: pointer; }
    .fk-easystep__img__container {
      width: auto !important;
      max-height: 612px;
      margin: auto;
      margin-top: 56px !important; }
    .fk-easystep__header {
      font-size: 40px;
      font-weight: 600;
      color: #ffffff;
      margin: 128px 0px 0px 0px; }
    .fk-easystep__wrapper img {
      width: auto;
      height: 800px;
      margin: auto; }
    .fk-easystep__container {
      display: flex;
      flex-direction: column;
      align-items: center; }
    .fk-easystep__newline {
      display: none; }
    .fk-easystep__position {
      position: absolute;
      top: 857px;
      left: 136px; }
    .fk-easystep .slick-next {
      right: 50%;
      -moz-transform: translate(300px, 6vh);
      -webkit-transform: translate(300px, 6vh);
      transform: translate(300px, 6vh); }
    .fk-easystep .slick-prev {
      left: 50%;
      -moz-transform: translate(300px, 6vh);
      -webkit-transform: translate(300px, 6vh);
      transform: translate(-300px, 6vh); }
    .fk-easystep .slick-dots {
      margin: 0px;
      display: flex;
      justify-content: space-around;
      flex-direction: row;
      position: absolute;
      left: -50px;
      top: 92px;
      padding: 10px;
      list-style-type: none;
      height: 150px; }
      .fk-easystep .slick-dots svg {
        margin: 4px;
        align-self: start; }
        .fk-easystep .slick-dots svg:hover {
          cursor: pointer; }
    .fk-easystep .slick-dots li {
      list-style: none;
      display: inline-block;
      max-height: 100px;
      max-width: none; }
    .fk-easystep .step {
      position: absolute;
      -moz-transform: translateX(-50px);
      -webkit-transform: translateX(-50px);
      transform: translateX(-50px); } }

.fk-insight {
  background: none;
  -webkit-background-size: none;
  -moz-background-size: none;
  -o-background-size: none;
  background-size: none; }

@keyframes blinker {
  50% {
    opacity: 1; }
  49% {
    opacity: 1; }
  50% {
    opacity: 0; }
  99% {
    opacity: 0; }
  100% {
    opacity: 1; } }
  .fk-insight__applyshadow {
    -moz-filter: none;
    -webkit-filter: none;
    filter: drop-shadow(0px 24px 32px rgba(73, 79, 95, 0.32)); }
  .fk-insight p {
    font-size: 16px;
    font-family: Sarabun, sans-serif;
    margin: 5px 0px !important;
    color: #494f5f; }
  .fk-insight a {
    text-decoration: none; }
  .fk-insight__container {
    display: flex;
    flex-direction: column;
    align-items: center;
    min-height: 1462px; }
  .fk-insight__innerlayout {
    padding-left: 4px !important;
    padding-right: 4px !important; }
  .fk-insight__header {
    font-family: Prompt;
    font-size: 40px;
    font-weight: 600;
    color: #191e28;
    max-width: 380px;
    margin-top: 80px; }
    .fk-insight__header--blue {
      color: #2174d8; }
    .fk-insight__header__cursor {
      display: inline-block;
      width: 3px;
      background-color: #494f5f;
      margin-left: 5px;
      animation: blinker 1s infinite; }
  .fk-insight__download {
    height: 42px;
    margin-top: 24px;
    margin-bottom: 98px;
    max-width: 414px;
    font-size: 24px; }
    .fk-insight__download--left {
      display: flex;
      justify-content: flex-end; }
  .fk-insight__icon {
    width: 24px;
    -moz-filter: invert(55%) sepia(57%) saturate(5159%) hue-rotate(189deg) brightness(87%) contrast(94%);
    -webkit-filter: invert(55%) sepia(57%) saturate(5159%) hue-rotate(189deg) brightness(87%) contrast(94%);
    filter: invert(55%) sepia(57%) saturate(5159%) hue-rotate(189deg) brightness(87%) contrast(94%); }
  .fk-insight__content__container {
    margin-top: 176px; }
    .fk-insight__content__container .col-xs-12 {
      margin-bottom: 62px; }
  .fk-insight__content--align-center {
    display: flex;
    align-items: center; }
  .fk-insight__content--align-right {
    display: flex;
    justify-content: flex-end; }
  @media only screen and (max-width: 580px) {
    .fk-insight {
      background: url(https://freshket-share-bucket.s3-ap-southeast-1.amazonaws.com/rewamp2021/images/landing/BG-insight.png) no-repeat;
      background-repeat: no-repeat;
      background-size: 100% 100%; }
    .fk-insight__header {
      font-size: 38px !important; } }

.fk-insight-desktop {
  background: url(https://freshket-share-bucket.s3-ap-southeast-1.amazonaws.com/rewamp2021/images/landing/BG-insight-desktop.png) no-repeat;
  background-repeat: no-repeat;
  background-size: 100% 100%; }

@keyframes blinker {
  50% {
    opacity: 1; }
  49% {
    opacity: 1; }
  50% {
    opacity: 0; }
  99% {
    opacity: 0; }
  100% {
    opacity: 1; } }
  .fk-insight-desktop__applyshadow {
    -moz-filter: none;
    -webkit-filter: none;
    filter: drop-shadow(0px 24px 32px rgba(73, 79, 95, 0.32));
    width: 90%;
    height: 90%; }
  .fk-insight-desktop a {
    display: inline-flex;
    text-decoration: none; }
  .fk-insight-desktop p {
    font-family: Sarabun, sans-serif; }
  .fk-insight-desktop__container {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    background-color: #fafbff;
    min-height: 981px; }
    .fk-insight-desktop__container--align-center {
      display: flex;
      align-items: center; }
  .fk-insight-desktop__header {
    font-size: 56px;
    font-weight: 600;
    margin-bottom: 44px;
    font-family: Prompt; }
    .fk-insight-desktop__header--blue {
      color: #2174d8; }
    .fk-insight-desktop__header__cursor {
      display: inline-block;
      width: 3px;
      background-color: #191e28;
      margin-left: 5px;
      animation: blinker 1s infinite; }
  .fk-insight-desktop__clear {
    padding: 0px; }
  .fk-insight-desktop__content {
    font-size: 16px;
    line-height: 30px; }
    .fk-insight-desktop__content--bt-margin {
      margin-bottom: 72px; }
  .fk-insight-desktop__icon {
    width: 48px;
    -moz-filter: invert(55%) sepia(57%) saturate(5159%) hue-rotate(189deg) brightness(87%) contrast(94%);
    -webkit-filter: invert(55%) sepia(57%) saturate(5159%) hue-rotate(189deg) brightness(87%) contrast(94%);
    filter: invert(55%) sepia(57%) saturate(5159%) hue-rotate(189deg) brightness(87%) contrast(94%);
    margin-bottom: 16px; }
  .fk-insight-desktop__download {
    height: 62px; }
    .fk-insight-desktop__download__container {
      margin-bottom: 142px; }
    .fk-insight-desktop__download--left {
      margin-left: 8px; }

.fk-explore {
  max-height: 1400px;
  background-color: #fafbff; }
  .fk-explore a:hover {
    text-decoration: none;
    color: #494f5f !important; }
  .fk-explore a:visited {
    text-decoration: none;
    color: #494f5f !important; }
  .fk-explore a:active {
    text-decoration: none;
    color: #494f5f !important; }
  .fk-explore a:link {
    text-decoration: none;
    color: #494f5f !important; }
  .fk-explore p {
    font-family: Sarabun, sans-serif;
    font-size: 16px !important;
    font-weight: 400;
    text-align: center !important;
    text-decoration: none;
    margin: 0 0 24px; }
    .fk-explore p:hover {
      text-decoration: none;
      color: #494f5f !important; }
  .fk-explore img {
    width: 94%;
    height: auto;
    margin: 10px auto; }
  .fk-explore__allcat {
    max-width: 373px;
    margin: 60px auto 70px auto; }
  .fk-explore__container {
    display: flex;
    flex-direction: column;
    align-items: center;
    min-height: 997px;
    background-color: #fafbff; }
  .fk-explore__newline {
    display: none; }
  .fk-explore__header {
    font-size: 30px;
    font-weight: 600;
    color: #008065;
    max-width: 500px;
    margin: 70px auto 0px auto;
    font-family: Prompt; }
  .fk-explore__content {
    font-size: 24px;
    font-weight: 400;
    color: #494f5f;
    max-width: 500px;
    margin: 16px auto 56px auto !important;
    padding-left: 18px;
    padding-right: 18px;
    font-family: Sarabun, sans-serif; }
  .fk-explore__wrapper {
    width: 100%;
    padding: 0px 18px;
    overflow: hidden; }
  .fk-explore img + p {
    line-height: 1.5em;
    height: 3em;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 100%; }
  .fk-explore__rectangle {
    margin: 10px auto;
    padding: 8px;
    width: 140px;
    height: 140px;
    background: blue;
    border-radius: 40px; }
  .fk-explore .slick-slider {
    user-select: none; }
  .fk-explore .slick-slide:focus,
  .fk-explore .slick-slide a {
    outline: none; }
  .fk-explore .slick-slide {
    user-select: none; }
    .fk-explore .slick-slide:focus,
    .fk-explore .slick-slide button {
      outline: none; }
  .fk-explore .slick-dots {
    display: flex;
    justify-content: center;
    margin: auto;
    list-style-type: none; }
    .fk-explore .slick-dots li {
      margin: 0 2px; }
    .fk-explore .slick-dots button {
      display: block;
      width: 1rem;
      height: 1rem;
      padding: 0;
      outline: none;
      border: none;
      border-radius: 100%;
      background-color: #c2c5cc;
      text-indent: -9999px; }
    .fk-explore .slick-dots li.slick-active button {
      background-color: #00ce7c; }
  @media only screen and (min-width: 992px) {
    .fk-explore .newline {
      display: none; }
    .fk-explore__wrapper {
      padding: 0px 72px; }
    .fk-explore__container {
      min-height: 1053px; }
    .fk-explore__header {
      font-size: 40px;
      margin: 162px auto 0px auto;
      line-height: 60px; }
    .fk-explore__content {
      font-size: 24px !important;
      margin: 8px auto 83px auto !important; }
    .fk-explore__allcat {
      margin-top: 82px; }
      .fk-explore__allcat:hover {
        text-decoration: none; } }

footer {
  font-size: 16px; }

.nav-info {
  background-color: #008065; }
  .nav-info__container {
    display: flex;
    justify-content: center;
    padding: 20px 62px 20px 62px; }
    .nav-info__container > a:not(:last-child)::after {
      content: "\00a0\00a0\00a0\00a0|";
      color: #004c3c; }
    .nav-info__container > a:not(:first-child)::before {
      content: "\00a0\00a0\00a0\00a0";
      color: #004c3c; }
    .nav-info__container > a:hover {
      color: inherit;
      text-decoration: none; }
  .nav-info__link {
    text-decoration: none;
    color: #ffffff; }
    .nav-info__link:hover, .nav-info__link:active, .nav-info__link:focus {
      color: #004c3c;
      text-decoration: none; }

.nav-end {
  background-color: #004c3c; }
  .nav-end__container {
    padding: 8px 0px; }
  .nav-end__social-group {
    text-align: left; }
    .nav-end__social-group > a:not(:last-child) {
      margin-right: 32px; }
  .nav-end__copyright {
    text-align: right;
    color: #fff; }
  .nav-end__logo {
    width: 18px;
    height: 18px; }
  .nav-end__btn {
    padding: 0;
    color: #ffffff;
    background-color: Transparent;
    background-repeat: no-repeat;
    border: none;
    cursor: pointer;
    overflow: hidden;
    outline: none; }
  .nav-end__dropdown-menu {
    text-align: left;
    transform: translate(10%, 0); }

@media only screen and (max-width: 992px) {
  .nav-info {
    font-size: 16px;
    background-color: #008065; }
    .nav-info__container {
      display: grid;
      grid-template-columns: 100%;
      padding: 42px 32px; }
      .nav-info__container > a:not(:last-child)::after {
        content: none; }
      .nav-info__container > a:not(:last-child) {
        border-bottom: 1px solid #004c3c; }
      .nav-info__container > a:not(:first-child)::before {
        content: none; }
    .nav-info__link {
      padding: 32px 24px; }
      .nav-info__link--center {
        text-align: center; }
  .nav-end {
    font-size: 30px;
    background-color: #004c3c; }
    .nav-end__container {
      padding: 52px 0px 32px 0px; }
    .nav-end__social-group {
      text-align: center; }
      .nav-end__social-group > a:not(:last-child) {
        margin-right: 32px; }
    .nav-end__copyright {
      text-align: center;
      padding: 20px 0px 20px 0px;
      font-size: 14px; }
    .nav-end__dropdown {
      text-align: center;
      padding: 20px 0px 20px 0px; }
    .nav-end__logo {
      width: 24px;
      height: 24px; }
    .nav-end__dropdown-menu {
      left: 50%;
      right: auto;
      text-align: center;
      transform: translate(-50%, -15px); } }

.fk-contact-us__title {
  margin: 48px 0px 36px; }
  .fk-contact-us__title > h1::after {
    text-align: center;
    display: block;
    width: 100px;
    height: 4px;
    border-radius: 16px;
    background: #008065;
    content: "\A";
    white-space: pre;
    margin: auto;
    margin-top: 16px; }

.fk-contact-us__map {
  height: 450px;
  width: 100%;
  margin-bottom: 16px; }
  .fk-contact-us__map iframe {
    width: 100%;
    height: 100%; }

.fk-contact-us__office-content h4 {
  color: black;
  font-size: 24px;
  font-weight: bold; }

.fk-contact-us__office-content p {
  color: #191e28;
  font-style: normal;
  font-size: 20px;
  font-weight: normal; }

@media only screen and (max-width: 768px) {
  .fk-contact-us__title {
    margin: 48px 0px 36px; }
    .fk-contact-us__title > h1::after {
      text-align: center;
      display: block;
      width: 100px;
      height: 4px;
      border-radius: 16px;
      background: #008065;
      content: "\A";
      white-space: pre;
      margin: auto;
      margin-top: 16px; }
  .fk-contact-us__map {
    height: 200px;
    width: 100%; }
    .fk-contact-us__map iframe {
      width: 100%;
      height: 100%; }
  .fk-contact-us__office-content {
    padding: 0px; }
    .fk-contact-us__office-content h4 {
      color: black;
      font-size: 20px;
      font-weight: bold; }
    .fk-contact-us__office-content p {
      font-style: normal;
      font-size: 18px;
      font-weight: normal; }
    .fk-contact-us__office-content--custom {
      padding-top: 18px; } }

.fk-main-content {
  overflow-x: hidden; }

.collapsible {
  padding-left: 0px; }

.text-product-type {
  font-size: 16px;
  font-weight: bold; }

.filter-mobile-area {
  padding-left: 5px;
  border-bottom: 1px solid #ddd;
  display: flex;
  overflow-y: hidden;
  overflow-x: scroll; }

.pagination li {
  display: inline-block;
  border-radius: 2px;
  text-align: center;
  vertical-align: top;
  height: 30px; }

.btn-reset-filter {
  display: none; }

.btn-filter-m {
  width: 100%;
  background-color: transparent;
  border: 1px solid #eee;
  margin: 15px 0;
  color: #008065 !important;
  font-size: 16px;
  font-weight: bold;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 5px 0; }

a.tabs-filter-product {
  margin: 0;
  border: none;
  padding: 5px 14px;
  float: left;
  position: relative;
  display: block;
  -webkit-flex-grow: 0;
  -ms-flex-positive: 0;
  flex-grow: 0;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  text-decoration: none;
  font-size: 16px;
  font-weight: bold;
  color: gray;
  overflow: hidden; }
  a.tabs-filter-product:first-child {
    padding-left: 0px; }
  a.tabs-filter-product.active {
    color: #008065;
    border-bottom: 2px solid #008065; }

.search-cate-description .text-search {
  color: #008065;
  font-weight: bold; }

.search-cate-description .text-cat {
  background-color: #008065;
  padding: 0 10px;
  border-radius: 3px;
  margin-left: 5px;
  cursor: pointer;
  color: #fff;
  margin-bottom: 10px; }

.reset-area, .search-cate-description {
  padding: 10px; }

.fk-filter-list {
  padding: 5px; }
  .fk-filter-list ul:not(.browser-default) li {
    list-style-type: none; }
  .fk-filter-list ul .product-filter {
    padding-left: 0px; }
  .fk-filter-list ul .left-list-cat {
    padding-left: 30px; }
  .fk-filter-list ul {
    border: none;
    box-shadow: none; }
    .fk-filter-list ul .left-list-product {
      line-height: 20px;
      border-bottom: 1px solid #eee;
      padding: 10px; }
      .fk-filter-list ul .left-list-product .radio-button {
        cursor: pointer;
        font-weight: 400; }
        .fk-filter-list ul .left-list-product .radio-button span {
          font-size: 14px; }
        .fk-filter-list ul .left-list-product .radio-button input[type=radio] {
          box-sizing: border-box;
          padding: 0;
          position: absolute;
          left: -9999px;
          opacity: 0; }
        .fk-filter-list ul .left-list-product .radio-button input {
          font-size: 1rem;
          line-height: 1.5;
          padding: 11px 23px;
          border: 1px solid rgba(0, 0, 0, 0.15);
          border-radius: 0;
          outline: 0;
          background-color: transparent; }
        .fk-filter-list ul .left-list-product .radio-button .radio-button__input {
          opacity: 0;
          position: absolute; }
        .fk-filter-list ul .left-list-product .radio-button .radio-button__control {
          position: relative;
          display: inline-block;
          width: 20px;
          height: 20px;
          margin-right: 12px;
          vertical-align: middle;
          background-color: inherit;
          color: #017b5f;
          border: 2px solid #666;
          border-radius: 24px; }
        .fk-filter-list ul .left-list-product .radio-button .radio-button__input:checked + .radio-button__control:after {
          content: "";
          display: block;
          position: absolute;
          top: 3px;
          left: 3px;
          width: 10px;
          height: 10px;
          background-color: #01a982;
          border-radius: 12px; }
        .fk-filter-list ul .left-list-product .radio-button .radio-button__input:checked + .radio-button__control {
          border-color: #01a982; }
        .fk-filter-list ul .left-list-product .radio-button .radio-button__control {
          transform: scale(0.75); }
  .fk-filter-list .text-product-type-count-item {
    font-family: "Prompt";
    font-style: normal;
    font-weight: 500;
    font-size: 14px;
    line-height: 21px;
    color: #393D42; }

.list_all_category {
  border: none;
  box-shadow: none; }
  .list_all_category li {
    line-height: 20px;
    border-bottom: 1px solid #eee;
    padding: 10px; }
    .list_all_category li .radio-button {
      cursor: pointer;
      font-weight: 400; }
      .list_all_category li .radio-button span {
        font-size: 14px; }
      .list_all_category li .radio-button input[type=radio] {
        box-sizing: border-box;
        padding: 0;
        position: absolute;
        left: -9999px;
        opacity: 0; }
      .list_all_category li .radio-button input {
        font-size: 1rem;
        line-height: 1.5;
        padding: 11px 23px;
        border: 1px solid rgba(0, 0, 0, 0.15);
        border-radius: 0;
        outline: 0;
        background-color: transparent; }
      .list_all_category li .radio-button .radio-button__input {
        opacity: 0;
        position: absolute; }
      .list_all_category li .radio-button .radio-button__control {
        position: relative;
        display: inline-block;
        width: 20px;
        height: 20px;
        margin-right: 12px;
        vertical-align: middle;
        background-color: inherit;
        color: #017b5f;
        border: 2px solid #666;
        border-radius: 24px; }
      .list_all_category li .radio-button .radio-button__input:checked + .radio-button__control:after {
        content: "";
        display: block;
        position: absolute;
        top: 3px;
        left: 3px;
        width: 10px;
        height: 10px;
        background-color: #01a982;
        border-radius: 12px; }
      .list_all_category li .radio-button .radio-button__input:checked + .radio-button__control {
        border-color: #01a982; }
      .list_all_category li .radio-button .radio-button__control {
        transform: scale(0.75); }

.fk-product-list {
  padding: 5px; }
  .fk-product-list .fk-card {
    background: #ffffff;
    border: 1px solid #D2D8E5;
    box-sizing: border-box;
    border-radius: 7px;
    margin-bottom: 10px;
    height: 440px; }
    .fk-product-list .fk-card__inner {
      display: flex;
      padding: 5px;
      position: relative;
      height: 100%; }
      .fk-product-list .fk-card__inner--top-area {
        width: 95%;
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        position: absolute;
        top: 5px;
        background: #ffffff;
        padding-bottom: 5px; }
        .fk-product-list .fk-card__inner--top-area .left img {
          width: 50px; }
        .fk-product-list .fk-card__inner--top-area .right {
          justify-content: flex-end; }
          .fk-product-list .fk-card__inner--top-area .right .dealed-label {
            font-style: normal;
            font-weight: bold;
            font-size: 14px;
            line-height: 14px;
            color: #2174D8; }
          .fk-product-list .fk-card__inner--top-area .right .dealed-sublabel {
            font-style: normal;
            font-weight: normal;
            font-size: 10px;
            line-height: 10px;
            color: #000000; }
      .fk-product-list .fk-card__inner--cotent-area {
        display: flex;
        flex-direction: column;
        margin-top: 8px; }
        .fk-product-list .fk-card__inner--cotent-area .product-area a:hover {
          text-decoration: none; }
        .fk-product-list .fk-card__inner--cotent-area .product-area a img {
          width: 100%; }
        .fk-product-list .fk-card__inner--cotent-area .product-area a .product-detail-area {
          height: 65px; }
          .fk-product-list .fk-card__inner--cotent-area .product-area a .product-detail-area .product-name {
            color: #000000;
            text-overflow: ellipsis;
            overflow: hidden;
            display: -webkit-box;
            -webkit-line-clamp: 2;
            -webkit-box-orient: vertical;
            margin-bottom: 2%; }
          .fk-product-list .fk-card__inner--cotent-area .product-area a .product-detail-area .special-message {
            position: absolute;
            top: 5px;
            color: #F27970;
            font-size: 14px;
            font-style: normal;
            font-weight: normal;
            line-height: 18px;
            text-align: left; }
          .fk-product-list .fk-card__inner--cotent-area .product-area a .product-detail-area .pack-size {
            color: #008065;
            font-style: normal;
            font-weight: normal;
            line-height: 18px;
            text-align: left;
            margin-bottom: 5px; }
        .fk-product-list .fk-card__inner--cotent-area .product-area .special-label-area {
          display: flex;
          flex-direction: row;
          justify-content: space-between;
          padding-top: 5px;
          padding-bottom: 5px;
          height: 35px; }
          .fk-product-list .fk-card__inner--cotent-area .product-area .special-label-area .weight-label {
            display: flex;
            flex-direction: row;
            background: #c1eaef;
            padding: 5px;
            width: auto;
            height: 25px;
            align-items: center;
            border-radius: 7px; }
            .fk-product-list .fk-card__inner--cotent-area .product-area .special-label-area .weight-label img {
              height: 15px;
              width: 15px; }
            .fk-product-list .fk-card__inner--cotent-area .product-area .special-label-area .weight-label .weight-text {
              display: none;
              color: #108B9B;
              font-size: 10px;
              font-weight: bold;
              margin-left: 2px;
              margin-top: 2px; }
          .fk-product-list .fk-card__inner--cotent-area .product-area .special-label-area .delivery-label {
            display: flex;
            flex-direction: row;
            background: #f7ebdf;
            padding: 5px;
            height: 25px;
            display: flex;
            align-items: center;
            border-radius: 7px; }
            .fk-product-list .fk-card__inner--cotent-area .product-area .special-label-area .delivery-label img {
              height: 15px;
              width: 15px; }
            .fk-product-list .fk-card__inner--cotent-area .product-area .special-label-area .delivery-label .delivery-text {
              color: #F27970;
              font-size: 10px;
              font-weight: bold;
              margin-left: 2px;
              margin-top: 2px; }
        .fk-product-list .fk-card__inner--cotent-area .product-area .progress-area .progress-desc-area {
          display: flex;
          align-content: space-between;
          flex-direction: row; }
          .fk-product-list .fk-card__inner--cotent-area .product-area .progress-area .progress-desc-area .minimumOrderText {
            font-family: "Prompt";
            text-align: left;
            font-size: 10px;
            width: 70%;
            color: #2174D8;
            font-weight: bold; }
          .fk-product-list .fk-card__inner--cotent-area .product-area .progress-area .progress-desc-area .CommitValue {
            font-family: "Prompt";
            text-align: right;
            font-size: 10px;
            width: 30%;
            color: #2174D8;
            font-weight: bold; }
        .fk-product-list .fk-card__inner--cotent-area .product-area .progress-area .progress {
          background-color: #F4F4F4;
          height: 8px;
          border-radius: 2px;
          margin: .5rem 0 1rem 0;
          overflow: hidden;
          width: 100%;
          position: relative; }
          .fk-product-list .fk-card__inner--cotent-area .product-area .progress-area .progress .progress-bar {
            height: 8px;
            border-radius: 5px; }
        .fk-product-list .fk-card__inner--cotent-area .product-area .progress-area .ZeroOrderText {
          font-family: "Prompt";
          text-align: left;
          font-size: 10px;
          width: 70%;
          color: #2174D8;
          font-weight: bold;
          height: 45.5px; }
      .fk-product-list .fk-card__inner--footer-area {
        position: absolute;
        bottom: 0px;
        display: flex;
        flex-direction: column;
        width: 95%; }
        .fk-product-list .fk-card__inner--footer-area .discount-strike-area {
          height: 20px;
          text-align: right; }
        .fk-product-list .fk-card__inner--footer-area .strikeText {
          font-size: 10px; }
        .fk-product-list .fk-card__inner--footer-area .price-item-area {
          height: 20px; }
          .fk-product-list .fk-card__inner--footer-area .price-item-area .discount-price-area {
            display: flex;
            flex-direction: row;
            justify-content: space-between; }
            .fk-product-list .fk-card__inner--footer-area .price-item-area .discount-price-area .discount-price {
              color: #E6100B; }
            .fk-product-list .fk-card__inner--footer-area .price-item-area .discount-price-area span {
              color: #000000; }
          .fk-product-list .fk-card__inner--footer-area .price-item-area .normal-price-area {
            display: flex;
            flex-direction: row;
            justify-content: space-between; }
            .fk-product-list .fk-card__inner--footer-area .price-item-area .normal-price-area span {
              color: #000000; }
        .fk-product-list .fk-card__inner--footer-area .universal-unit-content {
          height: 15px; }
          .fk-product-list .fk-card__inner--footer-area .universal-unit-content .universal-unit-area {
            justify-content: center;
            display: flex; }
            .fk-product-list .fk-card__inner--footer-area .universal-unit-content .universal-unit-area span {
              font-size: 10px;
              color: #A4AAB9; }
        .fk-product-list .fk-card__inner--footer-area .add-toCart-area {
          height: 40px;
          display: flex;
          justify-content: center;
          margin-bottom: 10px; }
          .fk-product-list .fk-card__inner--footer-area .add-toCart-area .noti-after-add-to-cart {
            display: none;
            position: absolute;
            color: #fff;
            background-color: rgba(0, 0, 0, 0.8);
            border-radius: 5px;
            line-height: 41px;
            text-align: center;
            font-weight: bold;
            bottom: 80px;
            width: calc(100% - 20px); }
          .fk-product-list .fk-card__inner--footer-area .add-toCart-area .fk_addToCart {
            width: 100%; }
            .fk-product-list .fk-card__inner--footer-area .add-toCart-area .fk_addToCart .addToCart-text {
              margin-left: 15px; }
          .fk-product-list .fk-card__inner--footer-area .add-toCart-area .btn-circle-qty {
            width: 30.63px;
            height: 30.63px;
            background: #008065;
            border-radius: 100px;
            border: none;
            color: #ffffff;
            font-size: 22px;
            font-weight: 400; }
          .fk-product-list .fk-card__inner--footer-area .add-toCart-area .input-qty {
            width: 50%;
            text-align: center; }
    @media only screen and (max-width: 1024px) {
      .fk-product-list .fk-card {
        height: 480px; } }

.btn-load-more {
  width: 50%;
  margin-bottom: 5px;
  margin-top: 5px; }
  @media only screen and (min-width: 768px) {
    .btn-load-more {
      width: 10%; } }

.market-req-quotation {
  display: block;
  height: 140px;
  margin: 1em auto;
  border: 0.2em solid #008065;
  border-radius: 50%;
  padding: .5em; }

.get-quotation-search-bt {
  background-color: #008065;
  border: none;
  color: #ffffff;
  padding: 5px 4em;
  margin-bottom: 10px; }

.search-product-mobile {
  font-size: 16px; }
  .search-product-mobile .collection .collection-item {
    padding-top: 10px;
    padding-bottom: 10px;
    border-bottom: 1px solid #f7f8fb; }
    .search-product-mobile .collection .collection-item .right {
      float: right; }

.override-col-5 {
  padding-left: 5px;
  padding-right: 5px; }
  @media only screen and (min-width: 768px) {
    .override-col-5 {
      padding-left: 5px;
      padding-right: 5px; } }

.special-message-product-detail {
  margin-top: 5%;
  color: #F27970;
  font-size: 14px;
  font-style: normal;
  font-weight: normal;
  line-height: 18px;
  text-align: left; }

.fk-bg-image--right {
  position: absolute;
  right: 0px;
  bottom: 0px;
  z-index: -1; }

.fk-bg-image--left {
  position: absolute;
  left: 0px;
  top: 0px;
  z-index: -1; }

.has-error .form-control {
  border-color: red !important; }

.has-error .help-block {
  color: red; }

.with-errors {
  color: red;
  font-size: 14px;
  font-weight: 400; }

.fk-login__image {
  display: block;
  margin: auto;
  width: 80%; }

.fk-login__container--center {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100vh; }

.fk-login__modal__container--center {
  display: flex;
  justify-content: center; }

.fk-login__form {
  padding: 8px;
  width: 360px; }
  .fk-login__form__title {
    padding: 16px; }
  .fk-login__form > form * {
    margin-bottom: 18px; }

.fk-login__input {
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
  border-bottom: none;
  height: 52px;
  border: 1px solid #eee;
  margin-bottom: 0px !important; }

.fk-login__label {
  color: #5e6166;
  font-weight: normal; }

.fk-login__button {
  background: #008065;
  border: none; }

.fk-login__button--transparent {
  background-color: Transparent;
  background-repeat: no-repeat;
  border: none;
  cursor: pointer;
  overflow: hidden;
  outline: none;
  color: #008065; }
  .fk-login__button--transparent:hover {
    color: #004c3c; }

.fk-login__atag {
  color: #008065; }
  .fk-login__atag:hover {
    color: #004c3c; }

@media only screen and (max-width: 992px) {
  .fk-bg-image--right {
    display: none; }
  .fk-bg-image--left {
    display: none; } }

.fk_form-spinner,
.fk_form-spinner:after {
  border-radius: 50%;
  width: 1em;
  height: 1em; }

.fk_form-spinner {
  position: absolute !important;
  margin: auto;
  text-indent: -9999em;
  border-top: 2px solid rgba(255, 255, 255, 0.2);
  border-right: 2px solid rgba(255, 255, 255, 0.2);
  border-bottom: 2px solid rgba(255, 255, 255, 0.2);
  border-left: 2px solid #ffffff;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  transform: translateX(-24px);
  -webkit-animation: load8 1.1s infinite linear;
  animation: load8 1.1s infinite linear; }

@-webkit-keyframes load8 {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg); }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg); } }

@keyframes load8 {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg); }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg); } }

select {
  /* inline SVG */
  background-image: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20256%20448%22%20enable-background%3D%22new%200%200%20256%20448%22%3E%3Cstyle%20type%3D%22text%2Fcss%22%3E.arrow%7Bfill%3A%23424242%3B%7D%3C%2Fstyle%3E%3Cpath%20class%3D%22arrow%22%20d%3D%22M255.9%20168c0-4.2-1.6-7.9-4.8-11.2-3.2-3.2-6.9-4.8-11.2-4.8H16c-4.2%200-7.9%201.6-11.2%204.8S0%20163.8%200%20168c0%204.4%201.6%208.2%204.8%2011.4l112%20112c3.1%203.1%206.8%204.6%2011.2%204.6%204.4%200%208.2-1.5%2011.4-4.6l112-112c3-3.2%204.5-7%204.5-11.4z%22%2F%3E%3C%2Fsvg%3E%0A") !important;
  background-position: right 10px center !important;
  background-repeat: no-repeat;
  background-size: auto 50%;
  border-radius: 2px;
  border: none;
  color: #ffffff;
  padding: 10px 30px 10px 10px;
  outline: none;
  -moz-appearance: none;
  -webkit-appearance: none;
  appearance: none; }
  select::-ms-expand {
    display: none; }

@media only screen and (max-width: 992px) {
  .cc-selector {
    height: 300px; } }

.cc-selector input {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  opacity: 0;
  visibility: hidden; }

.cc-selector input:active + .fk-register-step1__darkcard-cc {
  opacity: 0.9; }

.cc-selector input:checked + .fk-register-step1__darkcard-cc {
  -webkit-filter: none;
  -moz-filter: none;
  filter: none; }

.uploaded-area {
  width: 100%;
  height: 44px;
  margin: auto;
  margin-top: 10px;
  background: #F8FAFF;
  border-radius: 12px;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  padding: 25px; }
  .uploaded-area .icon-filename-area {
    width: 80%;
    display: flex;
    flex-direction: row;
    align-items: center; }
    .uploaded-area .icon-filename-area img {
      width: 25px;
      margin-right: 15px; }
    .uploaded-area .icon-filename-area .filename {
      font-style: normal;
      font-weight: 500;
      font-size: 14px;
      line-height: 20px;
      color: #494F5F; }
  .uploaded-area .delete-area {
    width: 20%;
    align-items: center;
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
    cursor: pointer; }
    .uploaded-area .delete-area .icon-delete {
      color: #A4A8B3; }

.upload-btn-wrapper {
  position: relative;
  overflow: hidden;
  display: inline-block;
  width: 100%;
  /* margin-top: 20px;*/ }
  .upload-btn-wrapper .btn {
    height: 60px;
    background: #F0FAF8;
    border: 1px dashed #D2D8E5;
    box-sizing: border-box;
    border-radius: 12px;
    width: 100%;
    font-style: normal;
    font-weight: 600;
    font-size: 14px;
    line-height: 20px;
    /* identical to box height, or 143% */
    color: #008065;
    cursor: pointer; }
    .upload-btn-wrapper .btn img {
      margin-right: 15px; }
    .upload-btn-wrapper .btn.max {
      background: #C8CDD7;
      border: 1px dashed #C8CDD7;
      filter: grayscale(100%);
      -webkit-filter: grayscale(100%); }
  .upload-btn-wrapper .upload-description {
    font-family: "Sarabun";
    font-style: normal;
    font-weight: normal;
    font-size: 14px;
    line-height: 24px;
    /* or 167% */
    text-align: center;
    color: #C8CDD7;
    margin-top: 10px; }

.uploadfile-desc {
  font-style: normal;
  font-weight: 600;
  font-size: 14px;
  line-height: 24px;
  /* identical to box height, or 133% */
  text-align: center;
  color: #191E28;
  margin: 24px 0px 0px; }

.upload-btn-wrapper input[type=file] {
  font-size: 100px;
  position: absolute;
  left: 0;
  top: 0;
  opacity: 0; }

.fk-register-step1__darkcard-cc {
  cursor: pointer;
  background-size: contain;
  background-repeat: no-repeat;
  display: inline-block;
  width: 200px;
  height: 400px;
  -webkit-transition: all 100ms ease-in;
  -moz-transition: all 100ms ease-in;
  transition: all 100ms ease-in;
  -webkit-filter: brightness(1) opacity(0.1) grayscale(1);
  -moz-filter: brightness(1) opacity(0.1) grayscale(1);
  filter: brightness(1) opacity(0.1) grayscale(1); }

.fk-register-step1__card-icon {
  cursor: pointer;
  background-size: contain;
  background-repeat: no-repeat;
  display: inline-block;
  height: 150px;
  -webkit-transition: all 100ms ease-in;
  -moz-transition: all 100ms ease-in;
  transition: all 100ms ease-in;
  -webkit-filter: brightness(1) opacity(0.8);
  -moz-filter: brightness(1) opacity(0.8);
  filter: brightness(1) opacity(0.8); }

#sub-enduser {
  display: none; }

.register-all-area {
  position: relative;
  /* Chrome, Safari, Edge, Opera */
  /* Firefox */
  /*   height: 100vh;*/ }
  .register-all-area input::-webkit-outer-spin-button,
  .register-all-area input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0; }
  .register-all-area input[type=number] {
    -moz-appearance: textfield; }
  .register-all-area .sub-header-register {
    font-style: normal;
    font-weight: normal;
    font-size: 16px;
    line-height: 24px;
    /* or 143% */
    text-align: center;
    color: rgba(25, 30, 40, 0.5); }
  .register-all-area .link-logo {
    text-align: center;
    width: 250px; }
  .register-all-area .form-control {
    height: 45px; }
  .register-all-area .row {
    margin-top: 10px;
    margin-bottom: 10px; }
  .register-all-area .form-signin-heading {
    font-style: normal;
    font-weight: 600;
    font-size: 20px;
    line-height: 40px;
    /* identical to box height, or 200% */
    text-align: center;
    color: #191E28;
    margin-bottom: 8px; }
  .register-all-area .label-field {
    font-style: normal;
    font-weight: 500;
    font-size: 14px;
    line-height: 24px;
    /* identical to box height, or 171% */
    display: flex;
    align-items: center;
    color: #191E28; }
  @media only screen and (max-width: 992px) {
    .register-all-area .sub-head-register {
      width: 65% !important;
      margin: auto; } }
  .register-all-area .sub-head-register {
    font-family: "Prompt";
    font-style: normal;
    font-weight: normal;
    font-size: 14px;
    line-height: 24px;
    color: #191E28;
    width: 100%;
    margin-top: 20px; }
  .register-all-area .banner_area_desktop {
    margin-top: 10px;
    margin-right: 30px;
    /*margin-bottom: 36px;
        padding-bottom: 36px;*/
    background-image: url(../img/background_banner.svg);
    background-repeat: no-repeat;
    background-size: cover;
    width: 490px;
    height: 476px;
    border-radius: 12px; }
    .register-all-area .banner_area_desktop .banner_inner_desktop {
      display: flex;
      flex-direction: column;
      margin-left: 32px;
      margin-right: 46px; }
      .register-all-area .banner_area_desktop .banner_inner_desktop .banner_th .banner_header {
        height: 80px;
        font-style: normal;
        font-weight: 600;
        font-size: 36px;
        line-height: 46px;
        color: #F8FAFF;
        text-align: left;
        margin-bottom: 8px;
        margin-top: 100px;
        margin-left: 10px;
        margin-right: 10px;
        width: 80%; }
      .register-all-area .banner_area_desktop .banner_inner_desktop .banner_en .banner_header_en {
        height: 80px;
        font-style: normal;
        font-weight: 600;
        font-size: 36px;
        line-height: 46px;
        color: #F8FAFF;
        text-align: left;
        margin-bottom: 8px;
        margin-top: 100px;
        margin-left: 10px;
        margin-right: 10px;
        width: 100%; }
      .register-all-area .banner_area_desktop .banner_inner_desktop .banner_info_group {
        display: flex;
        flex-direction: row;
        margin-top: 24px; }
        .register-all-area .banner_area_desktop .banner_inner_desktop .banner_info_group .banner_info_text {
          font-style: normal;
          font-weight: normal;
          font-size: 16px;
          line-height: 24px;
          /* identical to box height, or 171% */
          color: #F8FAFF;
          opacity: 0.8;
          margin-left: 8px; }
        .register-all-area .banner_area_desktop .banner_inner_desktop .banner_info_group .banner_info_text_en {
          font-style: normal;
          font-weight: normal;
          font-size: 14px;
          line-height: 24px;
          /* identical to box height, or 171% */
          color: #F8FAFF;
          opacity: 0.8;
          margin-left: 8px; }
  .register-all-area #regis_step1 {
    width: 100%;
    /*margin-top: 10%;
       */ }
    .register-all-area #regis_step1 .inner-register {
      display: flex;
      flex-direction: row;
      justify-content: center;
      width: 100%; }
    .register-all-area #regis_step1 #hidepassword {
      display: block;
      cursor: pointer; }
    .register-all-area #regis_step1 #showpassword {
      display: none;
      cursor: pointer; }
    .register-all-area #regis_step1 .form_step1 {
      width: 451px;
      margin-top: 10px;
      padding-top: 10px;
      padding-left: 16px;
      padding-bottom: 8px;
      padding-right: 16px;
      background: #FFFFFF;
      box-shadow: 0px 6px 20px rgba(0, 0, 0, 0.1);
      border-radius: 12px; }
    .register-all-area #regis_step1 .banner_area {
      display: none; }
    @media only screen and (max-width: 992px) {
      .register-all-area #regis_step1 .form_step1 {
        width: 100%;
        background: #FFFFFF;
        box-shadow: 0px 6px 20px rgba(0, 0, 0, 0.1);
        border-radius: 12px; }
      .register-all-area #regis_step1 .banner_area_desktop {
        display: none; }
      .register-all-area #regis_step1 .banner_area {
        display: flex;
        flex-direction: column;
        margin-top: 40px;
        margin-bottom: 36px;
        padding-bottom: 36px; }
        .register-all-area #regis_step1 .banner_area .banner_header {
          height: 80px;
          font-style: normal;
          font-weight: 600;
          font-size: 32px;
          line-height: 40px;
          color: #F8FAFF;
          text-align: left;
          margin-bottom: 20px; }
        .register-all-area #regis_step1 .banner_area .banner_header_en {
          height: 80px;
          font-style: normal;
          font-weight: 600;
          font-size: 32px;
          line-height: 40px;
          color: #F8FAFF;
          text-align: left;
          margin-bottom: 20px; }
      .register-all-area #regis_step1 .banner_info_group {
        display: flex;
        flex-direction: row;
        margin-top: 8px; }
        .register-all-area #regis_step1 .banner_info_group .banner_info_text {
          font-style: normal;
          font-weight: normal;
          font-size: 14px;
          line-height: 24px;
          /* identical to box height, or 171% */
          color: #F8FAFF;
          opacity: 0.8;
          margin-left: 8px; }
        .register-all-area #regis_step1 .banner_info_group .banner_info_text_en {
          font-style: normal;
          font-weight: normal;
          font-size: 11px;
          line-height: 24px;
          /* identical to box height, or 171% */
          color: #F8FAFF;
          opacity: 0.8;
          margin-left: 8px; } }
  .register-all-area .register-top-area {
    width: 100%;
    display: flex;
    justify-content: space-between;
    padding-top: 8px; }
  .register-all-area .restaurant-dropdown-area {
    /*  margin-top:10px;*/ }
  .register-all-area .footer-area {
    width: 100%; }

.fk_register__goback {
  max-width: 364px; }

.fk_register__input {
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.01);
  border-bottom: none;
  height: 52px;
  border: 1px solid #eee;
  margin-bottom: 0px !important; }

.fk_register__label {
  color: #5e6166;
  font-weight: normal; }

.fk_register__button {
  background: #008065;
  border: none; }

.fk_register__button--transparent {
  background-color: Transparent;
  background-repeat: no-repeat;
  border: none;
  cursor: pointer;
  overflow: hidden;
  outline: none;
  color: #008065;
  margin: auto; }
  .fk_register__button--transparent:hover {
    color: #004c3c; }

.fk-register-step1__container--center {
  height: 93.5vh; }

@media only screen and (min-width: 768px) and (max-device-width: 768px) {
  .fk-register-step1__container--center {
    background: linear-gradient(0deg, #00B28D 600px, #fff 600px) !important;
    height: 100vh; } }

@media only screen and (max-width: 992px) {
  .fk-register-step1__container--center {
    display: flex;
    justify-content: center;
    background: linear-gradient(0deg, #00B28D 400px, #fff 400px);
    height: unset; } }

.fk-register-step1__logo {
  display: inline-block;
  /*  margin: 36px 0px 0px 0px;*/
  margin: auto;
  width: 250px;
  /*  margin-bottom: 10%;*/ }

.fk-register-step1__card {
  filter: grayscale(100%); }
  .fk-register-step1__card.active {
    filter: unset; }
  .fk-register-step1__card__container {
    height: 216px; }
  .fk-register-step1__card__title {
    position: absolute;
    left: 50%;
    -moz-transform: translate(-50%, 10px);
    -webkit-transform: translate(-50%, 10px);
    transform: translate(-50%, 10px);
    color: #008065; }
  .fk-register-step1__card--left {
    position: absolute;
    margin-left: auto;
    left: 0;
    right: 0;
    text-align: center; }
  .fk-register-step1__card--right {
    position: absolute;
    margin-right: auto;
    left: 0;
    right: 0;
    text-align: center; }

.fk-register-step1__atag {
  color: #008065; }
  .fk-register-step1__atag:hover {
    color: #004c3c; }

.fk-register-step1__button {
  background: #008065;
  border: none;
  margin: auto;
  width: 100%; }
  .fk-register-step1__button.inactive {
    background: #C2C5CC;
    color: #919499; }
    .fk-register-step1__button.inactive:hover {
      background: #C2C5CC;
      color: #919499; }

.fk-register-step1__button--transparent {
  background-color: Transparent;
  background-repeat: no-repeat;
  border: none;
  cursor: pointer;
  overflow: hidden;
  outline: none;
  color: #008065;
  margin: auto;
  max-width: 364px; }
  .fk-register-step1__button--transparent:hover {
    color: #004c3c; }

.fk-register-step1__button--top {
  background-color: Transparent;
  background-repeat: no-repeat;
  border: none;
  cursor: pointer;
  overflow: hidden;
  outline: none;
  color: #008065;
  text-align: left; }
  .fk-register-step1__button--top:hover {
    color: #004c3c; }

.fk-register-step2__padding {
  padding: 8px; }

.fk-register-step2__container--center {
  display: flex;
  justify-content: center;
  align-items: center; }
  .fk-register-step2__container--center .step-area {
    display: none;
    width: 380px;
    padding: 8px; }
    .fk-register-step2__container--center .step-area .collapsible-header {
      display: block;
      cursor: pointer;
      min-height: 3rem;
      line-height: 3rem;
      padding: 0;
      padding-left: 5px;
      padding-top: 10px;
      background-color: #E2F4E8;
      border: none; }
    .fk-register-step2__container--center .step-area .collapsible-header.active:before {
      font-family: "Font Awesome 5 Free";
      content: "\f077";
      color: black;
      padding-right: 0px;
      float: right; }
    .fk-register-step2__container--center .step-area .collapsible-header:before {
      font-family: "Font Awesome 5 Free";
      content: "\f078";
      color: black;
      padding-left: 0px;
      float: right; }
    .fk-register-step2__container--center .step-area .collapsible-body {
      display: none;
      border-bottom: none;
      box-sizing: border-box; }
    .fk-register-step2__container--center .step-area [type="radio"].with-gap:checked + label:before {
      border: 2px solid #008065 !important; }

.fk-register-step2__button {
  background: #008065;
  border: none;
  margin: auto;
  width: 380px; }

.fk-register-step2__button--transparent {
  background-color: Transparent;
  background-repeat: no-repeat;
  border: none;
  cursor: pointer;
  overflow: hidden;
  outline: none;
  color: #008065;
  margin: auto;
  max-width: 364px; }
  .fk-register-step2__button--transparent:hover {
    color: #004c3c; }

.fk-register-step3__container--center {
  display: flex;
  justify-content: center;
  align-items: center; }
  .fk-register-step3__container--center .step-area {
    display: none;
    width: 380px;
    padding: 8px; }
    .fk-register-step3__container--center .step-area .otp-message-error {
      color: red;
      font-size: 1rem;
      display: none;
      text-align: center;
      margin-top: 3%;
      margin-bottom: 3%;
      font-size: 16px; }
    .fk-register-step3__container--center .step-area input {
      margin: 0 5px;
      text-align: center;
      line-height: 80px;
      font-size: 50px;
      border: solid 1px #ccc;
      box-shadow: 0 0 5px #ccc inset;
      outline: none;
      width: 20%;
      transition: all .2s ease-in-out;
      border-radius: 3px; }
      .fk-register-step3__container--center .step-area input:focus {
        border-color: #008065;
        box-shadow: 0 0 5px #008065 inset; }
      .fk-register-step3__container--center .step-area input::selection {
        background: transparent; }
    .fk-register-step3__container--center .step-area .footer-area {
      left: 0px;
      width: 100%;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      flex-wrap: wrap;
      margin-top: 40px; }
    .fk-register-step3__container--center .step-area .footer-head-area {
      margin-bottom: 20px;
      text-align: center;
      display: flex;
      justify-content: center; }
    .fk-register-step3__container--center .step-area .footer-head-text {
      font-weight: 500;
      font-size: 16px;
      line-height: 18px;
      color: #191E28; }
    .fk-register-step3__container--center .step-area .footer-head-link {
      font-weight: 500;
      font-size: 16px;
      line-height: 18px;
      color: #008065;
      cursor: pointer; }

.fk-register-step4__container--center {
  display: flex;
  justify-content: center;
  align-items: center; }
  .fk-register-step4__container--center .step-area {
    display: none;
    width: 100%;
    padding: 8px; }
    .fk-register-step4__container--center .step-area .search-address-are-hide {
      display: none; }
    .fk-register-step4__container--center .step-area .current-address-area {
      width: 100%;
      margin-right: auto;
      margin-left: auto; }
      .fk-register-step4__container--center .step-area .current-address-area .current-inner-address-area {
        display: flex;
        flex-direction: row;
        justify-content: space-between; }
        @media only screen and (max-width: 992px) {
          .fk-register-step4__container--center .step-area .current-address-area .current-inner-address-area .left-area {
            width: 70% !important; }
          .fk-register-step4__container--center .step-area .current-address-area .current-inner-address-area .right-area {
            width: 30% !important; }
            .fk-register-step4__container--center .step-area .current-address-area .current-inner-address-area .right-area #lbl_used_current_location {
              text-align: left !important; } }
        .fk-register-step4__container--center .step-area .current-address-area .current-inner-address-area .left-area {
          width: 80%;
          margin-right: 15px; }
          .fk-register-step4__container--center .step-area .current-address-area .current-inner-address-area .left-area #lbl_current_location {
            margin-bottom: 10px;
            margin-top: 10px; }
        .fk-register-step4__container--center .step-area .current-address-area .current-inner-address-area .right-area {
          width: 20%; }
          .fk-register-step4__container--center .step-area .current-address-area .current-inner-address-area .right-area #lbl_used_current_location {
            margin-bottom: 10px;
            margin-top: 10px;
            text-align: right; }
    .fk-register-step4__container--center .step-area .search-address-area {
      width: 100%;
      margin-right: auto;
      margin-left: auto; }
      .fk-register-step4__container--center .step-area .search-address-area .current-inner-address-area {
        display: flex;
        flex-direction: row;
        justify-content: space-between; }
        @media only screen and (max-width: 992px) {
          .fk-register-step4__container--center .step-area .search-address-area .current-inner-address-area .left-area {
            width: 70% !important; }
          .fk-register-step4__container--center .step-area .search-address-area .current-inner-address-area .right-area {
            width: 30% !important; }
            .fk-register-step4__container--center .step-area .search-address-area .current-inner-address-area .right-area #lbl_used_current_location {
              text-align: left !important; }
            .fk-register-step4__container--center .step-area .search-address-area .current-inner-address-area .right-area #btn-pin-map {
              margin-top: 20%; } }
        .fk-register-step4__container--center .step-area .search-address-area .current-inner-address-area .left-area {
          width: 80%;
          margin-right: 15px; }
          .fk-register-step4__container--center .step-area .search-address-area .current-inner-address-area .left-area #lbl_current_location {
            margin-bottom: 10px;
            margin-top: 10px; }
        .fk-register-step4__container--center .step-area .search-address-area .current-inner-address-area .right-area {
          width: 20%; }
          .fk-register-step4__container--center .step-area .search-address-area .current-inner-address-area .right-area #lbl_used_current_location {
            margin-bottom: 10px;
            margin-top: 10px;
            text-align: right; }
          .fk-register-step4__container--center .step-area .search-address-area .current-inner-address-area .right-area #btn-pin-map {
            margin-top: 10%; }
    .fk-register-step4__container--center .step-area .search-address-are-hide {
      width: 100%;
      margin-left: auto;
      margin-right: auto; }
    .fk-register-step4__container--center .step-area .footer-area {
      width: 380px;
      margin-left: auto;
      margin-right: auto; }
      @media only screen and (max-width: 992px) {
        .fk-register-step4__container--center .step-area .footer-area {
          width: 100% !important; } }

.fk-register-step5__container--center {
  display: flex;
  justify-content: center;
  align-items: center; }
  .fk-register-step5__container--center .step-area {
    display: none;
    width: 50%;
    padding: 8px; }
    .fk-register-step5__container--center .step-area .margin-t-b-10 {
      margin-top: 10px;
      margin-bottom: 10px; }
    .fk-register-step5__container--center .step-area .readmore-text {
      margin-top: 5px;
      margin-bottom: 5px;
      font-style: normal;
      font-weight: 500;
      font-size: 14px;
      line-height: 20px;
      text-align: center;
      color: #008065;
      cursor: pointer;
      text-decoration: underline; }

/* checkbox custom */
.container-checkbox {
  color: #191E28;
  position: relative;
  padding-left: 35px;
  margin-bottom: 12px;
  cursor: pointer;
  font-size: 14px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none; }

.container-checkbox input {
  position: absolute;
  opacity: 0;
  cursor: pointer; }

.container-checkbox .checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 20px;
  width: 20px;
  border: 1px solid #191E28;
  border-radius: 3px; }

.container-checkbox:hover input ~ .checkmark {
  background-color: #ccc; }

.container-checkbox input:checked ~ .checkmark {
  border: solid #008065;
  border-radius: 3px; }

.container-checkbox .checkmark:after {
  content: "";
  position: absolute;
  display: none; }

.container-checkbox input:checked ~ .checkmark:after {
  display: block; }

.container-checkbox .checkmark:after {
  left: 4.5px;
  top: 1px;
  width: 6px;
  height: 12px;
  border: solid #008065;
  border-width: 0 3px 3px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  transform: rotate(45deg); }

.input-area {
  margin-top: 8px;
  /*  margin-bottom: 8px;*/ }

.sub-head {
  display: none; }

.sub-head-description {
  font-size: 10px;
  text-align: center; }

.msg-error {
  color: red !important;
  font-size: 14px !important;
  margin-left: 0px !important;
  margin-top: 10px !important;
  position: relative !important;
  font-weight: 400;
  display: none;
  text-align: left; }

.outline {
  margin-top: 10%; }

.input-group-addon {
  background: #fff;
  border: 1px solid #eee;
  border-radius: 5px !important;
  padding-top: 4; }
  .input-group-addon__left {
    border-right: none; }
    .input-group-addon__left.error {
      border-color: red; }
  .input-group-addon__right {
    border-left: none; }
    .input-group-addon__right.error {
      border-color: red; }

.fk_register__input.error {
  border-color: red; }

.btn-submit-step1-desktop-area {
  padding-bottom: 3%;
  margin-top: 48px; }

.btn-submit-step1-mobile-area {
  width: 50%;
  display: none;
  float: right;
  margin-right: 0px;
  margin-top: 48px; }

#fk-reg-outline-sm {
  width: 50%;
  display: none;
  float: right;
  margin-right: 0px;
  /* margin-top: 10%;*/ }

.btn-desktop {
  padding-bottom: 3%;
  margin-top: 48px;
  margin-bottom: 27px; }

.btn-mobile {
  display: none;
  margin-top: 48px;
  margin-bottom: 27px; }

.footer-head-area {
  margin-bottom: 20px;
  padding-bottom: 30px;
  text-align: center;
  display: flex;
  justify-content: center; }

#fk-reg-outline {
  padding-bottom: 3%; }

.input-group .form-control {
  z-index: 12; }

#txt_phone {
  left: -3; }

#txt_password {
  right: -3; }

@media only screen and (max-width: 992px) {
  .row {
    margin-top: unset;
    margin-bottom: unset; }
  #regis_step1 {
    width: 80% !important; }
  #regis_step5 {
    width: 90% !important; }
  .col {
    margin-bottom: 10px;
    margin-top: 10px; }
  .fk-register-step1__button {
    width: 100%; }
  .footer-area {
    /* position: fixed;
            bottom: 0;*/
    width: 100% !important;
    margin-bottom: 10px;
    height: 70px; }
  .fk-register-step1__button {
    /* width: 138px;*/
    font-size: 16px; }
  .fk-register-step1__button--transparent {
    width: 138px;
    margin-right: auto;
    text-align: center;
    font-size: 16px; }
  .fk-register-step1__button--top {
    width: 138px;
    margin-right: auto;
    text-align: left;
    font-size: 16px; }
  .fk-register-step1__card {
    position: absolute;
    height: 300px;
    left: 0;
    right: 0;
    text-align: center;
    filter: grayscale(100%); }
    .fk-register-step1__card--right {
      margin-left: auto; }
    .fk-register-step1__card--left {
      position: absolute;
      margin-right: auto;
      height: 300px;
      left: 0;
      right: 0;
      text-align: center; }
    .fk-register-step1__card__title {
      width: 100px; }
    .fk-register-step1__card__container {
      height: 300px; }
  .fk-register-step1__text--enduser {
    position: absolute;
    left: 0%;
    width: 160px;
    -moz-transform: translate(8px, -64px);
    -webkit-transform: translate(8px, -64px);
    transform: translate(8px, -64px); }
  .fk-register-step1__text--res {
    left: 0%;
    position: absolute;
    width: 160px;
    -moz-transform: translate(8px, -64px);
    -webkit-transform: translate(8px, -64px);
    transform: translate(8px, -64px); }
  .fk-register-step1__logo {
    width: 240px;
    margin: 8px; }
  .fk-register-step1__card-icon {
    width: 135px;
    height: 200px; }
  .fk-register-step1__darkcard-cc {
    width: 135px;
    height: 200px; }
  #fk-reg-outline {
    width: 100%;
    display: flex;
    justify-content: space-between;
    display: none;
    padding-bottom: 5%; }
  #fk-reg-outline-sm {
    width: 100%;
    display: flex;
    float: right; }
  .btn-desktop {
    display: none; }
  .btn-mobile {
    width: 100%;
    display: flex;
    float: right; } }

@media only screen and (min-width: 768px) and (max-device-width: 768px) {
  #regis_step1 {
    width: 45% !important; } }

.pac-item {
  font-family: "Prompt", sans-serif !important;
  font-size: 14px !important; }
  .pac-item span {
    font-family: "Prompt", sans-serif !important;
    font-size: 14px !important; }

.fk-about-us__background {
  /* The image used */
  background-image: url("https://freshket-share-bucket.s3-ap-southeast-1.amazonaws.com/rewamp2021/images/about-us/header.jpg");
  min-height: 300px;
  /* Center and scale the image nicely */
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  /* Needed to position the navbar */
  position: relative; }

.fk-about-us__team {
  max-width: 100%;
  height: auto;
  box-sizing: border-box; }

.fk-about-us__content {
  padding-bottom: 10%; }
  .fk-about-us__content h1,
  .fk-about-us__content p {
    margin: 0; }
  .fk-about-us__content h1 {
    margin-bottom: 36px; }
  .fk-about-us__content p,
  .fk-about-us__content button {
    margin-bottom: 28px;
    font-size: 18px; }

.fk-bg-image--right {
  position: absolute;
  right: 0px;
  bottom: 0px;
  z-index: -1; }

.fk-bg-image--left {
  position: absolute;
  left: 0px;
  top: 0px;
  z-index: -1; }

.fk-forgotpassword__image {
  display: block;
  margin: auto;
  width: 80%; }

.fk-forgotpassword__container--center {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100vh; }

.fk-forgotpassword__form {
  padding: 8px;
  width: 360px; }
  .fk-forgotpassword__form__title {
    padding: 16px; }
  .fk-forgotpassword__form > form * {
    margin-bottom: 18px; }

.fk-forgotpassword__input {
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
  border-bottom: none;
  margin-buttom: 18px !important;
  height: 52px;
  border: 1px solid #eee; }

.fk-forgotpassword__label {
  color: #5e6166;
  font-weight: normal; }

.fk-forgotpassword__button {
  background: #008065;
  border: none; }

.fk-forgotpassword__button--transparent {
  background-color: Transparent;
  background-repeat: no-repeat;
  border: none;
  cursor: pointer;
  overflow: hidden;
  outline: none;
  color: #008065; }
  .fk-forgotpassword__button--transparent:hover {
    color: #00ce7c; }

.fk-forgotpassword__atag {
  color: #008065; }
  .fk-forgotpassword__atag:hover {
    color: #00ce7c; }

@media only screen and (max-width: 992px) {
  .fk-bg-image--right {
    display: none; }
  .fk-bg-image--left {
    display: none; } }

.fk-bg-image--right {
  position: absolute;
  right: 0px;
  bottom: 0px;
  z-index: -1; }

.fk-bg-image--left {
  position: absolute;
  left: 0px;
  top: 0px;
  z-index: -1; }

.fk-changepassword__image {
  display: block;
  margin: auto;
  width: 80%; }

.fk-changepassword__container--center {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100vh; }

.fk-changepassword__form {
  padding: 8px;
  width: 360px; }
  .fk-changepassword__form__title {
    padding: 16px; }
  .fk-changepassword__form > form * {
    margin-bottom: 18px; }

.fk-changepassword__input {
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
  border-bottom: none;
  height: 52px;
  border: 1px solid #eee; }

.fk-changepassword__label {
  color: #5e6166;
  font-weight: normal; }

.fk-changepassword__button {
  background: #008065;
  border: none; }

.fk-changepassword__button--transparent {
  background-color: Transparent;
  background-repeat: no-repeat;
  border: none;
  cursor: pointer;
  overflow: hidden;
  outline: none;
  color: #008065; }
  .fk-changepassword__button--transparent:hover {
    color: #00ce7c; }

.fk-changepassword__atag {
  color: #008065; }
  .fk-changepassword__atag:hover {
    color: #00ce7c; }

@media only screen and (max-width: 992px) {
  .fk-bg-image--right {
    display: none; }
  .fk-bg-image--left {
    display: none; } }

.fk-profile::-webkit-scrollbar {
  display: none; }

.fk-profile__list {
  padding: 18px 15px;
  align-items: center;
  cursor: pointer;
  border-bottom: 2px solid #f7f8fb; }
  .fk-profile__list__container {
    display: flex;
    flex-direction: row;
    align-items: center; }
    .fk-profile__list__container img {
      width: 24px; }
    .fk-profile__list__container p {
      margin: 0px;
      margin-left: 16px;
      font-weight: 500;
      font-size: 16px; }
  .fk-profile__list:hover {
    background-color: #eee; }

.fk-profile__container {
  display: flex;
  flex-direction: column; }

.fk-profile__header {
  padding: 48px 15px 32px 15px;
  background-color: #f7f8fb; }

.fk-profile__restaurant-info {
  padding: 0px 15px;
  padding-top: 8px;
  background-color: #f7f8fb; }
  .fk-profile__restaurant-info__name {
    white-space: nowrap;
    overflow: hidden;
    align-self: center;
    text-overflow: ellipsis;
    max-width: 500px;
    font-weight: 600;
    font-size: 16px;
    margin: 0px; }
  .fk-profile__restaurant-info__edit {
    padding: 0px 15px;
    background-color: #f7f8fb;
    padding-bottom: 24px;
    padding-top: 8px; }
    .fk-profile__restaurant-info__edit--atag {
      color: #008065;
      font-weight: 500;
      font-size: 14px; }
      .fk-profile__restaurant-info__edit--atag:hover {
        cursor: pointer; }
  .fk-profile__restaurant-info__rank {
    padding: 0px 15px;
    background-color: #f7f8fb;
    padding-bottom: 8px; }
    .fk-profile__restaurant-info__rank p,
    .fk-profile__restaurant-info__rank div {
      margin: 0px; }
    .fk-profile__restaurant-info__rank--bold {
      font-weight: 600;
      font-size: 16px; }
    .fk-profile__restaurant-info__rank--right {
      font-weight: 600;
      font-size: 16px; }
    .fk-profile__restaurant-info__rank--green {
      color: #008065; }
  .fk-profile__restaurant-info__progress {
    padding: 0px 15px;
    background-color: #f7f8fb;
    padding-bottom: 8px; }
    .fk-profile__restaurant-info__progress--custom-progress {
      height: 12px;
      margin: 0px;
      background: #d2d8e5; }
  .fk-profile__restaurant-info__point {
    padding: 0px 15px;
    background-color: #f7f8fb;
    padding-bottom: 8px; }
    .fk-profile__restaurant-info__point p,
    .fk-profile__restaurant-info__point div {
      margin: 0px; }
    .fk-profile__restaurant-info__point--bold {
      font-weight: 500;
      font-size: 16px; }
    .fk-profile__restaurant-info__point--green {
      color: #008065; }

.fk-profile__container--inner {
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-item: base-line; }
  .fk-profile__container--inner .progress-bar {
    background-image: none;
    background-color: #008065 !important; }

.fk-desktop-profile {
  display: flex;
  justify-content: center; }
  .fk-desktop-profile__btn {
    border: none;
    background-color: transparent;
    color: #008065; }
    .fk-desktop-profile__btn:active, .fk-desktop-profile__btn:hover, .fk-desktop-profile__btn:focus {
      color: #008065; }
  .fk-desktop-profile__text-crip {
    display: block;
    max-width: 220px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis; }
  .fk-desktop-profile__dropdown-menu__center {
    width: 414px;
    right: auto;
    left: 50% !important;
    -webkit-transform: translate(-50%, 0);
    -o-transform: translate(-50%, 0);
    transform: translate(-50%, 0); }
  .fk-desktop-profile__dropdown-menu__color {
    background-color: #f7f8fb; }
  .fk-desktop-profile__list {
    padding: 12px 32px;
    align-items: center;
    cursor: pointer;
    border-bottom: 2px solid #f7f8fb; }
    .fk-desktop-profile__list__container {
      display: flex;
      flex-direction: row;
      align-items: center; }
      .fk-desktop-profile__list__container img {
        width: 18px; }
      .fk-desktop-profile__list__container p {
        margin: 0px;
        margin-left: 18px;
        font-weight: 500;
        font-size: 16px; }
    .fk-desktop-profile__list:hover {
      border: none;
      background-color: #eee; }
    .fk-desktop-profile__list:last-child {
      border-radius: 0px 0px 20px 20px; }
  .fk-desktop-profile__container {
    display: flex;
    flex-direction: column; }
    .fk-desktop-profile__container--inner {
      display: flex;
      flex-wrap: nowrap;
      justify-content: space-between;
      background-color: #fff;
      color: #171819 !important; }
  .fk-desktop-profile__header {
    padding: 48px 32px 32px 32px;
    background-color: #f7f8fb; }
  .fk-desktop-profile__restaurant-info {
    padding: 0px 32px;
    padding-top: 26px;
    background-color: #f7f8fb;
    border-radius: 20px 20px 0px 0px; }
    .fk-desktop-profile__restaurant-info__name {
      align-self: center;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      max-width: 300px;
      font-weight: 600;
      font-size: 16px;
      margin: 0px; }
    .fk-desktop-profile__restaurant-info__edit {
      padding: 0px 32px;
      background-color: #f7f8fb;
      padding-bottom: 24px;
      padding-top: 8px; }
      .fk-desktop-profile__restaurant-info__edit--atag {
        color: #008065 !important;
        font-weight: 500;
        font-size: 14px;
        padding: 0px !important; }
        .fk-desktop-profile__restaurant-info__edit--atag:hover {
          cursor: pointer; }
    .fk-desktop-profile__restaurant-info__rank {
      padding: 0px 32px;
      background-color: #f7f8fb;
      padding-bottom: 8px; }
      .fk-desktop-profile__restaurant-info__rank p,
      .fk-desktop-profile__restaurant-info__rank div {
        margin: 0px; }
      .fk-desktop-profile__restaurant-info__rank--bold {
        font-weight: 600;
        font-size: 14px; }
      .fk-desktop-profile__restaurant-info__rank--right {
        font-weight: 600;
        font-size: 16px; }
      .fk-desktop-profile__restaurant-info__rank--green {
        color: #008065; }
    .fk-desktop-profile__restaurant-info__progress {
      padding: 0px 32px;
      background-color: #f7f8fb;
      padding-bottom: 8px; }
      .fk-desktop-profile__restaurant-info__progress--custom-progress {
        height: 12px;
        margin: 0px;
        background: #d2d8e5; }
        .fk-desktop-profile__restaurant-info__progress--custom-progress .progress-bar {
          background-image: none;
          background-color: #008065 !important; }
    .fk-desktop-profile__restaurant-info__point {
      padding: 0px 32px;
      background-color: #f7f8fb;
      padding-bottom: 12px; }
      .fk-desktop-profile__restaurant-info__point p,
      .fk-desktop-profile__restaurant-info__point div {
        margin: 0px; }
      .fk-desktop-profile__restaurant-info__point--bold {
        font-weight: 500;
        font-size: 14px; }
      .fk-desktop-profile__restaurant-info__point--green {
        color: #008065; }

.product-detail-area__body {
  padding-bottom: 5%; }
  .product-detail-area__body .big-image {
    width: 100%;
    border: 1px solid #eee; }
  .product-detail-area__body .imageThumbSlider {
    width: 95%;
    margin: 10px;
    padding: 10px;
    display: flex;
    flex-direction: row;
    justify-content: center; }
    .product-detail-area__body .imageThumbSlider img {
      width: 128px;
      height: 128px; }
    .product-detail-area__body .imageThumbSlider .image-item {
      margin-left: 5px;
      margin-right: 5px;
      border: 1px solid #eee;
      cursor: pointer; }
    .product-detail-area__body .imageThumbSlider .active {
      border: 1px solid #000; }
  .product-detail-area__body .product-name {
    font-size: 20px;
    font-weight: bold;
    line-height: 28px; }
  .product-detail-area__body .pack-size {
    height: 18px;
    color: gray;
    font-size: 14px; }
  .product-detail-area__body .detail-des {
    font-size: 14px;
    margin-top: 10px; }
  .product-detail-area__body .distict-area {
    font-size: 14px;
    margin-top: 10px; }
  .product-detail-area__body .discount-strike-area {
    height: 20px;
    text-align: right; }
  .product-detail-area__body .strikeText {
    font-size: 14px; }
  .product-detail-area__body .progress-area .progress-desc-area {
    display: flex;
    align-content: space-between;
    flex-direction: row; }
    .product-detail-area__body .progress-area .progress-desc-area .minimumOrderText {
      font-family: "Prompt";
      text-align: left;
      font-size: 14px;
      width: 70%;
      color: #2174D8;
      font-weight: bold; }
    .product-detail-area__body .progress-area .progress-desc-area .CommitValue {
      font-family: "Prompt";
      text-align: right;
      font-size: 14px;
      width: 30%;
      color: #2174D8;
      font-weight: bold; }
  .product-detail-area__body .progress-area .progress {
    background-color: #F4F4F4;
    height: 8px;
    border-radius: 2px;
    margin: .5rem 0 1rem 0;
    overflow: hidden;
    width: 100%;
    position: relative; }
    .product-detail-area__body .progress-area .progress .progress-bar {
      height: 8px;
      border-radius: 5px; }
  .product-detail-area__body .progress-area .ZeroOrderText {
    font-family: "Prompt";
    text-align: left;
    font-size: 14px;
    width: 70%;
    color: #2174D8;
    font-weight: bold;
    height: 45.5px; }
  .product-detail-area__body .price-item-area {
    height: 20px;
    width: 25%; }
    @media only screen and (max-width: 768px) {
      .product-detail-area__body .price-item-area {
        width: 40%; } }
    .product-detail-area__body .price-item-area .strikethrough {
      position: relative; }
      .product-detail-area__body .price-item-area .strikethrough::after {
        content: "";
        width: 100%;
        height: 1px;
        background: #A4AAB9;
        position: absolute;
        top: 40%;
        left: 0;
        transform: rotate(-5deg);
        border-top: 2px solid; }
    .product-detail-area__body .price-item-area .discount-price-area {
      display: flex;
      flex-direction: row;
      justify-content: space-between; }
      .product-detail-area__body .price-item-area .discount-price-area .discount-price {
        color: #E6100B; }
      .product-detail-area__body .price-item-area .discount-price-area span {
        color: #000000; }
    .product-detail-area__body .price-item-area .normal-price-area {
      display: flex;
      flex-direction: row;
      justify-content: space-between; }
      .product-detail-area__body .price-item-area .normal-price-area span {
        color: #000000; }
  .product-detail-area__body .universal-unit-content {
    height: 15px;
    width: 35%; }
    @media only screen and (max-width: 768px) {
      .product-detail-area__body .universal-unit-content {
        width: 100%; } }
    .product-detail-area__body .universal-unit-content .universal-unit-area {
      justify-content: center;
      display: flex; }
      .product-detail-area__body .universal-unit-content .universal-unit-area span {
        font-size: 10px;
        color: #A4AAB9; }
  .product-detail-area__body .add-toCart-area {
    height: 40px;
    display: flex;
    justify-content: center;
    width: 30%; }
    @media only screen and (max-width: 768px) {
      .product-detail-area__body .add-toCart-area {
        width: 100%; } }
    .product-detail-area__body .add-toCart-area .noti-after-add-to-cart {
      display: none;
      position: absolute;
      color: #fff;
      background-color: rgba(0, 0, 0, 0.8);
      border-radius: 5px;
      line-height: 41px;
      text-align: center;
      font-weight: bold;
      bottom: 80px;
      width: calc(100% - 20px); }
    .product-detail-area__body .add-toCart-area .fk_addToCart {
      width: 100%; }
      .product-detail-area__body .add-toCart-area .fk_addToCart .addToCart-text {
        margin-left: 15px; }
    .product-detail-area__body .add-toCart-area .btn-circle-qty {
      width: 30.63px;
      height: 30.63px;
      background: #008065;
      border-radius: 100px;
      border: none;
      color: #ffffff;
      font-size: 22px;
      font-weight: 400; }
    .product-detail-area__body .add-toCart-area .input-qty {
      width: 50%;
      text-align: center; }

.lifestyle-area {
  /*  display: flex;
    flex-direction: column;
    justify-content: center;
*/ }
  .lifestyle-area lifestyle-title {
    font-size: 16px;
    font-weight: bold;
    color: #000; }
  .lifestyle-area .header {
    display: flex;
    flex-direction: row;
    justify-content: center;
    margin-bottom: 10px;
    margin-top: 20px; }
    @media only screen and (max-width: 768px) {
      .lifestyle-area .header {
        justify-content: space-between; } }
    .lifestyle-area .header .section-title {
      font-size: 16px;
      font-weight: bold;
      color: #000;
      margin-right: 15px;
      margin-top: 10px; }
    .lifestyle-area .header .lifestyle-viewall {
      color: #1e87f0;
      text-decoration: none;
      cursor: pointer;
      font-size: 16px;
      margin-top: 7px; }
  .lifestyle-area .special-img-area {
    background-image: url("https://freshket-share-bucket.s3-ap-southeast-1.amazonaws.com/rewamp2021/images/cover_web_lifestyle.jpg");
    background-repeat: no-repeat;
    background-size: cover;
    margin-left: auto;
    margin-right: auto;
    margin: 0;
    width: 100%; }
    .lifestyle-area .special-img-area .special-img-inner {
      width: 100%;
      margin-left: auto;
      margin-right: auto;
      display: flex;
      flex-direction: row;
      align-items: center;
      height: 240px; }
      .lifestyle-area .special-img-area .special-img-inner .special-content {
        display: flex;
        flex-direction: column;
        justify-content: center;
        width: 100%; }
        .lifestyle-area .special-img-area .special-img-inner .special-content .special-head-text {
          font-weight: bold;
          color: #ffffff;
          line-height: 30px;
          font-size: 30px;
          text-align: center; }
        .lifestyle-area .special-img-area .special-img-inner .special-content .special-subhead-text {
          color: #80b435;
          text-transform: uppercase;
          vertical-align: middle;
          display: inline-block;
          margin-left: 10px;
          font-size: 30px;
          text-align: center;
          margin-bottom: 5%; }
        .lifestyle-area .special-img-area .special-img-inner .special-content .special-subhead-text > span {
          color: #fff; }
  .lifestyle-area .section-with-background-area {
    background-image: url("../img/bg3-desktop.png");
    background-repeat: no-repeat;
    background-size: cover;
    margin-left: auto;
    margin-right: auto;
    padding-bottom: 5%;
    padding-top: 3%;
    background-position: top 50px !important; }
  .lifestyle-area .recipe-area {
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    padding-bottom: 10px; }
    .lifestyle-area .recipe-areah5 {
      margin-top: 10px; }
  @media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
    .lifestyle-area .health-product-slide-area {
      width: 100% !important; } }
  @media only screen and (max-width: 600px) {
    .lifestyle-area .special-health-area {
      background-image: url("../img/bg3-desktop.png"); }
    .lifestyle-area .health-product-slide-area {
      width: 100% !important; }
    .lifestyle-area .special-product-slide-item {
      min-height: 210px; } }

.fk-dealed-filter-cate-area {
  display: flex;
  justify-content: center; }
  .fk-dealed-filter-cate-area ul {
    padding: 0; }
    .fk-dealed-filter-cate-area ul li {
      display: inline-block;
      padding: 20px;
      margin: 0 10px;
      list-style: none;
      padding: 10px 15px;
      border-color: #E5E5E5;
      border-radius: 5px;
      border-width: 1px;
      border-style: solid;
      cursor: pointer;
      font-size: 16px; }
      .fk-dealed-filter-cate-area ul li:hover {
        background: #2174D8;
        border-radius: 5px;
        color: #fff; }
      .fk-dealed-filter-cate-area ul li.active {
        background: #2174D8;
        border-radius: 5px;
        color: #fff; }

.recipe-detail-area .image-recipe {
  display: block;
  margin: auto;
  width: 50%;
  height: 42%;
  border-radius: 3%; }

.recipe-detail-area .recipe-detail-data {
  padding-top: 2%;
  padding-bottom: 2%;
  padding-left: 25%; }

.recipe-detail-area .add-all-area {
  margin-top: 10%;
  position: fixed;
  bottom: calc(99.5vh - 100vh);
  background: #FFFFFF;
  box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.1);
  padding: 20px;
  text-align: center;
  width: 100%;
  z-index: 500; }
  @media only screen and (max-width: 768px) {
    .recipe-detail-area .add-all-area.add-all-area {
      bottom: calc(99.5vh - 93vh); } }

.recipe-detail-area .add-all-area-inner {
  margin-left: auto;
  margin-right: auto;
  width: 50%; }
  @media only screen and (max-width: 768px) {
    .recipe-detail-area .add-all-area-inner.add-all-area-inner {
      width: 100%;
      justify-content: center;
      display: flex;
      flex-direction: column; } }

.recipe-detail-area .Ingredients-text {
  color: #000000;
  font-weight: bold;
  margin-top: 10px; }

.recipe-detail-area .btn-add-all {
  background: #008700;
  border-radius: 5px;
  width: 209px;
  color: #fff;
  height: 40px; }

.recipe-detail-area .btn-add-all-light {
  background: #008065;
  color: #fff; }

.recipe-detail-area .Add-All-Button-Added {
  display: none; }

.fk-page-not-found * {
  font-family: Prompt;
  margin-bottom: 8px;
  border-color: transparent; }

.fk-page-not-found__fixwidth {
  min-width: 325px; }

.fk-page-not-found__container {
  display: flex;
  justify-content: center;
  overflow: hidden;
  background-color: gray;
  height: 100vh; }

.fk-page-not-found__content {
  margin-top: 50px;
  color: white; }
  .fk-page-not-found__content__container {
    padding: 18px; }

.fk-page-not-found__image {
  margin-top: 48px; }

.error-checkout-area-message {
  font-family: "Prompt" !important;
  font-style: normal !important;
  font-weight: 600;
  font-size: 16px !important;
  text-align: center;
  color: red; }

.error-checkout-supplier-area-message {
  font-family: "Prompt" !important;
  font-style: normal !important;
  font-weight: 600;
  font-size: 14px !important;
  text-align: left;
  margin-left: 8%;
  color: #F27970;
  margin-bottom: 15px; }
  .error-checkout-supplier-area-message ul {
    margin-top: 10px; }
    .error-checkout-supplier-area-message ul .item-data {
      list-style-type: disc !important;
      font-family: "Prompt" !important;
      font-style: normal;
      font-weight: normal;
      font-size: 14px;
      line-height: 30px;
      color: #F27970;
      margin-left: 25px; }

#restaurant-company-area [type="radio"]:checked,
#restaurant-company-area [type="radio"]:not(:checked) {
  position: absolute;
  left: -9999px; }

#restaurant-company-area [type="radio"]:checked + label,
#restaurant-company-area [type="radio"]:not(:checked) + label {
  position: relative;
  padding-left: 28px;
  cursor: pointer;
  line-height: 20px;
  display: inline-block;
  color: #666; }

#restaurant-company-area [type="radio"]:checked + label:before,
#restaurant-company-area [type="radio"]:not(:checked) + label:before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  width: 23px;
  height: 23px;
  border: 1px solid #008065;
  border-radius: 100%;
  background: #fff; }

#restaurant-company-area [type="radio"]:checked + label:after,
#restaurant-company-area [type="radio"]:not(:checked) + label:after {
  content: '';
  width: 13px;
  height: 13px;
  background: #008065;
  position: absolute;
  top: 5.5px;
  left: 4.8px;
  border-radius: 100%;
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease; }

#restaurant-company-area [type="radio"]:not(:checked) + label:after {
  opacity: 0;
  -webkit-transform: scale(0);
  transform: scale(0); }

#restaurant-company-area [type="radio"]:checked + label:after {
  opacity: 1;
  -webkit-transform: scale(1);
  transform: scale(1); }

.coupon {
  position: relative;
  width: 350px;
  margin: 10px;
  padding: 5px;
  height: auto;
  border-radius: 10px;
  border: 2px dashed #00ce7c;
  background-color: #fff; }
  .coupon .coupon__tag {
    position: absolute;
    left: 5%;
    top: 10%;
    width: 50%;
    /* transform: rotate(-90deg);
        -ms-transform: rotate(-90deg);
        -webkit-transform: rotate(-90deg);*/
    font-size: 0.65em;
    text-align: left;
    font-family: "Sarabun";
    color: #008065; }
    .coupon .coupon__tag .coupon_title_text {
      font-size: 20px;
      font-weight: bold; }
    .coupon .coupon__tag .promoCode_text {
      font-size: 14px;
      color: gray; }
  .coupon .coupon__body {
    margin-left: 70%;
    padding: 10px;
    border-left: 1px dotted #00ce7c; }
    .coupon .coupon__body .coupon__title, .coupon .coupon__body .coupon__value {
      text-align: center; }
    .coupon .coupon__body .coupon__title {
      font-family: "Sarabun";
      font-size: 1em;
      color: #008065; }
    .coupon .coupon__body .coupon__value {
      font-family: "Prompt";
      font-size: 14px;
      color: #008065;
      margin-top: 5px;
      /*  text-shadow: 2px 2px 0 #00ce7c;*/ }

#timeSlot [type="radio"]:checked + label:after,
#timeSlot [type="radio"]:not(:checked) + label:after {
  display: none; }

.basket-area {
  margin-top: 15px; }
  .basket-area #restaurant-company-area {
    display: none; }
  .basket-area .basket-button-outline {
    background: #FFFFFF;
    border: 2px solid #008065;
    box-sizing: border-box;
    border-radius: 12px;
    width: auto;
    padding: 8px 16px; }
  .basket-area .select_date_time_area {
    display: none; }
    .basket-area .select_date_time_area .select_date_time_inner {
      display: flex;
      flex-direction: row;
      justify-content: flex-end;
      align-items: center;
      padding: 20px 4%; }
      .basket-area .select_date_time_area .select_date_time_inner .deliveryDate {
        width: auto;
        padding: 8px 16px;
        margin-left: 10%; }
        @media only screen and (max-width: 992px) {
          .basket-area .select_date_time_area .select_date_time_inner .deliveryDate {
            width: 100% !important;
            margin-left: 0px; } }
  .basket-area .productItem .err {
    background: #FFF8F1; }
  .basket-area .orange-text {
    color: #008065;
    margin: 15px; }
  .basket-area .text-left {
    text-align: left; }
  .basket-area .text-right {
    text-align: right; }
  .basket-area .btn-back-mp {
    color: #008065; }
  .basket-area .icon-del-all {
    color: #008065; }
    .basket-area .icon-del-all .img-delete-all {
      height: 20px;
      vertical-align: unset; }
  .basket-area ul.collapsible {
    border: none;
    box-shadow: none; }
  .basket-area ul:not(.browser-default) {
    padding-left: 0;
    list-style-type: none; }
  .basket-area ul:not(.browser-default) li {
    list-style-type: none; }
  .basket-area .basketlist .f3 {
    font-size: 20px;
    font-family: superstore-book; }
  .basket-area .title-ffk {
    text-align: center;
    background-color: #008065;
    color: white;
    border-bottom: 3px solid #ffffff;
    padding: 7px 0;
    display: flex;
    justify-content: center; }
  .basket-area .collapsible-header {
    display: block;
    cursor: pointer;
    min-height: 3rem;
    line-height: 3rem;
    padding: 0 1rem;
    background-color: #fff;
    border-bottom: 1px solid #ddd; }
  @media only screen and (max-width: 992px) {
    .basket-area .checkout-item {
      flex-direction: column !important;
      padding: 0px; }
    .basket-area .shipping-address {
      flex-direction: column !important;
      padding: 0px; }
    .basket-area .item-product-area {
      padding: 0px !important; } }
  .basket-area .item-product-area {
    padding: 15px 5%;
    display: flex;
    flex-direction: row;
    width: 100%; }
    @media only screen and (max-width: 768px) {
      .basket-area .item-product-area .newtooltip1 {
        font-size: 1.2rem; }
      .basket-area .item-product-area .newtooltip2 {
        font-size: 1.2rem; }
      .basket-area .item-product-area img {
        width: 50px !important;
        height: 50px !important; } }
    @media only screen and (max-width: 992px) {
      .basket-area .item-product-area .left-area {
        width: 60% !important; }
      .basket-area .item-product-area .right-area {
        width: 40% !important; } }
    .basket-area .item-product-area .left-area {
      width: 75%;
      display: flex;
      flex-direction: row; }
      .basket-area .item-product-area .left-area img {
        width: 80px;
        height: 80px;
        margin-right: 15px; }
      .basket-area .item-product-area .left-area.minimumorder-area-description {
        display: flex;
        flex-direction: column; }
    .basket-area .item-product-area .right-area {
      width: 25%; }
      @media only screen and (max-width: 992px) {
        .basket-area .item-product-area .right-area .right-inner {
          flex-direction: column !important; } }
      .basket-area .item-product-area .right-area .right-inner {
        display: flex;
        flex-direction: row;
        justify-content: flex-end; }
    .basket-area .item-product-area .supplier-name-text {
      font-size: 16px;
      font-weight: 600; }
    .basket-area .item-product-area .line-sup-name {
      margin-top: 5%; }
    .basket-area .item-product-area .restoInfo {
      font-family: "Sarabun";
      font-size: 14px; }
  .basket-area .checkout-area {
    display: flex;
    flex-direction: column; }
  .basket-area .checkout-item {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    padding: 20px 5%;
    border-bottom: 1px solid #ddd; }
    @media only screen and (max-width: 992px) {
      .basket-area .checkout-item .left-area {
        width: 100% !important; }
      .basket-area .checkout-item .right-area {
        width: 100% !important; } }
    .basket-area .checkout-item .left-area {
      width: 70%;
      display: flex;
      align-items: center; }
      .basket-area .checkout-item .left-area .product_name {
        font-size: 16px;
        font-style: normal;
        font-weight: 500;
        line-height: 24px;
        /* or 150% */
        color: #000000; }
      .basket-area .checkout-item .left-area .packsize {
        font-family: "Sarabun";
        font-style: normal;
        font-weight: normal;
        font-size: 14px;
        line-height: 18px;
        /* identical to box height, or 129% */
        color: #494F5F; }
    .basket-area .checkout-item .right-area {
      width: 30%; }
      .basket-area .checkout-item .right-area .warning-item-validate {
        display: none; }
        .basket-area .checkout-item .right-area .warning-item-validate .warning-exclude-area {
          display: flex;
          flex-direction: row;
          justify-content: space-between; }
      .basket-area .checkout-item .right-area .btn-circle-qty {
        width: 30.63px;
        height: 30.63px;
        background: #008065;
        border-radius: 100px;
        border: none;
        color: #ffffff;
        font-size: 22px;
        font-weight: 400; }
      .basket-area .checkout-item .right-area .input-qty {
        width: 50%;
        text-align: center; }
      .basket-area .checkout-item .right-area .summary-desc-area {
        display: flex;
        flex-direction: row;
        justify-content: space-between; }
        .basket-area .checkout-item .right-area .summary-desc-area .universal-unit-area {
          font-family: "Sarabun";
          font-style: normal;
          font-weight: normal;
          font-size: 12px;
          line-height: 18px; }
        .basket-area .checkout-item .right-area .summary-desc-area .summary-text {
          font-family: "Sarabun";
          font-style: normal;
          font-weight: normal;
          font-size: 12px;
          line-height: 18px; }
  .basket-area .checkout-item-err {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    padding: 20px 5%;
    border-bottom: 1px solid #ddd;
    background: #FFF8F1; }
    @media only screen and (max-width: 992px) {
      .basket-area .checkout-item-err .left-area {
        width: 100% !important; }
      .basket-area .checkout-item-err .right-area {
        width: 100% !important; }
        .basket-area .checkout-item-err .right-area .warning-item-validate {
          margin-left: 20%; } }
    .basket-area .checkout-item-err .left-area {
      width: 70%;
      display: flex;
      align-items: center; }
      .basket-area .checkout-item-err .left-area .product_name {
        font-size: 16px;
        font-style: normal;
        font-weight: 500;
        line-height: 24px;
        /* or 150% */
        color: #A4AAB9; }
      .basket-area .checkout-item-err .left-area .packsize {
        font-family: "Sarabun";
        font-style: normal;
        font-weight: normal;
        font-size: 14px;
        line-height: 18px;
        /* identical to box height, or 129% */
        color: #A4AAB9; }
      .basket-area .checkout-item-err .left-area .normal-price-area {
        color: #A4AAB9; }
    .basket-area .checkout-item-err .right-area {
      width: 30%; }
      .basket-area .checkout-item-err .right-area .m_padd_top {
        display: none; }
      .basket-area .checkout-item-err .right-area .warning-item-validate {
        display: block; }
        .basket-area .checkout-item-err .right-area .warning-item-validate .warning-exclude-area {
          display: flex;
          flex-direction: row;
          justify-content: space-between; }
      .basket-area .checkout-item-err .right-area .btn-circle-qty {
        width: 30.63px;
        height: 30.63px;
        background: #008065;
        border-radius: 100px;
        border: none;
        color: #ffffff;
        font-size: 22px;
        font-weight: 400; }
      .basket-area .checkout-item-err .right-area .input-qty {
        width: 50%;
        text-align: center; }
      .basket-area .checkout-item-err .right-area .summary-desc-area {
        display: flex;
        flex-direction: row;
        justify-content: space-between; }
        .basket-area .checkout-item-err .right-area .summary-desc-area .universal-unit-area {
          font-family: "Sarabun";
          font-style: normal;
          font-weight: normal;
          font-size: 12px;
          line-height: 18px; }
        .basket-area .checkout-item-err .right-area .summary-desc-area .summary-text {
          font-family: "Sarabun";
          font-style: normal;
          font-weight: normal;
          font-size: 12px;
          line-height: 18px; }
  .basket-area .promocode-area {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    padding: 20px 5%; }
    .basket-area .promocode-area .input_enter_promo_code {
      font-family: "Sarabun"; }
    @media only screen and (max-width: 992px) {
      .basket-area .promocode-area .left-area {
        width: 50% !important; }
      .basket-area .promocode-area .right-area {
        width: 50% !important; } }
    .basket-area .promocode-area .discount-head-text {
      font-family: "Prompt";
      font-style: normal;
      font-weight: 600;
      font-size: 16px;
      line-height: 32px;
      /* identical to box height, or 200% */
      text-align: left;
      color: #000000; }
    .basket-area .promocode-area .left-area {
      width: 70%; }
    .basket-area .promocode-area .right-area {
      width: 30%;
      display: flex;
      flex-direction: row;
      justify-content: space-between; }
      .basket-area .promocode-area .right-area .textinput {
        width: 60%; }
      .basket-area .promocode-area .right-area button {
        width: 15%; }
  .basket-area .select-paperbox-head-text {
    font-family: "Prompt";
    font-style: normal;
    font-weight: 600;
    font-size: 16px;
    line-height: 32px;
    /* identical to box height, or 200% */
    text-align: left;
    color: #000000;
    margin: 20px 4%; }
  .basket-area .current-delivery-address-area {
    display: flex;
    flex-direction: column; }
    .basket-area .current-delivery-address-area .delivery-address-head-text {
      font-family: "Prompt";
      font-style: normal;
      font-weight: 600;
      font-size: 16px;
      line-height: 32px;
      text-align: left;
      color: #000000;
      margin: 20px 4%; }
    .basket-area .current-delivery-address-area .current-delivery-address-data-area {
      /* display: flex;
            flex-direction: row;
            align-items: center;*/ }
      .basket-area .current-delivery-address-area .current-delivery-address-data-area .current-delivery-address-text {
        padding: 20px 4%;
        font-family: "Sarabun";
        font-style: normal;
        font-weight: normal;
        font-size: 16px;
        line-height: 24px;
        color: #A4AAB9;
        width: 80%;
        margin-right: 10px; }
        .basket-area .current-delivery-address-area .current-delivery-address-data-area .current-delivery-address-text img {
          margin-left: 4px; }
  @media only screen and (max-width: 768px) {
    .basket-area .userBasket-area {
      flex-direction: column !important;
      justify-content: center !important;
      align-items: center !important;
      padding: 0px !important; } }
  @media only screen and (min-width: 768px) and (max-device-width: 768px) {
    .basket-area .userBasket-area {
      flex-direction: row !important;
      justify-content: space-between !important;
      align-items: center !important;
      padding: 20px 4%; } }
  .basket-area .userBasket-area {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    padding: 20px 4%;
    /* ******************* Selection Radio Item */ }
    @media only screen and (max-width: 768px) {
      .basket-area .userBasket-area .left-area {
        width: 80% !important; }
      .basket-area .userBasket-area .right-area {
        width: 20% !important; } }
    .basket-area .userBasket-area .select-plastic-desc {
      font-family: "Sarabun";
      font-style: normal;
      font-weight: normal;
      font-size: 16px;
      line-height: 24px;
      color: #A4AAB9;
      width: 80%;
      margin-bottom: 20px;
      min-height: 96px; }
    .basket-area .userBasket-area .user-basket-head {
      font-family: "Prompt";
      font-style: normal;
      font-weight: 600;
      font-size: 16px;
      line-height: 24px;
      /* or 150% */
      color: #191E28; }
    .basket-area .userBasket-area .user-basket-text {
      font-family: "Sarabun";
      font-style: normal;
      font-size: 14px;
      line-height: 24px;
      /* or 150% */
      color: #191E28; }
    @media only screen and (max-width: 768px) {
      .basket-area .userBasket-area .selected-content {
        width: 100% !important; }
      .basket-area .userBasket-area .select-plastic-desc {
        width: 100% !important; }
      .basket-area .userBasket-area .selection-wrapper {
        width: 100% !important; } }
    @media only screen and (min-width: 768px) and (max-device-width: 768px) {
      .basket-area .userBasket-area .selected-content {
        width: 320px !important; }
      .basket-area .userBasket-area .select-plastic-desc {
        width: 90% !important; }
      .basket-area .userBasket-area .selection-wrapper {
        width: 100% !important; } }
    @media only screen and (min-device-width: 1024px) and (max-device-width: 1366px) and (-webkit-min-device-pixel-ratio: 2) {
      .basket-area .userBasket-area .selected-content {
        width: 400px !important; }
      .basket-area .userBasket-area .select-plastic-desc {
        width: 90% !important; } }
    .basket-area .userBasket-area .selected-content {
      font-family: "Sarabun";
      text-align: left;
      border-radius: 3px;
      box-shadow: 0 2px 4px 0 rgba(219, 215, 215, 0);
      border: solid 2px #D2D8E5;
      border-radius: 8px;
      background: #fff;
      /*  max-width: 280px;*/
      /* height: 330px;*/
      padding: 10px 45px;
      transition: .3s ease-in-out all;
      width: 450px;
      height: 88px;
      display: flex;
      flex-direction: row;
      justify-content: space-between;
      align-items: center;
      cursor: pointer; }
    .basket-area .userBasket-area .selected-content img {
      width: 230px;
      margin: 0 auto; }
    .basket-area .userBasket-area .selected-content h4 {
      font-size: 16px;
      letter-spacing: -0.24px;
      text-align: left;
      color: #1f2949; }
    .basket-area .userBasket-area .selected-content h5 {
      font-size: 14px;
      line-height: 1.4;
      text-align: center;
      color: #686d73; }
    .basket-area .userBasket-area .selected-label {
      position: relative;
      width: 100%; }
    .basket-area .userBasket-area .selected-label input {
      display: none; }
    .basket-area .userBasket-area .selected-label .icon {
      width: 20px;
      height: 20px;
      border: solid 2px #e3e3e3;
      border-radius: 50%;
      position: absolute;
      top: 40%;
      left: 15px;
      transition: .3s ease-in-out all;
      transform: scale(1);
      z-index: 1; }
    .basket-area .userBasket-area .selected-label .icon:before {
      content: "\f00c";
      position: absolute;
      width: 100%;
      height: 100%;
      font-family: "Font Awesome 5 Free";
      font-weight: 900;
      font-size: 12px;
      color: #000;
      text-align: center;
      opacity: 0;
      transition: .2s ease-in-out all;
      transform: scale(2); }
    .basket-area .userBasket-area .selected-label input:checked + .icon {
      background: #00A053;
      border-color: #00A053;
      transform: scale(1.2); }
    .basket-area .userBasket-area .selected-label input:checked + .icon:before {
      color: #fff;
      opacity: 1;
      transform: scale(0.8); }
    .basket-area .userBasket-area .selected-label input:checked ~ .selected-content {
      box-shadow: 0 2px 4px 0 rgba(219, 215, 215, 0.5);
      border: solid 2px #00A053;
      background: #E9F4EF; }
  .basket-area .summary-data-area {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    padding: 20px 5%; }
    .basket-area .summary-data-area .left-align {
      text-align: left;
      font-family: "Sarabun";
      font-style: normal;
      font-weight: normal;
      font-size: 16px;
      line-height: 24px;
      /* or 150% */
      color: #000000; }
    .basket-area .summary-data-area .right-align {
      text-align: right;
      font-family: "Sarabun";
      font-style: normal;
      font-weight: normal;
      font-size: 16px;
      line-height: 24px;
      /* or 150% */
      text-align: right;
      color: #191E28; }
    .basket-area .summary-data-area .grand-total-text-left {
      font-family: "Sarabun";
      font-style: normal;
      font-weight: bold;
      font-size: 20px;
      line-height: 24px;
      text-align: left;
      /* identical to box height, or 120% */
      color: #191E28; }
    .basket-area .summary-data-area .grand-total-text-right {
      font-family: "Sarabun";
      font-style: normal;
      font-weight: bold;
      font-size: 20px;
      line-height: 24px;
      text-align: right;
      /* identical to box height, or 120% */
      color: #191E28; }
  .basket-area .basket-footer-area {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 20px 5%; }
    .basket-area .basket-footer-area .btn-primary {
      width: 20%; }
      @media only screen and (max-width: 992px) {
        .basket-area .basket-footer-area .btn-primary {
          width: 100%; } }
  .basket-area .time2ship {
    padding: 10px;
    margin: 15px;
    text-align: center;
    list-style: none;
    border-top: 1px solid #ccc;
    line-height: 2.5rem;
    height: 150px;
    padding-bottom: 15px; }
    .basket-area .time2ship .deliverytime-head {
      font-family: "Prompt";
      font-style: normal;
      font-weight: bold;
      font-size: 20px;
      line-height: 36px;
      text-align: center;
      color: #191E28;
      margin: 15px; }
    .basket-area .time2ship li {
      display: inline-block; }
      .basket-area .time2ship li [type="radio"]:not(:checked), .basket-area .time2ship li [type="radio"]:checked {
        position: absolute;
        left: -9999px;
        opacity: 0; }
      .basket-area .time2ship li [type="radio"]:not(:checked) + label {
        padding: 8px 16px;
        background: #FFFFFF;
        border: 1px solid #008065;
        box-sizing: border-box;
        border-radius: 24px;
        padding: 8px 16px;
        width: 120px;
        font-size: 14px;
        font-family: "Sarabun";
        font-style: normal;
        cursor: pointer; }
      .basket-area .time2ship li [type="radio"]:checked + label {
        padding: 8px 16px;
        background: #FFFFFF;
        border: 1px solid #008065;
        box-sizing: border-box;
        border-radius: 24px;
        padding: 8px 16px;
        width: 120px;
        font-size: 14px;
        font-family: "Sarabun";
        font-style: normal;
        cursor: pointer;
        color: #FFF;
        background-color: #008065; }
  .basket-area #shipping-address {
    display: none; }
  .basket-area .header-shipping {
    font-style: normal;
    font-weight: bold;
    font-size: 24px;
    line-height: 36px;
    color: #191E28;
    margin-top: 20px; }
  .basket-area #remark-area {
    display: none; }
  .basket-area .shipping-address {
    margin-top: 20px;
    /* margin-bottom: 50px;*/
    padding: 20px 0px;
    display: flex;
    flex-direction: row;
    width: 100%;
    min-height: 450px; }
    @media only screen and (max-width: 992px) {
      .basket-area .shipping-address .left-area {
        width: 100% !important;
        height: unset !important; }
      .basket-area .shipping-address .right-area {
        width: 100% !important; } }
    .basket-area .shipping-address .left-area {
      width: 70%;
      height: 50px; }
      @media only screen and (max-width: 992px) {
        .basket-area .shipping-address .left-area .text-input {
          width: 100% !important; }
        .basket-area .shipping-address .left-area .text-input-province {
          width: 100% !important; } }
      .basket-area .shipping-address .left-area .sub-head {
        display: block; }
      .basket-area .shipping-address .left-area .no-padding {
        padding: 0px; }
      .basket-area .shipping-address .left-area .text-input {
        height: 40px !important; }
      .basket-area .shipping-address .left-area .text-input-province {
        width: 97.5%; }
      .basket-area .shipping-address .left-area .col {
        margin-bottom: 10px;
        margin-top: 10px;
        height: 85px; }
      .basket-area .shipping-address .left-area .msg-error {
        margin-top: 0px !important; }
    .basket-area .shipping-address .right-area {
      width: 30%; }
    .basket-area .shipping-address .bottom-shipping {
      font-family: "Sarabun";
      font-style: normal;
      font-weight: normal;
      font-size: 14px;
      line-height: 24px;
      /* identical to box height, or 150% */
      text-align: center;
      color: #A4AAB9; }
  .basket-area .box-confirm-area {
    display: flex;
    justify-content: center; }

.promocode-modal-container {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  margin-bottom: 20px; }
  .promocode-modal-container .promocode-control-area {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    width: 100%; }
    .promocode-modal-container .promocode-control-area .left-area {
      width: 75%; }
    .promocode-modal-container .promocode-control-area .right-area {
      width: 20%; }

.loading-in-div-area {
  display: none; }
  .loading-in-div-area .loading-in-div {
    display: flex;
    flex-direction: column;
    margin: auto; }
    .loading-in-div-area .loading-in-div .loader {
      /* width: 200px;*/
      height: 50px;
      padding-top: 5vh;
      margin: auto;
      display: flex; }
    .loading-in-div-area .loading-in-div .circle {
      width: 15px;
      height: 15px;
      background: white;
      border-radius: 50%;
      animation: jump 1s linear infinite;
      margin: 0 5px;
      background-color: #008065; }
    .loading-in-div-area .loading-in-div .caption {
      font-family: "Prompt";
      margin: auto;
      font-size: 14px;
      color: #000000;
      margin-top: 15px; }
    .loading-in-div-area .loading-in-div #b {
      animation-delay: 0.2s;
      background-color: #008065; }
    .loading-in-div-area .loading-in-div #c {
      animation-delay: 0.4s;
      background-color: #008065; }

@keyframes jump {
  0% {
    margin-top: 0; }
  35% {
    margin-top: -25px; }
  70% {
    margin-top: 0px; } }

.inner-button-click-search {
  background: #F0F7F9;
  border-radius: 16px;
  height: 60px;
  display: flex;
  justify-content: space-between;
  flex-direction: row;
  padding: 10px 17px; }

.text-product-type-count-item {
  display: none;
  font-style: normal;
  font-weight: 500;
  font-size: 14px;
  line-height: 21px;
  color: #393D42;
  text-align: left;
  margin-top: 35px;
  margin-bottom: 15px;
  margin-left: 10px; }

.text-product-type-count-item-mobile {
  display: block;
  font-style: normal;
  font-weight: 500;
  font-size: 14px;
  line-height: 21px;
  color: #393D42;
  text-align: center;
  margin-top: 35px;
  margin-bottom: 25px; }

.product-type-button-area {
  list-style: none;
  display: flex;
  flex-direction: row;
  justify-content: center; }
  .product-type-button-area .product-type-item {
    background: #F0F7F9;
    box-shadow: 0px 4px 16px rgba(103, 109, 126, 0.25);
    border-radius: 16px;
    padding: 8px 2px;
    margin-left: 10px;
    margin-right: 10px;
    margin-top: 30px;
    font-style: normal;
    font-weight: 500;
    font-size: 14px;
    line-height: 24px;
    color: #008065;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 108px;
    height: 82px; }
    .product-type-button-area .product-type-item img {
      width: 40px;
      height: 40px; }
  .product-type-button-area .product-type-item-active {
    background: #00CE7C;
    border-radius: 16px;
    padding: 8px 2px;
    margin-left: 10px;
    margin-right: 10px;
    margin-top: 30px;
    color: #008065;
    cursor: pointer;
    font-style: normal;
    font-weight: 500;
    font-size: 14px;
    line-height: 24px;
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 108px;
    height: 82px; }
    .product-type-button-area .product-type-item-active img {
      width: 40px;
      height: 40px; }

@media only screen and (min-width: 992px) {
  .text-product-type-count-item {
    display: block; }
  .text-product-type-count-item-mobile {
    display: none; }
  .product-type-button-area {
    list-style: none;
    display: flex;
    flex-direction: row;
    justify-content: unset; }
    .product-type-button-area .product-type-item {
      background: #F0F7F9;
      box-shadow: 0px 4px 16px rgba(103, 109, 126, 0.25);
      border-radius: 16px;
      padding: 16px 24px;
      margin-left: 10px;
      margin-right: 10px;
      margin-top: 30px;
      font-style: normal;
      font-weight: 500;
      font-size: 16px;
      line-height: 36px;
      color: #008065;
      cursor: pointer;
      width: unset;
      height: unset;
      display: flex;
      flex-direction: row; }
    .product-type-button-area .product-type-item-active {
      background: #00CE7C;
      border-radius: 16px;
      padding: 16px 24px;
      margin-left: 10px;
      margin-right: 10px;
      margin-top: 30px;
      color: #008065;
      cursor: pointer;
      font-style: normal;
      font-weight: 500;
      font-size: 16px;
      line-height: 36px;
      width: unset;
      height: unset;
      display: flex;
      flex-direction: row; } }

.campaign-page-area {
  padding-top: 0px;
  margin-bottom: 16px; }
  .campaign-page-area .section-title-area {
    padding-left: 16px;
    padding-right: 16px;
    margin-top: 16px;
    margin-bottom: 16px;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    width: 100%; }
    .campaign-page-area .section-title-area .section-title {
      font-style: normal;
      font-weight: 600;
      font-size: 20px;
      line-height: 32px;
      color: #393D42;
      width: 70%; }
    .campaign-page-area .section-title-area .view-all-btn-icon {
      color: #008065;
      font-size: 25px; }
    .campaign-page-area .section-title-area .view-all-btn {
      font-style: normal;
      font-weight: normal;
      font-size: 16px;
      line-height: 24px;
      text-align: right;
      color: #00B28D;
      display: none; }
  .campaign-page-area .section-items {
    margin-top: 0px;
    margin-bottom: 80px;
    /*  margin-left:16px;*/ }
  .campaign-page-area .padding-16 {
    padding-left: 16px;
    padding-right: 16px; }
  .campaign-page-area .image-banner {
    background: #AEE6FF;
    border-radius: 12px;
    margin-top: 16px;
    margin-bottom: 8px;
    border-radius: 12px; }
  .campaign-page-area .image-banner-top {
    background: #AEE6FF;
    border-radius: 12px;
    margin-top: 40px;
    margin-bottom: 16px;
    border-radius: 12px; }
  .campaign-page-area .image-promotion {
    margin-top: unset;
    margin-bottom: unset; }
  .campaign-page-area .empty-cart-area {
    display: flex;
    justify-content: center; }
  .campaign-page-area .universal-unit-content {
    height: 23px; }
    .campaign-page-area .universal-unit-content .universal-unit-area {
      display: none; }
      .campaign-page-area .universal-unit-content .universal-unit-area span {
        font-family: "Sarabun";
        font-style: normal;
        font-weight: normal;
        font-size: 12px;
        line-height: 18px;
        color: #A4AAB9; }
  .campaign-page-area .btn-circle-qty {
    width: 30.63px;
    height: 30.63px;
    background: #008065;
    border-radius: 100px;
    border: none;
    color: #ffffff;
    font-size: 22px;
    font-weight: 400; }
  .campaign-page-area .add-toCart-area {
    min-height: 42px; }
  .campaign-page-area .input-qty {
    width: 50%;
    text-align: center; }
  .campaign-page-area .link {
    cursor: pointer; }
  .campaign-page-area .brandarea {
    display: flex;
    flex-wrap: wrap;
    justify-content: center; }
    .campaign-page-area .brandarea .brand-item {
      border: solid 1px #EDEFF4;
      flex: 0 0 calc(33.33% - 20px);
      margin: 10px; }
  .campaign-page-area .promotionarea {
    width: 100%;
    margin-right: auto;
    margin-left: auto;
    justify-content: center;
    display: flex;
    flex-wrap: wrap; }
    .campaign-page-area .promotionarea .promotion-item {
      flex: 0 0 calc(100%);
      margin: 10px; }

@media only screen and (min-width: 992px) {
  .campaign-page-area {
    padding: 16px;
    padding-top: 0px;
    margin-bottom: 16px;
    /* padding-right: 15px;
        padding-left: 15px;*/
    margin-right: auto;
    margin-left: auto;
    overflow: hidden; }
    .campaign-page-area .section-title-area {
      margin-right: auto;
      margin-left: auto;
      width: 1170px;
      padding-left: 0px;
      padding-right: 0px; }
      .campaign-page-area .section-title-area .view-all-btn-icon {
        display: none; }
      .campaign-page-area .section-title-area .view-all-btn {
        display: block !important; }
    .campaign-page-area .brandarea {
      width: 1170px;
      margin-right: auto;
      margin-left: auto;
      display: flex;
      flex-wrap: wrap;
      justify-content: center; }
      .campaign-page-area .brandarea .brand-item {
        border: solid 1px #EDEFF4;
        flex: 0 0 calc(16.66% - 20px);
        margin: 10px; }
    .campaign-page-area .image-banner {
      width: 1170px;
      margin-right: auto;
      margin-left: auto;
      justify-content: center;
      display: flex; }
    .campaign-page-area .image-banner-top {
      width: 1170px;
      margin-right: auto;
      margin-left: auto;
      justify-content: center;
      display: flex; }
    .campaign-page-area .image-promotion {
      width: 1170px;
      margin-right: auto;
      margin-left: auto;
      justify-content: center;
      display: flex; }
    .campaign-page-area .promotionarea {
      width: 1170px;
      margin-right: auto;
      margin-left: auto;
      justify-content: space-between;
      display: flex;
      /* padding-bottom: 30px;*/ }
      .campaign-page-area .promotionarea .promotion-item {
        width: 48%;
        flex: unset;
        margin: unset; }
    .campaign-page-area .section-items {
      width: 1170px;
      margin-right: auto;
      margin-left: auto; }
    .campaign-page-area .recipe-area-slide {
      width: 1170px;
      margin-right: auto;
      margin-left: auto; } }

.incomplete-page-area {
  display: flex;
  flex-direction: column;
  min-height: 100vh; }
  .incomplete-page-area .incomplete-image-area {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding-top: 45%; }
    .incomplete-page-area .incomplete-image-area .incomplete-image {
      width: 50%; }
  .incomplete-page-area .header-text {
    margin-top: 16px;
    margin-bottom: 16px;
    font-style: normal;
    font-weight: 600;
    font-size: 28px;
    line-height: 36px;
    color: #393D42; }
  .incomplete-page-area .restaurant-info-area {
    margin-bottom: 16px; }
    .incomplete-page-area .restaurant-info-area .sub-text {
      line-height: 30px;
      font-style: normal;
      font-weight: 600;
      font-size: 14px;
      line-height: 24px;
      color: #393D42; }
  .incomplete-page-area .items-incomplete-area .items-incommplete-info {
    width: 100%; }
    .incomplete-page-area .items-incomplete-area .items-incommplete-info .detail-text {
      padding-bottom: 16px;
      border-bottom: 2px solid #F1F2F6;
      line-height: 30px;
      font-style: normal;
      font-weight: 600;
      font-size: 12px;
      line-height: 24px;
      color: #393D42; }
    .incomplete-page-area .items-incomplete-area .items-incommplete-info .item-area {
      border-bottom: 2px solid #F1F2F6;
      padding-top: 16px;
      padding-bottom: 16px;
      display: flex;
      flex-direction: row;
      justify-content: space-between; }
      .incomplete-page-area .items-incomplete-area .items-incommplete-info .item-area .left-area {
        display: flex;
        flex-direction: column; }
        .incomplete-page-area .items-incomplete-area .items-incommplete-info .item-area .left-area .item-name-text {
          font-style: normal;
          font-weight: normal;
          font-size: 14px;
          line-height: 20px;
          color: #393D42; }
        .incomplete-page-area .items-incomplete-area .items-incommplete-info .item-area .left-area .packsize-price-text {
          font-style: normal;
          font-weight: normal;
          font-size: 12px;
          line-height: 20px;
          margin-left: 15px;
          color: #494F5F; }
      .incomplete-page-area .items-incomplete-area .items-incommplete-info .item-area .right-area {
        display: flex;
        flex-direction: column; }
        .incomplete-page-area .items-incomplete-area .items-incommplete-info .item-area .right-area .missing-text {
          font-style: normal;
          font-weight: 500;
          font-size: 14px;
          line-height: 20px;
          text-align: right;
          color: #FF0500; }
        .incomplete-page-area .items-incomplete-area .items-incommplete-info .item-area .right-area .missing-from-order {
          font-style: normal;
          font-weight: normal;
          font-size: 12px;
          line-height: 20px;
          text-align: right;
          color: #494F5F; }
  .incomplete-page-area .items-incomplete-area .incomplete-refund-area {
    width: 100%; }
    .incomplete-page-area .items-incomplete-area .incomplete-refund-area .refund-top {
      display: flex;
      flex-direction: row;
      justify-content: space-between; }
      .incomplete-page-area .items-incomplete-area .incomplete-refund-area .refund-top .refund-head-text {
        font-style: normal;
        font-weight: 600;
        font-size: 18px;
        line-height: 20px;
        color: #393D42;
        margin-top: 16px;
        margin-bottom: 16px; }
    .incomplete-page-area .items-incomplete-area .incomplete-refund-area .refund-detail {
      margin-top: 16px;
      margin-bottom: 42px;
      padding: 8px;
      background: #F0F6FC;
      border-radius: 8px;
      display: flex;
      flex-direction: row;
      justify-content: space-between; }
      .incomplete-page-area .items-incomplete-area .incomplete-refund-area .refund-detail .refund-detail-text {
        font-style: normal;
        font-weight: 500;
        font-size: 14px;
        line-height: 20px;
        color: #2174D8; }

.incomplete-modal-area .incomplete-head {
  align-items: unset !important;
  height: 300px;
  background-size: cover;
  background-repeat: no-repeat;
  background-image: url("https://freshket-share-bucket.s3.ap-southeast-1.amazonaws.com/rewamp2021/images/incomplete/Incomplete_head.svg"); }

.incomplete-modal-area .modal-content-incomplete {
  border-radius: 25px !important;
  width: 100%; }
  .incomplete-modal-area .modal-content-incomplete .modal-body {
    padding: 15px !important; }
  .incomplete-modal-area .modal-content-incomplete .incomplete-body-area {
    display: flex;
    flex-direction: column;
    justify-items: center;
    text-align: center;
    padding: 16px;
    align-items: center; }
    .incomplete-modal-area .modal-content-incomplete .incomplete-body-area .incomplete-body-head-text {
      font-style: normal;
      font-weight: 600;
      font-size: 22px;
      line-height: 26px;
      text-align: center;
      color: #393D42;
      margin: 8px; }
    .incomplete-modal-area .modal-content-incomplete .incomplete-body-area .incomplete-body-subhead-text {
      font-style: normal;
      font-weight: 600;
      font-size: 14px;
      line-height: 20px;
      text-align: center;
      color: #393D42;
      margin: 8px; }
    .incomplete-modal-area .modal-content-incomplete .incomplete-body-area .incomplete-body-detail-text {
      font-style: normal;
      font-weight: 400;
      font-size: 14px;
      line-height: 20px;
      text-align: center;
      color: #393D42;
      margin: 8px; }
    .incomplete-modal-area .modal-content-incomplete .incomplete-body-area .btn-view-incomplete {
      width: 45%;
      padding: 8px 16px;
      margin-top: 24px; }

.incomplete-list-area {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  min-height: 100vh; }
  .incomplete-list-area .header-text {
    margin-top: 16px;
    margin-bottom: 16px;
    font-style: normal;
    font-weight: 600;
    font-size: 28px;
    line-height: 36px;
    color: #393D42; }
  .incomplete-list-area .items-incomplete-area .items-incommplete-info .item-area {
    border-bottom: 2px solid #F1F2F6;
    padding-top: 16px;
    padding-bottom: 16px;
    display: flex;
    flex-direction: column; }
    .incomplete-list-area .items-incomplete-area .items-incommplete-info .item-area .item-inner {
      display: flex;
      flex-direction: row;
      justify-content: space-between; }
      .incomplete-list-area .items-incomplete-area .items-incommplete-info .item-area .item-inner .left-area {
        display: flex;
        flex-direction: column; }
        .incomplete-list-area .items-incomplete-area .items-incommplete-info .item-area .item-inner .left-area .delievery-time-text {
          font-style: normal;
          font-weight: 600;
          font-size: 14px;
          line-height: 24px;
          color: #393D42; }
        .incomplete-list-area .items-incomplete-area .items-incommplete-info .item-area .item-inner .left-area .inv-name-text {
          font-style: normal;
          font-weight: 600;
          font-size: 14px;
          line-height: 20px;
          color: #393D42; }
        .incomplete-list-area .items-incomplete-area .items-incommplete-info .item-area .item-inner .left-area .desc-text {
          font-style: normal;
          font-weight: normal;
          font-size: 14px;
          line-height: 24px;
          color: #A4AAB9; }
      .incomplete-list-area .items-incomplete-area .items-incommplete-info .item-area .item-inner .right-area {
        color: #008065;
        font-size: 18px; }
  .incomplete-list-area .incomplete-image-area {
    padding-top: 25%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 100%; }
    .incomplete-list-area .incomplete-image-area .incomplete-image {
      width: 100%; }

@media only screen and (min-width: 992px) {
  .incomplete-page-area .incomplete-image-area {
    padding-top: 10%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center; }
    .incomplete-page-area .incomplete-image-area .incomplete-image {
      width: 20%; }
  .incomplete-page-area .items-incomplete-area {
    display: flex;
    flex-direction: row;
    justify-content: space-between; }
    .incomplete-page-area .items-incomplete-area .items-incommplete-info {
      width: 60%; }
      .incomplete-page-area .items-incomplete-area .items-incommplete-info .item-area {
        border-bottom: 2px solid #F1F2F6;
        padding-top: 16px;
        padding-bottom: 16px;
        display: flex;
        flex-direction: row;
        justify-content: space-between; }
        .incomplete-page-area .items-incomplete-area .items-incommplete-info .item-area .left-area {
          display: flex;
          flex-direction: column; }
          .incomplete-page-area .items-incomplete-area .items-incommplete-info .item-area .left-area .item-name-text {
            font-style: normal;
            font-weight: normal;
            font-size: 14px;
            line-height: 20px;
            color: #393D42; }
          .incomplete-page-area .items-incomplete-area .items-incommplete-info .item-area .left-area .packsize-price-text {
            font-style: normal;
            font-weight: normal;
            font-size: 12px;
            line-height: 20px;
            margin-left: 15px;
            color: #494F5F; }
        .incomplete-page-area .items-incomplete-area .items-incommplete-info .item-area .right-area {
          display: flex;
          flex-direction: column; }
          .incomplete-page-area .items-incomplete-area .items-incommplete-info .item-area .right-area .missing-text {
            font-style: normal;
            font-weight: 500;
            font-size: 14px;
            line-height: 20px;
            text-align: right;
            color: #FF0500; }
          .incomplete-page-area .items-incomplete-area .items-incommplete-info .item-area .right-area .missing-from-order {
            font-style: normal;
            font-weight: normal;
            font-size: 12px;
            line-height: 20px;
            text-align: right;
            color: #494F5F; }
    .incomplete-page-area .items-incomplete-area .incomplete-refund-area {
      width: 30%;
      padding-left: 16px; }
      .incomplete-page-area .items-incomplete-area .incomplete-refund-area .refund-top {
        display: flex;
        flex-direction: row;
        justify-content: space-between; }
        .incomplete-page-area .items-incomplete-area .incomplete-refund-area .refund-top .refund-head-text {
          font-style: normal;
          font-weight: 600;
          font-size: 18px;
          line-height: 20px;
          color: #393D42; }
  .incomplete-modal-area .incomplete-head {
    align-items: unset !important;
    height: 300px;
    background-size: cover;
    background-repeat: no-repeat;
    background-image: url("https://freshket-share-bucket.s3.ap-southeast-1.amazonaws.com/rewamp2021/images/incomplete/Incomplete_head.svg"); }
  .incomplete-modal-area .modal-content-incomplete {
    border-radius: 25px !important;
    width: 90%; }
    .incomplete-modal-area .modal-content-incomplete .modal-body {
      padding: 15px !important; }
    .incomplete-modal-area .modal-content-incomplete .incomplete-body-area {
      display: flex;
      flex-direction: column;
      justify-items: center;
      text-align: center;
      padding: 16px;
      align-items: center; }
      .incomplete-modal-area .modal-content-incomplete .incomplete-body-area .incomplete-body-head-text {
        font-style: normal;
        font-weight: 600;
        font-size: 22px;
        line-height: 26px;
        text-align: center;
        color: #393D42;
        margin: 8px; }
      .incomplete-modal-area .modal-content-incomplete .incomplete-body-area .incomplete-body-subhead-text {
        font-style: normal;
        font-weight: 600;
        font-size: 14px;
        line-height: 20px;
        text-align: center;
        color: #393D42;
        margin: 8px; }
      .incomplete-modal-area .modal-content-incomplete .incomplete-body-area .incomplete-body-detail-text {
        font-style: normal;
        font-weight: 400;
        font-size: 14px;
        line-height: 20px;
        text-align: center;
        color: #393D42;
        margin: 8px; }
      .incomplete-modal-area .modal-content-incomplete .incomplete-body-area .btn-view-incomplete {
        width: 45%;
        padding: 8px 16px;
        margin-top: 24px; }
  .incomplete-list-area {
    align-items: flex-start;
    justify-content: flex-start; }
    .incomplete-list-area .incomplete-image-area {
      padding-top: 10%;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      width: 100%; }
      .incomplete-list-area .incomplete-image-area .incomplete-image {
        width: 20%; }
    .incomplete-list-area .items-incomplete-area {
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      width: 100%; }
      .incomplete-list-area .items-incomplete-area .items-incommplete-info {
        width: 100%; }
        .incomplete-list-area .items-incomplete-area .items-incommplete-info .item-area {
          border-bottom: 2px solid #F1F2F6;
          padding-top: 16px;
          padding-bottom: 16px;
          display: flex;
          flex-direction: row;
          justify-content: space-between;
          width: 100%; }
          .incomplete-list-area .items-incomplete-area .items-incommplete-info .item-area .item-inner {
            width: 100%;
            align-items: center; }
          .incomplete-list-area .items-incomplete-area .items-incommplete-info .item-area .left-area {
            display: flex;
            flex-direction: column; }
            .incomplete-list-area .items-incomplete-area .items-incommplete-info .item-area .left-area .item-name-text {
              font-style: normal;
              font-weight: normal;
              font-size: 14px;
              line-height: 20px;
              color: #393D42; }
            .incomplete-list-area .items-incomplete-area .items-incommplete-info .item-area .left-area .packsize-price-text {
              font-style: normal;
              font-weight: normal;
              font-size: 12px;
              line-height: 20px;
              margin-left: 15px;
              color: #494F5F; }
          .incomplete-list-area .items-incomplete-area .items-incommplete-info .item-area .right-area {
            display: flex;
            flex-direction: column; }
            .incomplete-list-area .items-incomplete-area .items-incommplete-info .item-area .right-area .missing-text {
              font-style: normal;
              font-weight: 500;
              font-size: 14px;
              line-height: 20px;
              text-align: right;
              color: #FF0500; }
            .incomplete-list-area .items-incomplete-area .items-incommplete-info .item-area .right-area .missing-from-order {
              font-style: normal;
              font-weight: normal;
              font-size: 12px;
              line-height: 20px;
              text-align: right;
              color: #494F5F; } }

.multiple-address-area {
  display: flex;
  flex-direction: column;
  padding: 8px; }
  .multiple-address-area .header-text {
    font-style: normal;
    font-weight: 600;
    font-size: 20px;
    line-height: 28px;
    color: #393D42;
    margin-top: 8px;
    margin-bottom: 8px; }
  .multiple-address-area .message-address {
    padding: 8px;
    margin-bottom: 8px;
    height: 80px;
    background: #F5DBDB;
    border-radius: 12px;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    font-style: normal;
    font-weight: 500;
    font-size: 14px;
    line-height: 20px;
    color: #F27A7A; }
    .multiple-address-area .message-address img {
      margin-right: 4px; }
  .multiple-address-area .btn-add-neww-address {
    font-style: normal;
    font-weight: normal;
    font-size: 14px;
    line-height: 24px;
    color: #008065;
    margin-bottom: 8px; }
    .multiple-address-area .btn-add-neww-address img {
      margin-right: 4px; }
  .multiple-address-area .address-card-area .address-card-item-active {
    padding: 8px;
    width: 100%;
    left: 0px;
    top: 0px;
    background: #F3F3F3;
    border-radius: 12px;
    border: 1px solid #DADDE5;
    display: flex;
    flex-direction: column;
    margin-bottom: 16px; }
    .multiple-address-area .address-card-area .address-card-item-active .top {
      display: flex;
      flex-direction: row;
      justify-content: space-between;
      margin-bottom: 8px; }
      .multiple-address-area .address-card-area .address-card-item-active .top .left {
        display: flex;
        flex-direction: row;
        font-style: normal;
        font-weight: normal;
        font-size: 14px;
        line-height: 20px;
        color: #A4AAB9;
        width: 250px; }
        .multiple-address-area .address-card-area .address-card-item-active .top .left img {
          margin-right: 4px; }
      .multiple-address-area .address-card-area .address-card-item-active .top .right .btn-current-address {
        background: #D7E4E3;
        border-radius: 100px;
        padding: 2px 10px;
        font-style: normal;
        font-weight: 500;
        font-size: 14px;
        line-height: 20px;
        color: #00B28D; }
      .multiple-address-area .address-card-area .address-card-item-active .top .right .btn-select-address {
        padding: 2px 16px;
        background: #008065;
        border-radius: 100px;
        font-style: normal;
        font-weight: 500;
        font-size: 14px;
        line-height: 20px;
        color: #FFFFFF;
        cursor: pointer; }
    .multiple-address-area .address-card-area .address-card-item-active .center {
      display: flex;
      flex-direction: column;
      font-style: normal;
      font-weight: normal;
      font-size: 14px;
      line-height: 20px;
      margin-bottom: 8px;
      color: #393D42; }
    .multiple-address-area .address-card-area .address-card-item-active .footer {
      display: flex;
      flex-direction: row;
      justify-content: space-between; }
      .multiple-address-area .address-card-area .address-card-item-active .footer .left {
        display: flex;
        flex-direction: row; }
        .multiple-address-area .address-card-area .address-card-item-active .footer .left img {
          margin-right: 4px; }
        .multiple-address-area .address-card-area .address-card-item-active .footer .left .btn-edit-address {
          font-style: normal;
          font-weight: 500;
          font-size: 14px;
          line-height: 20px;
          color: #008065; }
      .multiple-address-area .address-card-area .address-card-item-active .footer .right {
        display: flex;
        flex-direction: row; }
        .multiple-address-area .address-card-area .address-card-item-active .footer .right img {
          margin-right: 4px; }
        .multiple-address-area .address-card-area .address-card-item-active .footer .right .btn-delete-address {
          font-style: normal;
          font-weight: 500;
          font-size: 14px;
          line-height: 20px;
          color: #008065; }
  .multiple-address-area .address-card-area .address-card-item {
    padding: 8px;
    width: 100%;
    background: #FFFFFF;
    box-shadow: 0px 4px 16px rgba(99, 102, 104, 0.1);
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    margin-bottom: 16px; }
    .multiple-address-area .address-card-area .address-card-item .top {
      display: flex;
      flex-direction: row;
      justify-content: space-between;
      margin-bottom: 8px; }
      .multiple-address-area .address-card-area .address-card-item .top .left {
        display: flex;
        flex-direction: row;
        font-style: normal;
        font-weight: normal;
        font-size: 14px;
        line-height: 20px;
        width: 350px; }
        .multiple-address-area .address-card-area .address-card-item .top .left img {
          margin-right: 4px; }
      .multiple-address-area .address-card-area .address-card-item .top .right .btn-current-address {
        background: #D7E4E3;
        border-radius: 100px;
        padding: 2px 16px;
        font-style: normal;
        font-weight: 500;
        font-size: 14px;
        line-height: 20px;
        color: #00B28D; }
      .multiple-address-area .address-card-area .address-card-item .top .right .btn-select-address {
        padding: 2px 16px;
        background: #008065;
        border-radius: 100px;
        font-style: normal;
        font-weight: 500;
        font-size: 14px;
        line-height: 20px;
        color: #FFFFFF;
        cursor: pointer; }
    .multiple-address-area .address-card-area .address-card-item .center {
      display: flex;
      flex-direction: column;
      font-style: normal;
      font-weight: normal;
      font-size: 14px;
      line-height: 20px;
      color: #393D42;
      margin-bottom: 8px; }
    .multiple-address-area .address-card-area .address-card-item .footer {
      display: flex;
      flex-direction: row;
      justify-content: space-between;
      margin-bottom: 8px; }
      .multiple-address-area .address-card-area .address-card-item .footer .left {
        display: flex;
        flex-direction: row; }
        .multiple-address-area .address-card-area .address-card-item .footer .left img {
          margin-right: 4px; }
        .multiple-address-area .address-card-area .address-card-item .footer .left .btn-edit-address {
          font-style: normal;
          font-weight: 500;
          font-size: 14px;
          line-height: 20px;
          color: #008065; }
      .multiple-address-area .address-card-area .address-card-item .footer .right {
        display: flex;
        flex-direction: row; }
        .multiple-address-area .address-card-area .address-card-item .footer .right img {
          margin-right: 4px; }
        .multiple-address-area .address-card-area .address-card-item .footer .right .btn-delete-address {
          font-style: normal;
          font-weight: 500;
          font-size: 14px;
          line-height: 20px;
          color: #008065; }

.fk-address-modal .multiple-addres-body {
  padding-bottom: 16px;
  overflow-y: scroll;
  height: 90vh; }

.fk-address-modal .address-item {
  margin-top: 16px;
  margin-bottom: 16px; }

.fk-confirm-delete-modal .confirm-delete-area {
  display: flex;
  flex-direction: column;
  justify-content: center; }
  .fk-confirm-delete-modal .confirm-delete-area .confirm-delete-header {
    text-align: center;
    font-style: normal;
    font-weight: 600;
    font-size: 18px;
    line-height: 28px;
    color: #393D42; }
  .fk-confirm-delete-modal .confirm-delete-area .confirm-delete-content {
    font-style: normal;
    font-weight: 500;
    font-size: 14px;
    line-height: 28px;
    text-align: center;
    color: #393D42;
    min-height: 30vh;
    display: flex;
    align-items: center;
    justify-content: center; }
  .fk-confirm-delete-modal .confirm-delete-area .confirm-delete-footer {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    margin-top: auto; }

@media only screen and (min-width: 992px) {
  .multiple-address-area {
    width: 1170px;
    padding-right: 15px;
    padding-left: 15px;
    margin-right: auto;
    margin-left: auto; }
    .multiple-address-area .address-card-area .address-card-item-active .top .left {
      width: 250px; }
    .multiple-address-area .address-card-area .address-card-item .top .left {
      width: 250px; }
  .fk-address-modal .modal-dialog {
    top: 5% !important; }
  .fk-address-modal .multiple-addres-body {
    padding-bottom: 16px;
    overflow-y: scroll;
    height: 80vh; }
  .fk-address-modal .address-item {
    margin-top: 16px;
    margin-bottom: 16px; }
  .address-content-body {
    padding: 15px !important; }
  .fk-content-delete-address {
    width: 65% !important;
    height: unset !important; }
  .fk-delete-top-content {
    top: 40% !important;
    left: 40% !important; }
  .confirm-delete-content {
    height: 5vh !important;
    min-height: unset !important; } }

.algohol-modal-area .algohol-head {
  align-items: unset !important;
  height: 100px;
  background-size: cover;
  background-repeat: no-repeat;
  background-image: url("https://res.cloudinary.com/freshketimage001/image/upload/f_auto/v1636508946/freshket/campaigns/Beer_Celebration-rafiki_1.svg"); }

.algohol-modal-area .modal-content-algohol {
  border-radius: 25px !important;
  width: 85%;
  height: 50vh !important;
  min-height: 55vh !important;
  margin: auto;
  margin-top: 40%; }
  .algohol-modal-area .modal-content-algohol .modal-body {
    padding: 10px !important; }
  .algohol-modal-area .modal-content-algohol .algohol-body-area {
    display: flex;
    flex-direction: column;
    justify-items: center;
    text-align: center;
    align-items: center; }
    .algohol-modal-area .modal-content-algohol .algohol-body-area .algohol-body-detail-before-head {
      font-style: normal;
      font-weight: normal;
      font-size: 12px;
      line-height: 16px;
      text-align: center;
      color: #000000; }
    .algohol-modal-area .modal-content-algohol .algohol-body-area .algohol-body-head-text {
      font-style: normal;
      font-weight: 600;
      font-size: 18px;
      line-height: 24px;
      text-align: center;
      text-decoration-line: underline;
      color: #008065;
      text-align: center;
      margin: 10px; }
    .algohol-modal-area .modal-content-algohol .algohol-body-area .algohol-confirm-area {
      background: #FBF8F0;
      border-radius: 8px;
      padding: 8px; }
      .algohol-modal-area .modal-content-algohol .algohol-body-area .algohol-confirm-area .algohol-body-subhead-text {
        font-style: normal;
        font-weight: bold;
        font-size: 12px;
        line-height: 16px;
        text-align: center;
        color: #000000; }
      .algohol-modal-area .modal-content-algohol .algohol-body-area .algohol-confirm-area .algohol-body-detail-text {
        font-style: normal;
        font-weight: normal;
        font-size: 10px;
        line-height: 14px;
        text-align: center;
        color: #000000;
        margin: 4px; }
    .algohol-modal-area .modal-content-algohol .algohol-body-area .algohol-footer-area {
      display: flex;
      flex-direction: row;
      justify-content: space-between;
      width: 100%;
      margin-top: 16px; }
      .algohol-modal-area .modal-content-algohol .algohol-body-area .algohol-footer-area .btn-accept-algohol {
        width: 45%;
        padding: 8px 16px;
        color: #fff;
        box-shadow: 0px 4px 12px rgba(122, 172, 193, 0.5);
        border-radius: 4px;
        background: #008065; }
      .algohol-modal-area .modal-content-algohol .algohol-body-area .algohol-footer-area .btn-decline-algohol {
        width: 45%;
        padding: 8px 16px;
        color: #008065;
        border: 1px solid #25A580;
        box-sizing: border-box;
        background: #ffff;
        box-shadow: 0px 4px 12px rgba(122, 172, 193, 0.5);
        border-radius: 4px; }

@media only screen and (min-width: 992px) {
  .algohol-modal-area .algohol-head {
    align-items: unset !important;
    height: 100px;
    background-size: cover;
    background-repeat: no-repeat;
    background-image: url("https://res.cloudinary.com/freshketimage001/image/upload/f_auto/v1636508946/freshket/campaigns/Beer_Celebration-rafiki_1.svg"); }
  .algohol-modal-area .modal-content-algohol {
    border-radius: 25px !important;
    width: 100%;
    min-height: 47vh !important;
    margin: auto; }
    .algohol-modal-area .modal-content-algohol .algohol-body-area {
      display: flex;
      flex-direction: column;
      justify-items: center;
      text-align: center;
      align-items: center; }
      .algohol-modal-area .modal-content-algohol .algohol-body-area .algohol-body-head-text {
        font-style: normal;
        font-weight: 600;
        font-size: 22px;
        line-height: 26px;
        text-align: center;
        text-decoration-line: underline;
        color: #008065; }
      .algohol-modal-area .modal-content-algohol .algohol-body-area .algohol-footer-area {
        width: 40%;
        margin-top: 16px; }
        .algohol-modal-area .modal-content-algohol .algohol-body-area .algohol-footer-area .btn-accept-algohol {
          width: 45%; }
        .algohol-modal-area .modal-content-algohol .algohol-body-area .algohol-footer-area .btn-decline-algohol {
          width: 45%; } }

/**/
/* Slider */
@media only screen and (min-height: 400px) and (max-height: 620px) {
  .prev, .next {
    top: 40%; } }

@media only screen and (min-height: 621px) and (max-height: 700px) {
  .prev, .next {
    top: 35%; } }

@media only screen and (min-height: 701px) and (max-height: 810px) {
  .prev, .next {
    top: 30%; } }

@media only screen and (min-height: 811px) and (max-height: 950px) {
  .prev, .next {
    top: 28%; } }

@media only screen and (min-height: 951px) {
  .prev, .next {
    top: 20%; } }

.prev, .next {
  cursor: pointer;
  position: absolute;
  width: auto;
  padding: 16px;
  top: 50%;
  transform: translateY(-50%);
  color: white;
  font-weight: bold;
  font-size: 20px;
  transition: 0.6s ease;
  border-radius: 0 3px 3px 0;
  user-select: none;
  background-color: rgba(0, 0, 0, 0.1); }

.next1 {
  cursor: pointer;
  top: 50%;
  width: auto;
  padding: 16px;
  margin-top: -22px;
  color: white;
  font-weight: bold;
  font-size: 20px;
  transition: 0.6s ease;
  border-radius: 0 3px 3px 0;
  user-select: none;
  background-color: rgba(0, 0, 0, 0.1); }

.mySlides {
  display: none; }

.mySlides1 {
  display: none; }

/* Position the "next button" to the right */
.next {
  right: 0;
  border-radius: 3px 0 0 3px; }

/* On hover, add a black background color with a little bit see-through */
.prev:hover, .next:hover {
  background-color: rgba(0, 0, 0, 0.5); }

.slideshow-container {
  position: relative;
  margin: auto; }

.dot {
  height: 15px;
  width: 15px;
  margin: 0 2px;
  background-color: #bbb;
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease; }

.slick-slider {
  position: relative;
  display: block;
  box-sizing: border-box;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -ms-touch-action: pan-y;
  touch-action: pan-y;
  -webkit-tap-highlight-color: transparent; }

.slick-list {
  position: relative;
  overflow: hidden;
  display: block;
  margin: 0;
  padding: 0; }
  .slick-list:focus {
    outline: none; }
  .slick-list.dragging {
    cursor: pointer;
    cursor: hand; }

.slick-slider .slick-track,
.slick-slider .slick-list {
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  -o-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0); }

.slick-track {
  position: relative;
  left: 0;
  top: 0;
  display: block;
  margin-left: auto;
  margin-right: auto; }
  .slick-track:before, .slick-track:after {
    content: "";
    display: table; }
  .slick-track:after {
    clear: both; }
  .slick-loading .slick-track {
    visibility: hidden; }

.slick-slide {
  float: left;
  height: 100%;
  min-height: 1px;
  display: none; }
  [dir="rtl"] .slick-slide {
    float: right; }
  .slick-slide img {
    display: block; }
  .slick-slide.slick-loading img {
    display: none; }
  .slick-slide.dragging img {
    pointer-events: none; }
  .slick-initialized .slick-slide {
    display: block; }
  .slick-loading .slick-slide {
    visibility: hidden; }
  .slick-vertical .slick-slide {
    display: block;
    height: auto;
    border: 1px solid transparent; }

.slick-arrow.slick-hidden {
  display: none; }

/* Slider */
.slick-loading .slick-list {
  background: #fff url("ajax-loader.gif") center center no-repeat; }

/* Icons */
@font-face {
  font-family: "slick";
  src: url("fonts/slick.eot");
  src: url("fonts/slick.eot?#iefix") format("embedded-opentype"), url("fonts/slick.woff") format("woff"), url("fonts/slick.ttf") format("truetype"), url("fonts/slick.svg#slick") format("svg");
  font-weight: normal;
  font-style: normal; }

/* Arrows */
.slick-prev,
.slick-next {
  position: absolute;
  display: block;
  height: 20px;
  width: 20px;
  line-height: 0px;
  font-size: 0px;
  cursor: pointer;
  background: transparent;
  color: transparent;
  top: 50%;
  -webkit-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
  transform: translate(0, -50%);
  padding: 0;
  border: none;
  outline: none; }
  .slick-prev:hover, .slick-prev:focus,
  .slick-next:hover,
  .slick-next:focus {
    outline: none;
    background: transparent;
    color: transparent; }
    .slick-prev:hover:before, .slick-prev:focus:before,
    .slick-next:hover:before,
    .slick-next:focus:before {
      opacity: 1; }
  .slick-prev.slick-disabled:before,
  .slick-next.slick-disabled:before {
    opacity: 0.25; }
  .slick-prev:before,
  .slick-next:before {
    font-family: "slick";
    font-size: 20px;
    line-height: 1;
    color: white;
    opacity: 0.75;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale; }

.slick-prev {
  left: -25px; }
  [dir="rtl"] .slick-prev {
    left: auto;
    right: -25px; }
  .slick-prev:before {
    content: "←"; }
    [dir="rtl"] .slick-prev:before {
      content: "→"; }

.slick-next {
  right: -25px; }
  [dir="rtl"] .slick-next {
    left: -25px;
    right: auto; }
  .slick-next:before {
    content: "→"; }
    [dir="rtl"] .slick-next:before {
      content: "←"; }

/* Dots */
.slick-dotted.slick-slider {
  margin-bottom: 30px; }

.slick-dots {
  position: absolute;
  bottom: -25px;
  list-style: none;
  display: block;
  text-align: center;
  padding: 0;
  margin: 0;
  width: 100%; }
  .slick-dots li {
    position: relative;
    display: inline-block;
    height: 20px;
    width: 20px;
    margin: 0 5px;
    padding: 0;
    cursor: pointer; }
    .slick-dots li button {
      border: 0;
      background: transparent;
      display: block;
      height: 20px;
      width: 20px;
      outline: none;
      line-height: 0px;
      font-size: 0px;
      color: transparent;
      padding: 5px;
      cursor: pointer; }
      .slick-dots li button:hover, .slick-dots li button:focus {
        outline: none; }
        .slick-dots li button:hover:before, .slick-dots li button:focus:before {
          opacity: 1; }
      .slick-dots li button:before {
        position: absolute;
        top: 0;
        left: 0;
        content: "•";
        width: 20px;
        height: 20px;
        font-family: "slick";
        font-size: 6px;
        line-height: 20px;
        text-align: center;
        color: black;
        opacity: 0.25;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale; }
    .slick-dots li.slick-active button:before {
      color: black;
      opacity: 0.75; }

.picker {
  font-family: "Prompt";
  font-size: 16px;
  text-align: left;
  line-height: 1.2;
  color: #000;
  position: absolute;
  z-index: 10000;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  outline: none; }

/**
 * The picker input element.
 */
.picker__input {
  cursor: default; }

/**
 * When the picker is opened, the input element is “activated”.
 */
.picker__input.picker__input--active {
  border-color: #0089ec; }

/**
 * The holder is the only “scrollable” top-level container element.
 */
.picker__holder {
  width: 100%;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch; }

/*!
 * Default mobile-first, responsive styling for pickadate.js
 * Demo: http://amsul.github.io/pickadate.js
 */
/**
 * Note: the root picker element should *NOT* be styled more than what’s here.
 */
/**
 * Make the holder and frame fullscreen.
 */
.picker__holder,
.picker__frame {
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  -ms-transform: translateY(100%);
  transform: translateY(100%); }

/**
 * The holder should overlay the entire screen.
 */
.picker__holder {
  position: fixed;
  transition: background 0.15s ease-out, transform 0s 0.15s;
  -webkit-backface-visibility: hidden; }

/**
 * The frame that bounds the box contents of the picker.
 */
.picker__frame {
  position: absolute;
  margin: 0 auto;
  min-width: 256px;
  width: 300px;
  max-height: 350px;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  filter: alpha(opacity=0);
  -moz-opacity: 0;
  opacity: 0;
  transition: all 0.15s ease-out; }

@media (min-height: 33.875em) {
  .picker__frame {
    overflow: visible;
    top: auto;
    bottom: -100%;
    max-height: 80%; } }

@media (min-height: 40.125em) {
  .picker__frame {
    margin-bottom: 7.5%; } }

/**
 * The wrapper sets the stage to vertically align the box contents.
 */
.picker__wrap {
  display: table;
  width: 100%;
  height: 100%; }

@media (min-height: 33.875em) {
  .picker__wrap {
    display: block; } }

/**
 * The box contains all the picker contents.
 */
.picker__box {
  background: #fff;
  display: table-cell;
  vertical-align: middle; }

@media (min-height: 26.5em) {
  .picker__box {
    font-size: 1.25em; } }

@media (min-height: 33.875em) {
  .picker__box {
    display: block;
    font-size: 1.33em;
    border: 1px solid #777;
    border-top-color: #898989;
    border-bottom-width: 0;
    border-radius: 5px 5px 0 0;
    box-shadow: 0 12px 36px 16px rgba(0, 0, 0, 0.24); } }

@media (min-height: 40.125em) {
  .picker__box {
    font-size: 1.5em;
    border-bottom-width: 1px;
    border-radius: 5px; } }

/**
 * When the picker opens...
 */
.picker--opened .picker__holder {
  -ms-transform: translateY(0);
  transform: translateY(0);
  background: transparent;
  -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#1E000000,endColorstr=#1E000000)";
  zoom: 1;
  background: rgba(0, 0, 0, 0.32);
  transition: background 0.15s ease-out; }

.picker--opened .picker__frame {
  -ms-transform: translateY(0);
  transform: translateY(0);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  filter: alpha(opacity=100);
  -moz-opacity: 1;
  opacity: 1; }

@media (min-height: 33.875em) {
  .picker--opened .picker__frame {
    top: 10%; } }

/* ==========================================================================
   $BASE-DATE-PICKER
   ========================================================================== */
/**
 * The picker box.
 */
.picker__box {
  padding: 0px; }
  .picker__box .picker__date-display {
    text-align: center;
    background-color: #008065;
    color: #fff;
    padding-bottom: 15px;
    font-weight: 300; }
    .picker__box .picker__date-display .picker__weekday-display {
      background-color: #008065;
      padding: 10px;
      font-weight: 200;
      letter-spacing: .5;
      font-size: 1rem;
      margin-bottom: 15px; }
      .picker__box .picker__date-display .picker__weekday-display .picker__month-display {
        text-transform: uppercase;
        font-size: 2rem; }
      .picker__box .picker__date-display .picker__weekday-display .picker__day-display {
        font-size: 4.5rem;
        font-weight: 400; }
      .picker__box .picker__date-display .picker__weekday-display .picker__year-display {
        font-size: 1.8rem;
        color: rgba(255, 255, 255, 0.4); }
  .picker__box .picker__calendar-container {
    padding: 0 1rem; }

/**
 * The header containing the month and year stuff.
 */
.picker__header {
  text-align: center;
  position: relative;
  margin-top: .75em;
  font-family: "Sarabun";
  font-size: 16px; }

.picker__month-display, .picker__year-display {
  font-size: 20px;
  margin: 15px; }

.picker__day-display {
  font-size: 40px;
  margin: 15px; }

/**
 * The month and year labels.
 */
.picker__month,
.picker__year {
  font-weight: 500;
  display: inline-block;
  margin-left: .25em;
  margin-right: .25em; }

.picker__year {
  color: #999;
  font-size: .8em;
  font-style: italic; }

/**
 * The month and year selectors.
 */
.picker__select--month,
.picker__select--year {
  border: 1px solid #b7b7b7;
  height: 2em;
  padding: .5em;
  margin-left: .25em;
  margin-right: .25em; }

@media (min-width: 24.5em) {
  .picker__select--month,
  .picker__select--year {
    margin-top: -0.5em; } }

.picker__select--month {
  width: 35%; }

.picker__select--year {
  width: 22.5%; }

.picker__select--month:focus,
.picker__select--year:focus {
  border-color: #0089ec; }

/**
 * The month navigation buttons.
 */
.picker__nav--prev,
.picker__nav--next {
  position: absolute;
  padding: .5em 1.25em;
  width: 1em;
  height: 1em;
  box-sizing: content-box;
  top: -0.25em; }

@media (min-width: 24.5em) {
  .picker__nav--prev,
  .picker__nav--next {
    top: -0.33em; } }

.picker__nav--prev {
  left: -1em;
  padding-right: 1.25em; }

@media (min-width: 24.5em) {
  .picker__nav--prev {
    padding-right: 1.5em; } }

.picker__nav--next {
  right: -1em;
  padding-left: 1.25em; }

@media (min-width: 24.5em) {
  .picker__nav--next {
    padding-left: 1.5em; } }

.picker__nav--prev:before,
.picker__nav--next:before {
  content: " ";
  border-top: .5em solid transparent;
  border-bottom: .5em solid transparent;
  border-right: .75em solid #676767;
  width: 0;
  height: 0;
  display: block;
  margin: 0 auto; }

.picker__nav--next:before {
  border-right: 0;
  border-left: 0.75em solid #676767; }

.picker__nav--prev:hover,
.picker__nav--next:hover {
  cursor: pointer;
  color: #000;
  /*  background: #b1dcfb;*/ }

.picker__nav--disabled,
.picker__nav--disabled:hover,
.picker__nav--disabled:before,
.picker__nav--disabled:before:hover {
  cursor: default;
  background: none;
  border-right-color: #f5f5f5;
  border-left-color: #f5f5f5; }

/**
 * The calendar table of dates
 */
.picker__table {
  text-align: center;
  border-collapse: collapse;
  border-spacing: 0;
  table-layout: fixed;
  font-family: "Sarabun";
  font-size: 16px;
  width: 100%;
  margin-top: .75em;
  margin-bottom: .5em; }

@media (min-height: 33.875em) {
  .picker__table {
    margin-bottom: .75em; } }

.picker__table td {
  margin: 0;
  padding: 0; }

/**
 * The weekday labels
 */
.picker__weekday {
  width: 14.285714286%;
  font-size: 14px;
  text-align: center;
  padding-bottom: .25em;
  color: #999;
  font-weight: 500;
  /* Increase the spacing a tad */ }

@media (min-height: 33.875em) {
  .picker__weekday {
    padding-bottom: .5em; } }

/**
 * The days on the calendar
 */
.picker__day {
  padding: 10px;
  font-weight: 200;
  border: 1px solid transparent; }

.picker__day--today {
  position: relative; }

.picker__day--today:before {
  content: " ";
  position: absolute;
  top: 2px;
  right: 2px;
  width: 0;
  height: 0;
  border-top: 0.5em solid #0059bc;
  border-left: .5em solid transparent; }

.picker__day--disabled:before {
  border-top-color: #aaa; }

.picker__day--outfocus {
  color: #ddd; }

.picker__day--infocus:hover,
.picker__day--outfocus:hover {
  cursor: pointer;
  color: #000;
  /* background: #b1dcfb;*/ }

.picker__day--highlighted {
  /* border-color: #0089ec;*/ }

.picker__day--highlighted:hover,
.picker--focused .picker__day--highlighted {
  cursor: pointer;
  color: #000;
  /*  background: #b1dcfb;*/ }

.picker__day--selected,
.picker__day--selected:hover,
.picker--focused .picker__day--selected {
  border-radius: 50%;
  -webkit-transform: scale(0.9);
  transform: scale(0.9);
  background-color: #008065;
  color: #fff; }

.picker__day--disabled,
.picker__day--disabled:hover,
.picker--focused .picker__day--disabled {
  background: #f5f5f5;
  border-color: #f5f5f5;
  color: #ddd;
  cursor: default; }

.picker__day--highlighted.picker__day--disabled,
.picker__day--highlighted.picker__day--disabled:hover {
  background: #bbb; }

/**
 * The footer containing the "today", "clear", and "close" buttons.
 */
.picker__footer {
  display: flex;
  justify-content: space-between;
  padding: 10px; }
  .picker__footer .picker__today, .picker__footer .picker__close {
    border: none;
    border-radius: 2px;
    display: inline-block;
    height: 40px;
    line-height: 36px;
    padding: 10px 20px 40px 20px;
    margin-right: 10px !important;
    text-transform: uppercase;
    vertical-align: middle;
    -webkit-tap-highlight-color: transparent;
    color: #008065;
    background: none;
    font-size: 16px; }

.picker__button--today,
.picker__button--clear,
.picker__button--close {
  border: 1px solid #fff;
  background: #fff;
  font-size: .8em;
  padding: .66em 0;
  font-weight: bold;
  width: 33%;
  display: inline-block;
  vertical-align: bottom; }

.picker__button--today:hover,
.picker__button--clear:hover,
.picker__button--close:hover {
  cursor: pointer;
  color: #000;
  background: #b1dcfb;
  border-bottom-color: #b1dcfb; }

.picker__button--today:focus,
.picker__button--clear:focus,
.picker__button--close:focus {
  background: #b1dcfb;
  border-color: #0089ec;
  outline: none; }

.picker__button--today:before,
.picker__button--clear:before,
.picker__button--close:before {
  position: relative;
  display: inline-block;
  height: 0; }

.picker__button--today:before,
.picker__button--clear:before {
  content: " ";
  margin-right: .45em; }

.picker__button--today:before {
  top: -0.05em;
  width: 0;
  border-top: 0.66em solid #0059bc;
  border-left: .66em solid transparent; }

.picker__button--clear:before {
  top: -0.25em;
  width: .66em;
  border-top: 3px solid #e20; }

.picker__button--close:before {
  content: "\D7";
  top: -0.1em;
  vertical-align: top;
  font-size: 1.1em;
  margin-right: .35em;
  color: #777; }

.picker__button--today[disabled],
.picker__button--today[disabled]:hover {
  background: #f5f5f5;
  border-color: #f5f5f5;
  color: #ddd;
  cursor: default; }

.picker__button--today[disabled]:before {
  border-top-color: #aaa; }

/* ==========================================================================
   $DEFAULT-DATE-PICKER
   ========================================================================== */