/*! normalize.css v8.0.0 | MIT License | github.com/necolas/normalize.css */
/* Document
   ========================================================================== */
/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 */
html {
  line-height: 1.15;
  /* 1 */
  -webkit-text-size-adjust: 100%;
  /* 2 */ }

/* Sections
     ========================================================================== */
/**
   * Remove the margin in all browsers.
   */
body {
  margin: 0; }

/**
   * 1. Change the font styles in all browsers.
   * 2. Remove the margin in Firefox and Safari.
   */
button,
input,
optgroup,
select,
textarea {
  font-family: inherit;
  /* 1 */
  font-size: 100%;
  /* 1 */
  line-height: 1.15;
  /* 1 */
  margin: 0;
  /* 2 */ }

/**
   * Show the overflow in IE.
   * 1. Show the overflow in Edge.
   */
button,
input {
  /* 1 */
  overflow: visible; }

/**
   * Remove the inheritance of text transform in Edge, Firefox, and IE.
   * 1. Remove the inheritance of text transform in Firefox.
   */
button,
select {
  /* 1 */
  text-transform: none; }

/**
   * Correct the inability to style clickable types in iOS and Safari.
   */
button,
[type="button"],
[type="reset"],
[type="submit"] {
  -webkit-appearance: button; }

/**
   * Remove the inner border and padding in Firefox.
   */
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
  border-style: none;
  padding: 0; }

/**
   * Restore the focus styles unset by the previous rule.
   */
button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
  outline: 1px dotted ButtonText; }

/**
   * Correct the padding in Firefox.
   */
fieldset {
  padding: 0.35em 0.75em 0.625em; }

/**
   * Remove the default vertical scrollbar in IE 10+.
   */
textarea {
  overflow: auto; }

ul {
  list-style: inherit; }

dl, ol, ul {
  margin: 0; }

/** RESET **/
a,
a:hover {
  text-decoration: none;
  color: inherit;
  cursor: pointer; }

button:hover {
  cursor: pointer; }

p {
  margin-bottom: 0; }

img {
  vertical-align: bottom; }

body {
  background-color: #f9fafb;
  font-weight: 300; }

section.banner,
section.big-menu,
section.about-us,
section.product,
section.contact {
  -webkit-user-select: none;
  /* Safari */
  -ms-user-select: none;
  /* IE 10 and IE 11 */
  user-select: none;
  /* Standard syntax */ }

.content-width-xs {
  width: 100%;
  margin: 0 auto; }
  @media only screen and (min-width: 62em) {
    .content-width-xs {
      max-width: 1200px; } }

.content-width-s {
  width: 100%;
  margin: 0 auto; }
  @media only screen and (min-width: 62em) {
    .content-width-s {
      max-width: 800px; } }

.content-width-m {
  width: 100%;
  margin: 0 auto; }
  @media only screen and (min-width: 62em) {
    .content-width-m {
      max-width: 900px; } }

.content-width-xl {
  width: 100%;
  margin: 0 auto; }
  @media only screen and (min-width: 62em) {
    .content-width-xl {
      max-width: 1300px; } }

.content-width-700 {
  width: 100%;
  margin: 0 auto; }
  @media only screen and (min-width: 62em) {
    .content-width-700 {
      max-width: 700px; } }

