.wrapperA {
  display: grid;
  grid-template-columns: 5fr 1fr 6fr;
  column-gap: 25px;
}
.wrapper {
  display: grid;
  grid-template-columns: 2fr 10fr;
  column-gap: 25px;
}
.wrapperB {
  display: grid;
  grid-template-columns: 2fr 10fr;
  column-gap: 25px;
}
.wrapper2 {
  display: grid;
  grid-template-columns: 2fr 10fr;
}
.wrapper3 {
  display: grid;
  grid-template-columns: 2fr 3fr 3fr 3fr;
  column-gap: 25px;
}
.slogan {
  position: fixed;
  bottom: 100px;
}

.tab-pane {
    text-align: left;
    height: 100px !important;
    width: 500px;
    max-width: 100%;
}

.cycle-tab-item:after {
  display:block;
  content: '';
  /*border-bottom: solid 3px #fcae17;  */
  border-bottom: 0;
  transform: scaleX(0);  
  transition: transform 0ms ease-out;
}
.cycle-tab-item.active:after { 
  transform: scaleX(1);
  transform-origin:  0% 50%; 
  transition: transform 5000ms ease-in;
}
.nav-tabs {
	border-bottom: 0;
	list-style: none;
	padding: 0;
}
.tab-content {
    max-height: 423px;
	height: 423px;
}
.nav-link2:hover,
.cycle-tab-item.active a {
  border-color: transparent !important;
  color: #fcae17;
  text-decoration: underline !important;
}

@media only screen and (min-device-width: 0px) and (max-device-width: 735px) {
  .wrapper {
    grid-template-columns: 12fr;
  }
  .wrapperA {
    grid-template-columns: 5fr 2fr;
  }  
  .wrapperA .column1 {
    grid-column: 1 / span 2;
    grid-row: 1;
  }
  .wrapperA .column2 {
    grid-column: 1 / span 2;
    grid-row: 1;
  }
  .wrapperA .column3 {
    grid-column: 1 / span 2;
    grid-row: 2;
  }
  .wrapperB {
    grid-template-columns: 12fr;
  }
  .wrapperB .column1 {
    grid-column: 1 / span 2;
    grid-row: 1;
  }
  .wrapperB .column2 {
    grid-column: 1 / span 2;
    grid-row: 2;
    width: 345px;
  }
  .wrapper2 {
    grid-template-columns: 12fr;
  }  
  .wrapper2 .column1 {
    grid-column: 1 / span 2;
    grid-row: 1;
  }
  .wrapper2 .column2 {
    grid-column: 1 / span 2;
    grid-row: 2;
    width: 345px;
  }
  .dash-before::before {
    width: 50px;
  }
  .dash-before span {
    padding: 10px 0 0 5px;
    width: 82%;
  }
  .tab-pane {
    height: auto !important;
  }
  .slogan { 
    position: absolute;
    bottom: 0;
  }
}

/* ipad - portrail*/
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) {
  .wrapper {
    grid-template-columns: 12fr;
  }
  .wrapper2 {
    grid-template-columns: 12fr;
  }

  .dash-before::before {
    width: 50px;
  }
  .dash-before span {
    padding: 10px 0 0 5px;
    width: 82%;
  }
  .slogan { 
    position: absolute;
    bottom: 0;
  }
}

/* ipad - landscape */
@media only screen and (min-device-width : 1024px) and (max-device-width : 1080px) and (orientation : landscape) {
  .aboutimg-1 {
      position: absolute;
      top: 1337px;
      right: 15px;
  }
  .aboutimg-3 {
    top: 2185px;
  }
  .aboutimg-3 img {
      width: 280px;
  }
  body#lang_th .aboutimg-3 {
    top: 2156px;
  }
  .feature-slide-image {
      margin-right: 20px;
  }
  .feature-slide-content {
      width: 425px;
  }
}