/* Disable Google Chrome Yellow Field Background */
input:-webkit-autofill {
  -webkit-box-shadow: 0 0 0 500px rgba(0, 0, 0, 0) inset;
}
/* Disable Google Chrome Blue Field Outline */
textarea,
input,
*:focus {
  outline: none !important;
}
body {
  background: #000;
  color: #ccc;
  font-size: 14px;
  font-family: 'Lato', 'ThaiSans All', sans-serif;
  z-index: 0;
  padding: 0px;
  margin: 0px;
  background: #222;
  line-height: 1.6em;
  -webkit-font-smoothing: antialiased;
  text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.004);
}
#pageFooter .txt-desc {
  opacity: 0.1;
}
.reveal-animation {
  top: 0;
  left: 0;
  padding: 0px;
  margin: 0px;
  max-width: 980px;
  margin: auto;
  position: absolute;
  display: none;
}
/*<< MIXIN : START >>*/
.user_select_none {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
/*<< MIXIN : END >>*/
.shop_cat_slide_img.ng-enter {
  opacity: 0;
}
.margin50 {
  clear: both;
  height: 50px;
}
.margin40 {
  clear: both;
  height: 40px;
}
.margin10 {
  clear: both;
  height: 10px;
}
.marginH1 {
  clear: both;
  height: 1px;
}
.marginH2 {
  clear: both;
  height: 2px;
}
.marginH3 {
  clear: both;
  height: 3px;
}
.marginH4 {
  clear: both;
  height: 4px;
}
.marginH5 {
  clear: both;
  height: 5px;
}
.marginH6 {
  clear: both;
  height: 6px;
}
.marginH7 {
  clear: both;
  height: 7px;
}
.marginH8 {
  clear: both;
  height: 8px;
}
.marginH9 {
  clear: both;
  height: 9px;
}
.marginH10 {
  clear: both;
  height: 10px;
}
.marginH16 {
  clear: both;
  height: 16px;
}
.marginH20 {
  clear: both;
  height: 20px;
}
.marginH30 {
  clear: both;
  height: 30px;
}
.marginH40 {
  clear: both;
  height: 40px;
}
.marginH50 {
  clear: both;
  height: 50px;
}
.marginH60 {
  clear: both;
  height: 60px;
}
.marginH70 {
  clear: both;
  height: 70px;
}
.marginH80 {
  clear: both;
  height: 80px;
}
.marginH90 {
  clear: both;
  height: 90px;
}
.marginH100 {
  clear: both;
  height: 100px;
}
.marginH110 {
  clear: both;
  height: 110px;
}
.marginH120 {
  clear: both;
  height: 120px;
}
.marginH130 {
  clear: both;
  height: 130px;
}
.marginH140 {
  clear: both;
  height: 140px;
}
.marginH150 {
  clear: both;
  height: 150px;
}
/* MARGIN W */
.marginW5 {
  width: 5px;
  margin: 0px;
  padding: 0px;
  width: 20px;
  height: 1px;
  background: rgba(0, 0, 0, 0);
}
.marginW10 {
  width: 10px;
  margin: 0px;
  padding: 0px;
  width: 20px;
  height: 1px;
  background: rgba(0, 0, 0, 0);
}
.marginW20 {
  width: 20px;
  margin: 0px;
  padding: 0px;
  height: 1px;
  background: rgba(0, 0, 0, 0);
}
/* CSS LOAD 
CSS KEYFRAME */
@-webkit-keyframes uil-default-anim {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@keyframes uil-default-anim {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
.uil-default-css > div:nth-of-type(1) {
  -webkit-animation: uil-default-anim 1s linear infinite;
  animation: uil-default-anim 1s linear infinite;
  -webkit-animation-delay: -0.5s;
  animation-delay: -0.5s;
}
.uil-default-css {
  position: relative;
  background: none;
  width: 200px;
  height: 200px;
}
.uil-default-css > div:nth-of-type(2) {
  -webkit-animation: uil-default-anim 1s linear infinite;
  animation: uil-default-anim 1s linear infinite;
  -webkit-animation-delay: -0.41666667s;
  animation-delay: -0.41666667s;
}
.uil-default-css {
  position: relative;
  background: none;
  width: 200px;
  height: 200px;
}
.uil-default-css > div:nth-of-type(3) {
  -webkit-animation: uil-default-anim 1s linear infinite;
  animation: uil-default-anim 1s linear infinite;
  -webkit-animation-delay: -0.33333333s;
  animation-delay: -0.33333333s;
}
.uil-default-css {
  position: relative;
  background: none;
  width: 200px;
  height: 200px;
}
.uil-default-css > div:nth-of-type(4) {
  -webkit-animation: uil-default-anim 1s linear infinite;
  animation: uil-default-anim 1s linear infinite;
  -webkit-animation-delay: -0.25s;
  animation-delay: -0.25s;
}
.uil-default-css {
  position: relative;
  background: none;
  width: 200px;
  height: 200px;
}
.uil-default-css > div:nth-of-type(5) {
  -webkit-animation: uil-default-anim 1s linear infinite;
  animation: uil-default-anim 1s linear infinite;
  -webkit-animation-delay: -0.16666667s;
  animation-delay: -0.16666667s;
}
.uil-default-css {
  position: relative;
  background: none;
  width: 200px;
  height: 200px;
}
.uil-default-css > div:nth-of-type(6) {
  -webkit-animation: uil-default-anim 1s linear infinite;
  animation: uil-default-anim 1s linear infinite;
  -webkit-animation-delay: -0.08333333s;
  animation-delay: -0.08333333s;
}
.uil-default-css {
  position: relative;
  background: none;
  width: 200px;
  height: 200px;
}
.uil-default-css > div:nth-of-type(7) {
  -webkit-animation: uil-default-anim 1s linear infinite;
  animation: uil-default-anim 1s linear infinite;
  -webkit-animation-delay: 0s;
  animation-delay: 0s;
}
.uil-default-css {
  position: relative;
  background: none;
  width: 200px;
  height: 200px;
}
.uil-default-css > div:nth-of-type(8) {
  -webkit-animation: uil-default-anim 1s linear infinite;
  animation: uil-default-anim 1s linear infinite;
  -webkit-animation-delay: 0.08333333333333337s;
  animation-delay: 0.08333333333333337s;
}
.uil-default-css {
  position: relative;
  background: none;
  width: 200px;
  height: 200px;
}
.uil-default-css > div:nth-of-type(9) {
  -webkit-animation: uil-default-anim 1s linear infinite;
  animation: uil-default-anim 1s linear infinite;
  -webkit-animation-delay: 0.16666666666666663s;
  animation-delay: 0.16666666666666663s;
}
.uil-default-css {
  position: relative;
  background: none;
  width: 200px;
  height: 200px;
}
.uil-default-css > div:nth-of-type(10) {
  -webkit-animation: uil-default-anim 1s linear infinite;
  animation: uil-default-anim 1s linear infinite;
  -webkit-animation-delay: 0.25s;
  animation-delay: 0.25s;
}
.uil-default-css {
  position: relative;
  background: none;
  width: 200px;
  height: 200px;
}
.uil-default-css > div:nth-of-type(11) {
  -webkit-animation: uil-default-anim 1s linear infinite;
  animation: uil-default-anim 1s linear infinite;
  -webkit-animation-delay: 0.33333333333333337s;
  animation-delay: 0.33333333333333337s;
}
.uil-default-css {
  position: relative;
  background: none;
  width: 200px;
  height: 200px;
}
.uil-default-css > div:nth-of-type(12) {
  -webkit-animation: uil-default-anim 1s linear infinite;
  animation: uil-default-anim 1s linear infinite;
  -webkit-animation-delay: 0.41666666666666663s;
  animation-delay: 0.41666666666666663s;
}
button,
a,
div {
  outline: 0px;
}
#screen-loading {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  display: block;
  /*background-color: rgba(0, 0, 0, .9);*/
  /* black tran90% */
  background-color: rgba(255, 80, 0, 0.9);
  z-index: 99999999;
  opacity: 1;
  /* TRANSITION */
  transition: all 1.5s;
  webkit-transition: all 1.5s;
  -moz-transition: all 1.5s;
  -o-transition: all 1.5s;
}
#screen-loading .uil-default-css {
  position: relative;
  background: none;
  width: 200px;
  height: 200px;
}
#screen-loading img {
  position: relative;
  top: 50%;
  left: 50%;
  margin-top: -37px;
  margin-left: -37px;
  width: 74px;
  height: 74px;
}
#screen-loading .uil-default-css {
  position: relative;
  top: 50%;
  left: 50%;
  margin-top: -100px;
  margin-left: -100px;
  width: 200px;
  height: 200px;
}
#screen-loading .text-loading-show {
  position: relative;
  top: 50%;
  left: 50%;
  margin-top: -85px;
  margin-left: -100px;
  width: 200px;
  height: 150px;
  text-align: center;
  color: #fff;
  text-transform: uppercase;
}
#screen-loading .loader {
  width: 150px;
  height: 150px;
  line-height: 150px;
  position: relative;
  box-sizing: border-box;
  text-align: center;
  z-index: 0;
  text-transform: uppercase;
  margin: 0 auto;
  margin-top: -75px;
  top: 50%;
}
#screen-loading .loader:before,
#screen-loading .loader:after {
  opacity: 0;
  box-sizing: border-box;
  content: "\0020";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 100px;
  border: 5px solid #fff;
  box-shadow: 0 0 0px #fff, inset 0 0 00px #fff;
}
#screen-loading .loader:after {
  z-index: 1;
  -webkit-animation: gogoloader 3s infinite 1.5s;
}
#screen-loading .loader:before {
  z-index: 2;
  -webkit-animation: gogoloader 3s infinite;
}
@-webkit-keyframes gogoloader {
  0% {
    -webkit-transform: scale(0);
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(1);
    opacity: 0;
  }
}
.screen-load-ani {
  -webkit-transition: all .5;
  -moz-transition: all .5s;
  -ms-transition: all .5s;
  -o-transition: all .5s;
}
.screen-hide {
  z-index: -10 !important;
}
.screen-load-hide {
  opacity: 0 !important;
}
/* END CSS LOAD */
[ng-cloak],
[data-ng-cloak],
[x-ng-cloak],
.ng-cloak,
.x-ng-cloak {
  display: none !important;
}
.grid-1200 {
  width: 1200px !important;
}
.grid-980 {
  width: 981px !important;
}
.force-middle {
  float: none !important;
  margin: 0 auto !important;
}
.clear {
  clear: both;
}
#pageContent {
  padding: 0px;
}
.topBar {
  position: relative;
  width: 100%;
  min-width: 980px;
  height: 160px;
  background: #ccc;
  margin: 0px;
  background-image: linear-gradient(180deg, #222222 0%, #111111 100%);
  text-align: center;
}
.topBar #topBarLogo {
  display: block;
  position: relative;
  height: 100px;
  margin: auto;
  top: 60px;
}
.topBar svg {
  position: relative;
  width: 126px;
  height: 80px;
  margin-left: auto;
  margin-right: auto;
  margin-top: 30px;
}
.screenline1 {
  width: 100%;
  min-width: 980px;
  height: 2px;
  background: #ff5000;
}
.cfbLine1 {
  width: 100%;
  height: 1px;
  background: #ff5000;
  margin: 8px auto;
}
.contentBody {
  min-width: 320px;
  width: 980px;
  max-width: 1200px;
  margin: auto;
  position: relative;
  height: auto;
}
.contentNotiBox {
  background-color: #d0021b;
  min-height: 40px;
  padding: 0px 20px;
}
.contentNotiBox .cntLabel {
  color: white;
  font-size: 18px;
  font-weight: 300;
  width: 100%;
  text-align: center;
  position: relative;
  padding: 8px 0px;
}
.contentBody .ngSlideView .cfbLabelType1 {
  max-width: 439px;
  min-height: 72px;
  margin: 40px auto;
  color: rgba(255, 255, 255, 0.54);
  font-size: 18px;
  font-weight: 300;
  line-height: 36px;
  text-align: center;
}
.cfbLabelType1 {
  color: rgba(255, 255, 255, 0.54);
  font-family: Lato;
  font-size: 18px;
  font-weight: 300;
  line-height: 27px;
}
.cfbForm .cfbFormRow {
  margin: 40px 0px;
}
.cfbForm .cfbFormRow .formLabelH2 {
  text-align: center;
  min-width: 29px;
  color: white;
  font-size: 24px;
  font-weight: 300;
  line-height: 29px;
}
.cfbForm .cfbFormRow .formDLabelH2 {
  text-align: center;
  min-width: 29px;
  color: white;
  font-size: 24px;
  font-weight: 400;
  line-height: 32px;
  font-family: inherit;
}
.cfbForm .cfbFormRow .formInputH2 {
  border: 0px;
  background: none;
  margin: 10px;
}
.cfbForm .cfbFormRow .formInputH2 .cfbInputH2 {
  border: 0px;
  background: none;
  outline: none;
  width: 100%;
  text-align: center;
  color: #ff5000;
  font-size: 48px;
  font-weight: 300;
}
.cfbForm .cfbFormRow.navButton {
  text-align: center;
  margin: 48px 0px;
}
.cfbForm .cfbFormRow .formNavButton {
  cursor: pointer;
  margin: 0px 20px;
}
.forgotpassword_btn,
.forgotpassword_btn:visited,
.forgotpassword_btn:focus {
  text-decoration: none;
  outline: none;
}
.forgotpassword_btn:hover {
  text-decoration: none;
  color: #666;
}
/*  Animate  */
.ngSlideView {
  padding: 0px;
  margin: 0px;
  position: relative;
  transition: 430ms ease-in-out;
  -webkit-transition: 430ms ease-in-out;
  -moz-transition: 430ms ease-in-out;
  -ms-transition: 430ms ease-in-out;
  -o-transition: 430ms ease-in-out;
}
.ngViewBox {
  display: :none;
  min-height: 100px;
  height: auto;
  padding: 0px;
  margin: 0px;
  margin-top: 20px;
  text-align: center;
  position: relative;
  width: 100%;
  min-width: 980px;
}
.ngViewBox .n {
  text-transform: none;
}
.ngViewBox .errorNoti {
  display: none;
  margin-bottom: 20px;
}
.ngViewBox .cfbForm {
  margin: 40px auto;
}
.display-none {
  display: none;
}
.navViewFade .ngSlideView.ng-enter {
  opacity: 0;
}
.navViewFade .ngSlideView.ng-enter.ng-enter-active {
  opacity: 1;
}
.navViewFade .ngSlideView.ng-enter.ng-leave {
  opacity: 1;
}
.navViewFade .ngSlideView.ng-leave.ng-leave-active {
  opacity: 0;
}
/* Prev animation*/
.navViewPrev .ngSlideView.ng-enter {
  left: -100%;
}
.navViewPrev .ngSlideView.ng-enter.ng-enter-active {
  left: 0%;
  opacity: 1;
}
.navViewPrev .ngSlideView.ng-leave {
  left: 0%;
  opacity: 1;
}
.navViewPrev .ngSlideView.ng-leave.ng-leave-active {
  left: 100%;
  opacity: 0;
}
/* Next animation*/
.navViewNext .ngSlideView.ng-enter {
  left: 100%;
}
.navViewNext .ngSlideView.ng-enter.ng-enter-active {
  left: 0%;
  opacity: 1;
}
.navViewNext .ngSlideView.ng-leave {
  left: 0%;
  opacity: 1;
}
.navViewNext .ngSlideView.ng-leave.ng-leave-active {
  left: -100%;
  opacity: 0;
}
.nRight .circle-btn,
.nLeft .circle-btn {
  width: auto;
  display: inline-block;
}
.nRight svg,
.nLeft svg {
  fill: #fff;
  opacity: .2;
}
.nRight .activeNext:hover svg,
.nLeft .activeNext:hover svg {
  fill: #ff9500 !important;
  opacity: 1 !important;
}
.nRight .activeNext:active svg,
.nLeft .activeNext:active svg {
  fill: #ff5000 !important;
  opacity: 1 !important;
}
.nRight .activeNext svg,
.nLeft .activeNext svg {
  fill: #fff !important;
  opacity: 0.5;
}
.nRight .activeNext svg {
  opacity: 1 !important;
}
.thaiall {
  -webkit-transition-duration: 0.5s;
  /* Safari */
  transition-duration: 0.5s;
  font-family: 'ThaiSans All';
}
.fixed-divs {
  position: fixed !important;
  width: 100%;
  background-color: #222222;
  z-index: 5;
  top: 80px;
}
.scroll-menu-fixed {
  position: fixed !important;
  top: 0px;
  z-index: 3;
  padding-bottom: 45px;
  height: 56px !important;
}
.color-white {
  color: rgba(255, 255, 255, 0.54) !important;
  font-size: 28px;
  font-weight: normal;
  line-height: 36px;
  margin-top: 13px;
}
.color-orange {
  color: #ff5000 !important;
  font-size: 24px;
  font-weight: normal;
  line-height: 29px;
}
.padTop50 {
  float: left;
  width: 969px;
  position: relative;
  margin-top: 0px;
}
.padTop50 .middle-3-block {
  -webkit-transition-duration: 0.35s;
  /* Safari */
  transition-duration: 0.35s;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  float: left;
  position: relative;
  width: 303px;
  height: 112px;
  border: 1px solid #979797;
  margin: 10px 10px;
  cursor: pointer;
}
.padTop50 .middle-3-block:hover {
  border: 1px solid #ff5000;
}
.padTop50 .middle-3-block:hover span {
  color: #fff !important;
  opacity: 1;
  font-weight: bold;
}
.padTop50 .middle-3-block h2 {
  color: #ff5000 !important;
  font-size: 24px;
  font-weight: 400;
  line-height: 29px;
}
.padTop50 .middle-3-block span {
  color: rgba(255, 255, 255, 0.54);
  font-size: 24px;
  font-weight: normal;
  line-height: 31px;
  margin-top: 8px;
}
.padTop50 .middle-selected {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  background-color: #ff5000;
  border: 1px solid #ff5000;
}
.padTop50 .middle-selected h2 {
  color: white !important;
}
.padTop50 .middle-selected span {
  color: rgba(255, 255, 255, 0.54) !important;
}
.transition_material_1 {
  transition: all 3s cubic-bezier(0.19, 1, 0.22, 1);
  -moz-transition: all 3s cubic-bezier(0.19, 1, 0.22, 1);
  -webkit-transition: all 3s cubic-bezier(0.19, 1, 0.22, 1);
  -o-transition: all 3s cubic-bezier(0.19, 1, 0.22, 1);
  -ms-transition: all 3s cubic-bezier(0.19, 1, 0.22, 1);
}
.slide-arrow-div {
  width: 26px;
  padding: 1px;
  height: 170px;
  position: absolute;
  z-index: 99;
  background: #222;
}
.arrow-div-left {
  left: 0px;
  margin-left: -1px;
}
.arrow-div-right {
  right: 0px;
  margin-right: -1px;
}
.survey-notibox-top {
  text-align: center;
  font-size: 17px;
}
.survey-notibox-top .txt-normal.red {
  color: #d0021b;
}
.survey-notibox-top .txt-normal.red.th {
  font-size: 24px;
}
.survey-category-slide-div .items-center-div {
  background: #f0f;
  height: 200px;
}
.survey-category-slide-div .items-center-div .item-slide-area {
  height: 100%;
  margin: 0px auto;
  background: #0f0;
}
.survey-category-slide-div,
.padTop50-middle {
  overflow: hidden;
  float: left;
  width: 100%;
  position: relative;
  margin-top: 0px;
  margin-bottom: 49px;
  opacity: 1;
  background: inherit;
}
.survey-category-slide-div .middle-6-overflow-blog,
.padTop50-middle .middle-6-overflow-blog {
  width: 100%;
  margin: auto;
  overflow: hidden;
  height: 168px;
  position: relative;
}
.survey-category-slide-div .middle-6-overflow-blog .block-overflow,
.padTop50-middle .middle-6-overflow-blog .block-overflow {
  transition: all 3s cubic-bezier(0.19, 1, 0.22, 1);
  -moz-transition: all 3s cubic-bezier(0.19, 1, 0.22, 1);
  -webkit-transition: all 3s cubic-bezier(0.19, 1, 0.22, 1);
  -o-transition: all 3s cubic-bezier(0.19, 1, 0.22, 1);
  -ms-transition: all 3s cubic-bezier(0.19, 1, 0.22, 1);
  position: relative;
}
.survey-category-slide-div .middle-arrow-left,
.padTop50-middle .middle-arrow-left {
  float: left;
  margin-top: 33px;
  fill: #fff;
  opacity: .54;
  cursor: pointer;
}
.survey-category-slide-div .middle-arrow-left:hover,
.padTop50-middle .middle-arrow-left:hover {
  opacity: 2;
}
.survey-category-slide-div .middle-arrow-right,
.padTop50-middle .middle-arrow-right {
  float: right;
  margin-top: 33px;
  z-index: 0;
  top: 0;
  transform: rotate(180deg);
  fill: #fff;
  opacity: .54;
  cursor: pointer;
}
.survey-category-slide-div .middle-arrow-right:hover,
.padTop50-middle .middle-arrow-right:hover {
  opacity: 2;
}
.survey-category-slide-div .circlr-middle,
.padTop50-middle .circlr-middle {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  width: 100px;
  height: auto;
  border-radius: 50%;
  float: left;
  margin: 0px 31px;
  margin-bottom: 60px;
  cursor: pointer;
}
.survey-category-slide-div .circlr-middle:hover .description,
.padTop50-middle .circlr-middle:hover .description {
  opacity: 1;
}
.survey-category-slide-div .circlr-middle:hover .normal,
.padTop50-middle .circlr-middle:hover .normal {
  display: none;
}
.survey-category-slide-div .circlr-middle:hover .hover,
.padTop50-middle .circlr-middle:hover .hover {
  display: block;
}
.survey-category-slide-div .circlr-middle:hover .active,
.padTop50-middle .circlr-middle:hover .active {
  display: none;
}
.survey-category-slide-div .circlr-middle img,
.padTop50-middle .circlr-middle img {
  max-width: 100px;
  width: 100px;
  height: 100px;
  float: left;
  transition: 0.5s linear all;
  -webkit-transition: .5s linear all;
}
.survey-category-slide-div .circlr-middle img.ng-enter,
.padTop50-middle .circlr-middle img.ng-enter {
  opacity: 0;
}
.survey-category-slide-div .circlr-middle img.ng-enter.ng-enter-active,
.padTop50-middle .circlr-middle img.ng-enter.ng-enter-active {
  opacity: 1;
}
.survey-category-slide-div .circlr-middle img.ng-leave,
.padTop50-middle .circlr-middle img.ng-leave {
  opacity: 1;
}
.survey-category-slide-div .circlr-middle img.ng-leave.ng-leave-active,
.padTop50-middle .circlr-middle img.ng-leave.ng-leave-active {
  opacity: 0;
}
.survey-category-slide-div .circlr-middle .description,
.padTop50-middle .circlr-middle .description {
  padding-top: 5px;
  color: white;
  opacity: 0;
  font-size: 18px;
}
.survey-category-slide-div .circlr-middle svg,
.padTop50-middle .circlr-middle svg {
  max-width: 100px;
  height: 100px;
  border-radius: 50%;
}
.survey-category-slide-div .circlr-middle .normal,
.padTop50-middle .circlr-middle .normal {
  display: block;
}
.survey-category-slide-div .circlr-middle .hover,
.padTop50-middle .circlr-middle .hover {
  display: none;
}
.survey-category-slide-div .circlr-middle .active,
.padTop50-middle .circlr-middle .active {
  display: none;
}
.survey-category-slide-div .c-selected .normal,
.padTop50-middle .c-selected .normal {
  display: none;
}
.survey-category-slide-div .c-selected .hover,
.padTop50-middle .c-selected .hover {
  display: none;
}
.survey-category-slide-div .c-selected .active,
.padTop50-middle .c-selected .active {
  display: block;
}
.survey-category-slide-div .c-selected .description,
.padTop50-middle .c-selected .description {
  opacity: 1;
}
.survey-category-slide-div .c-selected:hover .normal,
.padTop50-middle .c-selected:hover .normal {
  display: none;
}
.survey-category-slide-div .c-selected:hover .hover,
.padTop50-middle .c-selected:hover .hover {
  display: none;
}
.survey-category-slide-div .c-selected:hover .active,
.padTop50-middle .c-selected:hover .active {
  display: block;
}
.survey-category-slide-div .c-unselected,
.padTop50-middle .c-unselected {
  opacity: .4;
}
.survey-category-slide-div .c-unselected .normal,
.padTop50-middle .c-unselected .normal {
  display: block;
}
.survey-category-slide-div .c-unselected .hover,
.padTop50-middle .c-unselected .hover {
  display: none;
}
.survey-category-slide-div .c-unselected .active,
.padTop50-middle .c-unselected .active {
  display: none;
}
.padTop48 {
  float: left;
  position: relative;
  width: 100%;
  height: auto;
  margin-top: 23px;
  margin-bottom: 25px;
}
.padTop48 span {
  color: rgba(255, 255, 255, 0.54);
  font-size: 18px;
  cursor: pointer;
  font-weight: 300;
}
.padTop48 p {
  color: rgba(255, 255, 255, 0.54);
  font-size: 18px;
  text-align: left;
  line-height: 28.8px;
}
.padTop48 .th {
  font-size: 20px;
  font-weight: 400;
  line-height: 32px;
}
.center-div {
  clear: left;
  float: left;
  width: 100%;
  height: auto;
  text-align: center;
  margin: 0 auto;
}
.center-div .middle-1-block {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  position: relative;
  width: 303px;
  height: 112px;
  border: 1px solid #979797;
  margin-bottom: 25px;
  cursor: pointer;
  margin-left: auto;
  margin-right: auto;
}
.center-div .middle-1-block:hover {
  border: 1px solid #ff5000;
}
.center-div .middle-1-block h2 {
  color: #ff5000 !important;
  font-size: 24px;
  font-weight: 400;
  line-height: 29px;
}
.center-div .middle-1-block span {
  color: rgba(255, 255, 255, 0.54) !important;
  font-size: 24px;
  font-weight: normal;
  line-height: 31px;
  margin-top: 8px;
}
.center-div .middle-selected {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  background-color: #ff5000;
  border: 1px solid #ff5000;
}
.center-div .middle-selected h2 {
  color: white !important;
}
.center-div .middle-selected span {
  color: rgba(255, 255, 255, 0.54) !important;
}
.for3 {
  overflow: hidden;
}
.cfbFormRow-extend90 {
  margin: 88px 0 !important;
}
.extend-navbtn {
  margin: 23px 0px !important;
}
.final-line {
  float: left;
  position: relative;
  height: auto;
  width: 100%;
  clear: both;
}
.final-line .pad24 {
  float: left;
  position: relative;
  height: 24px;
  width: 100%;
  clear: both;
}
.final-line .pad90 {
  float: left;
  position: relative;
  height: 88px;
  width: 100%;
  clear: both;
}
.final-line .pad40 {
  float: left;
  position: relative;
  height: 40px;
  width: 100%;
  clear: both;
}
.final-line .pad48 {
  float: left;
  position: relative;
  height: 48px;
  width: 100%;
  clear: both;
}
.final-line .pad25 {
  float: left;
  position: relative;
  height: 25px;
  width: 100%;
  clear: both;
}
.final-line .lbl-orange {
  height: 39px;
  color: #ff5000;
  font-size: 24px;
  font-weight: 700;
  line-height: 38.4px;
  float: left;
  width: 100%;
  text-align: center;
}
.final-line .lbl-green-ready {
  color: #009933;
  font-family: Lato;
  font-size: 24px;
  font-weight: 700;
  line-height: 38.4px;
  margin-top: 24px;
  float: left;
  width: 100%;
  text-align: center;
}
.final-line .lbl-white {
  color: rgba(255, 255, 255, 0.54);
  font-size: 28px;
  font-weight: 700;
  line-height: 44.8px;
  float: left;
  width: 100%;
  text-align: center;
}
.final-line .lbl-white.th-white-size-28 {
  font-family: Lato, 'Thaisans All';
  font-weight: 500;
  color: white;
  font-size: 28px;
  line-height: 32px;
}
.final-line .big {
  font-size: 72px !important;
  line-height: 115.2px !important;
}
.final-line .en-light {
  color: rgba(255, 255, 255, 0.54);
  font-size: 18px;
  font-weight: 300;
  line-height: 28.8px;
}
.final-line .th-light {
  font-size: 24px;
  font-weight: 300;
  line-height: 38.4px;
}
.helperMiddleSmall {
  color: rgba(255, 255, 255, 0.54);
  font-family: Lato;
  font-size: 18px;
  font-weight: 700;
  line-height: 22px;
}
/* DASHBOARD CSS */
.opa-low {
  opacity: .4;
}
.opa-low:hover {
  opacity: 1;
}
.dx-full {
  clear: both;
  position: relative;
  float: left;
  width: 100%;
  height: auto;
  margin-top: 40px;
  z-index: 1000;
}
.dx-full .dx-bar-top {
  position: fixed;
  width: 100%;
  height: 80px;
  background-color: #ff5000;
  z-index: 7;
  top: 0;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.dx-full .dx-bar-top a {
  cursor: pointer;
}
.dx-full .dx-bar-top .dx-gae-logo {
  width: 28px;
  height: 56px;
  margin-left: auto;
  margin-right: auto;
  padding-top: 12px;
}
.dx-full .dx-bar-top .dx-gae-logo svg {
  fill: white;
  width: 28px;
  height: 56px;
}
.dx-full .dx-bar-top .dx-gae-menu {
  z-index: 600;
  margin-left: auto;
  width: 980px;
  margin-right: auto;
  text-align: center;
  max-height: 80px;
  height: 80px;
}
.dx-full .dx-bar-top .dx-gae-menu .dx-gae-menu-a {
  padding-left: 43px;
  padding-right: 43px;
  display: inline-block;
  color: #303030;
  font-family: Lato;
  font-size: 14px;
  font-weight: 900;
  height: 23px;
  padding-top: 29px;
}
.dx-full .dx-bar-top .dx-gae-menu .dx-gae-menu-a svg {
  fill: white;
  width: 28px;
  height: 56px;
  position: absolute;
  top: -5px;
  left: 25px;
}
.dx-full .dx-bar-top .dx-gae-menu .dx-gae-menu-a:hover {
  color: #fff;
  text-decoration: none;
}
.dx-full .dx-bar-top .dx-gae-menu .dx-gae-menu-a.disable {
  cursor: default;
  opacity: 0.4;
}
.dx-full .dx-bar-top .dx-gae-menu .dx-gae-menu-a.disable:hover {
  color: #303030;
  text-decoration: none;
}
.dx-full .dx-bar-top .dx-gae-menu .a-svg {
  position: relative;
}
.dx-full .dx-bar-top .dashboard-topbar-notiBox {
  position: relative;
  z-index: 500;
  display: none;
  width: 100%;
  height: 60px;
  background-color: #ccc;
  text-align: center;
  font-size: 15px;
  line-height: 24px;
}
.dx-full .dx-bar-top .dashboard-topbar-notiBox .notiBox-content {
  display: none;
  min-width: 980px;
}
.dx-full .dx-bar-top .dashboard-topbar-notiBox .label {
  height: 25px;
}
.dx-full .dx-bar-top .dashboard-topbar-notiBox .label.en {
  font-weight: 500;
  font-size: 15px;
}
.dx-full .dx-bar-top .dashboard-topbar-notiBox .label.th {
  font-weight: 500;
  font-size: 21px;
}
.dx-full .dx-bar-top .dashboard-topbar-notiBox.complete {
  background-color: rgba(0, 153, 51, 0.8);
  color: #fff;
}
.dx-full .dx-bar-top .dashboard-topbar-notiBox.danger {
  background-color: rgba(208, 2, 27, 0.8);
  color: #fff;
}
.dx-full .dx-bar-top .dashboard-topbar-notiBox.info {
  background-color: rgba(48, 48, 48, 0.8);
  color: #fff;
}
.dx-full .dx-bar-top2 {
  position: relative;
  width: 100%;
  height: 45px;
  background-color: #e64900;
}
.dx-full .dx-bar-top2 .menu {
  margin-left: auto;
  margin-right: auto;
  width: auto;
  height: 100%;
  text-align: center;
}
.dx-full .dx-bar-top2 .menu a {
  padding-left: 41px;
  padding-right: 41px;
  color: #fff;
  font-family: Lato;
  font-size: 14px;
  font-weight: bold;
  line-height: 45px;
  cursor: pointer;
  display: inline-block;
  text-decoration: none;
}
.dx-full .dx-bar-top2 .svg-logo {
  margin-left: auto;
  margin-right: auto;
  width: auto;
  height: 100%;
  text-align: center;
  margin-top: 8px;
}
.dx-full .dx-bar-top25 {
  position: relative;
  width: 100%;
  height: 56px;
  background-color: #e64900;
}
.dx-full .dx-bar-top25 .svg-logo {
  margin-left: auto;
  margin-right: auto;
  width: auto;
  height: 100%;
  text-align: center;
}
.dx-full .dx-bar-top3 {
  position: relative;
  width: 100%;
  height: 64px;
  background-color: #303030;
}
.dx-full .dx-bar-top3 .menu {
  margin-left: auto;
  margin-right: auto;
  width: auto;
  height: 100%;
  text-align: center;
  color: white;
  line-height: 64px;
  font-size: 24px;
  font-weight: 400;
  font-family: 'ThaiSans All';
}
.dx-full .dx-bar-error {
  position: relative;
  width: 100%;
  height: 48px;
  background-color: #d0021b;
  margin-top: 40px;
}
.dx-full .dx-bar-error .menu {
  margin-left: auto;
  margin-right: auto;
  width: auto;
  height: 100%;
  text-align: center;
  color: white;
  line-height: 48px;
  font-size: 24px;
  font-weight: 400;
  font-family: 'ThaiSans All';
}
.dx-full .dx-bar-cart {
  position: relative;
  width: 100%;
  height: 48px;
  background-color: #303030;
}
.dx-full .dx-bar-cart .menu {
  margin-left: auto;
  margin-right: auto;
  width: auto;
  height: 100%;
  text-align: center;
  line-height: 48px;
  font-size: 24px;
  font-weight: 400;
  color: #ff5000;
  font-family: "ThaiSans All";
}
.dx-full .dx-bar-store {
  position: relative;
  width: 100%;
  height: 48px;
  background-color: #212121;
  border-bottom: 1px solid #ff5000;
}
.dx-full .dx-bar-store .menu {
  margin-left: auto;
  margin-right: auto;
  width: auto;
  height: 100%;
  text-align: center;
  color: #ff9500;
  font-family: Lato;
  font-size: 24px;
  font-weight: 700;
  line-height: 36.4px;
}
.dx-full .dx-bar-addon {
  position: relative;
  width: 100%;
  height: 48px;
  background-color: #303030;
}
.dx-full .dx-bar-addon .menu {
  margin-left: auto;
  margin-right: auto;
  width: auto;
  height: 100%;
  text-align: center;
  color: #ff5000;
  font-family: "ThaiSans All";
  font-size: 24px;
  font-weight: 400;
  line-height: 47px;
}
.dx-full .dx-middle {
  width: 980px;
  height: auto;
  margin-left: auto;
  margin-right: auto;
}
.all-center-container {
  width: 100%;
  height: auto;
  text-align: center;
  color: rgba(255, 255, 255, 0.54);
}
.all-center-container .lbl-head-en {
  height: 39px;
  color: #ff5000;
  font-family: Lato;
  font-size: 24px;
  font-weight: 700;
  line-height: 38.4px;
  clear: both;
}
.all-center-container .lbl-head-en-green {
  height: 39px;
  color: #009933;
  font-family: Lato;
  font-size: 24px;
  font-weight: 700;
  line-height: 38.4px;
  clear: both;
}
.all-center-container .lbl-head-th {
  height: 45px;
  color: rgba(255, 255, 255, 0.54);
  font-family: "ThaiSans All";
  font-size: 28px;
  font-weight: 700;
  line-height: 44.8px;
  clear: both;
}
.all-center-container .lbl-big-orange {
  height: 116px;
  color: #ff5000;
  font-family: Lato;
  font-size: 72px;
  font-weight: 700;
  line-height: 115.2px;
  clear: both;
}
.all-center-container .lbl-desc-en {
  color: rgba(255, 255, 255, 0.54);
  font-family: Lato;
  font-size: 18px;
  font-weight: 300;
  line-height: 28.8px;
  clear: both;
}
.all-center-container .lbl-desc-th {
  height: 39px;
  color: rgba(255, 255, 255, 0.54);
  font-family: "ThaiSans All";
  font-size: 24px;
  font-weight: 300;
  line-height: 38.4px;
  clear: both;
}
.all-center-container .input-container {
  clear: both;
  position: relative;
  width: 100%;
  height: auto;
}
.all-center-container .input-container .header {
  width: 100%;
  height: 39px;
  color: white;
  font-family: Lato;
  font-size: 24px;
  font-weight: 300;
  line-height: 38.4px;
}
.all-center-container .input-container .input-form {
  position: relative;
  width: 100%;
  height: auto;
  padding-bottom: 0px;
  border-bottom: 1px solid #ff5000;
}
.all-center-container .input-container .input-form .orange-inp {
  width: 100%;
  height: 77px;
  color: #ff5000;
  font-family: Lato;
  font-size: 48px;
  font-weight: 300;
  line-height: 76.8px;
  outline: 0;
  background-color: transparent;
  border: 0px;
  text-align: center;
}
.all-center-container .input-container .helper-text {
  width: 100%;
  margin-top: 5px;
  height: 39px;
  color: rgba(255, 255, 255, 0.54);
  font-family: "ThaiSans All";
  font-size: 24px;
  font-weight: 400;
  line-height: 38.4px;
}
.all-center-container .btn-container .btn-prev,
.all-center-container .btn-container .btn-next {
  cursor: pointer;
  display: inline-block;
  padding: 0px 25px;
}
.all-center-container .btn-container .btn-prev svg,
.all-center-container .btn-container .btn-next svg {
  fill: rgba(255, 255, 255, 0.3);
}
.all-center-container .btn-container .active svg {
  fill: rgba(255, 255, 255, 0.54);
}
.all-center-container .btn-container .active:active svg {
  fill: #ff5000 !important;
}
.all-center-container .next-container {
  position: relative;
  float: left;
  width: 100%;
  height: auto;
  margin-top: 48px;
  margin-bottom: 150px;
}
.all-center-container .next-container .btn-prev,
.all-center-container .next-container .btn-next {
  cursor: pointer;
  display: inline-block;
  padding: 0px 25px;
}
.all-center-container .next-container .btn-prev svg,
.all-center-container .next-container .btn-next svg {
  fill: rgba(255, 255, 255, 0.3);
}
.all-center-container .next-container .active svg {
  fill: rgba(255, 255, 255, 0.54);
}
.all-center-container .next-container .active:active svg {
  fill: #ff5000 !important;
}
.all-center-container .btn-rounded button {
  width: 141px;
  height: 40px;
  border: 1px solid #979797;
  border-radius: 40px;
  background-color: transparent;
  color: white;
  font-family: Lato;
  font-size: 14px;
  font-weight: 400;
  line-height: 17px;
}
.padding12 {
  position: relative;
  float: left;
  width: 100%;
  height: auto;
  margin-top: 12px;
}
.padding32 {
  position: relative;
  float: left;
  width: 100%;
  height: auto;
  margin-top: 32px;
}
.padding41 {
  position: relative;
  float: left;
  width: 100%;
  height: auto;
  margin-top: 41px;
}
.padding49 {
  position: relative;
  float: left;
  width: 100%;
  height: auto;
  margin-top: 49px;
}
.padding24 {
  position: relative;
  float: left;
  width: 100%;
  height: auto;
  margin-top: 24px;
}
.padding27 {
  position: relative;
  float: left;
  width: 100%;
  height: auto;
  margin-top: 27px;
}
.padding33 {
  position: relative;
  float: left;
  width: 100%;
  height: auto;
  margin-top: 33px;
}
.padding89 {
  position: relative;
  float: left;
  width: 100%;
  height: auto;
  margin-top: 89px;
}
.padding10 {
  position: relative;
  float: left;
  width: 100%;
  height: auto;
  margin-top: 10px;
}
.paddingLeft42 {
  position: relative;
  width: 42px;
  height: auto;
  display: inline-block;
}
.fill-container {
  float: left;
  position: relative;
  width: 100%;
  height: auto;
  text-align: center;
}
.fill-container .middle {
  width: 136px;
  height: 136px;
  background-color: #303030;
  border-radius: 50%;
  color: #ff5000;
  margin-right: auto;
  margin-left: auto;
  cursor: pointer;
}
.fill-container .middle .txt {
  width: 100%;
  color: #ff5000;
  font-family: Lato;
  font-size: 64px;
  font-weight: 400;
  line-height: 136px;
  text-align: center;
}
.fill-container .middle img,
.fill-container .middle svg {
  width: 136px;
  height: 136px;
}
.fill-container .dx-tet {
  clear: left;
  width: 100%;
  height: auto;
  color: #ff5000;
}
.fill-container .text-msc {
  color: #e64900;
  font-family: Lato;
  font-size: 36px;
  font-weight: 700;
  line-height: 44px;
}
.fill-container .orange {
  font-family: Lato;
  color: #ff5000;
  font-size: 24px;
  font-weight: 700;
  line-height: 38.4px;
}
.fill-container .white {
  color: rgba(255, 255, 255, 0.54);
  font-size: 24px;
  font-weight: 400;
  line-height: 32px;
}
.fill-container .yellow {
  color: #ffe620;
  font-size: 24px;
  font-weight: 400;
  line-height: 32px;
}
.fill-container .change-view-container {
  position: relative;
  width: 480px;
  height: auto;
  margin-left: 238px;
  display: flex;
}
.fill-container .change-view-container .current-plan {
  position: relative;
  float: left;
  width: auto;
}
.fill-container .change-view-container .current-plan .items-center {
  position: relative;
  width: 144px;
  height: 160px;
  border: 1px solid #303030;
  border-radius: 40px;
  text-align: center !important;
  margin: 0 auto !important;
}
.fill-container .change-view-container .current-plan .planPink:hover {
  border: 1px solid #fa114f !important;
}
.fill-container .change-view-container .current-plan .planGreen:hover {
  border: 1px solid #04de71 !important;
}
.fill-container .change-view-container .current-plan .planPurple:hover {
  border: 1px solid #787aff !important;
}
.fill-container .change-view-container .current-plan .customPlan:hover {
  border: 1px solid #fff !important;
}
.fill-container .change-view-container .current-plan .items-active {
  background-color: #ff9500;
  color: white;
}
.fill-container .change-view-container .current-plan .items-active .head,
.fill-container .change-view-container .current-plan .items-active span,
.fill-container .change-view-container .current-plan .items-active .price,
.fill-container .change-view-container .current-plan .items-active .currency {
  color: white !important;
}
.fill-container .change-view-container .current-plan .items {
  float: left;
  position: relative;
  width: 144px;
  height: 160px;
  border: 1px solid #303030;
  border-radius: 40px;
  margin-left: 10px;
  margin-bottom: 15px;
  margin-right: 10px;
  cursor: pointer;
}
.fill-container .change-view-container .current-plan .items .custom-pick {
  margin-top: 45px;
  margin-bottom: 15px;
}
.fill-container .change-view-container .current-plan .items .free {
  color: rgba(255, 255, 255, 0.54);
}
.fill-container .change-view-container .current-plan .items .pink {
  color: #fa114f;
}
.fill-container .change-view-container .current-plan .items .green {
  color: #04de71;
}
.fill-container .change-view-container .current-plan .items .purple {
  color: #787aff;
}
.fill-container .change-view-container .current-plan .items .yellow {
  color: #ff9500;
  font-family: Lato;
  font-size: 20px;
  font-weight: 900 !important;
  line-height: 24px;
}
.fill-container .change-view-container .current-plan .items .yellow2 {
  color: #ff5000;
  font-family: Lato;
  font-size: 48px;
  font-weight: 400;
  line-height: 57px;
}
.fill-container .change-view-container .current-plan .items .head {
  margin-top: 17px;
  width: 100%;
  height: 24px;
  color: #fa114f;
  font-family: Lato;
  font-size: 20px;
  line-height: 20px;
  text-align: center;
}
.fill-container .change-view-container .current-plan .items .head span {
  font-weight: 300;
}
.fill-container .change-view-container .current-plan .items .head span.bold {
  font-weight: 900 !important;
  clear: both;
  width: 100%;
  display: block;
  margin-top: 5px;
  text-transform: capitalize;
}
.fill-container .change-view-container .current-plan .items .price {
  font-family: Lato;
  font-size: 48px;
  font-weight: 400;
  line-height: 57px;
  margin-top: 20px;
  text-align: center;
}
.fill-container .change-view-container .current-plan .items .currency {
  color: #f2f4ff;
  font-family: Lato;
  font-size: 14px;
  font-weight: 400;
  line-height: 17px;
}
.fill-container .change-view-container .then-arrow {
  cursor: pointer;
}
.fill-container .change-view-container .then-arrow .up {
  float: left;
  margin-left: 44px;
  margin-right: 40px;
  margin-top: 65px;
}
.fill-container .change-view-container .then-arrow .down {
  float: left;
  margin-left: 44px;
  margin-right: 40px;
  margin-top: 65px;
}
.fill-container .change-view-container .then-arrow .down svg {
  transform: rotate(180deg);
}
.fill-container .change-view-container .then-arrow .firm {
  float: left;
  margin-left: 44px;
  margin-right: 40px;
  margin-top: 50px;
}
.fill-container .change-view-container .activeNext svg {
  fill: #fff !important;
}
.fill-container .change-view-container .activeNext:hover svg {
  fill: #ff9500 !important;
  opacity: 1 !important;
}
.fill-container .change-view-container .activeNext:active svg {
  fill: #ff5000 !important;
  opacity: 1 !important;
}
.fill-container .change-view-container .activeNext svg {
  fill: #fff !important;
  opacity: .5 !important;
}
.fill-container .change-view-container .new-plan {
  position: relative;
  float: left;
  width: auto;
}
.fill-container .change-view-container .new-plan .items-center {
  position: relative;
  width: 144px;
  height: 160px;
  border: 1px solid #303030;
  border-radius: 40px;
  text-align: center !important;
  margin: 0 auto !important;
}
.fill-container .change-view-container .new-plan .planPink:hover {
  border: 1px solid #fa114f !important;
}
.fill-container .change-view-container .new-plan .planGreen:hover {
  border: 1px solid #04de71 !important;
}
.fill-container .change-view-container .new-plan .planPurple:hover {
  border: 1px solid #787aff !important;
}
.fill-container .change-view-container .new-plan .customPlan:hover {
  border: 1px solid #fff !important;
}
.fill-container .change-view-container .new-plan .items-active {
  background-color: #ff9500;
  color: white;
}
.fill-container .change-view-container .new-plan .items-active .head,
.fill-container .change-view-container .new-plan .items-active span,
.fill-container .change-view-container .new-plan .items-active .price,
.fill-container .change-view-container .new-plan .items-active .currency {
  color: white !important;
}
.fill-container .change-view-container .new-plan .items {
  float: left;
  position: relative;
  width: 144px;
  height: 160px;
  border: 1px solid #303030;
  border-radius: 40px;
  margin-left: 10px;
  margin-bottom: 15px;
  margin-right: 10px;
  cursor: pointer;
}
.fill-container .change-view-container .new-plan .items .custom-pick {
  margin-top: 55px;
  margin-bottom: 15px;
}
.fill-container .change-view-container .new-plan .items .yellow {
  color: #ff9500;
  font-weight: 900 !important;
}
.fill-container .change-view-container .new-plan .items .free {
  color: rgba(255, 255, 255, 0.54);
}
.fill-container .change-view-container .new-plan .items .pink {
  color: #fa114f;
}
.fill-container .change-view-container .new-plan .items .green {
  color: #04de71;
}
.fill-container .change-view-container .new-plan .items .purple {
  color: #787aff;
}
.fill-container .change-view-container .new-plan .items .head {
  margin-top: 17px;
  width: 100%;
  height: 24px;
  color: #fa114f;
  font-family: Lato;
  font-size: 20px;
  line-height: 20px;
  text-align: center;
}
.fill-container .change-view-container .new-plan .items .head span {
  font-weight: 300;
}
.fill-container .change-view-container .new-plan .items .head span.bold {
  font-weight: 900 !important;
  clear: both;
  width: 100%;
  display: block;
  margin-top: 5px;
  text-transform: capitalize;
}
.fill-container .change-view-container .new-plan .items .price {
  font-family: Lato;
  font-size: 48px;
  font-weight: 400;
  line-height: 57px;
  margin-top: 20px;
  text-align: center;
}
.fill-container .change-view-container .new-plan .items .currency {
  color: #f2f4ff;
  font-family: Lato;
  font-size: 14px;
  font-weight: 400;
  line-height: 17px;
}
.box-3-container {
  float: left;
  height: auto;
  width: 100%;
  overflow: hidden;
}
.box-3-container .box-each-re {
  float: left;
}
.box-3-container .box-each {
  float: left;
  height: 334px;
  margin-bottom: 31px;
  margin-right: 21px;
  width: 305px;
  position: relative;
  border: 1px solid #303030;
  border-radius: 40px;
  text-align: center;
}
.box-3-container .box-each:hover .in-over {
  z-index: 1;
  display: block;
}
.box-3-container .box-each .in-container {
  width: 100%;
  height: auto;
  margin-left: auto;
  margin-right: auto;
  position: relative;
  font-size: 20px;
  font-weight: 400;
  color: white;
}
.box-3-container .box-each .in-container .circle {
  width: 100px;
  height: 100px;
  margin: 0 auto;
  border: 1px solid #ff5000;
  border-radius: 50%;
  margin-top: 25px;
  margin-bottom: 17px;
}
.box-3-container .box-each .in-container .circle span {
  color: #ff5000;
  font-family: Lato;
  font-size: 36px;
  font-weight: 400;
  line-height: 100px;
}
.box-3-container .box-each .in-container .circle svg.monotone {
  opacity: 0.1;
  height: 100px;
}
.box-3-container .box-each .in-container .circle .display-img-profile {
  width: 100px;
  height: 100px;
  border-radius: 50%;
  position: absolute;
  top: 0px;
  margin-left: -50px;
  border: 1px solid #222222;
}
.box-3-container .box-each .in-container .mono-border {
  border: 1px solid #303030;
}
.box-3-container .box-each .in-container .marble-container {
  width: 217px;
  height: auto;
  overflow: hidden;
  margin-left: 57px;
}
.box-3-container .box-each .in-container .marble-container .marble-item {
  float: left;
  width: 48px;
  height: 48px;
  margin-top: 24px;
  margin-right: 24px;
  background-color: #303030;
  border-radius: 50%;
}
.box-3-container .box-each .in-over {
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: rgba(48, 48, 48, 0.9);
  top: 0px;
  border-radius: 40px;
  cursor: pointer;
  z-index: -1;
  display: none;
}
.box-3-container .box-each .in-over:active .over-icon svg {
  fill: #ff9500;
}
.box-3-container .box-each .in-over:active .over-text {
  color: #ff9500;
}
.box-3-container .box-each .in-over .over-icon {
  width: 100%;
  text-align: center;
  margin-left: auto;
  margin-right: auto;
  margin-top: 40%;
}
.box-3-container .box-each .in-over .over-icon svg {
  fill: #fffffe;
}
.box-3-container .box-each .in-over .over-text {
  width: 100%;
  text-align: center;
  color: white;
  font-family: Lato;
  font-size: 20px;
  font-weight: 400;
  line-height: 24px;
  margin-top: 16px;
}
.box-3-container .box-each-info {
  float: left;
  width: 305px;
  clear: left;
  height: 240px;
  max-height: 240px;
  overflow: hidden;
  margin-bottom: 20px;
}
.box-3-container .box-each-info .box-marble {
  float: left;
  width: 100%;
  height: auto;
  margin-bottom: 20px;
}
.box-3-container .box-each-info .box-marble .marble-rounded {
  width: 144px;
  height: 160px;
  border: 1px solid #303030;
  border-radius: 40px;
  float: left;
}
.box-3-container .box-each-info .box-marble .marble-rounded:first-child {
  margin-right: 17px;
}
.box-3-container .box-each-info .box-marble .marble-rounded .line-name {
  color: rgba(255, 255, 255, 0.52);
  font-family: Lato;
  font-size: 20px;
  font-weight: 300;
  line-height: 24px;
  margin-top: 10px;
  text-transform: capitalize;
}
.box-3-container .box-each-info .box-marble .marble-rounded .line-number {
  height: 57px;
  color: rgba(255, 255, 255, 0.52);
  font-family: Lato;
  font-size: 48px;
  font-weight: 400;
  line-height: 57px;
  margin-top: 5px;
}
.box-3-container .box-each-info .box-marble .marble-rounded .line-number-txt {
  color: rgba(255, 255, 255, 0.52);
  font-family: Lato;
  font-size: 14px;
  font-weight: 400;
  line-height: 17px;
  margin-top: 5px;
}
.box-3-container .box-each-info .box-marble .marble-rounded .line-button {
  height: 17px;
  color: rgba(255, 255, 255, 0.52);
  font-family: Lato;
  font-size: 14px;
  font-weight: 400;
  line-height: 17px;
  margin-top: 3px;
}
.box-3-container .box-each-info .box-marble .marble-rounded .red-txt {
  color: #d0021b;
  margin-top: 5px;
}
.box-3-container .box-each-info .box-marble .marble-rounded .txt-small {
  color: rgba(255, 255, 255, 0.52);
  font-family: Lato;
  font-size: 16px;
  font-weight: 400;
  line-height: 17px;
  margin-top: 20px;
}
.box-3-container .box-each-info .box-marble .marble-rounded .red-color {
  color: #d0021b;
}
.box-3-container .box-each-info .box-info {
  float: left;
  width: 100%;
  height: auto;
  margin-bottom: 20px;
}
.box-3-container .box-each-info .box-info button.btn-dash-info {
  width: 141px;
  height: 40px;
  border: 1px solid #979797;
  background-color: transparent;
  border-radius: 40px;
  text-align: center;
  color: white;
  font-family: Lato;
  font-size: 14px;
  font-weight: 400;
  line-height: 21px;
}
.squard-one {
  width: 256px;
  height: 304px;
  border: 1px solid #303030;
  border-radius: 40px;
  margin-right: auto;
  margin-left: auto;
}
.squard-one .sq-container {
  width: 100%;
  text-align: center;
  height: auto;
}
.squard-one .sq-container .circle {
  width: 104px;
  height: 104px;
  background-color: #ff9500;
  border-radius: 50%;
  margin-top: 64px;
  margin-bottom: 16px;
  margin-left: auto;
  margin-right: auto;
}
.squard-one .sq-container .circle svg {
  margin-top: 21px;
}
.squard-one .txt-container {
  width: 100%;
  text-align: center;
  height: auto;
  margin-top: 16px;
}
.squard-one .txt-container span {
  color: white;
  margin-top: 16px;
  font-size: 20px;
  font-weight: 400;
  line-height: 24px;
}
.squard-one .txt-container .upgrade {
  color: #ff9500;
  font-family: Lato;
  font-size: 20px;
  font-weight: 400;
  line-height: 24px;
}
.desc-sub {
  color: rgba(255, 255, 255, 0.54);
  font-family: "ThaiSans All";
  font-size: 24px;
  font-weight: 300;
  line-height: 38.4px;
}
.box-6-container {
  width: 990px;
  height: auto;
  float: left;
  position: relative;
  overflow: hidden;
}
.box-6-container .items {
  width: 141px;
  height: 40px;
  margin-right: 22px;
  margin-bottom: 16px;
  float: left;
  position: relative;
  color: white;
  font-size: 16px;
  font-weight: 400;
  line-height: 40px;
  text-align: center;
  border: 1px solid #979797;
  border-radius: 40px;
  cursor: pointer;
}
.box-6-container .items:hover {
  background-color: #ff5000;
  border: 1px solid #ff5000;
}
.box-6-container .items-popular {
  border: 2px solid #ff5000;
}
.box-6-container .items-selected {
  background-color: #ff5000 !important;
  border: 1px solid #ff5000 !important;
}
.function-one {
  position: relative;
  width: 100%;
  height: auto;
  margin-bottom: 24px;
  clear: both;
  margin-left: auto;
  margin-right: auto;
}
.function-one .circle {
  width: 80px;
  height: 80px;
  background-color: #303030;
  border-radius: 50%;
  margin-left: auto;
  margin-right: auto;
}
.function-one .name-en {
  height: 22px;
  color: #ff9500;
  font-family: Lato;
  font-size: 18px;
  font-weight: 700;
  line-height: 22px;
  margin-left: auto;
  margin-right: auto;
  margin-top: 17px;
}
.function-one .name-th {
  color: rgba(255, 255, 255, 0.54);
  font-family: "ThaiSans All";
  font-size: 22px;
  font-weight: 300;
  line-height: 29px;
}
.checkPick {
  position: relative;
  width: 100%;
  height: auto;
  margin: 0 auto;
}
.checkPick svg {
  fill: rgba(255, 255, 254, 0.51);
  cursor: pointer;
}
.checkPick svg:hover {
  fill: #ff9500;
}
.checkPick svg:active {
  fill: #ff5000;
}
.divine-full {
  clear: both;
  width: 100%;
  border-bottom: 1px solid #ff5000;
  position: relative;
  display: flex;
  margin-top: 25px;
  float: left;
}
.normal-en {
  height: 39px;
  color: #ff5000;
  font-family: Lato;
  font-size: 24px;
  font-weight: 700;
  line-height: 38.4px;
  margin: 0 auto;
  position: relative;
  clear: both;
  width: 100%;
}
.normal-en-yellow {
  height: 29px;
  color: #ffe620;
  font-family: Lato;
  font-size: 24px;
  font-weight: 700;
  line-height: 36px;
  margin: 0 auto;
  position: relative;
  clear: both;
  width: 100%;
}
.normal-th {
  height: 32px;
  color: rgba(255, 255, 255, 0.54);
  font-family: "ThaiSans All";
  font-size: 24px;
  font-weight: 400;
  line-height: 32px;
  position: relative;
  clear: both;
  width: 100%;
}
.big-en-green {
  height: 57px;
  color: #7ed321;
  font-family: Lato;
  font-size: 48px;
  font-weight: 400;
  line-height: 57px;
  position: relative;
  clear: both;
  width: 100%;
}
.box-3-container-mini {
  width: 820px;
  height: auto;
  position: relative;
  margin: 0 auto;
  overflow: hidden;
  display: flex;
}
.box-3-container-mini .items-center {
  float: none !important;
  position: relative;
  width: 144px;
  height: 160px;
  border: 1px solid #303030;
  border-radius: 40px;
  text-align: center !important;
  margin: 0 auto !important;
}
.box-3-container-mini .planPink:hover {
  border: 1px solid #fa114f !important;
}
.box-3-container-mini .planGreen:hover {
  border: 1px solid #04de71 !important;
}
.box-3-container-mini .planPurple:hover {
  border: 1px solid #787aff !important;
}
.box-3-container-mini .customPlan:hover {
  border: 1px solid #fff !important;
}
.box-3-container-mini .items-active {
  background-color: #ff9500;
  color: white;
}
.box-3-container-mini .items-active .head,
.box-3-container-mini .items-active span,
.box-3-container-mini .items-active .price,
.box-3-container-mini .items-active .currency {
  color: white !important;
}
.box-3-container-mini .block-eco:hover {
  border: 1px solid #ff114f;
}
.box-3-container-mini .block-eco .head {
  color: #ff114f !important;
}
.box-3-container-mini .block-eco .head span {
  color: #ff114f;
}
.box-3-container-mini .block-eco .price {
  color: #ff114f !important;
}
.box-3-container-mini .block-eco-p:hover {
  border: 1px solid #ff9500;
}
.box-3-container-mini .block-eco-p .head {
  color: #ff9500 !important;
}
.box-3-container-mini .block-eco-p .head span {
  color: #ff9500;
}
.box-3-container-mini .block-eco-p .price {
  color: #ff9500 !important;
}
.box-3-container-mini .block-business:hover {
  border: 1px solid #7ed321;
}
.box-3-container-mini .block-business .head {
  color: #7ed321 !important;
}
.box-3-container-mini .block-business .head span {
  color: #7ed321;
}
.box-3-container-mini .block-business .price {
  color: #7ed321 !important;
}
.box-3-container-mini .block-first:hover {
  border: 1px solid #2094fa;
}
.box-3-container-mini .block-first .head {
  color: #2094fa !important;
}
.box-3-container-mini .block-first .head span {
  color: #2094fa;
}
.box-3-container-mini .block-first .price {
  color: #2094fa !important;
}
.box-3-container-mini .block-eco.items-active {
  background-color: #ff114f !important;
}
.box-3-container-mini .block-eco.items-active .head,
.box-3-container-mini .block-eco.items-active .price {
  color: white !important;
}
.box-3-container-mini .block-eco-p.items-active {
  background-color: #ff9500 !important;
}
.box-3-container-mini .block-eco-p.items-active .head,
.box-3-container-mini .block-eco-p.items-active .price {
  color: white !important;
}
.box-3-container-mini .block-business.items-active {
  background-color: #7ed321 !important;
}
.box-3-container-mini .block-business.items-active .head,
.box-3-container-mini .block-business.items-active .price {
  color: white !important;
}
.box-3-container-mini .block-first.items-active {
  background-color: #2094fa !important;
}
.box-3-container-mini .block-first.items-active .head,
.box-3-container-mini .block-first.items-active .price {
  color: white !important;
}
.box-3-container-mini .items {
  position: relative;
  width: 144px;
  height: 160px;
  border: 1px solid #303030;
  border-radius: 40px;
  margin-left: 10px;
  margin-bottom: 15px;
  margin-right: 10px;
  cursor: pointer;
  display: inline-block;
  margin: 0 auto;
}
.box-3-container-mini .items .custom-pick {
  margin-top: 55px;
  margin-bottom: 15px;
}
.box-3-container-mini .items .free {
  color: rgba(255, 255, 255, 0.54);
}
.box-3-container-mini .items .pink {
  color: #fa114f;
}
.box-3-container-mini .items .green {
  color: #04de71;
}
.box-3-container-mini .items .purple {
  color: #787aff;
}
.box-3-container-mini .items .yellow {
  color: #ff9500;
  font-family: Lato;
  font-size: 20px;
  font-weight: 900 !important;
  line-height: 24px;
}
.box-3-container-mini .items .yellow2 {
  color: #ff5000;
  font-family: Lato;
  font-size: 48px;
  font-weight: 400;
  line-height: 57px;
}
.box-3-container-mini .items .head {
  margin-top: 16px;
  width: 100%;
  height: 24px;
  color: #fff;
  font-family: Lato;
  font-size: 20px;
  line-height: 20px;
  text-align: center;
}
.box-3-container-mini .items .head span {
  font-weight: 300;
}
.box-3-container-mini .items .head span.bold {
  font-weight: 900 !important;
  clear: both;
  width: 100%;
  display: block;
  margin-top: 5px;
  text-transform: capitalize;
}
.box-3-container-mini .items .price {
  font-family: Lato;
  font-size: 48px;
  font-weight: 400;
  line-height: 57px;
  margin-top: 23px;
  text-align: center;
}
.box-3-container-mini .items .currency {
  color: #f2f4ff;
  font-family: Lato;
  font-size: 14px;
  font-weight: 400;
  line-height: 17px;
  margin-top: 3px;
}
.box-5-container-mini {
  width: 841px;
  height: auto;
  position: relative;
  margin: 0 auto;
  overflow: hidden;
  clear: both;
  margin-left: 82px;
}
.box-5-container-mini .items {
  width: 120px;
  height: auto;
  float: left;
  margin-right: 48px;
  margin-bottom: 48px;
  cursor: pointer;
}
.box-5-container-mini .items .circle {
  width: 72px;
  height: 72px;
  border-radius: 50%;
  margin-left: auto;
  margin-right: auto;
  background-color: #333333;
}
.box-5-container-mini .items .circle:hover {
  background-color: #ff5000;
}
.box-5-container-mini .items .circle:hover .normal {
  display: none;
}
.box-5-container-mini .items .circle:hover .hover {
  display: block;
}
.box-5-container-mini .items .circle img {
  width: 72px;
  height: 72px;
}
.box-5-container-mini .items .circle .hover {
  display: none;
}
.box-5-container-mini .items .circle .txt {
  width: 100%;
  height: 19px;
  color: white;
  font-family: Lato;
  font-size: 16px;
  font-weight: 900;
  line-height: 72px;
}
.box-5-container-mini .items .circle .pro {
  color: #04de71;
}
.box-5-container-mini .items .circle .ex {
  color: #2094fa;
}
.box-5-container-mini .items .circle svg {
  margin-top: 17px;
}
.box-5-container-mini .items .feature-name {
  text-align: center;
  color: rgba(255, 255, 255, 0.54);
  font-size: 15px;
  font-weight: 300;
  line-height: 22px;
  margin-top: 16px;
}
.box-5-container-mini .items .feature-name .text-link {
  color: #ffe620;
  font-family: Lato;
  font-size: 14px;
  font-weight: 400;
  line-height: 17px;
  cursor: pointer;
  outline: 0;
}
.box-5-container-mini .items .feature-name .text-link:hover {
  text-decoration: underline;
}
.box-5-container-mini .items:hover .feature-name {
  color: #fff !important;
}
.box-5-container-mini .items:active .feature-name {
  color: #ff5000 !important;
}
.box-5-toleft .items {
  float: left;
  display: block;
}
.box-5-container-feature {
  width: 852px;
  height: auto;
  position: relative;
  margin: 0 auto;
  overflow: hidden;
  clear: both;
  margin-left: 82px;
}
.box-5-container-feature .items {
  width: 120px;
  height: auto;
  display: inline-block;
  margin-right: 48px;
  margin-bottom: 48px;
}
.box-5-container-feature .items .circle {
  width: 72px;
  height: 72px;
  border-radius: 50%;
  margin-left: auto;
  margin-right: auto;
  border: 1px solid #303030;
  cursor: pointer;
}
.box-5-container-feature .items .circle img {
  width: 72px;
  height: 72px;
}
.box-5-container-feature .items .circle .normal {
  display: block;
}
.box-5-container-feature .items .circle .hover {
  display: none;
}
.box-5-container-feature .items .circle .txt {
  width: 100%;
  height: 19px;
  color: white;
  font-family: Lato;
  font-size: 16px;
  font-weight: 900;
  line-height: 72px;
}
.box-5-container-feature .items .circle .pro {
  color: #04de71;
}
.box-5-container-feature .items .circle .ex {
  color: #2094fa;
}
.box-5-container-feature .items .circle-selected {
  border: 4px solid #FFFFFF !important;
}
.box-5-container-feature .items .circle-selected .normal {
  width: 70px !important;
  height: 64px !important;
  margin-left: -3px !important;
}
.box-5-container-feature .items .feature-name {
  text-align: center;
  color: rgba(255, 255, 255, 0.54);
  font-size: 15px;
  font-weight: 300;
  line-height: 22px;
  margin-top: 16px;
  height: 22px;
  overflow: hidden;
}
.showpassword-btn {
  position: relative;
  margin-top: 7px;
  margin-bottom: 5px;
  background-color: transparent;
  border: 1px solid #ff5000;
  color: #ff5000;
  border-radius: 7px;
  font-size: 16px;
  outline: 0;
}
.showpassword-btn:hover {
  background-color: #ff5000;
  color: white;
}
.showpassword-btn-lock {
  position: relative;
  margin-top: 7px;
  margin-bottom: 5px;
  background-color: transparent;
  border: 1px solid #ff5000;
  color: #ff5000;
  border-radius: 7px;
  font-size: 16px;
  outline: 0;
}
.showpassword-btn-lock:hover {
  background-color: #ff5000;
  color: white;
}
.showpassword-btn-lock:focus {
  outline: none;
}
.checktrue-icon svg {
  background-color: #093;
  border-radius: 50%;
}
.checktrue-txt {
  color: #093 !important;
  font-family: Lato;
  font-size: 24px;
  font-weight: 700;
  line-height: 38.4px;
  margin-top: 18px;
  font-weight: normal;
}
.checktrue-txt2 {
  color: rgba(255, 255, 255, 0.54);
  font-family: Lato;
  font-size: 18px;
  font-weight: 300;
  line-height: 28.8px;
}
.checktrue-txt3 {
  color: rgba(255, 255, 255, 0.54);
  font-family: "ThaiSans All";
  font-size: 24px;
  font-weight: 300;
  line-height: 38.4px;
}
.y-link {
  cursor: pointer;
  color: #ff9500;
  text-decoration: underline;
}
.p-descripCustom {
  color: rgba(255, 255, 255, 0.54);
  font-family: "ThaiSans All";
  font-size: 20px;
  font-weight: 300;
  line-height: 32px;
  margin-top: 104px;
}
.feature-repeat-container {
  float: left;
  width: 100%;
  height: auto;
  border-bottom: 1px solid #303030;
}
.feature-repeat-container .center-detail {
  width: 900px;
  height: auto;
  margin-left: auto;
  margin-right: auto;
  display: flex;
  padding-top: 24px;
}
.feature-repeat-container .center-detail .items-1 {
  float: left;
  width: 200px;
}
.feature-repeat-container .center-detail .items-2 {
  float: left;
  width: 670px;
}
.feature-repeat-container .center-detail .items-2 .apps-rows {
  float: left;
  position: relative;
  display: block;
  width: 100%;
  height: auto;
  padding-bottom: 24px;
}
.feature-repeat-container .center-detail .items-2 .apps-rows .circle-display img {
  max-width: 72px;
  max-height: 72px;
  width: 72px;
  height: 72px;
  border-radius: 50%;
}
.feature-repeat-container .center-detail .items-2 .inside-1 {
  float: left;
  position: relative;
  width: 180px;
}
.feature-repeat-container .center-detail .items-2 .inside-2 {
  float: left;
  position: relative;
  width: 150px;
  margin-left: 30px;
  text-align: center;
}
.feature-repeat-container .center-detail .items-2 .inside-2 .price-lbl-1 {
  color: rgba(255, 255, 255, 0.54);
  font-family: "ThaiSans All";
  font-size: 24px;
  font-weight: 300;
  clear: both;
  text-align: center;
}
.feature-repeat-container .center-detail .items-2 .inside-2 .price-lbl-2 {
  color: #04de71;
  font-family: Lato;
  font-size: 24px;
  font-weight: 400;
  text-align: center;
  padding-top: 10px;
}
.feature-repeat-container .center-detail .items-2 .inside-2 .price-lbl-3 {
  color: #f2f4ff;
  font-family: Lato;
  font-size: 14px;
  font-weight: 400;
  line-height: 17px;
  text-align: center;
  margin-top: 10px;
}
.feature-repeat-container .center-detail .items-2 .inside-3 {
  float: left;
  position: relative;
  width: 238px;
  margin-left: 70px;
  text-align: left;
}
.feature-repeat-container .center-detail .items-2 .inside-3 .inside-rows {
  float: left;
  position: relative;
  width: 100%;
  height: auto;
  margin-bottom: 13px;
  cursor: pointer;
}
.feature-repeat-container .center-detail .items-2 .inside-3 .inside-rows:hover .svg-1 {
  display: none;
}
.feature-repeat-container .center-detail .items-2 .inside-3 .inside-rows:hover .svg-2 {
  display: block;
}
.feature-repeat-container .center-detail .items-2 .inside-3 .inside-rows .svg-1 {
  display: block;
}
.feature-repeat-container .center-detail .items-2 .inside-3 .inside-rows .svg-2 {
  display: none;
}
.feature-repeat-container .center-detail .items-2 .inside-3 .inside-rows .pick-store {
  width: 36px;
  height: 36px;
  background-color: #303030;
  border-radius: 50%;
  float: left;
}
.feature-repeat-container .center-detail .items-2 .inside-3 .inside-rows .pick-selected {
  /* background-color: rgb(255, 149, 0) !important;*/
  width: 36px;
  height: 36px;
  background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAkCAYAAADhAJiYAAAD7ElEQVRYR82Yf0zUZRzHX9/nDlLCpSv1YsXWD2NRxB3naOPHLAqnaTVyedqCMts0k2xzY2tuhq2V/Vo4mwzbsHAzkoKZmnMkWglbJiqzJG655s86ScWAILh7vu354p1y/Ljv94Ttvn/d9/t83u/ndc+vz/M8GlafTWlTIG4eaPloJCNIQsokw0aI80jOo3Ma9Hro382K45etVKGZDv4kvYA4ezGSXAR2UzqJH8GP9Ps3srKlzowmMtBGZzbx2vsgsswYjhwjm+jTSyg+1jiaz8hAz2IjL+MjhLbqxkDC1FLfQMOR1dQQGM53eKBS52Sm27YjyB9TmKCZpB5fYCGlxzrC/YcCKZjbtSYQ948LTMhUtvKnnhUONRjI6Cb3nnFrmfB/qFqqoXnu9d03GKg8o2zMx0ykZlZj6pUjrwfDrgEZs8l2MJJ+XMr7AjnB2XcNqMLVeONTO1pc2cSyo9lKPQA0sOjVRms3ku6BKXdTN/tDvjt3iBUH149u3+9/Ri2eA0AV7gbg0bEG+uGpT8l1uPjl0u+kfbUokv1+ljXnaajcpMVfMJ0OItleLffck0/1Y+8ab0sOlPKZd9foSpVm9L5pGuXphQh7lcl6TIVNtN3Eb56vSU50cLj9BJl1RehmlNJfpFHhqgJRaCbebMzajJdZN3O5EZ6zYymNvhaTUrlVo9y9H8EjJhURw+64eRptnloS7BOoPrmXxfvWRNSEAiQHNCrcbcB95lWjR27Le5vF986hx99LypcLONPts2Lt1Sh3dSJEohXVSLFZ0x+i8elKo3hd82ZKmzdbs5WyS7XQP8Aka8qh0Wr9OFRQxcypqZzt9hmt86+/16ptp+kum5ecg+vWFMqOb6PL3zOkoiUpT1I5603j+3P71vDFyb1WYVS86jJzg/rc83tISpjKz+2/Mvfb17j435VQhZPiEvB6anEk3EaTr4XsHUujgQFjUG9yf46NokgObzhf5J3MlUZYa8cfzN79Kme7Lxjv7z1cTEn6C+joZNYWcfjv1kh2w5cHqLK0MK56cBEfZ61GQ+N0118GlF8PcGJhDfEiji1t3/DS929FB6NUAb3QcuoonPEElbPWYhd22nsv4+04RbbDSWd/NzOqC/D1XIoOKJQ6lNxicp2fnMP2x9cz0T4hVHnJTxv4oGVrdDADqqvJVf2MYvuR63Cyc04Zt8Qn4r1yirQaD33SHz3QoO2H0UrWN2ipk+9ieeoCtrTt5OhFteBH+4Rv0JRPzG1hFVRMbfIVUMwdgxRUTB0Ug2Mypo7SQaiYumy4fvbGzHVM+JISMxdW4WDGsUnMR4h8pLhz2Cs9Ic8gZT263GX1Su9/l2+Bzmou7eAAAAAASUVORK5CYII=);
}
.feature-repeat-container .center-detail .items-2 .inside-3 .inside-rows .pick-selected:hover {
  background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAkCAYAAADhAJiYAAADeklEQVRYR82YS0hUURjH/9+9Y200S0WkGcUWRUWZiwjSggqEojYGFgWjWUHvDBShFmEFQWKUmQuLyEcPSnoskhZCBZUtWqS9c1OplYVvhRbOvV+cO43M3BnvnLkq3AuzmXu+//nd73yPcw4hxudtYsY8GtM366A8BmcQ83wA4ieen0z0k0BdCriV45WWrOGuwVimINnB71RPvgYcAfNaAC5JOx+InqtAzXKt54GMTVSg966MXB9rlWDkyAhOOobQ5iK1fJmv66WVzqRAXFCgvn3w6jzrXDIlEJMxKVSdlb+6lJqbtUi6EYG+zs2cOzw6fheMvOmEmdAitCYmxG1bMPRtyKwfBiRgRkbG2xhYMiMw/0UJ+DRnTlyOGSoESCxTx/22xzPmmXB3tK7YmrMpePlCgDpcnovTHTPRvCxiaoWv51hg3ASQkU269iKawEy8dynqmkD2TQC1q+6XU05tu7SEtmztR64wN4CMosd830ov5dAuJO3egd9nL2H4XovU1EnF25FWUYaBhmb0nqy0tFGJtoriaQC1q54nYF5vZbH483PMXpgJ6IyuXccweNOSH8n7vfBcPmt88nj3L3zMXGX9EURPs7WeDSR6kz6q/YnWDpL27kR63Tm/qIAqKsHgrcjdIBgGDHTvLcVA/d1oXvUpCWoqtatuLxiN0UaL9ylHdsN98ZR/qKb7PWWCMsP0HDqB/romGXnhzULqUD2NzOyVs7CGSt7nhafWv0zCMzHBiIAmaqJ21fMUzOtkgQxPHS6Gu/p0iKeUhPgpwRhiRM+oQ3F/YWBRLEBhUDoLMdueCSqKnQJolIH4WIHCoMQfNpYpeF4CxgTQCAMJdoBCAvh/oH8vKsHQ7Yd25ETojdpeMnM2+UusP/vsQhHQaSuow1L74HHQ7FkhJcEWlBHUanoDs14o6+NIMP1XbhjmMnXKah4ipTGmwihTZ1KO7oH7QoVl8ZwMSiXyyreO4u1Iv1olldpmqG87Dso0ZH/rELQyzXXp99eI86RJp3Yw1N83H9C5cqN1VASaqxgls/1IO1OOpMIC9FZUYeD6HamQEw05tewA+mquoa+23tImZPvh95KDNmgCyHFbWAHlqE2+0YqcdgwSUI46KAbSwFFH6QCUoy4bgguGY65jzFXMMRdWZjDj2DSmbSHjSg/pka/00M3gViVefRTrld4/L7fnvHJRmPsAAAAASUVORK5CYII=);
}
.feature-repeat-container .center-detail .items-2 .inside-3 .inside-rows .pick-name {
  float: left;
  color: white;
  font-family: Lato;
  font-size: 18px;
  font-weight: 300;
  margin-left: 16px;
  overflow: hidden;
}
.feature-repeat-container .circle-display {
  width: 72px;
  height: 72px;
  border: 1px solid #303030;
  border-radius: 50%;
  margin-left: auto;
  margin-right: auto;
}
.feature-repeat-container .text-display {
  height: 19px;
  color: rgba(255, 255, 255, 0.54);
  font-family: Lato;
  font-size: 16px;
  font-weight: 400;
  line-height: 19px;
  margin-top: 16px;
  text-align: center;
}
.feature-repeat-container .text-link {
  height: 19px;
  color: rgba(255, 255, 255, 0.54);
  font-family: Lato;
  font-size: 14px;
  font-weight: 400;
  line-height: 17px;
  text-align: center;
}
.feature-repeat-container .text-link a {
  cursor: pointer;
  outline: 0;
  color: #ff9500;
  font-family: Lato;
}
.app-more-detail {
  position: relative;
  width: 100%;
  text-align: center;
  margin-top: 20px;
  clear: left;
  display: inline-block;
}
.app-more-detail .items-1 {
  width: 138px;
  clear: left;
  display: block;
  cursor: pointer;
  margin: 0 auto;
}
.app-more-detail .items-1:hover svg:first-child {
  display: none;
}
.app-more-detail .items-1:hover svg:nth-child(2) {
  display: block;
}
.app-more-detail .items-1 svg:first-child {
  display: block;
}
.app-more-detail .items-1 svg:nth-child(2) {
  display: none;
}
.app-more-detail .items-2 {
  width: 141px;
  height: 40px;
  border: 1px solid #979797;
  border-radius: 40px;
  color: white;
  font-family: Lato;
  font-size: 14px;
  font-weight: 400;
  line-height: 35px;
  margin: 0 auto;
  margin-top: 40px;
  position: relative;
  display: inline-block;
  cursor: pointer;
}
.app-more-detail .items-2:hover {
  border: 1px solid #ff5000;
  color: #ff5000;
}
.div-table-compare-plan-list {
  width: 980px;
  margin: auto;
}
.div-table-compare-plan-list .table-compare {
  position: relative;
  margin-left: -65px;
}
.table-compare {
  width: 955px;
  height: auto;
  float: left;
  clear: both;
}
.table-compare tbody tr {
  border-bottom: 1px solid #303030;
}
.table-compare tbody tr td {
  padding-top: 10px;
  padding-bottom: 10px;
}
.table-compare tbody tr td header {
  height: 32px;
  color: #ff5000;
  font-family: Lato;
  font-size: 20px;
  font-weight: 400;
  line-height: 30px;
  width: 100%;
  text-align: center;
}
.table-compare tbody tr td span {
  height: 39px;
  color: rgba(255, 255, 255, 0.54);
  font-family: "ThaiSans All";
  font-size: 24px;
  font-weight: 400;
  line-height: 36px;
  width: 100%;
  text-align: center;
  display: block;
}
.table-compare .bubble {
  width: 164px;
  text-align: center;
  color: rgba(255, 255, 255, 0.54);
  font-family: "ThaiSans All";
  font-size: 24px;
  font-weight: 400;
  line-height: 38.4px;
  margin: 0px 10px;
}
.table-compare .name {
  width: 315px;
}
.block-reorder {
  position: relative;
  width: auto;
}
.bubble-container {
  width: 144px;
  height: 160px;
  border: 1px solid #303030;
  border-radius: 40px;
  display: inline-block;
}
.bubble-container .plan-name {
  /* Base text style */
  height: 24px;
  color: rgba(255, 255, 255, 0.54);
  font-family: Lato;
  font-size: 20px;
  line-height: 24px;
  font-weight: 300;
  text-align: center;
  margin-top: 22px;
}
.bubble-container .plan-name .b {
  font-weight: 900;
  text-transform: capitalize;
}
.bubble-container .plan-price {
  height: 57px;
  color: rgba(255, 255, 255, 0.54);
  font-family: Lato;
  font-size: 48px;
  font-weight: 400;
  line-height: 57px;
  text-align: center;
  margin-top: 7px;
}
.bubble-container .plan-txt {
  height: 17px;
  color: #f2f4ff;
  font-family: Lato;
  font-size: 14px;
  font-weight: 400;
  line-height: 17px;
  text-align: center;
}
.bubble-darkyellow:hover {
  border: 1px solid #ff9500;
}
.bubble-darkyellow .plan-name {
  color: #ff9500;
}
.bubble-darkyellow .plan-price {
  color: #ff9500;
}
.bubble-pink:hover {
  border: 1px solid #fa114f;
}
.bubble-pink .plan-name {
  color: #fa114f;
}
.bubble-pink .plan-price {
  color: #fa114f;
}
.bubble-green:hover {
  border: 1px solid #04de71;
}
.bubble-green .plan-name {
  color: #04de71;
}
.bubble-green .plan-price {
  color: #04de71;
}
.bubble-purple:hover {
  border: 1px solid #2094fa;
}
.bubble-purple .plan-name {
  color: #2094fa;
}
.bubble-purple .plan-price {
  color: #2094fa;
}
.bubble-custom:hover {
  border: 1px solid #ff9500;
}
.bubble-custom .plan-name {
  height: 24px;
  color: #ff9500;
  font-family: Lato;
  font-size: 20px;
  font-weight: 900;
  line-height: 24px;
}
.bubble-custom .plan-price {
  color: #ff5000;
}
.bubble-red {
  top: 8px;
  position: relative;
}
.bubble-red .plan-name {
  height: 17px;
  color: #f2f4ff;
  font-family: Lato;
  font-size: 14px;
  font-weight: 400;
  line-height: 17px;
}
.bubble-red .plan-days-1 {
  height: 48px;
  color: #d0021b;
  font-family: Lato;
  font-size: 48px;
  font-weight: 400;
  line-height: 48px;
  margin-top: 5px;
}
.bubble-red .plan-days-2 {
  height: 17px;
  color: #f2f4ff;
  font-family: Lato;
  font-size: 14px;
  font-weight: 400;
  line-height: 17px;
  margin-top: 5px;
}
.bubble-red .plan-txt {
  height: 17px;
  color: #d0021b;
  font-family: Lato;
  font-size: 14px;
  font-weight: 400;
  line-height: 17px;
  margin-top: 5px;
}
.bubble-flat-gray {
  width: 141px;
  height: 40px;
  background-color: transparent;
  border: 1px solid #979797;
  border-radius: 40px;
  color: white;
  font-family: Lato;
  font-size: 14px;
  font-weight: 400;
  line-height: 17px;
  outline: 0;
}
.bubble-flat-gray:hover {
  border: 1px solid #ff5000;
  color: #ff5000;
}
.bubble-flat-grayYellow {
  width: 141px;
  height: 40px;
  background-color: transparent;
  border: 1px solid #979797;
  border-radius: 40px;
  color: white;
  font-family: Lato;
  font-size: 14px;
  font-weight: 400;
  line-height: 17px;
  outline: 0;
}
.bubble-flat-grayYellow:hover {
  border: 1px solid #ff5000;
}
.bubble-flat-grayYellow:active {
  background-color: #ff5000;
  border: #ff5000;
}
.bubble-flat-selected {
  border: 1px solid #ff9500;
  background-color: #ff9500;
}
.bubble-flat-orange {
  border: 1px solid #cc4100;
  background-color: #cc4100;
}
.bubble-flat-orange-border {
  border: 1px solid #cc4100;
  background-color: #ff5000;
}
/* CART PAYMENT POINT */
.padding17 {
  position: relative;
  float: left;
  width: 100%;
  height: auto;
  margin-top: 17px;
}
.en-green {
  color: #093;
  font-family: Lato;
  font-size: 20px;
  font-weight: 400;
  line-height: 32px;
  position: relative;
  display: block;
}
.en-orange {
  color: #ff5000;
  font-family: Lato;
  font-size: 20px;
  font-weight: 400;
  line-height: 32px;
  position: relative;
  display: block;
}
.en-orange2 {
  height: 29px;
  color: #ff5000;
  font-family: Lato;
  font-size: 24px;
  font-weight: 400;
  line-height: 29px;
}
.en-yellow {
  color: #ff9500;
  font-family: Lato;
  font-size: 36px;
  font-weight: 700;
  line-height: 44px;
  position: relative;
  display: block;
}
.th-white {
  color: rgba(255, 255, 255, 0.54);
  font-family: "ThaiSans All";
  font-size: 24px;
  font-weight: 400;
  line-height: 38.4px;
  position: relative;
  display: block;
}
.th-purewhite {
  padding-top: 10px;
  color: #f2f4ff;
  font-family: Lato;
  font-size: 14px;
  font-weight: 400;
  line-height: 17px;
  position: relative;
  display: block;
}
.credit-number {
  padding-top: 5px;
  color: #7ed321;
  font-family: Lato;
  font-size: 48px;
  font-weight: 400;
  line-height: 57px;
  position: relative;
  display: block;
}
.ovl-txt1 {
  color: #f2f4ff;
  font-family: Lato;
  font-size: 14px;
  font-weight: 400;
  line-height: 17px;
}
.option-choose {
  position: relative;
  width: 100%;
  height: auto;
}
.option-choose .items {
  cursor: pointer;
  /*&:hover {
            .pick-lbl {
                background-color: rgb(126, 211, 33) !important;
            }
            }*/
}
.option-choose .items .pick-lbl,
.option-choose .items .pick-txt {
  display: inline-block;
}
.option-choose .items .pick-lbl {
  border-radius: 50%;
  width: 24px;
  height: 24px;
  background-color: #303030;
  margin-right: 10px;
}
.option-choose .items .pick-lbl-active {
  background-color: #7ed321 !important;
}
.option-choose .items .pick-txt {
  color: white;
  font-family: Lato;
  font-size: 18px;
  font-weight: 300;
  line-height: 28.8px;
}
.asj {
  width: 131px !important;
  margin-right: 36px !important;
  cursor: pointer;
}
.asj:hover .circle .feature-name {
  color: #ff5000 !important;
}
.asj .feature-name {
  color: rgba(255, 255, 255, 0.54) !important;
  font-family: Lato;
  font-size: 16px;
  font-weight: 400 !important;
  line-height: 19px;
}
.overlay-square {
  width: 800px;
  height: auto;
  clear: left;
  overflow: hidden;
  margin: 0 auto;
  position: relative;
}
.square-block {
  width: 821px;
  clear: left;
  position: relative;
  height: auto;
  text-align: center;
  display: flex;
  margin: 0 auto;
  flex-direction: row;
  flex-wrap: wrap;
  flex-grow: 5;
}
.square-block .items {
  position: relative;
  width: 144px;
  height: 160px;
  border-radius: 40px;
  border: 1px solid #303030;
  margin-right: 20px;
  margin-bottom: 20px;
}
.square-block .items .empty-block {
  position: relative;
  color: rgba(255, 255, 255, 0.24);
  font-family: Lato;
  font-size: 14px;
  font-weight: 400;
  line-height: 17px;
  margin-top: 46%;
}
.square-block .items .svg-icon {
  margin-top: 40px;
  width: 100%;
  text-align: center;
  height: 50px;
}
.square-block .items .txt {
  width: 100%;
  text-align: center;
  margin-bottom: 5px;
  color: #f2f4ff;
  font-family: Lato;
  font-size: 14px;
  font-weight: 400;
}
.square-block .items .text-green {
  padding-top: 15px;
  color: #04de71;
  font-family: Lato;
  font-size: 24px;
  font-weight: 400;
  line-height: 29px;
}
.square-block .items .status {
  color: #ff5000;
  font-family: Lato;
  font-size: 14px;
  font-weight: 400;
  line-height: 17px;
}
.addon-top-btn button {
  margin: 0px 11px;
}
.addon-highlight-container {
  float: left;
  position: relative;
  width: 100%;
  height: auto;
}
.addon-highlight-container .arrow-left {
  left: 20px;
  position: absolute;
  top: 60px;
  cursor: pointer;
}
.addon-highlight-container .arrow-left svg {
  fill: white;
  opacity: 0.4;
}
.addon-highlight-container .arrow-left svg:hover {
  opacity: 1;
}
.addon-highlight-container .arrow-right {
  right: 35px;
  top: 60px;
  position: absolute;
  cursor: pointer;
}
.addon-highlight-container .arrow-right svg {
  fill: white;
  opacity: 0.4;
  position: absolute;
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  transform: rotate(180deg);
}
.addon-highlight-container .arrow-right svg:hover {
  opacity: 1;
}
.addon-highlight-container .arrow-middle-overflow {
  position: relative;
  margin-left: 60px;
  width: 100%;
  max-width: 1050px;
  overflow: hidden;
  z-index: 2;
}
.addon-highlight-container .arrow-middle-overflow a {
  text-decoration: none;
  color: inherit;
  outline: 0;
}
.addon-highlight-container .arrow-middle-overflow a:hover {
  text-decoration: none;
}
.addon-highlight-container .addon-ovl {
  -webkit-transition: all 0.4s;
  -o-transition: all .4s;
  -ms-transition: all .4s;
  transition: all .4s;
}
.addon-highlight-container .addon-ovl .hilight-items {
  width: 320px;
  margin: 0 15px;
  float: left;
}
.addon-highlight-container .addon-ovl .hilight-items:hover .middle-container .th {
  color: white;
  opacity: 1;
}
.addon-highlight-container .addon-ovl .hilight-items:active .middle-container .th {
  color: #ff5000;
  opacity: 1;
}
.addon-highlight-container .addon-ovl .hilight-items .title-img {
  width: 100%;
  height: auto;
  max-height: 160px;
  max-width: 320px;
  overflow: hidden;
  background-color: #303030;
  border-radius: 16px;
}
.addon-highlight-container .addon-ovl .hilight-items .title-img img {
  width: 100%;
  height: auto;
  max-width: 100%;
  background-color: #303030;
}
.addon-highlight-container .addon-ovl .hilight-items .title-en {
  color: #ffe620;
  font-family: Lato;
  font-size: 18px;
  font-weight: 400;
  line-height: 22px;
  padding-top: 15px;
  overflow: hidden;
}
.addon-highlight-container .addon-ovl .hilight-items .title-th {
  color: rgba(255, 255, 255, 0.54);
  font-family: "ThaiSans All";
  font-size: 22px;
  font-weight: 300;
  line-height: 29px;
  overflow: hidden;
}
.addon-highlight-container .addon-ovl .hilight-items .middle-container .th {
  opacity: .7;
}
.highlight-by-type {
  position: relative;
  float: left;
  width: 100%;
  height: auto;
  clear: both;
}
.highlight-by-type .title {
  display: block;
  float: left;
  clear: both;
  width: 100%;
}
.highlight-by-type .title .title-en {
  width: 100%;
  height: 29px;
  color: #ffe620;
  font-family: Lato;
  font-size: 24px;
  font-weight: 400;
  line-height: 29px;
  text-align: center;
}
.highlight-by-type .title .title-th {
  width: 100%;
  height: 39px;
  color: rgba(255, 255, 255, 0.54);
  font-family: "ThaiSans All";
  font-size: 24px;
  font-weight: 400;
  line-height: 38.4px;
  text-align: center;
}
.highlight-by-type .menu-head-list {
  display: flex;
  float: left;
  clear: both;
  width: 100%;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
}
.highlight-by-type .menu-head-list .title {
  margin: 10px 9px;
  width: 141px;
  height: 40px;
  border: 1px solid #979797;
  border-radius: 40px;
  color: #fff;
  font-family: Lato;
  font-size: 14px;
  font-weight: 400;
  line-height: 33px;
  cursor: pointer;
}
.highlight-by-type .menu-head-list .title:hover {
  border: 1px solid #cc4100;
}
.highlight-by-type .menu-head-list .title-selected {
  border: 1px solid #cc4100 !important;
  background-color: #cc4100 !important;
}
.highlight-by-type .menu-items-list {
  clear: both;
  width: 815px;
  display: flex;
  -webkit-flex-flow: row wrap;
  justify-content: flex-start;
  flex-direction: row;
  flex-wrap: wrap;
  margin: 0 auto;
}
.highlight-by-type .menu-items-list .items {
  margin: 0 14px;
  margin-bottom: 20px;
  width: 135px;
  cursor: pointer;
}
.highlight-by-type .menu-items-list .items .circle {
  width: 72px;
  height: 72px;
  border-radius: 50%;
  border: 1px solid #303030;
  margin: 0 auto;
}
.highlight-by-type .menu-items-list .items .circle img {
  width: 72px;
  height: 72px;
}
.highlight-by-type .menu-items-list .items .circle img:hover .normal {
  display: none;
}
.highlight-by-type .menu-items-list .items .circle img:hover .normal {
  display: block;
}
.highlight-by-type .menu-items-list .items .circle .hover {
  display: none;
}
.highlight-by-type .menu-items-list .items .title {
  color: rgba(255, 255, 255, 0.54);
  font-family: Lato;
  font-size: 15px;
  font-weight: 400;
  line-height: 19px;
  margin-top: 16px;
}
.highlight-by-type .menu-items-list .items:hover .title {
  color: white;
}
.highlight-by-type .menu-items-list .items:active .title {
  color: #ff5000;
}
.addon-page-container {
  float: left;
  position: relative;
  width: 100%;
  height: auto;
}
.addon-page-container .head {
  float: left;
  width: 100%;
  clear: both;
}
.addon-page-container .head .circle {
  width: 80px;
  height: 80px;
  margin: 0 auto;
  border-radius: 50%;
}
.addon-page-container .head .circle .normal {
  display: block;
}
.addon-page-container .head .circle .hover {
  display: none;
}
.addon-page-container .head .circle img {
  width: 80px;
  height: 80px;
}
.addon-page-container .head .title-en {
  height: 22px;
  color: #ffe620;
  font-family: Lato;
  font-size: 18px;
  font-weight: 400;
  line-height: 22px;
  margin-top: 17px;
}
.addon-page-container .head .title-th {
  height: 29px;
  color: rgba(255, 255, 255, 0.54);
  font-family: "ThaiSans All";
  font-size: 22px;
  font-weight: 300;
  line-height: 29px;
}
.addon-page-container .description {
  float: left;
  width: 100%;
  clear: both;
  color: rgba(255, 255, 255, 0.54);
  font-family: "ThaiSans All";
  font-size: 22px;
  font-weight: 300;
  line-height: 29px;
}
.addon-page-container .qualification {
  float: left;
  width: 100%;
  clear: both;
}
.addon-page-container .qualification .required-red {
  height: 29px;
  color: #d0021b;
  font-family: Lato;
  font-size: 24px;
  font-weight: 400;
  line-height: 29px;
}
.addon-page-container .qualification .required-white {
  height: 39px;
  color: rgba(255, 255, 255, 0.54);
  font-family: "ThaiSans All";
  font-size: 24px;
  font-weight: 400;
  line-height: 38.4px;
  margin-top: 8px;
}
.addon-page-container .qualification .plan-display {
  display: block;
  clear: both;
  margin-top: 16px;
}
.addon-page-container .qualification .plan-display .bubble {
  width: 122px;
  height: 136px;
  border: 1px solid #303030;
  border-radius: 40px;
  margin: 0 auto;
}
.addon-page-container .qualification .plan-display .bubble .get {
  height: 29px;
  color: #7ed321;
  font-family: Lato;
  font-size: 24px;
  font-weight: 300;
  line-height: 29px;
  text-align: center;
  display: block;
  margin-top: 10;
}
.addon-page-container .qualification .plan-display .bubble .bold {
  height: 32px;
  color: #7ed321;
  font-family: Lato;
  font-size: 20px;
  font-weight: 900;
  line-height: 23px;
  margin-top: 11px;
  display: block;
  text-transform: capitalize;
}
.addon-page-container .qualification .plan-display .bubble .plan {
  height: 17px;
  color: rgba(255, 255, 255, 0.52);
  font-family: Lato;
  font-size: 14px;
  font-weight: 400;
  line-height: 17px;
  display: block;
  text-align: center;
  margin-top: 21px;
}
.addon-page-container .qualification .action-btn {
  width: 141px;
  height: 40px;
  border: 1px solid #7ed321;
  border-radius: 40px;
  color: #7ed321;
  font-family: Lato;
  font-size: 14px;
  font-weight: 400;
  line-height: 17px;
  margin: 0 auto;
  background-color: transparent;
  outline: 0;
}
.addon-page-container .qualification .action-btn-upgrade {
  width: 141px;
  height: 40px;
  border: 1px solid #979797;
  border-radius: 40px;
  color: white;
  font-family: Lato;
  font-size: 14px;
  font-weight: 400;
  line-height: 17px;
  margin: 0 auto;
  background-color: transparent;
  outline: 0;
}
.addon-page-container .qualification .suggest-text {
  width: 100%;
  height: 39px;
  color: rgba(255, 255, 255, 0.54);
  font-family: "ThaiSans All";
  font-size: 24px;
  font-weight: 400;
  line-height: 38.4px;
  clear: both;
}
.addon-cart-view-container {
  clear: both;
  width: 100%;
  float: left;
  position: relative;
  height: auto;
}
.addon-cart-view-container .header {
  float: left;
  clear: both;
  width: 100%;
}
.addon-cart-view-container .header .title-en {
  height: 37px;
  color: #ff5000;
  font-family: Lato;
  font-size: 24px;
  font-weight: 700;
  line-height: 36.4px;
}
.addon-cart-view-container .addon-lists-container {
  float: left;
  position: relative;
  width: 100%;
  height: auto;
  clear: both;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
}
.addon-cart-view-container .addon-lists-container .addon-lists-items {
  width: 110px;
  height: auto;
  margin: 26px 26px;
}
.addon-cart-view-container .addon-lists-container .addon-lists-items .circle {
  width: 72px;
  height: 72px;
  border: 1px solid #ffe620;
  border-radius: 50%;
  margin: 0 auto;
}
.addon-cart-view-container .addon-lists-container .addon-lists-items .circle img {
  width: 72px;
  height: 72px;
}
.addon-cart-view-container .addon-lists-container .addon-lists-items .circle .normal {
  display: block;
}
.addon-cart-view-container .addon-lists-container .addon-lists-items .circle .hover {
  display: none;
}
.addon-cart-view-container .addon-lists-container .addon-lists-items .title {
  position: relative;
  margin-top: 16px;
  height: 19px;
  color: rgba(255, 255, 255, 0.54);
  font-family: Lato;
  font-size: 16px;
  font-weight: 400;
  line-height: 19px;
}
.addon-cart-view-container .addon-lists-container .addon-lists-items .title-remove {
  height: 17px;
  color: #d0021b;
  font-family: Lato;
  font-size: 14px;
  font-weight: 400;
  line-height: 17px;
}
.addon-cart-view-container .addon-plan-container {
  position: relative;
  width: 100%;
  height: auto;
  clear: both;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
}
.addon-cart-view-container .addon-plan-container .current-plan,
.addon-cart-view-container .addon-plan-container .addon-plan,
.addon-cart-view-container .addon-plan-container .plus-plan,
.addon-cart-view-container .addon-plan-container .pay-plan,
.addon-cart-view-container .addon-plan-container .checkout-plan {
  margin: 0px 17px;
}
.addon-cart-view-container .addon-plan-container .current-plan svg,
.addon-cart-view-container .addon-plan-container .addon-plan svg,
.addon-cart-view-container .addon-plan-container .plus-plan svg,
.addon-cart-view-container .addon-plan-container .pay-plan svg,
.addon-cart-view-container .addon-plan-container .checkout-plan svg {
  margin-top: 60px;
}
.addon-cart-view-container .addon-plan-container .current-plan .bubble,
.addon-cart-view-container .addon-plan-container .addon-plan .bubble,
.addon-cart-view-container .addon-plan-container .plus-plan .bubble,
.addon-cart-view-container .addon-plan-container .pay-plan .bubble,
.addon-cart-view-container .addon-plan-container .checkout-plan .bubble {
  width: 144px;
  height: 160px;
  border: 1px solid #303030;
  border-radius: 40px;
}
.addon-cart-view-container .addon-plan-container .current-plan .bubble .header,
.addon-cart-view-container .addon-plan-container .addon-plan .bubble .header,
.addon-cart-view-container .addon-plan-container .plus-plan .bubble .header,
.addon-cart-view-container .addon-plan-container .pay-plan .bubble .header,
.addon-cart-view-container .addon-plan-container .checkout-plan .bubble .header {
  height: 17px;
  color: rgba(255, 255, 255, 0.52);
  font-family: Lato;
  font-size: 14px;
  font-weight: 400;
  line-height: 17px;
  margin-top: 20px;
  margin-bottom: 10px;
  text-transform: capitalize;
}
.addon-cart-view-container .addon-plan-container .current-plan .bubble .bold,
.addon-cart-view-container .addon-plan-container .addon-plan .bubble .bold,
.addon-cart-view-container .addon-plan-container .plus-plan .bubble .bold,
.addon-cart-view-container .addon-plan-container .pay-plan .bubble .bold,
.addon-cart-view-container .addon-plan-container .checkout-plan .bubble .bold {
  height: 24px;
  color: white;
  font-family: Lato;
  font-size: 20px;
  font-weight: 900;
  line-height: 24px;
}
.addon-cart-view-container .addon-plan-container .current-plan .bubble .bold-yellow,
.addon-cart-view-container .addon-plan-container .addon-plan .bubble .bold-yellow,
.addon-cart-view-container .addon-plan-container .plus-plan .bubble .bold-yellow,
.addon-cart-view-container .addon-plan-container .pay-plan .bubble .bold-yellow,
.addon-cart-view-container .addon-plan-container .checkout-plan .bubble .bold-yellow {
  height: 24px;
  color: #ffe620;
  font-family: Lato;
  font-size: 20px;
  font-weight: 900;
  line-height: 24px;
}
.addon-cart-view-container .addon-plan-container .current-plan .bubble .price,
.addon-cart-view-container .addon-plan-container .addon-plan .bubble .price,
.addon-cart-view-container .addon-plan-container .plus-plan .bubble .price,
.addon-cart-view-container .addon-plan-container .pay-plan .bubble .price,
.addon-cart-view-container .addon-plan-container .checkout-plan .bubble .price {
  clear: both;
  width: 100%;
  height: 57px;
  color: #ffe620;
  font-family: Lato;
  font-size: 48px;
  font-weight: 400;
  line-height: 57px;
  text-align: center;
}
.addon-cart-view-container .addon-plan-container .current-plan .bubble .price-orange,
.addon-cart-view-container .addon-plan-container .addon-plan .bubble .price-orange,
.addon-cart-view-container .addon-plan-container .plus-plan .bubble .price-orange,
.addon-cart-view-container .addon-plan-container .pay-plan .bubble .price-orange,
.addon-cart-view-container .addon-plan-container .checkout-plan .bubble .price-orange {
  color: #ff5000;
}
.addon-cart-view-container .addon-plan-container .current-plan .bubble .bottom-text,
.addon-cart-view-container .addon-plan-container .addon-plan .bubble .bottom-text,
.addon-cart-view-container .addon-plan-container .plus-plan .bubble .bottom-text,
.addon-cart-view-container .addon-plan-container .pay-plan .bubble .bottom-text,
.addon-cart-view-container .addon-plan-container .checkout-plan .bubble .bottom-text {
  clear: both;
  margin-top: 0px;
  height: 17px;
  color: rgba(255, 255, 255, 0.52);
  font-family: Lato;
  font-size: 14px;
  font-weight: 400;
  line-height: 17px;
}
.addon-cart-view-container .addon-button {
  position: relative;
  width: 100%;
  height: auto;
  clear: both;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
}
.addon-cart-view-container .addon-button button {
  margin: 0px 11px;
  background-color: transparent;
  outline: 0;
}
.addon-cart-view-container .addon-button button:hover {
  border: 1px solid #ff5000;
  background-color: #ff5000;
  color: white;
}
.addon-cart-view-container .addon-button .a {
  width: 141px;
  height: 40px;
  border: 1px solid #979797;
  border-radius: 40px;
  color: white;
  font-family: Lato;
  font-size: 14px;
  font-weight: 400;
  line-height: 17px;
}
.addon-cart-view-container .addon-button .b {
  width: 141px;
  height: 40px;
  border: 1px solid #7ed321;
  color: #7ed321;
  border-radius: 40px;
  font-family: Lato;
  font-size: 14px;
  font-weight: 400;
  line-height: 17px;
}
.middle-center-form {
  float: left;
  position: relative;
  height: auto;
  clear: both;
  width: 100%;
  margin: 0 auto;
}
.middle-center-form .middle-center-container {
  position: relative;
  display: block;
  margin: 0 auto;
  width: 600px;
  max-width: 600px;
  height: auto;
}
.middle-center-form .middle-center-container .formLabelH2 {
  font-size: 18px;
}
#the-uploaded-image {
  width: 135px;
  height: 135px;
  position: relative;
}
#pageFooter {
  clear: both;
  position: relative;
  width: 100%;
  height: auto;
  margin-top: 120px;
  margin-bottom: 40px;
}
#pageFooter .txt-footer {
  position: relative;
  width: 980px;
  margin: 0 auto;
  text-align: center;
}
#pageFooter .txt-footer svg {
  width: 35px;
  height: auto;
  opacity: .2;
  margin-bottom: 20px;
}
.fix-shop-choose-container {
  float: left;
  width: 100%;
  height: 150px;
  max-height: 150px;
  background-color: #303030;
  overflow: hidden;
}
.fix-shop-choose-container .bar-choose-shop-container {
  text-align: center;
  position: relative;
  width: 100%;
}
.fix-shop-choose-container .bar-choose-shop-container .items-shop-list {
  position: relative;
  width: 80px;
  height: auto;
  margin-left: 40px;
  margin-right: 40px;
  display: inline-block;
  border: 0px solid red;
  opacity: .2;
  cursor: pointer;
}
.fix-shop-choose-container .bar-choose-shop-container .items-shop-list .circle {
  margin-top: 21px;
  width: 80px;
  height: 80px;
  border-radius: 50%;
  border: 1px solid #ff5000;
}
.fix-shop-choose-container .bar-choose-shop-container .items-shop-list .circle span {
  width: 100%;
  text-align: center;
  color: #ff5000;
  font-family: Lato;
  font-size: 29px;
  font-weight: 400;
  line-height: 80px;
}
.fix-shop-choose-container .bar-choose-shop-container .items-shop-list .circle img {
  width: 80px;
  height: 80px;
  border-radius: 50%;
}
.fix-shop-choose-container .bar-choose-shop-container .items-shop-list .circle svg {
  width: 80px;
  height: 80px;
}
.fix-shop-choose-container .bar-choose-shop-container .items-shop-list .name {
  color: white;
  font-family: Lato;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  height: 24px;
  margin-top: 10px;
  overflow: hidden;
}
.fix-shop-choose-container .bar-choose-shop-container .items-shop-list .over-name {
  font-size: 12px;
}
.fix-shop-choose-container .bar-choose-shop-container .items-shop-list:hover {
  opacity: 1;
}
.fix-shop-choose-container .bar-choose-shop-container .items-shop-list-active {
  opacity: 1;
}
.head-change-view-container {
  position: relative;
  width: 100%;
  height: auto;
  clear: both;
  float: left;
}
.head-change-view-container .inset-container {
  position: relative;
  width: 100%;
  height: 170px;
  text-align: center;
  /* EACH PLAN PICKED */
  /* EACH PLAN SELECTED */
}
.head-change-view-container .inset-container .items {
  width: 144px;
  height: 160px;
  margin-left: 7px;
  margin-right: 7px;
  border: 1px solid #303030;
  border-radius: 40px;
  display: inline-block;
  cursor: pointer;
}
.head-change-view-container .inset-container .items .name-plan {
  float: left;
  width: 100%;
  color: rgba(255, 255, 255, 0.54);
  font-family: Lato;
  font-size: 20px;
  font-weight: 300;
  line-height: 24px;
  margin-top: 5px;
  text-transform: capitalize;
}
.head-change-view-container .inset-container .items .name-plan span {
  display: block;
  clear: left;
  width: 100%;
  color: rgba(255, 255, 255, 0.54);
  font-family: Lato;
  font-size: 20px;
  font-weight: 900;
  line-height: 24px;
}
.head-change-view-container .inset-container .items .name-plan .single {
  float: left;
  width: 100%;
  color: white;
  font-family: Lato;
  font-size: 20px;
  font-weight: 300;
  line-height: 24px;
  margin-bottom: 9px;
  margin-top: 14px;
}
.head-change-view-container .inset-container .items .name-plan .double .first {
  float: left;
  width: 100%;
  color: white;
  font-family: Lato;
  font-size: 20px;
  font-weight: 300;
  line-height: 24px;
}
.head-change-view-container .inset-container .items .name-plan .double .second {
  float: left;
  width: 100%;
  height: 24px;
  color: #d0021b;
  font-family: Lato;
  font-size: 20px;
  font-weight: 400;
  line-height: 24px;
}
.head-change-view-container .inset-container .items .name-text {
  float: left;
  margin-top: 20px;
  width: 100%;
  color: white;
  font-family: Lato;
  font-size: 20px;
  font-weight: 300;
  line-height: 24px;
}
.head-change-view-container .inset-container .items .number {
  float: left;
  width: 100%;
  color: rgba(255, 255, 255, 0.54);
  font-family: Lato;
  font-size: 48px;
  font-weight: 400;
  line-height: 57px;
  margin-top: 0px;
  margin-bottom: 7px;
}
.head-change-view-container .inset-container .items .orange {
  color: #ff5000 !important;
}
.head-change-view-container .inset-container .items .name-btn {
  float: left;
  width: 100%;
  color: #f2f4ff;
  font-family: Lato;
  font-size: 14px;
  font-weight: 400;
  line-height: 17px;
}
.head-change-view-container .inset-container .items .circle {
  width: 80px;
  height: 80px;
  margin-left: 28px;
  position: relative;
  display: block;
  margin-top: 10px;
  float: left;
  border: 1px solid #ff5000;
  border-radius: 50%;
}
.head-change-view-container .inset-container .items .circle svg,
.head-change-view-container .inset-container .items .circle img {
  width: 80px;
  height: 80px;
  outline: 0;
}
.head-change-view-container .inset-container .items .circle span {
  color: #ff5000;
  font-family: Lato;
  font-size: 29px;
  font-weight: 400;
  line-height: 75px;
  height: 80px;
  display: block;
}
.head-change-view-container .inset-container .items .dash {
  float: left;
  width: 100%;
  margin-top: 20px;
}
.head-change-view-container .inset-container .items .plus {
  float: left;
  width: 100%;
  margin-top: 64px;
}
.head-change-view-container .inset-container .items .remain {
  float: left;
}
.head-change-view-container .inset-container .items .remain .i-1 {
  height: 17px;
  color: #f2f4ff;
  font-family: Lato;
  font-size: 14px;
  font-weight: 400;
  line-height: 17px;
  width: 100%;
  float: left;
  margin-top: 15px;
}
.head-change-view-container .inset-container .items .remain .i-2 {
  height: 48px;
  color: #d0021b;
  font-family: Lato;
  font-size: 48px;
  font-weight: 400;
  line-height: 48px;
  width: 100%;
  float: left;
  margin-top: 10px;
}
.head-change-view-container .inset-container .items .remain .i-3 {
  height: 17px;
  color: #f2f4ff;
  font-family: Lato;
  font-size: 14px;
  font-weight: 400;
  line-height: 17px;
  width: 100%;
  float: left;
  margin-top: 5px;
}
.head-change-view-container .inset-container .items .remain .i-4 {
  height: 17px;
  color: #d0021b;
  font-family: Lato;
  font-size: 14px;
  font-weight: 400;
  line-height: 17px;
  width: 100%;
  float: left;
  margin-top: 10px;
}
.head-change-view-container .inset-container .items .custom {
  float: left;
  position: relative;
  margin: 0 auto;
  width: 100%;
}
.head-change-view-container .inset-container .items .custom svg {
  position: relative;
  margin-top: 40px;
  margin-bottom: 10px;
}
.head-change-view-container .inset-container .items .custom .currency {
  height: 17px;
  color: #f2f4ff;
  font-family: Lato;
  font-size: 14px;
  font-weight: 400;
  line-height: 17px;
}
.head-change-view-container .inset-container .yellow-number .number {
  color: #ff9500;
}
.head-change-view-container .inset-container .no-border {
  border: 1px solid #191919;
}
.head-change-view-container .inset-container .no-border-svg {
  width: 56px;
  border: 1px solid #191919;
}
.head-change-view-container .inset-container .nav-left {
  position: absolute;
  left: 0;
  cursor: pointer;
  width: 64px;
  height: 64px;
}
.head-change-view-container .inset-container .nav-left .up {
  margin-top: 50px;
  opacity: .24;
}
.head-change-view-container .inset-container .nav-left .up svg {
  transform: rotate(180deg);
}
.head-change-view-container .inset-container .nav-left .down {
  margin-top: 50px;
  opacity: .24;
}
.head-change-view-container .inset-container .nav-left .down svg {
  transform: rotate(180deg);
}
.head-change-view-container .inset-container .nav-left .active-nav {
  opacity: 1 !important;
}
.head-change-view-container .inset-container .nav-left .active-nav:hover svg {
  fill: #ff5000 !important;
  fill-opacity: 1;
}
.head-change-view-container .inset-container .nav-left .active-nav svg {
  fill: #fff;
  fill-opacity: 1;
}
.head-change-view-container .inset-container .nav-left .pad-left {
  margin-left: 160px;
}
.head-change-view-container .inset-container .nav-right {
  position: absolute;
  right: 0;
  cursor: pointer;
  width: 64px;
  height: 64px;
}
.head-change-view-container .inset-container .nav-right svg {
  fill: #fff;
  fill-opacity: 1;
}
.head-change-view-container .inset-container .nav-right .up {
  margin-top: 50px;
  opacity: .24;
}
.head-change-view-container .inset-container .nav-right .down {
  margin-top: 50px;
  opacity: .24;
}
.head-change-view-container .inset-container .nav-right .down svg {
  transform: rotate(0deg);
}
.head-change-view-container .inset-container .nav-right .active-nav {
  opacity: 1 !important;
}
.head-change-view-container .inset-container .nav-right .pad-right {
  margin-left: -320px;
}
.head-change-view-container .inset-container .active-nav:hover svg {
  fill: #ff5000 !important;
  fill-opacity: 1;
}
.head-change-view-container .inset-container .plan-eco .name-plan {
  color: #ff114f !important;
}
.head-change-view-container .inset-container .plan-eco .name-plan span {
  color: #ff114f !important;
}
.head-change-view-container .inset-container .plan-eco .number {
  color: #ff114f !important;
}
.head-change-view-container .inset-container .plan-eco:hover {
  border: 1px solid #ff114f!important;
}
.head-change-view-container .inset-container .plan-eco:hover .name-plan {
  color: #ff114f !important;
}
.head-change-view-container .inset-container .plan-eco:hover .name-plan span {
  color: #ff114f !important;
}
.head-change-view-container .inset-container .plan-eco:hover .number {
  color: #ff114f !important;
}
.head-change-view-container .inset-container .plan-ecopremium .name-plan {
  color: #ff9500 !important;
}
.head-change-view-container .inset-container .plan-ecopremium .name-plan span {
  color: #ff9500 !important;
}
.head-change-view-container .inset-container .plan-ecopremium .number {
  color: #ff9500 !important;
}
.head-change-view-container .inset-container .plan-ecopremium:hover {
  border: 1px solid #ff9500 !important;
}
.head-change-view-container .inset-container .plan-ecopremium:hover .name-plan {
  color: #ff9500 !important;
}
.head-change-view-container .inset-container .plan-ecopremium:hover .name-plan span {
  color: #ff9500 !important;
}
.head-change-view-container .inset-container .plan-ecopremium:hover .number {
  color: #ff9500 !important;
}
.head-change-view-container .inset-container .plan-business .name-plan {
  color: #7ed321 !important;
}
.head-change-view-container .inset-container .plan-business .name-plan span {
  color: #7ed321 !important;
}
.head-change-view-container .inset-container .plan-business .number {
  color: #7ed321 !important;
}
.head-change-view-container .inset-container .plan-business:hover {
  border: 1px solid #7ed321 !important;
}
.head-change-view-container .inset-container .plan-business:hover .name-plan {
  color: #7ed321 !important;
}
.head-change-view-container .inset-container .plan-business:hover .name-plan span {
  color: #7ed321 !important;
}
.head-change-view-container .inset-container .plan-business:hover .number {
  color: #7ed321 !important;
}
.head-change-view-container .inset-container .plan-first .name-plan {
  color: #2094fa !important;
}
.head-change-view-container .inset-container .plan-first .name-plan span {
  color: #2094fa !important;
}
.head-change-view-container .inset-container .plan-first .number {
  color: #2094fa !important;
}
.head-change-view-container .inset-container .plan-first:hover {
  border: 1px solid #2094fa !important;
}
.head-change-view-container .inset-container .plan-first:hover .name-plan {
  color: #2094fa !important;
}
.head-change-view-container .inset-container .plan-first:hover .name-plan span {
  color: #2094fa !important;
}
.head-change-view-container .inset-container .plan-first:hover .number {
  color: #2094fa !important;
}
.head-change-view-container .inset-container .plan-custom .name-plan {
  color: #ffe620 !important;
}
.head-change-view-container .inset-container .plan-custom .name-plan span {
  color: #ffe620 !important;
}
.head-change-view-container .inset-container .plan-custom .number {
  color: #ffe620 !important;
}
.head-change-view-container .inset-container .plan-custom:hover {
  border: 1px solid #ff9500 !important;
}
.head-change-view-container .inset-container .plan-custom:hover .name-plan {
  color: #ffe620 !important;
}
.head-change-view-container .inset-container .plan-custom:hover .name-plan span {
  color: #ffe620 !important;
}
.head-change-view-container .inset-container .plan-custom:hover .number {
  color: #ffe620 !important;
}
.head-change-view-container .inset-container .plan-eco.picked-choice {
  background-color: #ff114f !important;
}
.head-change-view-container .inset-container .plan-eco.picked-choice .name-plan {
  color: #fff !important;
}
.head-change-view-container .inset-container .plan-eco.picked-choice .name-plan span {
  color: #fff !important;
}
.head-change-view-container .inset-container .plan-eco.picked-choice .name-plan .second {
  color: #fff !important;
}
.head-change-view-container .inset-container .plan-eco.picked-choice .number {
  color: #fff !important;
}
.head-change-view-container .inset-container .plan-ecopremium.picked-choice {
  background-color: #ff9500 !important;
}
.head-change-view-container .inset-container .plan-ecopremium.picked-choice .name-plan {
  color: #fff !important;
}
.head-change-view-container .inset-container .plan-ecopremium.picked-choice .name-plan span {
  color: #fff !important;
}
.head-change-view-container .inset-container .plan-ecopremium.picked-choice .name-plan .second {
  color: #fff !important;
}
.head-change-view-container .inset-container .plan-ecopremium.picked-choice .number {
  color: #fff !important;
}
.head-change-view-container .inset-container .plan-business.picked-choice {
  background-color: #7ed321 !important;
}
.head-change-view-container .inset-container .plan-business.picked-choice .name-plan {
  color: #fff !important;
}
.head-change-view-container .inset-container .plan-business.picked-choice .name-plan span {
  color: #fff !important;
}
.head-change-view-container .inset-container .plan-business.picked-choice .name-plan .second {
  color: #fff !important;
}
.head-change-view-container .inset-container .plan-business.picked-choice .number {
  color: #fff !important;
}
.head-change-view-container .inset-container .plan-first.picked-choice {
  background-color: #2094fa !important;
}
.head-change-view-container .inset-container .plan-first.picked-choice .name-plan {
  color: #fff !important;
}
.head-change-view-container .inset-container .plan-first.picked-choice .name-plan span {
  color: #fff !important;
}
.head-change-view-container .inset-container .plan-first.picked-choice .name-plan .second {
  color: #fff !important;
}
.head-change-view-container .inset-container .plan-first.picked-choice .number {
  color: #fff !important;
}
.head-change-view-container .inset-container .plan-custom.picked-choice {
  background-color: #ff5000 !important;
}
.head-change-view-container .inset-container .plan-custom.picked-choice .name-plan {
  color: #fff !important;
}
.head-change-view-container .inset-container .plan-custom.picked-choice .name-plan span {
  color: #fff !important;
}
.head-change-view-container .inset-container .plan-custom.picked-choice .name-plan .second {
  color: #d0021b !important;
}
.head-change-view-container .inset-container .plan-custom.picked-choice .number {
  color: #fff !important;
}
.mid-div {
  width: 100%;
  height: auto;
  float: left;
  position: relative;
}
.single-circle {
  width: 80px;
  height: 80px;
  border: 1px solid #ff5000;
  margin: 0 auto;
  border-radius: 50%;
}
.single-circle span {
  color: #ff5000;
  font-family: Lato;
  font-size: 29px;
  font-weight: 400;
  line-height: 80px;
}
.margin15 {
  margin-left: 15px !important;
  margin-right: 15px !important;
}
.margin15-center {
  border: 0px !important;
  width: 50px !important;
  margin-left: 0px !important;
}
.margin15-center svg {
  margin-top: 65px;
  position: absolute;
}
.nav-left .up:hover,
.nav-right .up:hover,
.nav-left .down:hover,
.nav-right .down:hover {
  opacity: 1 !important;
}
.nav-left .up:hover svg path,
.nav-right .up:hover svg path,
.nav-left .down:hover svg path,
.nav-right .down:hover svg path {
  opacity: 1;
  fill: #fff;
}
.nav-left .up:active,
.nav-right .up:active,
.nav-left .down:active,
.nav-right .down:active {
  opacity: 1 !important;
}
.nav-left .up:active svg path,
.nav-right .up:active svg path,
.nav-left .down:active svg path,
.nav-right .down:active svg path {
  opacity: 1;
  fill: #ff5000 !important;
}
.active-nav:hover {
  opacity: 1 !important;
}
.active-nav:hover svg path {
  opacity: 1;
  fill: #ff5000 !important;
}
#redeem-noti,
#bar-noti {
  position: fixed;
  z-index: 6;
  width: 100%;
  height: 80px;
  margin-top: -130px;
  background-color: #191919;
  transition: all 0.4s;
  webkit-transition: all 0.4s;
  -moz-transition: all 0.4s;
  -o-transition: all 0.4s;
}
#redeem-noti .noti-container,
#bar-noti .noti-container {
  text-align: center;
  width: 980px;
  margin: 0 auto;
  height: 80px;
  color: white;
  font-size: 25px;
  line-height: 29px;
  padding-top: 10px;
  font-family: 'ThaiSans All';
}
#redeem-noti .noti-container span:first-child,
#bar-noti .noti-container span:first-child {
  display: block;
  width: 100%;
  font-size: 24px;
}
#redeem-noti .noti-container span:nth-child(2),
#bar-noti .noti-container span:nth-child(2) {
  display: block;
  width: 100%;
  font-size: 21px;
}
#redeem-noti .nav-left,
#bar-noti .nav-left {
  position: relative;
  left: 0;
  display: block;
  top: 0;
  margin-top: -40px;
  font-size: 0.85em;
  width: 220px;
  text-align: left;
  height: 50;
  line-height: 2.3em;
  cursor: pointer;
  text-transform: capitalize;
}
#redeem-noti .nav-left:hover,
#bar-noti .nav-left:hover {
  color: #ff5000;
}
#bar-noti {
  z-index: 5;
  height: 50px;
  background-color: #191919;
  margin-top: 0px !important;
  position: relative;
}
#bar-noti .shop-name {
  display: inline-block;
  margin-left: 5px;
  margin-right: 0px;
}
#bar-noti .shop-items {
  display: inline-block;
  margin-left: 10px;
  margin-right: 10px;
  padding: 0px 10px;
  height: 30px;
  background-color: #093;
  border-radius: 40px;
  color: white;
  font-family: Lato;
  font-size: 20px;
  font-weight: 400;
  line-height: 27px;
  cursor: pointer;
}
.redeem-noti-show {
  margin-top: 0px !important;
}
.redeem-red {
  opacity: 0.9;
  background-color: #d0021b !important;
}
.redeem-green {
  opacity: 0.9;
  background-color: #093 !important;
}
.redeem-grey {
  background-color: #303030 !important;
}
.svg-right {
  width: 64px;
  height: 64px;
  background-repeat: no-repeat;
  background-size: contain;
  cursor: pointer;
  margin-left: auto;
  margin-right: auto;
  position: relative;
  clear: right;
}
.svg-right svg {
  opacity: 0.24;
  fill: #fff;
}
.svg-right:hover svg {
  opacity: 1;
}
.svg-right svg.active {
  opacity: 1;
  fill: #fff !important;
}
.svg-right svg.active:hover {
  fill: #ff5000 !important;
}
.middle-container {
  position: relative;
  width: 100%;
  height: auto;
  display: block;
  clear: both;
  text-align: center;
  margin: 0 auto;
  margin-bottom: 30px;
  padding: 0px;
}
.middle-container a {
  cursor: pointer;
  outline: 0;
  display: inline-block;
  color: inherit;
}
.middle-container a svg.back {
  fill: #ffffff;
  opacity: 0.54;
}
.middle-container a svg.back:hover {
  fill: #ffffff;
}
.middle-container a svg.back:active {
  fill: #ff5000;
}
.middle-container a:hover svg.back {
  fill: #ffffff;
  opacity: 1;
}
.middle-container a:active svg.back {
  fill: #ff5000 !important;
  opacity: 1;
}
.middle-container .square-rounded-big:hover .normal {
  border: 4px solid #ff5000;
}
.middle-container .square-rounded-big:active .normal {
  border: 4px solid #ff5000;
  background: #ff50000;
}
.middle-container .square-rounded-big .normal {
  display: block;
  width: 256px;
  height: 304px;
  border: 1px solid #303030;
  border-radius: 40px;
  text-align: center;
  margin: 0 auto;
  cursor: pointer;
}
.middle-container .circle-container-x104 {
  position: relative;
  margin: 0 auto;
  border: 0px solid #ff5000;
  border-radius: 50%;
  width: 104px;
  height: 104px;
}
.middle-container .circle-container-x104 span {
  color: #ff5000;
  font-size: 27px;
  position: relative;
  margin-top: 45%;
  display: block;
}
.middle-container .circle-container-x104 svg {
  width: 104px;
  height: 104px;
}
.middle-container .circle-container-x135 {
  position: relative;
  margin: 0 auto;
  border: 1px solid #ff5000;
  border-radius: 50%;
  width: 135px;
  height: 135px;
}
.middle-container .circle-container-x135 span {
  color: #ff5000;
  font-size: 27px;
  position: relative;
  margin-top: 45%;
  display: block;
}
.middle-container .circle-container-x135 svg {
  width: 135px;
  height: 135px;
}
.middle-container .circle-container-x135 img#the-uploaded-image {
  margin-left: -1px;
  margin-top: -1px;
}
.middle-container .circle-container-x135 .display-img-profile {
  width: 135px;
  height: 135px;
  border-radius: 50%;
}
.middle-container .circle-container-x80 {
  position: relative;
  margin: 0 auto;
  border-radius: 50%;
  width: 80px;
  height: 80px;
  background-color: #303030;
  clear: both;
}
.middle-container .circle-container-x80 svg {
  margin-top: 20px;
}
.middle-container .en {
  font-family: Lato;
}
.middle-container .th {
  font-family: 'Thaisans All';
  font-size: 170% !important;
}
.middle-container [data-th-font*="16"] {
  font-size: 21px !important;
}
.middle-container [data-th-font*="21"] {
  font-size: 25px !important;
}
.middle-container a {
  color: rgba(255, 255, 255, 0.54);
  text-decoration: none;
  font-weight: inherit;
}
.middle-container a:hover {
  color: #ff5000;
}
.middle-container .txt-inline {
  display: inline-block;
}
.middle-container .txt-xsmall {
  color: rgba(255, 255, 255, 0.54);
  font-size: 14px;
  line-height: 16px;
}
.middle-container .txt-small {
  color: rgba(255, 255, 255, 0.54);
  font-size: 16px;
  line-height: 27px;
}
.middle-container .txt-normal {
  color: rgba(255, 255, 255, 0.54);
  font-size: 16px;
  line-height: 27px;
}
.middle-container .txt-plusnormal {
  color: rgba(255, 255, 255, 0.54);
  font-size: 24px;
  line-height: 36px;
  height: 36px;
  margin: 0px;
}
.middle-container .txt-plusnormal.en.orange {
  font-weight: 600;
}
.middle-container .txt-big {
  color: white;
  font-size: 24px;
  line-height: 30px;
  height: 31px;
  margin: 3px 0px;
}
.middle-container .txt-plusbig {
  color: rgba(255, 255, 255, 0.54);
  font-size: 36px;
  line-height: 27px;
}
.middle-container .txt-big.th {
  font-size: 200% !important;
}
.middle-container .txt-superbig {
  font-size: 72px;
  font-weight: 700;
  line-height: 115.2px;
}
.middle-container .txt-number-big {
  font-size: 48px;
  font-weight: 400;
  line-height: 48px;
}
.middle-container .bold {
  font-weight: 700;
}
.middle-container .orange {
  color: #ff5000;
}
.middle-container .light-orange {
  color: #ff8300;
}
.middle-container .yellow {
  color: #ffe620;
}
.middle-container .gray {
  color: rgba(255, 255, 255, 0.52);
}
.middle-container .green {
  color: #093;
}
.middle-container .white {
  color: white;
}
.middle-container .light {
  opacity: .6;
}
.middle-container .light-weight {
  font-weight: 300;
}
.middle-container .weight-300 {
  font-weight: 300;
}
.middle-container .weight-400 {
  font-weight: 400;
}
.middle-container .weight-500 {
  font-weight: 500;
}
.middle-container .weight-600 {
  font-weight: 600;
}
.middle-container .weight-700 {
  font-weight: 700;
}
.middle-container .red {
  color: #d0021b;
}
.middle-container .light-gray {
  color: rgba(255, 255, 255, 0.52);
}
.middle-container .hover-orange {
  cursor: pointer;
}
.middle-container .hover-orange:hover {
  color: #ff5000;
}
.middle-container .svg-icon svg,
.middle-container .svg-icon path {
  fill: #fff;
  fill-opacity: 0.24;
  opacity: 0.24;
}
.middle-container .svg-icon svg:hover,
.middle-container .svg-icon path:hover {
  fill: #fff;
  fill-opacity: 1;
  opacity: 1;
}
.middle-container .svg-icon svg.active:hover {
  fill: #ff5000;
  fill-opacity: 1;
  opacity: 1;
}
.middle-container .square-container {
  position: relative;
  width: 100%;
}
.middle-container .square-container .sq-block {
  width: 825px;
  height: auto;
  margin: 0 auto;
}
.middle-container .square-container .sq-block .items-left {
  float: left;
  display: block !Important;
}
.middle-container .square-container .sq-block .items {
  width: 144px;
  height: 160px;
  border: 1px solid #303030;
  border-radius: 40px;
  display: inline-block;
  margin-left: 10px;
  margin-right: 10px;
  margin-bottom: 20px;
  cursor: pointer;
}
.middle-container .square-container .sq-block .items:hover {
  border: 1px solid #ff5000;
}
.middle-container .square-container .sq-block .items .line-3 div:first-child {
  margin-top: 30px;
  margin-bottom: 20px;
}
.middle-container .square-container .sq-block .items .line-3 div:first-child img {
  width: 45px;
  height: 45px;
}
.middle-container .square-container .sq-block .items .line-3 div:nth-child(2) {
  color: #f2f4ff;
  font-family: Lato;
  font-size: 14px;
  font-weight: 400;
  line-height: 17px;
  margin-bottom: 10px;
  text-transform: capitalize;
}
.middle-container .square-container .sq-block .items .line-3 div:nth-child(3) {
  color: #ff5000;
  font-family: Lato;
  font-size: 14px;
  font-weight: 400;
  line-height: 17px;
  text-transform: capitalize;
}
.middle-container .square-container .sq-block .items .icon-text div:first-child {
  margin-top: 40px;
  margin-bottom: 20px;
}
.middle-container .square-container .sq-block .items .icon-price-text div:first-child {
  margin-top: 20px;
  margin-bottom: 5px;
}
.middle-container .square-container .sq-block .items .icon-price-text div:nth-child(2) {
  color: #ff8300;
  font-family: Lato;
  font-size: 36px;
  font-weight: 400;
  line-height: 48px;
  margin-bottom: 5px;
}
.middle-container .square-container .sq-block .items .icon-price-text div:nth-child(3) {
  color: #f2f4ff;
  font-family: Lato;
  font-size: 14px;
  font-weight: 400;
  line-height: 17px;
}
.middle-container .square-container .sq-block .items .icon div:first-child {
  margin-top: 60px;
  margin-bottom: 20px;
}
.middle-container .square-container .sq-block .items-active {
  background-color: #ff5000;
}
.middle-container .square-container .sq-block .items-active div {
  color: white !important;
}
.middle-container .action-btn-upgrade {
  width: 141px;
  height: 40px;
  border: 1px solid #979797;
  border-radius: 40px;
  color: white;
  font-family: Lato;
  font-size: 14px;
  font-weight: 400;
  line-height: 17px;
  margin: 0 auto;
  background-color: transparent;
  outline: 0;
}
.middle-container .abs-square-container {
  position: relative;
  width: 100%;
  height: auto;
}
.middle-container .abs-square-container .asq-block {
  width: auto;
  height: auto;
}
.middle-container .abs-square-container .asq-block .items {
  width: 305px;
  height: 112px;
  border: 1px solid #979797;
  display: inline-block;
  margin-left: 10px;
  margin-right: 10px;
  margin-bottom: 20px;
  cursor: pointer;
}
.middle-container .abs-square-container .asq-block .items:hover {
  border: 1px solid #ff5000;
}
.middle-container .abs-square-container .asq-block .items-selected {
  background-color: #ff5000;
  color: white;
  border: 1px solid #ff5000;
}
.middle-container .abs-square-container .asq-block .items-selected [class^="txt"] {
  /* OVERIDE */
  color: white !important;
}
.middle-container .abs-square-container .asq-block .items-selected [class*="th"] {
  /* OVERIDE */
  color: white !important;
  opacity: 0.6;
}
.middle-container .marble-container {
  position: relative;
  width: 100%;
  height: auto;
}
.middle-container .marble-container .m-block {
  width: auto;
  height: auto;
  display: inline-flex;
}
.middle-container .marble-container .m-block .items {
  width: 180px;
  height: 255px;
  margin-left: 15px;
  margin-right: 15px;
  margin-bottom: 20px;
  display: inline-block;
  text-align: center;
  word-break: break-all;
}
.middle-container .marble-container .m-block .items .circle {
  width: 135px;
  height: 135px;
  border-radius: 50%;
  margin: 0 auto;
}
.middle-container .marble-container .m-block .items .circle img {
  width: 135px;
  height: 135px;
  border: 1px solid #ff5000;
}
.middle-container .marble-container .m-block .items .circle-small {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  margin: 0 auto;
  background-color: #303030;
  cursor: pointer;
}
.middle-container .marble-container .m-block .items .circle-small svg {
  margin-top: 25px;
}
.middle-container .marble-container .m-block .items .plus {
  width: 135px;
  height: 135px;
  border-radius: 50%;
  border: 1px solid #303030;
  cursor: pointer;
}
.middle-container .marble-container .m-block .items .plus svg {
  margin-top: 50px;
}
.middle-container .button-container .items {
  display: inline-block;
  margin-left: 20px;
  margin-right: 20px;
  cursor: pointer;
}
.middle-container .button-container .items .turn-left {
  transform: rotate(-180deg);
}
.middle-container .button-container .items svg {
  fill: #ffffff;
}
.middle-container .button-container .items.active svg,
.middle-container .button-container .items.active path {
  fill: #fff;
  opacity: 1 !important;
  fill-opacity: 1 !important;
}
.middle-container .button-container .items.active:hover svg {
  fill: #fff;
  opacity: 1 !important;
  fill-opacity: 1 !important;
}
.middle-container .button-container .items.active:hover svg path {
  fill: #fff;
  opacity: 1;
  fill-opacity: 1;
}
.middle-container .button-container .items.active:active svg {
  fill: #fff;
  opacity: 1 !important;
  fill-opacity: 1 !important;
}
.middle-container .button-container .items.active:active svg path {
  fill: #ff5000;
  opacity: 1;
  fill-opacity: 1;
}
.middle-container .button-on-middle {
  width: 100%;
  display: block;
  text-align: center;
  margin: 0 auto;
}
.middle-container .button-on-middle button {
  color: inherit;
  border: 0px;
  background-color: transparent;
  display: inline-block;
  margin-left: 10px;
  margin-right: 10px;
}
.middle-container .button-on-middle button:active svg {
  fill: #ff5000;
  fill-opacity: 1;
}
.middle-container .button-on-middle button:active svg path {
  fill: #ff5000;
  fill-opacity: 1;
}
.middle-container .button-on-middle button:hover svg {
  color: #ff9500 !important;
  fill: #ff9500 !important;
  opacity: 1;
  fill-opacity: 1;
}
.middle-container .button-on-middle button.backward svg,
.middle-container .button-on-middle button.backward img,
.middle-container .button-on-middle button.backward span {
  transform: rotate(-180deg);
}
.middle-container .button-on-middle button.forward svg,
.middle-container .button-on-middle button.forward img,
.middle-container .button-on-middle button.forward span {
  transform: rotate(0deg);
}
.middle-container .button-on-middle button:active svg {
  fill: #ff5000 !important;
  fill-opacity: 1;
}
.middle-container .button-on-middle button:active svg path {
  fill: #ff5000 !important;
  fill-opacity: 1;
}
.middle-container .button-on-middle button:hover svg {
  color: #ff9500 !important;
  fill: #ff9500 !important;
  opacity: 1;
  fill-opacity: 1;
}
.middle-container .button-on-middle button:hover svg path {
  color: #ff9500;
  fill: #ff9500;
  fill-opacity: 1;
}
.middle-container .button-on-middle button.active svg {
  fill: #fff;
  fill-opacity: 1;
}
.middle-container .button-on-middle button.active svg path {
  fill: #fff;
  fill-opacity: 1;
}
.middle-container .button-on-middle button.active:active svg {
  fill: #ff5000 !important;
  fill-opacity: 1;
}
.middle-container .button-on-middle button.active:active svg path {
  fill: #ff5000 !important;
  fill-opacity: 1;
}
.middle-container .button-on-middle button.active:hover svg {
  color: #ff9500 !important;
  fill: #ff9500 !important;
  opacity: 1;
  fill-opacity: 1;
}
.middle-container .button-on-middle button.active:hover svg path {
  color: #ff9500;
  fill: #ff9500;
  fill-opacity: 1;
}
.middle-container .button-on-middle button.disabled svg {
  opacity: 0.5;
  fill-opacity: 0.5;
}
.middle-container .button-on-middle button.disabled svg path {
  opacity: 0.5;
  fill-opacity: 0.5;
}
.middle-container .button-on-middle button.disabled:hover svg {
  fill: #fff;
  fill-opacity: 0.5;
}
.middle-container .button-on-middle button.disabled:hover svg path {
  fill: #fff;
  fill-opacity: 0.5;
}
.middle-container .button-on-middle button.disabled:active svg {
  fill: #fff;
  fill-opacity: 0.5;
}
.middle-container .button-on-middle button.disabled:active svg path {
  fill: #fff;
  fill-opacity: 0.5;
}
.display-owner-profile {
  width: 135px;
  height: 135px;
  position: absolute;
  top: 0;
  margin-left: -70px;
  border-radius: 50%;
}
.tos .txt-normal {
  font-size: 15px;
  line-height: 150%;
}
.rev-for-fix {
  margin-top: 140px;
}
.rev-for-fix thead {
  position: fixed;
  z-index: 1;
}
.rev-for-fix tbody tr:first-child td {
  padding-top: 230px !important;
}
.rev-for-fix-head {
  position: fixed;
  width: 100%;
  text-align: center;
}
.img-rounded {
  border-radius: 50%;
}
.dashboard-marble {
  cursor: pointer;
}
.dashboard-marble:hover {
  border: 2px solid #ff5000 !important;
}
.padTop50 .middle-3-block.centerthischoose {
  display: block;
  left: 325px;
}
.container-black-rounded {
  position: re;
  clear: both;
  background-color: rgba(0, 0, 0, 0.05);
  border-radius: 40px;
  min-height: 300px;
  max-width: auto;
  text-align: center;
  margin: 0 auto;
}
.container-black-rounded .box-marble {
  position: relative;
  margin: 0 auto;
  width: 305px;
}
.container-black-rounded .marble-rounded {
  width: 144px;
  height: 160px;
  border: 1px solid #303030;
  border-radius: 40px;
  float: left;
}
.container-black-rounded .marble-rounded:first-child {
  margin-right: 17px;
}
.container-black-rounded .marble-rounded .line-name {
  color: rgba(255, 255, 255, 0.52);
  font-family: Lato;
  font-size: 20px;
  font-weight: 300;
  line-height: 24px;
  margin-top: 10px;
  text-transform: capitalize;
}
.container-black-rounded .marble-rounded .line-number {
  height: 57px;
  color: rgba(255, 255, 255, 0.52);
  font-family: Lato;
  font-size: 48px;
  font-weight: 400;
  line-height: 57px;
  margin-top: 5px;
}
.container-black-rounded .marble-rounded .line-number-txt {
  color: rgba(255, 255, 255, 0.52);
  font-family: Lato;
  font-size: 14px;
  font-weight: 400;
  line-height: 17px;
  margin-top: 5px;
}
.container-black-rounded .marble-rounded .line-button {
  height: 17px;
  color: rgba(255, 255, 255, 0.52);
  font-family: Lato;
  font-size: 14px;
  font-weight: 400;
  line-height: 17px;
  margin-top: 3px;
}
.container-black-rounded .marble-rounded .red-txt {
  color: #d0021b;
  margin-top: 5px;
}
.container-black-rounded .marble-rounded .txt-small {
  color: rgba(255, 255, 255, 0.52);
  font-family: Lato;
  font-size: 14px;
  font-weight: 400;
  line-height: 17px;
  margin-top: 20px;
}
.container-black-rounded .marble-rounded .red-color {
  color: #d0021b;
}
.container-black-rounded .center-rounded {
  width: 144px;
  height: 160px;
  border: 1px solid #303030;
  border-radius: 40px;
  margin-left: 10px;
  margin-right: 10px;
  display: inline-block;
}
.container-black-rounded .center-rounded .app-ico {
  margin-top: 20px;
}
.container-black-rounded .center-rounded .app-price {
  width: 100%;
  height: 48px;
  color: #ff8300;
  font-family: Lato;
  font-size: 36px;
  font-weight: 400;
  line-height: 48px;
  text-align: center;
  margin-top: 10px;
}
.container-black-rounded .center-rounded .app-txt {
  width: 100%;
  height: 17px;
  color: #f2f4ff;
  font-family: Lato;
  font-size: 14px;
  font-weight: 400;
  line-height: 17px;
  text-align: center;
  margin-top: 10px;
}
.container-black-rounded .recurrring-container {
  position: relative;
  width: 901px;
  height: auto;
  margin: 0 auto;
  padding-bottom: 20px;
}
.container-black-rounded .recurrring-container .items {
  width: 280px;
  height: 190px;
  margin-left: 10px;
  margin-right: 10px;
  display: inline-block;
  margin-bottom: 20px;
}
.container-black-rounded .recurrring-container .items div,
.container-black-rounded .recurrring-container .items span {
  text-transform: capitalize;
}
.container-black-rounded .recurrring-container .items .left {
  width: 150px;
  float: left;
  height: 190px;
  background-color: rgba(0, 0, 0, 0.13);
  border-bottom-left-radius: 40px;
  border-top-left-radius: 40px;
}
.container-black-rounded .recurrring-container .items .left .cover img {
  width: 72px;
  height: 72px;
  background-color: #222;
  border-radius: 50%;
  margin: 0 auto;
}
.container-black-rounded .recurrring-container .items .right {
  float: left;
  width: 130px;
  height: 190px;
  background-color: rgba(0, 0, 0, 0.05);
  border-bottom-right-radius: 40px;
  border-top-right-radius: 40px;
}
.recurring-btn {
  clear: both;
  cursor: pointer;
  width: 36px;
  height: 36px;
  margin: 0 auto;
}
.recurring-btn:hover svg:first-child {
  display: none;
}
.recurring-btn:hover svg:nth-child(2) {
  display: block;
}
.recurring-btn svg:nth-child(2) {
  display: none;
}
.invoice-container {
  margin: 0 auto;
  position: relative;
  height: auto;
  width: 580px;
}
.invoice-container .items-1,
.invoice-container .items-2,
.invoice-container .items-3 {
  float: left;
  width: 193px;
  padding-bottom: 20px;
}
.invoice-container .items-1 {
  text-align: left;
  cursor: pointer;
}
.invoice-container .light-orange:hover {
  color: #ff5000 !important;
}
.invoice-container .items-2 {
  text-align: center;
}
.invoice-container .items-3 {
  text-align: right;
}
.close-shop {
  width: 280px;
  position: relative;
  margin: 0 auto;
  clear: left;
}
.close-shop .left,
.close-shop .right {
  cursor: pointer;
}
.close-shop .left svg,
.close-shop .right svg {
  width: 104px;
  height: 104px;
}
.close-shop .left:hover svg:first-child,
.close-shop .right:hover svg:first-child {
  display: none;
}
.close-shop .left:hover svg:nth-child(2),
.close-shop .right:hover svg:nth-child(2) {
  display: block;
}
.close-shop .left:hover .text,
.close-shop .right:hover .text {
  color: #ffffff;
}
.close-shop .left svg:nth-child(2),
.close-shop .right svg:nth-child(2) {
  display: none;
}
.close-shop .left .text,
.close-shop .right .text {
  width: 100%;
  text-align: center;
  color: rgba(255, 255, 255, 0.54);
}
.close-shop .left {
  float: left;
}
.close-shop .right {
  float: right;
}
.box-3-ext {
  display: block;
  width: 820px;
  margin: 0 auto;
}
.box-3-ext .items {
  margin: 0px 10px !important;
}
.shop-current-plan-container-all {
  position: relative;
  width: 100%;
  height: auto;
  clear: both;
  text-align: center;
  display: flex;
  flex-direction: row;
  justify-content: center;
  margin-bottom: 20px;
}
.shop-current-plan-container-all .shape {
  width: 32px;
  margin-left: 10px;
  margin-right: 10px;
  margin-top: 63px;
}
.shop-current-plan-container-all .shape.eq {
  margin-top: 70px;
}
.shop-current-plan-container-all .items {
  width: 144px;
  height: 160px;
  margin-left: 10px;
  margin-right: 10px;
  border: 1px solid #303030;
  border-radius: 40px;
  cursor: pointer;
}
.shop-current-plan-container-all .items .info {
  width: 144px;
  height: 160px;
  border-radius: 40px;
}
.shop-current-plan-container-all .items .info .get {
  width: 100%;
  height: 24px;
  color: #ffe620;
  font-family: Lato;
  font-size: 20px;
  font-weight: 300;
  line-height: 24px;
  text-align: center;
  margin-top: 8px;
  text-transform: capitalize;
}
.shop-current-plan-container-all .items .info .plan {
  width: 100%;
  height: 24px;
  color: #ffe620;
  font-family: Lato;
  font-size: 20px;
  font-weight: 900;
  line-height: 24px;
  text-align: center;
  text-transform: capitalize;
}
.shop-current-plan-container-all .items .info .price {
  width: 100%;
  height: 52px;
  color: #ffe620;
  font-family: Lato;
  font-size: 44px;
  font-weight: 400;
  line-height: 52px;
  text-align: center;
  margin-top: 7px;
}
.shop-current-plan-container-all .items .info .month {
  width: 100%;
  height: 17px;
  color: #f2f4ff;
  font-family: Lato;
  font-size: 14px;
  font-weight: 400;
  line-height: 17px;
  text-align: center;
  margin-top: 7px;
}
.shop-current-plan-container-all [price="240"] .info .txt {
  color: #ff114f;
}
.shop-current-plan-container-all [price="480"] .info .txt {
  color: #ff9500;
}
.shop-current-plan-container-all [price="990"] .info .txt {
  color: #7ed321;
}
.shop-current-plan-container-all [price="2490"] .info .txt {
  color: #2094fa;
}
.shop-current-plan-container-all [price="addon"] .info .get,
.shop-current-plan-container-all [price="add-on"] .info .get {
  margin-top: 20px;
  color: white;
  font-family: Lato;
  font-size: 20px;
  font-weight: 900;
}
.shop-current-plan-container-all [price="addon"] .info .price,
.shop-current-plan-container-all [price="add-on"] .info .price {
  margin-top: 19px;
  color: #ff8300;
}
.recurring-action-pause-close .pause-block-5 {
  position: relative;
  width: 762px;
  margin: 0 auto;
  height: auto;
  display: inline-flex;
}
.recurring-action-pause-close .pause-block-5 .blocks {
  width: 144px;
  height: 160px;
  border: 1px solid #303030;
  border-radius: 40px;
  margin-left: 14px;
  margin-right: 14px;
}
.recurring-action-pause-close .pause-block-5 .blocks .type-2 .icon {
  margin-top: 37px;
}
.recurring-action-pause-close .pause-block-5 .blocks .type-2 .txt {
  margin-top: 16px;
  text-align: center;
  height: 17px;
  color: #f2f4ff;
  font-family: Lato;
  font-size: 14px;
  font-weight: 400;
  line-height: 17px;
}
.recurring-action-pause-close .pause-block-5 .blocks .type-1 .get {
  height: 24px;
  color: white;
  font-family: Lato;
  font-size: 20px;
  font-weight: 300;
  line-height: 24px;
  width: 100%;
  text-align: center;
  margin-top: 9px;
  text-transform: capitalize;
}
.recurring-action-pause-close .pause-block-5 .blocks .type-1 .plan {
  height: 24px;
  color: white;
  font-family: Lato;
  font-size: 20px;
  font-weight: 900;
  line-height: 24px;
  text-align: center;
  text-transform: capitalize;
}
.recurring-action-pause-close .pause-block-5 .blocks .type-1 .price {
  height: 57px;
  color: white;
  font-family: Lato;
  font-size: 48px;
  font-weight: 400;
  width: 100%;
  text-align: center;
  line-height: 57px;
  text-transform: capitalize;
}
.recurring-action-pause-close .pause-block-5 .blocks .type-1 .txt {
  height: 17px;
  color: rgba(255, 255, 255, 0.52);
  font-family: Lato;
  font-size: 14px;
  font-weight: 400;
  line-height: 17px;
  width: 100%;
  text-align: center;
}
.recurring-action-pause-close .pause-block-5 .blocks-nav {
  margin-left: 12.5px;
  margin-right: 12.5px;
  margin-top: 65px;
}
.recurring-action-pause-close .downgrade-app-container {
  position: relative;
  width: 100%;
  height: auto;
}
.recurring-action-pause-close .downgrade-app-container .items {
  position: relative;
  width: 100%;
  text-align: center;
  clear: both;
  margin-bottom: 20px;
  float: left;
}
.recurring-action-pause-close .downgrade-app-container .items .icon {
  float: left;
  width: 48%;
  text-align: right;
  padding-right: 10px;
}
.recurring-action-pause-close .downgrade-app-container .items .txt {
  padding-left: 10px;
  float: right;
  width: 52%;
  text-align: left;
  color: white;
  font-family: Lato;
  font-size: 18px;
  font-weight: 400;
  line-height: 28.8px;
}
.recurring-action-pause-close .close-pause-block-2 {
  position: relative;
  width: 718px;
  margin: 0 auto;
  height: auto;
}
.recurring-action-pause-close .close-pause-block-2 .items {
  position: relative;
  float: left;
  width: 330px;
  height: auto;
  margin-right: 14px;
  margin-left: 14px;
}
.recurring-action-pause-close .close-pause-block-2 .items .icon {
  text-align: center;
  margin: 0 auto;
  width: 64px;
  height: 64px;
}
.recurring-action-pause-close .close-pause-block-2 .items .icon img:first-child {
  display: block;
}
.recurring-action-pause-close .close-pause-block-2 .items .icon img:nth-child(2) {
  display: none;
}
.recurring-action-pause-close .close-pause-block-2 .items .icon:hover img:first-child {
  display: none;
}
.recurring-action-pause-close .close-pause-block-2 .items .icon:hover img:nth-child(2) {
  display: block;
}
.recurring-action-pause-close .close-pause-block-2 .items a {
  outline: 0px;
  cursor: pointer;
}
.recurring-action-pause-close .txt-reason-answer {
  width: 655px;
  height: 300px;
  background-color: rgba(0, 0, 0, 0.1);
  -webkit-border-radius: 40px;
  -moz-border-radius: 40px;
  border-radius: 40px;
  padding: 40px;
  border: 0;
  outline: 0;
  color: rgba(255, 255, 255, 0.54);
  font-size: 27px;
  font-weight: 300;
  line-height: 29px;
  text-align: center;
}
.recurring-action-pause-close .btn-confirm-reason {
  /* Style for "Rectangle 24" */
  width: 141px;
  height: 40px;
  border: 1px solid #979797;
  -webkit-border-radius: 40px;
  -moz-border-radius: 40px;
  border-radius: 40px;
  /* Text style for "Pause Now" */
  color: white;
  font-family: Lato;
  font-size: 14px;
  font-weight: 400;
  line-height: 21px;
  text-align: center;
  background-color: transparent;
  cursor: pointer;
  outline: 0;
}
.recurring-action-pause-close .btn-confirm-reason:hover {
  border: 1px solid #ff5000;
  color: #ff5000;
}
.invoice-container-block .document-block {
  -webkit-border-radius: 40px;
  -moz-border-radius: 40px;
  border-radius: 40px;
  background-color: #202020;
  padding: 20px 20px 40px 20px;
  width: 100%;
  margin-left: 15px;
  margin-right: 15px;
  color: white;
  font-family: Lato;
  font-size: 18px;
  font-weight: 300;
  line-height: 28.8px;
}
.invoice-container-block .document-block .container-line {
  width: 1035px;
  margin: 0 auto;
  height: auto;
  display: table;
}
.invoice-container-block .document-block .container-line .line {
  clear: both;
  position: relative;
  float: left;
  width: 100%;
}
.invoice-container-block .document-block .container-line .line .col-1 {
  width: 535px;
  position: relative;
  float: left;
  height: auto;
  text-align: left;
}
.invoice-container-block .document-block .container-line .line .col-2 {
  width: 202px;
  text-align: center;
  float: left;
  position: relative;
  height: auto;
}
.invoice-container-block .document-block .container-line .line .col-3 {
  width: 153px;
  text-align: right;
  float: left;
  position: relative;
  height: auto;
}
.invoice-container-block .document-block .container-line .line .col-4 {
  width: 144px;
  text-align: right;
  float: left;
  position: relative;
  height: auto;
}
.invoice-container-block .invoice-download-btn {
  -webkit-border-radius: 40px;
  -moz-border-radius: 40px;
  border-radius: 40px;
  width: 141px;
  height: 40px;
  border: 1px solid #979797;
  color: white;
  font-family: Lato;
  font-size: 14px;
  font-weight: 400;
  line-height: 21px;
  background-color: transparent;
}
.invoice-container-block .invoice-download-btn:hover {
  border: 1px solid #ff5000;
  color: #ff5000;
}
.tel-container {
  width: 100%;
  margin: 0 auto;
  display: inline-block;
  border-bottom: 1px solid #ff5000;
  margin-bottom: 10px;
}
.tel-container .input-tel {
  position: relative;
  width: 500px;
  margin: 0 auto;
  display: inline-block;
}
.tel-container .input-tel .block-1,
.tel-container .input-tel .block-2,
.tel-container .input-tel .block-3 {
  border: 0px;
  background: none;
  outline: none;
  text-align: center;
  color: #ff5000;
  font-size: 48px;
  font-weight: 300;
  display: inline-block;
}
.tel-container .input-tel .block-1 input,
.tel-container .input-tel .block-2 input,
.tel-container .input-tel .block-3 input {
  width: 100%;
  background-color: transparent;
  border: 0px;
  outline: 0;
  text-align: center;
}
.tel-container .input-tel .block-1 .input-placeholder,
.tel-container .input-tel .block-2 .input-placeholder,
.tel-container .input-tel .block-3 .input-placeholder {
  color: #323232;
  font-weight: 300;
  display: inline-block;
  line-height: 1em;
}
.tel-container .input-tel .block-1 input::-webkit-input-placeholder,
.tel-container .input-tel .block-2 input::-webkit-input-placeholder,
.tel-container .input-tel .block-3 input::-webkit-input-placeholder {
  color: #323232;
  font-weight: 300;
  display: inline-block;
  line-height: 1em;
}
.tel-container .input-tel .block-1 input:-moz-placeholder,
.tel-container .input-tel .block-2 input:-moz-placeholder,
.tel-container .input-tel .block-3 input:-moz-placeholder {
  color: #323232;
  font-weight: 300;
  display: inline-block;
  line-height: 1em;
}
.tel-container .input-tel .block-1 input::-moz-placeholder,
.tel-container .input-tel .block-2 input::-moz-placeholder,
.tel-container .input-tel .block-3 input::-moz-placeholder {
  color: #323232;
  font-weight: 300;
  display: inline-block;
  line-height: 1em;
}
.tel-container .input-tel .block-1 input:-ms-input-placeholder,
.tel-container .input-tel .block-2 input:-ms-input-placeholder,
.tel-container .input-tel .block-3 input:-ms-input-placeholder {
  color: #323232;
  font-weight: 300;
  display: inline-block;
  line-height: 1em;
}
.tel-container .input-tel .block-1 {
  width: 20%;
}
.tel-container .input-tel .block-2 {
  width: 20%;
}
.tel-container .input-tel .block-3 {
  width: 25%;
}
.tel-container .input-tel .block-phon-number-full {
  width: 100%;
}
.tel-container .input-tel .block-phon-number-full input {
  width: 100%;
  background-color: transparent;
  border: 0px;
  outline: 0;
  text-align: center;
  color: #ff5000;
  font-size: 48px;
  height: 72px;
  line-height: 72px;
  font-weight: 300;
}
.tel-container .input-tel .block-phon-number-full .input-placeholder {
  color: #323232;
  font-weight: 300;
  display: inline-block;
  line-height: 1em;
}
.tel-container .input-tel .block-phon-number-full input::-webkit-input-placeholder {
  color: #323232;
  font-weight: 300;
  display: inline-block;
  line-height: 1em;
}
.tel-container .input-tel .block-phon-number-full input:-moz-placeholder {
  color: #323232;
  font-weight: 300;
  display: inline-block;
  line-height: 1em;
}
.tel-container .input-tel .block-phon-number-full input::-moz-placeholder {
  color: #323232;
  font-weight: 300;
  display: inline-block;
  line-height: 1em;
}
.tel-container .input-tel .block-phon-number-full input:-ms-input-placeholder {
  color: #323232;
  font-weight: 300;
  display: inline-block;
  line-height: 1em;
}
.tel-container .input-tel .block-dash {
  border: 0px;
  background: none;
  outline: none;
  width: 20px;
  text-align: center;
  font-size: 48px;
  font-weight: 300;
  display: inline-block;
}
.tel-container .input-tel .block-dash input {
  width: 100%;
  background-color: transparent;
  border: 0px;
  outline: 0;
  text-align: center;
  color: #ff5000;
}
.sign_tos_body {
  text-align: left;
  font-size: 18px;
  font-weight: 400;
  color: rgba(255, 255, 255, 0.54);
  line-height: 28.8px;
}
.sign_tos_body p {
  font-size: 18px;
  margin: 0px;
  padding: 20px 0px;
}
.sign_tos_body h3 {
  color: #fff;
  margin: 0px;
  padding: 20px 0px;
}
.sign_tos_body a {
  text-decoration: underline;
}
.signup_complete .txt-big {
  font-family: Lato;
  font-size: 24px;
  font-weight: 700;
  line-height: 36px;
}
.signup_complete .txt-normal {
  color: rgba(255, 255, 255, 0.54);
  font-weight: 300;
}
.dashboard_home .owner_profile_image {
  margin: auto;
  width: 136px;
  height: 136px;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  overflow: hidden;
  background: #303030;
}
.dashboard_home .label.storename {
  height: 54px;
  color: #e64900;
  font-family: Lato;
  font-size: 36px;
  font-weight: 700;
  line-height: 54px;
  text-align: center;
}
.dashboard_home .label.orangeH3 {
  height: 37px;
  color: #ff8300;
  font-family: Lato;
  font-size: 24px;
  font-weight: 700;
  line-height: 36.4px;
}
.dashboard_home .label.orangeH4_light1 {
  height: 37px;
  color: #ff8300;
  font-family: Lato;
  font-size: 20px;
  font-weight: 400;
  line-height: 36.4px;
}
.dashboard_home .label.orangeH3_ff5000 {
  height: 37px;
  color: #ff5000;
  font-family: Lato;
  font-size: 24px;
  font-weight: 700;
  line-height: 36.4px;
}
.dashboard_home .label.normal_light1 {
  height: 28px;
  color: #999;
  font-size: 24px;
  line-height: 27px;
  font-weight: 300;
}
.dashboard_home .label.normal_light1.en {
  font-size: 18px;
}
.dashboard_home .label.normal_white1 {
  height: 36px;
  color: white;
  font-size: 24px;
  font-weight: 300;
  line-height: 36px;
}
.dashboard_home .input_bigger {
  border: 0px;
  background: none;
  color: #ff5000;
  font-size: 64px;
  text-align: center;
  font-size: 48px;
  width: 100%;
}
.dashboard_home .input_bigger.slim1 {
  font-weight: 300;
}
.dashboard_home .underline_input {
  border: 1px solid #ff5000;
}
.dashboard_home .shop_list_area {
  width: 976px;
  margin: auto;
  min-height: 335px;
}
.dashboard_home .shop_list_area .ui-store-card {
  width: 324px;
}
.dashboard_home .shop_list_area .ui-store-card.center {
  margin: auto;
  clear: both;
}
.dashboard_home .shop_list_area .ui-store-card.left {
  float: left;
}
.ui_store_card_holder {
  cursor: default;
  padding: 0px;
  margin: 0px;
}
.ui_store_card_holder .ui_plan_card {
  margin: 20px 9px;
  float: left;
  margin-bottom: 30px;
}
.ui_store_card_holder .text_of_subscription .label.en {
  height: 37px;
  color: #ff8300;
  font-size: 24px;
  font-weight: 700;
  line-height: 36.4px;
}
.ui_store_card_holder .text_of_subscription .label.th {
  height: 28px;
  color: #999;
  font-size: 25px;
  line-height: 27px;
  font-weight: 300;
}
.ui_store_card_holder[target=_blank] {
  background-color: yellow;
}
.ui-store-card.blank {
  cursor: default;
}
.ui_store_card {
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  transition: all 0.3s;
  webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  -o-transition: all 0.3s;
  -webkit-border-radius: 40px;
  -moz-border-radius: 40px;
  border-radius: 40px;
  border: 1px solid #303030;
  padding: 0px;
  margin: 0px 10px;
  width: 305px;
  height: 334px;
  overflow: hidden;
}
.ui_store_card .card_filter {
  position: absolute;
  width: inherit;
  height: inherit;
  background-color: rgba(48, 48, 48, 0.9);
  z-index: 90;
  -webkit-border-radius: inherit;
  -moz-border-radius: inherit;
  border-radius: inherit;
  display: table;
}
.ui_store_card .card_filter .card_svg_center {
  display: table-cell;
  vertical-align: middle;
}
.ui_store_card .store_profile_image {
  border: 1px solid #ff5000;
  color: #ff5000;
  width: 100px;
  height: 100px;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  margin: auto;
  overflow: hidden;
}
.ui_store_card .label.storename {
  height: 29px;
  color: white;
  font-size: 18px;
  font-weight: 400;
  line-height: 28.8px;
}
.ui_store_card .addon_list_area {
  width: 216px;
  margin: auto;
}
.ui_store_card .addon_list_area .addon_item {
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  overflow: hidden;
  float: left;
  background-color: #303030;
  margin: 12px;
  width: 48px;
  height: 48px;
}
/* MIXIN : plancard_render_themecolor : START */
/* MIXIN : plancard_render_themecolor : END */
.ui_plan_card {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  transition: all 0.3s;
  webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  -o-transition: all 0.3s;
  -webkit-border-radius: 40px;
  -moz-border-radius: 40px;
  border-radius: 40px;
  text-align: center ;
  cursor: default;
  margin: 0px auto;
  width: 144px;
  height: 160px;
  border: 1px solid #303030;
  /* plan_body_info */
  /* plan_body_remain */
}
.ui_plan_card .plan_body_info {
  padding: 10px 0px;
}
.ui_plan_card .plan_body_info .label {
  color: #fff;
}
.ui_plan_card .plan_body_info .label.hLight1 {
  height: 24px;
  font-size: 20px;
  font-weight: 300;
  line-height: 24px;
}
.ui_plan_card .plan_body_info .label .text_head14 {
  height: 17px;
  color: #f2f4ff;
  font-size: 14px;
  font-weight: 400;
  line-height: 17px;
}
.ui_plan_card .plan_body_info .label.plan_time_text {
  color: white;
  font-size: 20px;
  font-weight: 300;
  height: 24px;
}
.ui_plan_card .plan_body_info .label.plan_promo_text {
  color: #d0021b;
  font-size: 20px;
  height: 24px;
  font-weight: 400;
}
.ui_plan_card .plan_body_info .label.plan_name {
  height: 24px;
  font-size: 20px;
  font-weight: 900;
  line-height: 24px;
}
.ui_plan_card .plan_body_info .label.plan_price {
  padding: 0px;
  height: 57px;
  font-size: 48px;
  font-weight: 400;
  line-height: 57px;
}
.ui_plan_card .plan_body_info .label.plan_price.orange {
  color: #ff5000;
}
.ui_plan_card .plan_body_info .label.plan_subfix {
  height: 17px;
  color: rgba(255, 255, 255, 0.52);
  font-size: 14px;
  font-weight: 400;
  line-height: 17px;
}
.ui_plan_card .plan_body_info .label.plan_text_white14 {
  height: 17px;
  color: #f2f4ff;
  font-size: 14px;
  font-weight: 400;
  line-height: 17px;
}
.ui_plan_card .plan_body_info .text_middle {
  position: absolute;
  width: 142;
  margin: auto;
  margin-top: 42px;
  text-align: center;
}
.ui_plan_card .plan_body_info .text_bottom {
  position: absolute;
  width: 142;
  margin: auto;
  margin-top: 52px;
  text-align: center;
}
.ui_plan_card .plan_body_remain {
  padding: 20px 0px;
}
.ui_plan_card .plan_body_remain .label.textLight1 {
  height: 17px;
  color: rgba(255, 255, 255, 0.52);
  font-size: 14px;
  font-weight: 400;
  line-height: 17px;
}
.ui_plan_card .plan_body_remain .label.day_number {
  height: 48px;
  color: #d0021b;
  font-size: 48px;
  font-weight: 400;
  line-height: 48px;
}
.ui_plan_card .plan_body_remain .label.day_string {
  height: 17px;
  color: rgba(255, 255, 255, 0.52);
  font-size: 14px;
  font-weight: 400;
  line-height: 17px;
}
.ui_plan_card .plan_body_remain .label.due_str {
  height: 17px;
  color: #d0021b;
  font-size: 14px;
  font-weight: 400;
  line-height: 17px;
}
.ui_plan_card.green .plan_body_info .label.hLight1 {
  color: #7ed321;
}
.ui_plan_card.green .plan_body_info .label.plan_name {
  color: #7ed321;
}
.ui_plan_card.green .plan_body_info .label.plan_price {
  color: #7ed321;
}
.ui_plan_card.green .plan_body_info .label.plan_subfix {
  color: rgba(255, 255, 255, 0.52);
}
.ui_plan_card.pink .plan_body_info .label.hLight1 {
  color: #ff114f;
}
.ui_plan_card.pink .plan_body_info .label.plan_name {
  color: #ff114f;
}
.ui_plan_card.pink .plan_body_info .label.plan_price {
  color: #ff114f;
}
.ui_plan_card.pink .plan_body_info .label.plan_subfix {
  color: rgba(255, 255, 255, 0.52);
}
.ui_plan_card.gray .plan_body_info .label.hLight1 {
  color: rgba(255, 255, 255, 0.54);
}
.ui_plan_card.gray .plan_body_info .label.plan_name {
  color: rgba(255, 255, 255, 0.54);
}
.ui_plan_card.gray .plan_body_info .label.plan_price {
  color: rgba(255, 255, 255, 0.54);
}
.ui_plan_card.gray .plan_body_info .label.plan_subfix {
  color: rgba(255, 255, 255, 0.52);
}
.ui_plan_card.yellow .plan_body_info .label.hLight1 {
  color: #ffe620;
}
.ui_plan_card.yellow .plan_body_info .label.plan_name {
  color: #ffe620;
}
.ui_plan_card.yellow .plan_body_info .label.plan_price {
  color: #ffe620;
}
.ui_plan_card.yellow .plan_body_info .label.plan_subfix {
  color: rgba(255, 255, 255, 0.52);
}
.ui_plan_card.yellow_half .plan_body_info .label.hLight1 {
  color: #ff9500;
}
.ui_plan_card.yellow_half .plan_body_info .label.plan_name {
  color: #ff9500;
}
.ui_plan_card.yellow_half .plan_body_info .label.plan_price {
  color: #ff9500;
}
.ui_plan_card.yellow_half .plan_body_info .label.plan_subfix {
  color: rgba(255, 255, 255, 0.52);
}
.ui_plan_card.blue .plan_body_info .label.hLight1 {
  color: #2094fa;
}
.ui_plan_card.blue .plan_body_info .label.plan_name {
  color: #2094fa;
}
.ui_plan_card.blue .plan_body_info .label.plan_price {
  color: #2094fa;
}
.ui_plan_card.blue .plan_body_info .label.plan_subfix {
  color: rgba(255, 255, 255, 0.52);
}
.ui_plan_card.enterprise .plan_body_info .label.hLight1 {
  color: #f2f4ff;
}
.ui_plan_card.enterprise .plan_body_info .label.plan_name {
  color: #f2f4ff;
}
.ui_plan_card.enterprise .plan_body_info .label.plan_price {
  color: #ff5000;
}
.ui_plan_card.enterprise .plan_body_info .label.plan_subfix {
  color: rgba(255, 255, 255, 0.52);
}
.ui_plan_card.enable {
  cursor: pointer;
}
.ui_plan_card.enable:hover {
  border: 1px solid #ff5000;
}
.ui_plan_card.enable.active {
  cursor: default;
}
.ui_plan_card.enable.green:hover {
  border: 1px solid #7ed321;
}
.ui_plan_card.enable.green:active,
.ui_plan_card.enable.green.active {
  background: #7ed321;
  border: 1px solid #7ed321;
  color: white;
}
.ui_plan_card.enable.green:active .label.hLight1,
.ui_plan_card.enable.green.active .label.hLight1 {
  color: white;
}
.ui_plan_card.enable.green:active .label.plan_name,
.ui_plan_card.enable.green.active .label.plan_name {
  color: white;
}
.ui_plan_card.enable.green:active .label.plan_price,
.ui_plan_card.enable.green.active .label.plan_price {
  color: white;
}
.ui_plan_card.enable.green:active .label.plan_subfix,
.ui_plan_card.enable.green.active .label.plan_subfix {
  color: white;
}
.ui_plan_card.enable.pink:hover {
  border: 1px solid #ff114f;
}
.ui_plan_card.enable.pink:active,
.ui_plan_card.enable.pink.active {
  background: #ff114f;
  border: 1px solid #ff114f;
  color: white;
}
.ui_plan_card.enable.pink:active .label.hLight1,
.ui_plan_card.enable.pink.active .label.hLight1 {
  color: white;
}
.ui_plan_card.enable.pink:active .label.plan_name,
.ui_plan_card.enable.pink.active .label.plan_name {
  color: white;
}
.ui_plan_card.enable.pink:active .label.plan_price,
.ui_plan_card.enable.pink.active .label.plan_price {
  color: white;
}
.ui_plan_card.enable.pink:active .label.plan_subfix,
.ui_plan_card.enable.pink.active .label.plan_subfix {
  color: white;
}
.ui_plan_card.enable.gray:hover {
  border: 1px solid rgba(255, 255, 255, 0.54);
}
.ui_plan_card.enable.gray:active,
.ui_plan_card.enable.gray.active {
  background: rgba(255, 255, 255, 0.54);
  border: 1px solid rgba(255, 255, 255, 0.54);
  color: white;
}
.ui_plan_card.enable.gray:active .label.hLight1,
.ui_plan_card.enable.gray.active .label.hLight1 {
  color: white;
}
.ui_plan_card.enable.gray:active .label.plan_name,
.ui_plan_card.enable.gray.active .label.plan_name {
  color: white;
}
.ui_plan_card.enable.gray:active .label.plan_price,
.ui_plan_card.enable.gray.active .label.plan_price {
  color: white;
}
.ui_plan_card.enable.gray:active .label.plan_subfix,
.ui_plan_card.enable.gray.active .label.plan_subfix {
  color: white;
}
.ui_plan_card.enable.yellow:hover {
  border: 1px solid #ffe620;
}
.ui_plan_card.enable.yellow:active,
.ui_plan_card.enable.yellow.active {
  background: #ffe620;
  border: 1px solid #ffe620;
  color: white;
}
.ui_plan_card.enable.yellow:active .label.hLight1,
.ui_plan_card.enable.yellow.active .label.hLight1 {
  color: white;
}
.ui_plan_card.enable.yellow:active .label.plan_name,
.ui_plan_card.enable.yellow.active .label.plan_name {
  color: white;
}
.ui_plan_card.enable.yellow:active .label.plan_price,
.ui_plan_card.enable.yellow.active .label.plan_price {
  color: white;
}
.ui_plan_card.enable.yellow:active .label.plan_subfix,
.ui_plan_card.enable.yellow.active .label.plan_subfix {
  color: white;
}
.ui_plan_card.enable.yellow_half:hover {
  border: 1px solid #ff9500;
}
.ui_plan_card.enable.yellow_half:active,
.ui_plan_card.enable.yellow_half.active {
  background: #ff9500;
  border: 1px solid #ff9500;
  color: white;
}
.ui_plan_card.enable.yellow_half:active .label.hLight1,
.ui_plan_card.enable.yellow_half.active .label.hLight1 {
  color: white;
}
.ui_plan_card.enable.yellow_half:active .label.plan_name,
.ui_plan_card.enable.yellow_half.active .label.plan_name {
  color: white;
}
.ui_plan_card.enable.yellow_half:active .label.plan_price,
.ui_plan_card.enable.yellow_half.active .label.plan_price {
  color: white;
}
.ui_plan_card.enable.yellow_half:active .label.plan_subfix,
.ui_plan_card.enable.yellow_half.active .label.plan_subfix {
  color: white;
}
.ui_plan_card.enable.blue:hover {
  border: 1px solid #2094fa;
}
.ui_plan_card.enable.blue:active,
.ui_plan_card.enable.blue.active {
  background: #2094fa;
  border: 1px solid #2094fa;
  color: white;
}
.ui_plan_card.enable.blue:active .label.hLight1,
.ui_plan_card.enable.blue.active .label.hLight1 {
  color: white;
}
.ui_plan_card.enable.blue:active .label.plan_name,
.ui_plan_card.enable.blue.active .label.plan_name {
  color: white;
}
.ui_plan_card.enable.blue:active .label.plan_price,
.ui_plan_card.enable.blue.active .label.plan_price {
  color: white;
}
.ui_plan_card.enable.blue:active .label.plan_subfix,
.ui_plan_card.enable.blue.active .label.plan_subfix {
  color: white;
}
.ui_plan_card.enable.enterprise .plan_body_info .label.hLight1 {
  color: #f2f4ff;
}
.ui_plan_card.enable.enterprise .plan_body_info .label.plan_name {
  color: #f2f4ff;
}
.ui_plan_card.enable.enterprise .plan_body_info .label.plan_price {
  color: #ff5000;
}
.ui_plan_card.enable.enterprise .plan_body_info .label.plan_subfix {
  color: rgba(255, 255, 255, 0.52);
}
.ui_plan_card.enable.enterprise:active,
.ui_plan_card.enable.enterprise.active {
  background: #ff8300;
  border: 1px solid #ff8300;
  color: white;
}
.ui_plan_card.enable.enterprise:active .label.hLight1,
.ui_plan_card.enable.enterprise.active .label.hLight1 {
  color: white;
}
.ui_plan_card.enable.enterprise:active .label.plan_name,
.ui_plan_card.enable.enterprise.active .label.plan_name {
  color: white;
}
.ui_plan_card.enable.enterprise:active .label.plan_price,
.ui_plan_card.enable.enterprise.active .label.plan_price {
  color: white;
}
.ui_plan_card.enable.enterprise:active .label.plan_subfix,
.ui_plan_card.enable.enterprise.active .label.plan_subfix {
  color: white;
}
.ui_plan_card.enable.custom_plan:active,
.ui_plan_card.enable.custom_plan.active {
  background: #ff9500;
  border: 1px solid #ff9500;
  color: white;
}
.ui_plan_card.enable.custom_plan:active .label.hLight1,
.ui_plan_card.enable.custom_plan.active .label.hLight1 {
  color: white;
}
.ui_plan_card.enable.custom_plan:active .label.plan_name,
.ui_plan_card.enable.custom_plan.active .label.plan_name {
  color: white;
}
.ui_plan_card.enable.custom_plan:active .label.plan_price,
.ui_plan_card.enable.custom_plan.active .label.plan_price {
  color: white;
}
.ui_plan_card.enable.custom_plan:active .label.plan_subfix,
.ui_plan_card.enable.custom_plan.active .label.plan_subfix {
  color: white;
}
.ui_plan_card.enable.price_info {
  cursor: default;
}
.ui_plan_card.enable.price_info:hover {
  border: 1px solid #303030;
}
.ui_plan_card.enable.price_info .plan_subfix_white {
  color: white;
  height: 17px;
  font-size: 14px;
  font-weight: 400;
  line-height: 17px;
}
.uiStoreBarSelected_div {
  width: 100%;
  height: 230px;
  position: fixed;
  top: 0px;
  left: 0px;
  z-index: 900;
}
.uiStoreBarSelector {
  width: 100%;
  height: 150px;
  background-color: #191919;
}
.uiStoreBarSelector .storeBarContent {
  position: relative;
  top: 20px;
  width: 100%;
  height: 114px;
  margin: 0px auto;
  max-width: 980px;
}
.uiStoreBarSelector .storeBarContent .storeButton {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  transition: all 0.3s;
  webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  -o-transition: all 0.3s;
  cursor: pointer;
  width: 140px;
  height: 100%;
  position: relative;
  margin: 0 10px;
  opacity: 0.5;
}
.uiStoreBarSelector .storeBarContent .storeButton .store_profile_image {
  margin: 0px;
  position: relative;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  width: 80px;
  height: 80px;
  border: 1px solid #FF5000;
}
.uiStoreBarSelector .storeBarContent .storeButton .label {
  transition: all 0.3s;
  webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  -o-transition: all 0.3s;
  position: relative;
  display: block;
  width: 100%;
  opacity: 0;
}
.uiStoreBarSelector .storeBarContent .storeButton .label.storename {
  text-align: center;
  height: 24px;
  color: white;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
}
.uiStoreBarSelector .storeBarContent .storeButton:hover {
  opacity: 1;
}
.uiStoreBarSelector .storeBarContent .storeButton:hover .label {
  opacity: 1;
}
.uiStoreBarSelector .storeBarContent .storeButton.active {
  cursor: default;
  opacity: 1;
}
.uiStoreBarSelector .storeBarContent .storeButton.active .label {
  opacity: 1;
}
/*<< UiCircleItemCart : START >>*/
.feature_list_area {
  width: 820px;
  margin: 10px auto;
}
div[ui-circle-item-card] {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  transition: all 0.2s;
  webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -o-transition: all 0.2s;
  padding: 0px;
  width: 144px;
  height: 140px;
  margin: 10px;
  cursor: default;
}
div[ui-circle-item-card] .ui-circle-item-card-body .item-card-image {
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  width: 72px;
  height: 72px;
  background-color: #303030;
  margin: auto;
}
div[ui-circle-item-card] .ui-circle-item-card-body .label.item-name {
  width: 100%;
  color: rgba(255, 255, 255, 0.54);
  font-size: 15px;
  font-weight: 400;
}
div[ui-circle-item-card] .ui-circle-item-card-body {
  transition: all 0.2s;
  webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -o-transition: all 0.2s;
}
div[ui-circle-item-card] .ui-circle-item-card-body.ng-enter {
  opacity: 0;
}
div[ui-circle-item-card] .ui-circle-item-card-body.ng-enter.ng-enter-active {
  opacity: 1;
}
div[ui-circle-item-card] .ui-circle-item-card-body.ng-leave {
  opacity: 1;
}
div[ui-circle-item-card] .ui-circle-item-card-body.ng-leave.ng-leave-active {
  opacity: 0;
}
/*<< UiCircleItemCart : END >>*/
/*<< UiPlanUpgradeBar : START >>*/
div[ui-plan-upgrade-bar] {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  transition: all 0.2s;
  webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -o-transition: all 0.2s;
  position: fixed;
  width: 100%;
  min-width: 980px;
  height: 300px;
  top: 80px;
  left: 0px;
  z-index: 500;
  background-color: #191919;
  border: 1px solid #222;
}
div[ui-plan-upgrade-bar] .bottom_line {
  height: 2px;
  width: 100%;
  background-color: #e64900;
  position: relative;
  top: 100%;
  margin-top: -2px;
}
div[ui-plan-upgrade-bar] .ui-plan-upgrade-bar-body {
  min-height: 274px;
  margin: 0px auto;
}
div[ui-plan-upgrade-bar] .ui-plan-upgrade-bar-body .text_label {
  width: 100%;
  text-align: center;
  margin: 0px;
}
div[ui-plan-upgrade-bar] .ui-plan-upgrade-bar-body .text_label.head1 {
  text-align: center;
  width: 100%;
  height: 36px;
  color: #ff5000;
  font-size: 24px;
  font-weight: 700;
  line-height: 36px;
}
div[ui-plan-upgrade-bar] .ui-plan-upgrade-bar-body .text_label.light_gray {
  height: 28px;
  color: #999;
  font-size: 24px;
  line-height: 27px;
}
div[ui-plan-upgrade-bar] .ui-plan-upgrade-bar-body .compare_area_div {
  height: 160px;
  margin: 0px;
  padding: 0px;
}
div[ui-plan-upgrade-bar] .ui-plan-upgrade-bar-body .compare_area_div .store_arrow_card {
  text-align: center;
  width: 144px;
  height: 140px;
  margin: 10px 0px;
}
div[ui-plan-upgrade-bar] .ui-plan-upgrade-bar-body .compare_area_div .store_arrow_card .store_arrow_card_image {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  border: 1px solid #ff5000;
  width: 80px;
  height: 80px;
}
div[ui-plan-upgrade-bar] .ui-plan-upgrade-bar-body .compare_area_div .store_arrow_card .arrow_right_image {
  text-align: center;
}
div[ui-plan-upgrade-bar] .ui-plan-upgrade-bar-body .compare_area_div .nav_btn {
  background: none;
  border: none;
}
div[ui-plan-upgrade-bar] .ui-plan-upgrade-bar-body .compare_area_div .col_card {
  margin: 0px 10px;
}
.arrow_button {
  color: inherit;
  border: 0px;
  background-color: transparent;
  display: inline-block;
  margin-left: 0px;
  margin-right: 0px;
}
.arrow_button:active svg {
  fill: #ff5000;
  fill-opacity: 1;
}
.arrow_button:active svg path {
  fill: #ff5000;
  fill-opacity: 1;
}
.arrow_button:hover svg {
  color: #ff9500 !important;
  fill: #ff9500 !important;
  opacity: 1;
  fill-opacity: 1;
}
.arrow_button:active svg {
  fill: #ff5000 !important;
  fill-opacity: 1;
}
.arrow_button:active svg path {
  fill: #ff5000 !important;
  fill-opacity: 1;
}
.arrow_button:hover svg {
  color: #ff9500 !important;
  fill: #ff9500 !important;
  opacity: 1;
  fill-opacity: 1;
}
.arrow_button:hover svg path {
  color: #ff9500;
  fill: #ff9500;
  fill-opacity: 1;
}
.arrow_button.backward svg,
.arrow_button.backward img,
.arrow_button.backward span {
  transform: rotate(-180deg);
}
.arrow_button.forward svg,
.arrow_button.forward img,
.arrow_button.forward span {
  transform: rotate(0deg);
}
.arrow_button.active svg {
  fill: #fff;
  fill-opacity: 1;
}
.arrow_button.active svg path {
  fill: #fff;
  fill-opacity: 1;
}
.arrow_button.active:active svg {
  fill: #ff5000 !important;
  fill-opacity: 1;
}
.arrow_button.active:active svg path {
  fill: #ff5000 !important;
  fill-opacity: 1;
}
.arrow_button.active:hover svg {
  color: #ff9500 !important;
  fill: #ff9500 !important;
  opacity: 1;
  fill-opacity: 1;
}
.arrow_button.active:hover svg path {
  color: #ff9500;
  fill: #ff9500;
  fill-opacity: 1;
}
.arrow_button.disabled svg {
  opacity: 0.5;
  fill-opacity: 0.5;
}
.arrow_button.disabled svg path {
  opacity: 0.5;
  fill-opacity: 0.5;
}
.arrow_button.disabled:hover svg {
  fill: #fff;
  fill-opacity: 0.5;
}
.arrow_button.disabled:hover svg path {
  fill: #fff;
  fill-opacity: 0.5;
}
.arrow_button.disabled:active svg {
  fill: #fff;
  fill-opacity: 0.5;
}
.arrow_button.disabled:active svg path {
  fill: #fff;
  fill-opacity: 0.5;
}
/* arrow_button */
/*<< UiPlanUpgradeBar : END >>*/
/*<< F BUTTON : START  >>*/
.long_rect_btn {
  margin: auto;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-border-radius: 40px;
  -moz-border-radius: 40px;
  border-radius: 40px;
  transition: all 0.2s;
  webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -o-transition: all 0.2s;
  width: 141px;
  height: 40px;
  border: 1px solid #979797;
  color: #FFF;
  font-size: 14px;
  font-weight: 400;
  line-height: 21px;
  padding: 8px;
}
.long_rect_btn:hover {
  border: 1px solid #FF5000;
  color: #FF5000;
}
.long_rect_btn:active {
  transition: all 0.05s;
  webkit-transition: all 0.05s;
  -moz-transition: all 0.05s;
  -o-transition: all 0.05s;
  border: 1px solid #FF5000;
  color: #fff;
  background: #ff5000;
}
/*<< F BUTTON : END >>*/
/*<< SUBSCRIPTION : START >>*/
/*<< SUBSCRIPTION : END >>*/
.store_image {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
}
.store_image.size80 {
  width: 80px;
  height: 80px;
  border: 1px solid #FF5000;
}
/*<< NAV BUTTON : START >>*/
.navbtn {
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
/*<< NAV BUTTON : END >>*/
.upgrage_checkout_page .compare_area {
  width: 800px;
  margin: 0px auto;
}
.upgrage_checkout_page .compare_area .svg_arrow_right {
  margin: 0px 20px;
  margin-top: 60px;
}
.upgrage_checkout_page .compare_area div[ui-plan-card] {
  margin: 0px 20px;
}
.upgrage_checkout_page .cashback_info {
  text-align: center;
}
.upgrage_checkout_page .cashback_info .cashback_balance {
  height: 57px;
  color: #7ed321;
  font-size: 48px;
  font-weight: 400;
  line-height: 57px;
}
.upgrage_checkout_page .cashback_info .cashback_currency {
  height: 17px;
  color: #f2f4ff;
  font-size: 14px;
  font-weight: 400;
  line-height: 17px;
}
.upgrade_select_wallet_page .svg_wallet_image {
  margin: auto;
  width: 115px;
  height: 152px;
}
.upgrade_select_wallet_page .svg_wallet_image img {
  height: 100%;
  width: auto;
  padding: 0px;
  margin: 0px;
}
.upgrade_select_wallet_page .wallet_info {
  text-align: center;
}
.upgrade_select_wallet_page .wallet_info .wallet_balance {
  height: 57px;
  color: #7ed321;
  font-size: 48px;
  font-weight: 400;
  line-height: 57px;
}
.upgrade_select_wallet_page .wallet_info .wallet_currency {
  height: 17px;
  color: #f2f4ff;
  font-size: 14px;
  font-weight: 400;
  line-height: 17px;
}
.upgrade_select_wallet_page .circle_checkbox {
  cursor: pointer;
  width: 370px;
  margin: auto;
  background: #333;
}
.upgrade_select_wallet_page .circle_checkbox .checkboxBtn {
  float: left;
  width: 24px;
  height: 24px;
  margin: 0px 8px;
  border: 1px solid white;
  background: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  transition: all 0.2s;
  webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -o-transition: all 0.2s;
}
.upgrade_select_wallet_page .circle_checkbox .checkboxBtn.active {
  border: 1px solid #7ed321;
  background: #7ed321;
}
.upgrade_select_wallet_page .circle_checkbox .text_for_checkboxBtn {
  float: left;
  height: 29px;
  color: white;
  font-size: 18px;
  font-weight: 300;
  line-height: 28.8px;
  margin: 0px 8px;
}
.upgrade_complate_page .svg_wallet_image {
  margin: auto;
  width: 115px;
  height: 152px;
}
.upgrade_complate_page .svg_wallet_image img {
  height: 100%;
  width: auto;
  padding: 0px;
  margin: 0px;
}
.upgrade_complate_page .en-green.bigger {
  height: 39px;
  color: #093;
  font-size: 24px;
  font-weight: 700;
  line-height: 38.4px;
}
.upgrade_complate_page .th-white.bigger {
  height: 31px;
  color: white;
  font-size: 26px;
  line-height: 30px;
}
.upgrade_complate_page .cb-credit {
  width: 115px;
  height: 152px;
}
.upgrade_complate_page .wallet_info {
  text-align: center;
}
.upgrade_complate_page .wallet_info .wallet_balance {
  height: 57px;
  color: #7ed321;
  font-size: 48px;
  font-weight: 400;
  line-height: 57px;
}
.upgrade_complate_page .wallet_info .wallet_currency {
  height: 17px;
  color: #f2f4ff;
  font-size: 14px;
  font-weight: 400;
  line-height: 17px;
}
.svg_plan_block {
  height: 304px;
  width: 256px;
  margin: auto;
  display: table;
}
.svg_plan_block .image_svg {
  display: table-cell;
  vertical-align: middle;
  /* cursor: pointer; */
  height: 304px;
  width: 256px;
  position: relative;
  margin: auto;
  border: 1px solid #303030;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-border-radius: 40px;
  -moz-border-radius: 40px;
  border-radius: 40px;
  transition: all 0.2s;
  webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -o-transition: all 0.2s;
  /* disable for demo version ***
        &:hover{

            border: 4px solid #ff5000;
        }
        &:active{
            background: #ff5000;
            border: 4px solid #ff5000;
        }
        ***/
}
/*<< PLAN COMPATE PAGE : START >>*/
.plan_compare_page {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  min-width: 980px;
}
.plan_compare_page .compare-topbar-full {
  position: fixed;
  width: 100%;
  top: 80px;
  left: 0px;
  z-index: 100;
  height: 300px;
  background: #191919;
}
.plan_compare_page .compare-topbar-full .compare-topbar-content {
  width: 980px;
  height: 300px;
  margin: auto;
}
.plan_compare_page .compare-topbar-full .compare-topbar-content .label .normal-en {
  height: 36px;
  color: #ff5000;
  font-size: 24px;
  font-weight: 700;
  line-height: 36px;
}
.plan_compare_page .compare-topbar-full .compare-topbar-content .label .normal-th {
  height: 28px;
  color: #999;
  font-size: 24px;
  line-height: 27px;
}
.plan_compare_page .table-compare_headbar_div {
  min-width: 980px;
  margin: auto;
}
.plan_compare_page .table-compare {
  min-width: 980px;
}
.plan_compare_page .table-compare.head-bar {
  width: 980px;
  margin: auto;
}
.plan_compare_page .table-compare.head-bar .table-row {
  border: 0px;
  padding: 0px;
}
.plan_compare_page .table-compare .table-row {
  padding: 20px 0px;
  border-bottom: 1px solid #303030;
}
.plan_compare_page .table-compare .table-row .table-colum {
  float: left;
  display: block;
}
.plan_compare_page .table-compare .table-row .table-colum.head {
  width: 250px;
}
.plan_compare_page .table-compare .table-row .table-colum.head .head_label {
  width: 100%;
}
.plan_compare_page .table-compare .table-row .table-colum.head .head_label.en {
  min-height: 30px;
  color: #ff5000;
  font-size: 20px;
  font-weight: 400;
  line-height: 30px;
}
.plan_compare_page .table-compare .table-row .table-colum.head .head_label.th {
  min-height: 28px;
  color: #999;
  font-size: 24px;
  line-height: 27px;
}
.plan_compare_page .table-compare .table-row .table-colum.data {
  width: 164px;
}
.plan_compare_page .table-compare .table-row .table-colum.data .data_label {
  min-height: 29px;
  color: white;
  font-size: 18px;
  font-weight: 300;
  line-height: 28.8px;
}
.plan_compare_page .table-compare .table-row .row_line {
  height: 1px;
  width: 100%;
  margin: 0px;
  padding: 0px;
  background: #fff;
}
/*<< PLAN COMPATE PAGE : END >>*/
.vat_included_info_box,
.vat_excluded_info_box {
  margin: 0px;
  padding: 0px;
}
.vat_included_info_box .label,
.vat_excluded_info_box .label {
  color: rgba(255, 255, 255, 0.54);
  margin: 0px;
  padding: 0px;
}
.vat_included_info_box .label.normal-en,
.vat_excluded_info_box .label.normal-en {
  height: 29px;
  color: rgba(255, 255, 255, 0.54);
  font-size: 18px;
  font-weight: 300;
  line-height: 28.8px;
}
.vat_included_info_box .label.normal-th,
.vat_excluded_info_box .label.normal-th {
  height: 28px;
  font-size: 21px;
  font-weight: 300;
  line-height: 27px;
}
/*<< PAYMENT OMISE : START >>*/
.payment_omis_page {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.payment_omis_page .label.head-en {
  color: #ff5000;
  font-size: 24px;
  font-weight: 700;
  line-height: 36px;
}
.payment_omis_page .label.normal-th {
  color: #999;
  font-size: 24px;
  line-height: 27px;
  font-weight: 300;
}
.payment_omis_page .omise_box {
  margin: auto;
  width: 300px;
}
.payment_omis_page .omise_box .omis_logo_div {
  position: relative;
  z-index: 12;
  margin: auto;
  margin-bottom: -42px;
  width: 72px;
  height: 72px;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  background-color: white;
  border: 1px solid #b3b3b3;
  -webkit-box-shadow: 0 0 6px rgba(178, 178, 178, 0.84), inset 0 -1px 3px #979797;
  -moz-box-shadow: 0 0 6px rgba(178, 178, 178, 0.84), inset 0 -1px 3px #979797;
  box-shadow: 0 0 6px rgba(178, 178, 178, 0.84), inset 0 -1px 3px #979797;
}
.payment_omis_page .omise_box .omis_logo_div .logo_place {
  position: relative;
  top: 4%;
  left: 6%;
  width: 62px;
  height: 62px;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  padding: 0px;
  -webkit-box-shadow: inset 0 0.5px 0 rgba(255, 255, 255, 0.5);
  -moz-box-shadow: inset 0 0.5px 0 rgba(255, 255, 255, 0.5);
  box-shadow: inset 0 0.5px 0 rgba(255, 255, 255, 0.5);
}
.payment_omis_page .omise_box .omis_logo_div .logo_place .logo_image {
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.payment_omis_page .omise_box .omis_logo_div .logo_place .logo_image img {
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  position: relative;
  width: 100%;
  height: auto;
}
.payment_omis_page .omise_box .omise_body {
  font-family: "Helvetica Neue";
  position: relative;
  z-index: 10;
  margin: auto;
  width: 300px;
  height: 326px;
  background-color: whitesmoke;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  -webkit-box-shadow: 0 12px 28px rgba(0, 0, 0, 0.5);
  -moz-box-shadow: 0 12px 28px rgba(0, 0, 0, 0.5);
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.5);
  overflow: hidden;
}
.payment_omis_page .omise_box .omise_body .omise_body-topbar {
  width: 100%;
  height: 108px;
  background-image: linear-gradient(180deg, #f5f5f7 0%, #e6e6e7 100%);
  -webkit-border-radius: 5px 0 0 5px;
  -moz-border-radius: 5px 0 0 5px;
  border-radius: 5px 0 0 5px;
}
.payment_omis_page .omise_box .omise_body .omise_body-topbar .label.head {
  height: 21px;
  text-shadow: 0 1px 1px white;
  color: black;
  font-size: 17px;
  font-weight: 700;
  line-height: 21px;
}
.payment_omis_page .omise_box .omise_body .omise_body-topbar .label.normal {
  height: 15px;
  text-shadow: 0 1px 1px white;
  color: #666;
  font-size: 13px;
  font-weight: 400;
  letter-spacing: 0.2px;
  line-height: 15px;
}
.payment_omis_page .omise_box .omise_body .line_section {
  width: 100%;
  height: 2px;
  border: 1px solid #ccc;
}
.payment_omis_page .omise_box .omise_body .omise_body-content .form-input-row input {
  width: 228px;
  height: 37px;
  background-color: white;
  border: 1px solid #ccc;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  padding: 10px;
  color: #7a7a7a;
  font-size: 15px;
  font-weight: 500;
  line-height: 15px;
  margin: 0px;
}
.payment_omis_page .omise_box .omise_body .omise_body-content .form-input-row .input-placeholder {
  color: #b3b3b3;
  font-weight: 500;
  display: inline-block;
  line-height: 1em;
}
.payment_omis_page .omise_box .omise_body .omise_body-content .form-input-row input::-webkit-input-placeholder {
  color: #b3b3b3;
  font-weight: 500;
  display: inline-block;
  line-height: 1em;
}
.payment_omis_page .omise_box .omise_body .omise_body-content .form-input-row input:-moz-placeholder {
  color: #b3b3b3;
  font-weight: 500;
  display: inline-block;
  line-height: 1em;
}
.payment_omis_page .omise_box .omise_body .omise_body-content .form-input-row input::-moz-placeholder {
  color: #b3b3b3;
  font-weight: 500;
  display: inline-block;
  line-height: 1em;
}
.payment_omis_page .omise_box .omise_body .omise_body-content .form-input-row input:-ms-input-placeholder {
  color: #b3b3b3;
  font-weight: 500;
  display: inline-block;
  line-height: 1em;
}
.payment_omis_page .omise_box .omise_body .omise_body-content .form-input-row input.group-top-full {
  -webkit-border-radius: 0px;
  -moz-border-radius: 0px;
  border-radius: 0px;
  -webkit-border-top-left-radius: 5px;
  -webkit-border-top-right-radius: 5px;
  -moz-border-radius-topleft: 5px;
  -moz-border-radius-topright: 5px;
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
}
.payment_omis_page .omise_box .omise_body .omise_body-content .form-input-row input.group-bottom-left {
  -webkit-border-radius: 0px;
  -moz-border-radius: 0px;
  border-radius: 0px;
  width: 114px;
  -webkit-border-bottom-left-radius: 5px;
  -moz-border-radius-bottomleft: 5px;
  border-bottom-left-radius: 5px;
  margin-right: -2px;
  margin-top: -1px;
}
.payment_omis_page .omise_box .omise_body .omise_body-content .form-input-row input.group-bottom-right {
  -webkit-border-radius: 0px;
  -moz-border-radius: 0px;
  border-radius: 0px;
  width: 115px;
  -webkit-border-bottom-right-radius: 5px;
  -moz-border-radius-bottomright: 5px;
  border-bottom-right-radius: 5px;
  margin-left: -3px;
  margin-top: -1px;
}
.payment_omis_page .price_box {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  transition: all 0;
  webkit-transition: all 0;
  -moz-transition: all 0;
  -o-transition: all 0;
  cursor: pointer;
  position: relative;
  z-index: 80;
  width: 228px;
  height: 38px;
  background-color: #2094fa;
  border-radius: 5px;
  margin: auto;
  margin-top: -19px;
  padding: 8px;
}
.payment_omis_page .price_box .label.price {
  text-align: center;
  height: 22px;
  text-shadow: 0 -1px 0 #3a8bc9;
  color: white;
  font-size: 17px;
  font-weight: 700;
  letter-spacing: 0;
  line-height: 21px;
}
.payment_omis_page .price_box:active {
  transition: all 0.2s;
  webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -o-transition: all 0.2s;
  background-color: #0074da;
}
.payment_omis_page .contact_info_box {
  color: rgba(255, 255, 255, 0.54);
  font-size: 18px;
  font-weight: 300;
  line-height: 27px;
}
.payment_omis_page .contact_info_box .label {
  color: rgba(255, 255, 255, 0.54);
  font-size: 18px;
  font-weight: 300;
  line-height: 27px;
}
.payment_omis_page .contact_info_box .label.normal-th {
  font-size: 21px;
}
.payment_omis_page .contact_info_box .label.normal-en {
  font-size: 18px;
}
/*<< PAYMENT OMISE : END >>*/
/*<< UI : START >>*/
.uiFlexImage-image-svg-text {
  font-family: 'Lato', 'ThaiSans All', sans-serif;
  text-align: center;
  color: #ff5000;
}
/*<< UI : END >>*/
.logo_signup_header_svg {
  margin-top: 40px;
  width: 126px;
  height: 80px;
}