.content {
  padding: 0.5rem 1rem; }
  @media only all and (min-width: 20em) {
    .content {
      padding: 0.5rem 1rem; } }
  @media only all and (min-width: 36em) {
    .content {
      padding: 0.5rem 1.5rem; } }
  .content.content-bg {
    background-color: #fff; }
    .content.content-bg.bg-grey {
      background-color: #f5f5f5; }
    .content.content-bg.bg-home-about-us {
      padding: 0.5rem 1rem;
      background-color: #f5f5f5; }
      @media only all and (min-width: 48em) {
        .content.content-bg.bg-home-about-us {
          padding: 0.5rem 6rem; } }
    .content.content-bg.bg-home-product {
      padding: 0.5rem 1rem;
      background-color: #ffffff; }
      @media only all and (min-width: 48em) {
        .content.content-bg.bg-home-product {
          padding: 0.5rem 6rem; } }
    .content.content-bg.bg-home-contact {
      padding: 0.5rem 1rem;
      background-color: #ffffff; }
      @media only all and (min-width: 48em) {
        .content.content-bg.bg-home-contact {
          padding: 0.5rem 6rem; } }

.shadow {
  box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15); }

.shadow-slide {
  box-shadow: 0 0.05rem 0.25rem rgba(0, 0, 0, 0.15); }

.shadow-bottom {
  box-shadow: 0 4px 2px -2px gray; }

.shadow-left-right {
  box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15), 0 0.5rem 1rem rgba(0, 0, 0, 0.15); }

/** NAVBAR **/
.header-menu {
  display: flex;
  align-items: center;
  color: #fff;
  height: 70px;
  font-size: 0.65rem;
  margin-top: 56px; }
  @media only all and (min-width: 20em) {
    .header-menu {
      height: 40px;
      font-size: 0.75rem;
      margin-top: 56px; } }
  @media only all and (min-width: 36em) {
    .header-menu {
      height: 45px;
      font-size: 0.9rem;
      margin-top: 56px; } }
  @media only all and (min-width: 48em) {
    .header-menu {
      height: 45px;
      font-size: 1rem;
      margin-top: 56px; } }
  @media only screen and (min-width: 62em) {
    .header-menu {
      height: 54px;
      font-size: 1rem;
      margin-top: 0; } }
  @media only screen and (min-width: 75em) {
    .header-menu {
      height: 54px;
      font-size: 1rem;
      margin-top: 0; } }

.img-logo {
  margin-left: 1rem;
  margin-right: 0.5rem; }
  @media only all and (min-width: 48em) {
    .img-logo {
      margin-left: 1.5rem; }
      .img-logo.admin {
        margin-left: 3.5rem;
        margin-right: 3rem; } }

.btn-example {
  font-size: 0.8rem; }
  @media only all and (min-width: 48em) {
    .btn-example {
      font-size: 1rem; } }

.nid-indy-inno-logo {
  -webkit-user-select: none;
  /* Safari */
  -ms-user-select: none;
  /* IE 10 and IE 11 */
  user-select: none;
  /* Standard syntax */
  max-height: 60px; }
  @media only all and (min-width: 48em) {
    .nid-indy-inno-logo {
      max-height: 55px; } }

.navbar {
  width: 100%;
  position: fixed;
  max-height: 60px;
  height: 60px; }
  @media only screen and (min-width: 62em) {
    .navbar {
      position: relative;
      height: 55px;
      display: flex;
      justify-content: space-between; } }
  .navbar-nav {
    align-items: center; }
  .navbar-website {
    background-color: #fff;
    box-shadow: 0 0.1rem 0.5rem rgba(0, 0, 0, 0.1);
    z-index: 10;
    padding: 0; }

section.slider,
section.heading {
  padding-top: 60px; }
  @media only screen and (min-width: 62em) {
    section.slider,
    section.heading {
      padding-top: 0; } }

.navbar-nav .active > .nav-link-website,
.navbar-nav .nav-link-website.active,
.navbar-nav .nav-link-website.show,
.navbar-nav .show > .nav-link-website {
  color: #ff6d00;
  font-weight: 400;
  font-size: 120%; }
  @media only screen and (min-width: 75em) {
    .navbar-nav .active > .nav-link-website,
    .navbar-nav .nav-link-website.active,
    .navbar-nav .nav-link-website.show,
    .navbar-nav .show > .nav-link-website {
      background-color: inherit; } }

ul.navbar-nav-btn {
  margin-top: 1rem;
  padding-left: 0; }
  @media only all and (min-width: 48em) {
    ul.navbar-nav-btn {
      padding-left: 1.5rem;
      margin-top: 0; } }

.navbar-nav-btn {
  display: flex; }
  @media only all and (min-width: 48em) {
    .navbar-nav-btn {
      margin-right: 1.5rem; } }

.navbar-expand-xl .navbar-nav .nav-link-website {
  padding: 0.75rem;
  color: #0f0f0f; }
  @media only all and (min-width: 48em) {
    .navbar-expand-xl .navbar-nav .nav-link-website {
      color: #333333;
      padding: 0.56rem;
      padding-left: 1.25rem;
      padding-right: 1.25rem; } }
  .navbar-expand-xl .navbar-nav .nav-link-website:focus, .navbar-expand-xl .navbar-nav .nav-link-website:hover {
    color: #e25327;
    transition: 0.1s; }
    @media only screen and (min-width: 75em) {
      .navbar-expand-xl .navbar-nav .nav-link-website:focus, .navbar-expand-xl .navbar-nav .nav-link-website:hover {
        background-color: inherit; } }

li.nav-item-website a,
li.nav-item-website a.btn {
  -webkit-user-select: none;
  /* Safari */
  -ms-user-select: none;
  /* IE 10 and IE 11 */
  user-select: none;
  /* Standard syntax */
  outline: none;
  font-size: 1rem; }

.nav-item-website {
  width: 100%;
  border-bottom: 1px solid #0f0f0f;
  text-align: center; }
  @media only screen and (min-width: 75em) {
    .nav-item-website {
      width: auto;
      border-bottom: none; } }
  @media only screen and (min-width: 75em) {
    .nav-item-website.active {
      padding: 0;
      border-top: 0.25rem solid #ff6d00;
      border-bottom: 0.25rem solid #ff6d00; } }

.nav-btn {
  display: flex;
  justify-content: center;
  margin: 0.75rem 0;
  border-bottom: none; }
  @media only all and (min-width: 48em) {
    .nav-btn {
      margin: 0;
      margin-right: 0;
      margin-top: 0; } }
  @media only all and (min-width: 48em) {
    .nav-btn ~ .nav-btn {
      margin-left: 0.5rem;
      margin-top: 0; } }

.nav-item {
  list-style: none; }

.btn-menu-top {
  display: flex;
  color: #fff;
  background-color: #ff6d00; }
  @media only all and (min-width: 48em) {
    .btn-menu-top {
      color: #fff;
      background-color: #00000059;
      border-radius: 50%;
      line-height: 1.6;
      padding: 0.2rem 0.6rem; } }
  @media only screen and (min-width: 62em) {
    .btn-menu-top {
      padding: 0.3rem 0.6rem; } }
  .btn-menu-top:hover {
    color: #fff;
    background-color: #ff6d00; }
  .btn-menu-top > i {
    align-self: center;
    font-size: 1rem;
    position: relative; }
    .btn-menu-top > i.facebook {
      bottom: -1px; }
    .btn-menu-top > i.x {
      bottom: -1px; }
    .btn-menu-top > i.line {
      bottom: -2px; }

.nav-item-website > .nav-link {
  padding: 0.15rem 0.45rem; }

/** SIDEBAR **/
.nav-pushmenu {
  text-align: center;
  border: 1px solid #374151;
  border-radius: 0.25rem;
  margin-left: auto; }

.navbar-nav-admin {
  min-width: 100%;
  flex-wrap: wrap; }
  @media only screen and (min-width: 62em) {
    .navbar-nav-admin {
      min-width: inherit; } }

.layout-navbar-fixed .wrapper .content-wrapper {
  margin-top: 0; }

.nav-sidebar .nav-item > .nav-item-admin {
  border-bottom: none;
  text-align: left;
  border-bottom: none; }
  .nav-sidebar .nav-item > .nav-item-admin.nav-link {
    font-weight: 400; }

.home-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 0.25rem;
  margin-bottom: 1rem; }
  @media only screen and (min-width: 75em) {
    .home-head {
      margin-bottom: 0rem; } }

.home-heading {
  -webkit-user-select: none;
  /* Safari */
  -ms-user-select: none;
  /* IE 10 and IE 11 */
  user-select: none;
  /* Standard syntax */
  color: #ff6d00;
  font-size: 1.5rem;
  font-weight: 400; }
  @media only all and (min-width: 20em) {
    .home-heading {
      font-size: 1.8rem; } }
  @media only screen and (min-width: 62em) {
    .home-heading {
      font-size: 3rem; } }

.home-caret-right-all {
  font-size: 1.5rem;
  color: #88ce00; }
  .home-caret-right-all > * i {
    align-self: center;
    font-size: 1.5rem;
    position: relative;
    -webkit-text-stroke: 4px; }

.navbar-toggler {
  margin-right: 1rem;
  cursor: pointer;
  border-color: #e25327; }

.navbar-toggler-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='25' height='25' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%280, 0, 0, 1%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e"); }

.navbar-collapse {
  padding: 1rem;
  padding-top: 0;
  border-top: 1px solid #000;
  background-color: #fff;
  box-shadow: 0 4px 2px -2px gray; }
  @media only all and (min-width: 48em) {
    .navbar-collapse {
      padding: 0;
      box-shadow: none;
      margin: 0;
      background-color: inherit;
      justify-content: end;
      margin-right: 1.5rem;
      border-top: 0; } }

/** BANNER **/
.swiper-banner {
  min-height: 100px;
  width: 100%;
  height: 100%; }
  @media only all and (min-width: 48em) {
    .swiper-banner {
      min-height: 200px; } }

.content-banner {
  box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15), 0 0.5rem 1rem rgba(0, 0, 0, 0.15); }

/* CUSTOMIZE THE CAROUSEL
-------------------------------------------------- */
/* Carousel base class */
.carousel {
  padding: auto; }

/* Since positioning the image, we need to help out the caption */
.carousel-caption {
  bottom: 3rem;
  z-index: 10; }

/* Declare heights because of positioning of img element */
.carousel-item {
  height: 8.5em; }
  @media only all and (min-width: 20em) {
    .carousel-item {
      height: 12.5em; } }
  @media only all and (min-width: 36em) {
    .carousel-item {
      height: 15em; } }
  @media only all and (min-width: 48em) {
    .carousel-item {
      height: 16.75em; } }
  @media only screen and (min-width: 62em) {
    .carousel-item {
      height: 21.25em; } }
  @media only screen and (min-width: 75em) {
    .carousel-item {
      height: 25.5em; } }

.carousel-item > img {
  position: absolute;
  top: 0;
  left: 0;
  min-width: 100%; }

.carousel-indicators {
  margin-bottom: 0; }

.carousel-indicators .active {
  background-color: #ff6d00; }

/** Big Menu **/
.big-menu-items {
  display: flex;
  align-items: center;
  justify-content: space-around; }

.btn-big-menu {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 0.75rem;
  font-size: 1.2rem;
  transition: 0.3s;
  font-weight: 400;
  width: 100%;
  flex-basis: calc(100% / 5);
  padding: 0.75rem 0.5rem;
  font-size: 0.75rem;
  height: 1.5rem;
  margin-top: 0.25rem;
  margin-bottom: 0.25rem; }
  @media only all and (min-width: 48em) {
    .btn-big-menu {
      height: 4.5rem;
      padding: 0.375rem 1.5rem;
      font-size: 1.5rem;
      margin-top: 0.5rem;
      margin-bottom: 0.5rem; } }
  .btn-big-menu:hover {
    color: #fff;
    background-color: #ff6d00; }

/** Home About us */
.bg-grey {
  background-color: #f5f5f5; }

.home-about-us {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  width: 100%;
  padding: 0rem 0rem; }
  @media only all and (min-width: 48em) {
    .home-about-us {
      padding: 1rem 3rem;
      flex-direction: row;
      padding: 1rem 0rem; } }
  .home-about-us-image {
    display: flex;
    flex-direction: column;
    flex-basis: 100%;
    flex: 1;
    justify-content: center;
    align-items: center;
    padding: 0.5rem 2.5rem; }
    @media only all and (min-width: 48em) {
      .home-about-us-image {
        padding: 1.5rem 3rem; } }
  .home-about-us-text {
    display: flex;
    flex-direction: column;
    flex-basis: 100%;
    flex: 1.5;
    justify-content: center;
    align-items: center; }
  .home-about-us-header {
    color: #ff6d00;
    font-size: 1.5rem;
    font-weight: 400;
    margin-bottom: 0.5rem;
    padding: 0rem 1.5rem; }
    @media only all and (min-width: 48em) {
      .home-about-us-header {
        font-size: 3rem;
        padding: 0rem 1.5rem; } }
  .home-about-us-content {
    word-wrap: break-word;
    padding: 0rem 0.5rem;
    font-size: 90%; }
    @media only all and (min-width: 48em) {
      .home-about-us-content {
        padding: 0rem 1.5rem;
        font-size: 100%; } }

.product-slide-container {
  display: flex;
  border: 0;
  display: flex;
  position: relative;
  flex-direction: column;
  word-wrap: break-word; }
  @media only all and (min-width: 48em) {
    .product-slide-container {
      flex-direction: row; } }

.product-slide-items {
  display: flex;
  flex: 1 1 auto;
  min-height: 1px;
  padding: 1.25rem;
  justify-content: space-around;
  flex-direction: column; }
  @media only all and (min-width: 48em) {
    .product-slide-items {
      flex-direction: row; } }

.home-product-text {
  display: flex;
  flex-direction: column;
  justify-content: start;
  align-items: start;
  padding: 0.5rem;
  min-width: 0;
  flex-basis: calc(100%);
  order: 2;
  width: 100%; }
  @media only all and (min-width: 48em) {
    .home-product-text {
      margin-left: 2rem;
      flex-basis: calc(60%);
      padding: 1rem;
      min-width: 500px;
      order: 1; } }

.home-product-title {
  font-size: 1rem;
  color: #ff6d00; }
  @media only all and (min-width: 48em) {
    .home-product-title {
      margin-top: 0.5rem;
      font-size: 1.6rem;
      font-weight: 400; } }
  .home-product-title.subslide {
    color: #ff6d00; }

.home-product-excerpt {
  text-align: left;
  font-size: 0.8rem; }
  @media only all and (min-width: 48em) {
    .home-product-excerpt {
      font-size: 1rem; } }

.home-product-image {
  display: flex;
  flex-direction: column;
  width: 100%;
  order: 1; }
  @media only all and (min-width: 48em) {
    .home-product-image {
      margin-right: 2rem;
      flex-basis: calc(40%);
      justify-content: center;
      align-items: center;
      padding: 1rem;
      order: 2; } }

.product-subslide-container {
  display: flex;
  flex-wrap: wrap; }

.product-subslide-items {
  display: flex;
  align-content: space-between;
  align-self: stretch;
  flex-basis: calc(96% / 2);
  flex-flow: wrap;
  word-wrap: break-word;
  background-color: #fff;
  background-clip: border-box;
  border: 1px solid rgba(0, 0, 0, 0.125);
  border-radius: 0.25rem;
  box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
  padding: 0.5rem;
  margin-left: 2%; }
  @media only all and (min-width: 48em) {
    .product-subslide-items {
      flex-basis: calc(96% / 4);
      margin-left: 1%;
      padding: 1.25rem; } }
  .product-subslide-items:first-child, .product-subslide-items:nth-child(3) {
    margin-left: 0; }
  .product-subslide-items:nth-child(3), .product-subslide-items:nth-child(4) {
    margin-top: 0.5rem; }
  @media only all and (min-width: 48em) {
    .product-subslide-items:first-child {
      margin-left: 0; }
    .product-subslide-items:nth-child(3) {
      margin-left: 1%; }
    .product-subslide-items:nth-child(3), .product-subslide-items:nth-child(4) {
      margin-top: 0; } }

.btn-product-click {
  color: #ff6d00;
  border-color: #ff6d00;
  border-radius: 5rem;
  padding-left: 1rem;
  padding-right: 1rem;
  font-size: 0.9rem; }
  @media only all and (min-width: 48em) {
    .btn-product-click {
      font-size: 1rem;
      padding-left: 2rem;
      padding-right: 2rem; } }
  .btn-product-click:hover {
    color: #fff;
    background-color: #ff6d00;
    border-color: #ff6d00; }

/** PAGINATION **/
.page-item.active .page-link {
  background-color: #e25327;
  border-color: #e25327; }

.page-link {
  color: #ff6d00; }
  .page-link:hover {
    color: #b91c1c; }

.pagination-admin-color a {
  color: #0284c7; }

.pagination-admin-color.active a.page-link {
  background-color: #0284c7;
  border-color: #0284c7; }
  .pagination-admin-color.active a.page-link:hover {
    color: #fff; }

.pagination-admin-color .page-link:hover {
  color: #0c4a6e; }

/** OTHER **/
.divider {
  color: #fff;
  margin: 0.5rem 0; }
  .divider.heading {
    margin-top: 0rem;
    border-color: #595959; }

/** FOOTER **/
/** ADMIN SIDE **/
/** WAITING **/
.img-hover-zoom {
  overflow: hidden;
  border: 1px solid transparent; }

.img-hover-zoom:hover {
  background-color: #fff;
  border: 1px solid #ff6d00;
  border-radius: 0.25rem;
  max-width: 100%;
  height: auto; }

.img-hover-zoom img {
  transition: transform 0.3s ease; }

.img-hover-zoom:hover img {
  transform: scale(1.2); }

.card-title a {
  font-size: 1.5rem;
  color: #343a40;
  text-decoration: none;
  transition: 0.3s;
  height: auto; }

.card-title:hover a {
  color: #ff6d00;
  cursor: pointer; }

.card-excerpt,
.card-date {
  color: #939393; }

.img-thumbnail-post {
  object-fit: cover;
  max-width: 300px;
  min-height: 100px;
  max-height: 150px; }
  @media only screen and (min-width: 75em) {
    .img-thumbnail-post {
      min-height: 200px;
      max-height: 200px; } }
  .img-thumbnail-post-home {
    object-fit: cover;
    overflow: auto;
    max-width: 300px;
    max-height: 60px; }
    @media only all and (min-width: 20em) {
      .img-thumbnail-post-home {
        max-height: 65px; } }
    @media only all and (min-width: 36em) {
      .img-thumbnail-post-home {
        max-height: 70px; } }
    @media only all and (min-width: 48em) {
      .img-thumbnail-post-home {
        max-height: 65px; } }

.card-post {
  display: flex;
  flex: 1 1 auto;
  min-height: 1px;
  flex-direction: column;
  align-items: center;
  justify-content: center; }
  @media only all and (min-width: 48em) {
    .card-post {
      flex-direction: row;
      justify-content: space-around; } }

.card-thumbnail {
  max-width: 400px;
  display: flex;
  justify-content: center;
  align-items: center; }
  @media only all and (min-width: 48em) {
    .card-thumbnail {
      display: flex;
      justify-content: center;
      align-items: center; } }

.card-description {
  display: flex;
  flex-direction: column;
  align-self: stretch; }

.card-title {
  margin-top: 0.5rem;
  margin-bottom: 0; }
  @media only all and (min-width: 48em) {
    .card-title {
      margin-bottom: 0.75; } }
  .card-title a {
    display: block;
    /* Fallback for non-webkit */
    display: -webkit-box;
    height: 3.6rem;
    /* Fallback for non-webkit */
    font-size: 1.2rem;
    line-height: 1.5;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    height: auto; }
    @media only all and (min-width: 48em) {
      .card-title a {
        display: block;
        /* Fallback for non-webkit */
        display: -webkit-box;
        height: 6.75rem;
        /* Fallback for non-webkit */
        font-size: 1.5rem;
        line-height: 1.5;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
        overflow: hidden;
        text-overflow: ellipsis;
        height: auto; } }

.card-excerpt {
  margin-top: 0.25rem;
  display: block;
  /* Fallback for non-webkit */
  display: -webkit-box;
  height: 6rem;
  /* Fallback for non-webkit */
  font-size: 0.8rem;
  line-height: 1.5;
  -webkit-line-clamp: 5;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis; }
  @media only all and (min-width: 48em) {
    .card-excerpt {
      margin-top: 0.5rem;
      display: block;
      /* Fallback for non-webkit */
      display: -webkit-box;
      height: 5.625rem;
      /* Fallback for non-webkit */
      font-size: 0.75rem;
      line-height: 1.5;
      -webkit-line-clamp: 5;
      -webkit-box-orient: vertical;
      overflow: hidden;
      text-overflow: ellipsis; } }
  @media only screen and (min-width: 75em) {
    .card-excerpt {
      display: block;
      /* Fallback for non-webkit */
      display: -webkit-box;
      height: 6rem;
      /* Fallback for non-webkit */
      font-size: 1rem;
      line-height: 1.5;
      -webkit-line-clamp: 4;
      -webkit-box-orient: vertical;
      overflow: hidden;
      text-overflow: ellipsis; } }

.card-action {
  display: flex;
  justify-content: space-between;
  margin-top: 0.5rem;
  font-size: 0.9rem; }
  @media only screen and (min-width: 75em) {
    .card-action {
      display: flex;
      justify-content: space-between;
      margin-top: auto;
      font-size: 1rem; } }

.title {
  line-height: 1.4;
  font-size: 1.8rem; }
  @media only screen and (min-width: 75em) {
    .title {
      font-size: 2rem; } }

.heading-container {
  display: flex;
  justify-content: space-between;
  height: 100px;
  background-image: url("/assets/images/demo/header-menu.png");
  background-repeat: no-repeat;
  background-size: 50% 100%;
  background-position: right bottom; }
  @media only all and (min-width: 48em) {
    .heading-container {
      height: 150px;
      background-size: 30% 100%; } }
  .heading-container > .text {
    display: flex;
    flex-direction: column;
    align-items: start; }
    .heading-container > .text .text-en {
      color: #ff6d00;
      font-size: 2rem;
      font-weight: 400; }
      @media only all and (min-width: 48em) {
        .heading-container > .text .text-en {
          font-size: 2.8rem; } }
    .heading-container > .text .text-th {
      color: #74af00;
      font-size: 1.5rem;
      font-weight: 400; }
      @media only all and (min-width: 48em) {
        .heading-container > .text .text-th {
          font-size: 2rem; } }
  .heading-container .img {
    display: flex;
    justify-content: end; }

.heading-text {
  color: #ff6d00;
  font-size: 1.8rem; }
  @media only screen and (min-width: 62em) {
    .heading-text {
      font-size: 2rem; } }

.btn-readmore {
  color: #74af00;
  border-color: #74af00;
  padding: 0.25rem 0.5rem;
  font-size: 0.75rem;
  line-height: 1.5;
  border-radius: 0.5rem;
  transition: 0.3s;
  margin-left: auto; }
  @media only screen and (min-width: 75em) {
    .btn-readmore {
      padding: 0.25rem 0.75rem;
      font-size: 0.875rem;
      line-height: 1.5;
      border-radius: 1rem; } }
  .btn-readmore:hover {
    color: #fff;
    background-color: #74af00;
    border-color: #74af00; }

.red {
  color: #ff6d00;
  border-color: #ff6d00;
  line-height: 1.6; }

.product-detail-feature {
  width: 100%;
  display: flex;
  flex-direction: column; }
  @media only all and (min-width: 48em) {
    .product-detail-feature {
      flex-direction: row; } }
  .product-detail-feature .product-feature-img {
    display: flex;
    align-items: center;
    justify-content: center; }
    @media only all and (min-width: 48em) {
      .product-detail-feature .product-feature-img {
        width: 40%; } }
  .product-detail-feature .product-feature-text {
    display: flex;
    align-items: start;
    justify-content: start; }
    @media only all and (min-width: 48em) {
      .product-detail-feature .product-feature-text {
        width: 60%;
        margin-left: 3rem;
        margin-right: 1rem; } }
  .product-detail-feature * > .product-feature-about {
    color: #74af00;
    font-size: 1.5rem;
    margin-top: 1rem; }
    @media only all and (min-width: 48em) {
      .product-detail-feature * > .product-feature-about {
        font-size: 2rem;
        margin-bottom: 2rem; } }

/** FOOTER **/
.footer-website-container {
  border-top: 1px solid #ddd;
  background-color: #fff;
  min-height: 200px; }

.footer-website-detail {
  display: flex;
  flex-direction: column; }
  @media only all and (min-width: 48em) {
    .footer-website-detail {
      flex-direction: row; } }
  .footer-website-detail .footer-logo {
    display: flex;
    align-items: center;
    justify-content: center;
    max-width: 400px;
    margin: 0.5rem auto; }
    .footer-website-detail .footer-logo > img {
      max-width: 80%; }
      @media only all and (min-width: 48em) {
        .footer-website-detail .footer-logo > img {
          max-width: 100%; } }
  .footer-website-detail .footer-quick-links {
    display: flex;
    flex-direction: column;
    margin: auto 2.5rem; }
    @media only all and (min-width: 48em) {
      .footer-website-detail .footer-quick-links {
        margin: 2.5rem auto; } }

.footer-website-copyright {
  color: #333333;
  background-color: #ff6d00;
  padding: 1rem 4rem;
  font-size: 0.8rem;
  text-align: center; }
  @media only all and (min-width: 48em) {
    .footer-website-copyright {
      font-size: 1rem;
      text-align: left; } }

.quick-links-container {
  display: flex;
  flex-wrap: wrap; }
  .quick-links-container .quick-links-title {
    color: #ff6d00;
    font-weight: 400;
    font-size: 1.5rem;
    text-transform: uppercase;
    margin-bottom: 1.5rem; }
  .quick-links-container .quick-links-item {
    width: 100%;
    font-weight: 400; }
    .quick-links-container .quick-links-item > a > i {
      -webkit-text-stroke: 1px; }
    .quick-links-container .quick-links-item:hover {
      color: #ff6d00; }
  .quick-links-container > .quick-links-item {
    flex: 50%;
    /* or - flex: 0 50% - or - flex-basis: 50% - */
    margin-bottom: 1rem; }

.nicename_th,
.nicename_en {
  font-size: 1.25rem; }
  @media only all and (min-width: 36em) {
    .nicename_th,
    .nicename_en {
      font-size: 1.5rem; } }

.name_th,
.name_en {
  font-size: 1.1rem; }
  @media only all and (min-width: 36em) {
    .name_th,
    .name_en {
      font-size: 1.2rem; } }

.contact-form-container {
  margin-top: 1.5rem;
  margin-bottom: 1.5rem; }
  @media only all and (min-width: 48em) {
    .contact-form-container {
      margin-top: 3rem;
      margin-bottom: 3rem; } }

.contact-form-logo {
  margin-top: 1rem;
  margin-bottom: 0.5rem;
  width: 80%; }
  @media only all and (min-width: 48em) {
    .contact-form-logo {
      max-width: 200px;
      margin-top: 0rem;
      margin-bottom: 1.5rem; } }

.contact-form-text {
  align-items: start;
  width: 100%;
  margin-bottom: 1.5rem;
  padding: 0 1.5rem;
  font-size: 0.95rem; }
  @media only all and (min-width: 48em) {
    .contact-form-text {
      padding: 0;
      font-size: 1rem; } }

.contact-img-container {
  display: flex;
  justify-content: center;
  align-items: center; }
  @media only all and (min-width: 48em) {
    .contact-img-container {
      justify-content: start;
      margin-left: 18rem; } }

.contact-nicename-container {
  display: flex;
  justify-content: start;
  font-size: 1.2rem; }
  .contact-nicename-container .nicename_th {
    flex: 50%;
    margin-left: 3rem; }
  .contact-nicename-container .nicename_en {
    flex: 50%;
    margin-left: 4rem; }
  @media only all and (min-width: 48em) {
    .contact-nicename-container {
      font-size: 1.5rem;
      justify-content: start;
      flex-basis: calc(100% / 2); }
      .contact-nicename-container .nicename_th {
        flex: 50%;
        margin-left: 7rem; }
      .contact-nicename-container .nicename_en {
        flex: 50%;
        margin-left: 6rem; } }

.contact-name-container {
  display: flex;
  justify-content: start;
  line-height: 1.2;
  margin-top: 0.25rem; }
  @media only all and (min-width: 48em) {
    .contact-name-container {
      font-size: 1.2rem;
      line-height: 1.5;
      justify-content: start;
      margin-top: 0.5rem; } }
  .contact-name-container .name_th,
  .contact-name-container .name_en {
    flex: 50%; }

.contact-address-container {
  display: flex;
  justify-content: start;
  align-items: start;
  font-size: 0.85rem;
  margin-top: 0.25rem; }
  @media only all and (min-width: 48em) {
    .contact-address-container {
      font-size: 1rem;
      justify-content: start;
      margin-top: 0.5rem; } }
  .contact-address-container .address_th,
  .contact-address-container .address_en {
    text-wrap: nowrap;
    flex: 50%; }

.contact-social-container {
  display: flex;
  flex-direction: column;
  align-items: start;
  font-size: 0.85rem;
  margin-top: 0.5rem;
  margin-left: 5rem; }
  .contact-social-container .contact_img_qrcode {
    margin-top: 0.5rem;
    margin-bottom: 1rem; }
  @media only all and (min-width: 48em) {
    .contact-social-container {
      font-size: 1rem;
      flex-direction: column;
      align-items: start;
      font-size: 1rem;
      margin-top: 0.5rem;
      margin-left: 16rem; }
      .contact-social-container .contact_img_qrcode {
        margin-top: 0.5rem; } }

.contact-img {
  display: flex;
  justify-content: center;
  width: 100%;
  max-width: 150px; }

.email,
.website,
.tel {
  text-wrap: nowrap; }

.facebook-contact,
.x-contact,
.line-contact {
  text-wrap: nowrap; }
  .facebook-contact:hover,
  .x-contact:hover,
  .line-contact:hover {
    cursor: pointer;
    color: #ff6d00; }

.btn-send-form {
  border-radius: 5rem;
  padding-left: 2rem;
  padding-right: 2rem;
  background-color: #88ce00;
  color: #333333;
  border-color: transparent;
  transition: 0.3s; }
  .btn-send-form:hover {
    cursor: pointer;
    background-color: #608f00;
    color: #fff; }

.form-indy-inno {
  border: 1px solid #000; }
  .form-indy-inno::placeholder {
    color: #adadad;
    font-size: 80%; }

.breadcrumb-website {
  padding: 0.125rem 1rem;
  line-height: 1.6; }
