/*ProductListItemTemplate [Layout>Controls] Begin*/

.CommonProductItemStyle.ProductListItemTemplate { padding: 0; position: relative; text-align: center; width: 330px; margin: 20px; text-align: center; }


.ProductListItemTemplate .CommonProductImage tr td { vertical-align: top; }
.ProductListItemTemplate .PriceLabel, .ProductListItemTemplate .OurPriceLabel { display: none; }

.ProductListItemTemplate .DiscountPercent { float: none; }

.ProductListItemTemplate .CommonProductPriceDetails { margin-bottom: 0; width: 100%; text-align: center; }

.ProductListItemTemplate .ProductListDiscountPercent { margin-left: 0; }

.ProductListItemTemplate .CommonProductSpecialLabel { clear: left; float: left; margin: 5px 0; width: 100%; display: none; }


.ProductListItemTemplate .CommonProductName { position: relative; margin: 0; min-height: 30px; }

.ProductListItemTemplate .CommonProductNameLink { font-size: 28px; line-height: 1.5; }

.ProductListItemTemplate .OurPriceValue { font-size: 24px; line-height: 0.75; color: #333; width: 100%; }
.ProductListItemTemplate .RetailPricePanel { display: none; }
.ProductListItemTemplate .OurPricePanel { float: none; }
.ProductListItemTemplateDetailsColumn { margin: 0; position: relative; }

.ProductListItemTemplateTellFriendPanel, .ProductListItemTemplateAddtoWishListPanel, .ProductListItemTemplateAddtoCompareListPanel { display: inline-block; margin: 0px 8px; z-index: 0; position: relative; vertical-align: middle; display: none; }

.ProductListItemTemplateTellFriendPanel { clear: left; }

.ProductListItemTemplateOutOfStockPanel { clear: left; float: left; width: 100%; }

.ProductListItemTemplateOptionGroupPanel { clear: left; float: left; margin: 5px 0; width: 100%; }

.ProductListItemTemplate .ProductListItemQuantityDiscountPanel { display: inline-block; }

.ProductListItemTemplate div.CommonProductImage { min-height: 220px; }

.ProductListItemTemplate .CommonProductImagePanel { height: 220px; }

.ProductListItemTemplate .CommonProductImage a { overflow: hidden; height: 220px; }

.ProductListItemTemplate .CommonProductImage img { max-width: 330px; width: auto !important; max-height: inherit; }

.TemplateImageMore { clear: left; float: left; margin: 0; position: absolute; width: 100%; height: 220px; top: 0; display: none; }

.TemplateImageMoreLink { font-size: 30px; color: #fff; display: block; width: 330px; height: 220px !important; line-height: 220px; transition: background 0.5s ease-out; }

    .TemplateImageMoreLink:hover { background: rgba(253,106,106,0.8); color: #fff; transition: background 0.5s ease-out; }

    .TemplateImageMoreLink.Trendy:hover { background: rgba(5,37,78,0.8); }

    .TemplateImageMoreLink.Bright:hover { background: rgba(3,131,222,0.8); }

    .TemplateImageMoreLink.Chic:hover { background: rgba(249,114,183,0.8); }

    .TemplateImageMoreLink.Charming:hover { background: rgba(27,188,155,0.8); }

    .TemplateImageMoreLink.Sparkling:hover { background: rgba(136,210,233,0.8); }

    .TemplateImageMoreLink.Cozy:hover { background: rgba(233,165,88,0.8); }

    .TemplateImageMoreLink.Sassy:hover { background: rgba(212,51,75,0.8); }

    .TemplateImageMoreLink.Cheery:hover { background: rgba(2,117,198,0.8); }

    .TemplateImageMoreLink.Snazzy:hover { background: rgba(203,9,5,0.8); }

    .TemplateImageMoreLink.Delightful:hover { background: rgba(253,181,8,0.8); }

    .TemplateImageMoreLink.Exceptional:hover { background: rgba(50,57,72,0.8); }

    .TemplateImageMoreLink.Upscale:hover { background: rgba(46,44,44,0.8); }

    .TemplateImageMoreLink.Passion:hover { background: rgba(255,82,12,0.8); }

    .TemplateImageMoreLink.Modernize:hover { background: rgba(128,106,176,0.8); }

.ProductListItemTemplate div.CommonProductImage:hover .TemplateImageMore { display: block; }
/*ProductListItemTemplate [Layout>Controls] End*/

/*/////////////////  ProductDetailsResponsive Begin  /////////////////*/
.ProductDetailsResponsive ul.community { list-style-type: none; }

.ProductDetailsResponsive ul.deluxe { list-style-type: none; }

.ProductDetailsResponsive ul.multi { list-style-type: none; }

ul.community li:before, ul.deluxe li:before, ul.multi li:before { content: "• "; font-size: 23px; color: #0a9bd8; /* or whatever color you prefer */ }

.detailbutton { margin-top: 10px; clear: both; font-size: 18px; font-weight: bold; color: #fff !important; float: right; width: 120px; height: 32px; line-height: 16px; text-align: center; background-color: #0a9bd8; margin-bottom: 10px; padding: 7px 0; border-radius: 5px; margin-right: 15px; }

    .detailbutton:hover { background-color: #ff5400; }

.ProductDetailsResponsive .cll { padding-top: 10px; width: 72%; }

.ProductDetailsResponsive .BtnStyleSkyBlue { float: right; background: url("Images/Web2017/Icon/icon-review.gif") no-repeat scroll 5px center transparent; padding-left: 30px; color: #1e1e1e; font-size: 23px; text-shadow: none; text-decoration: none; margin-top: 5px; }

.ProductDetailsResponsive .community { margin-top: -40px; }

.Product .CommonPageTop { min-height: 20px; background: none; }
.TemplateCustomPrice { clear: left; float: left; width: 100%; padding: 30px 0; }

    .TemplateCustomPrice .RetailPriceValue { color: #66767B; float: left; text-decoration: line-through; font-size: 18px; margin-right: 15px; }

    .TemplateCustomPrice .OurPriceValue { float: left; color: #000000; font-size: 23px; position: relative; bottom: 3px; }

.TemplateCustomOption .OptionPrice { display: none; }

.RelatedProductsTemplateItemTable { margin-bottom: 20px; margin-top: 30px; width: 100%; }

.RelatedProductsTemplateStyle { color: #FF3737 !important; }

.detailbutton.RelatedProductsTemplateButton { background-color: #FF3737; }

.ProductDetailsResponsiveSocialButtonDiv { display: none; }

/*ProductDetailsResponsive End*/

/*ContactUsFinished Begin*/
.ContactUsFinished { min-height: 100%; margin: 0; padding: 150px 0; background: url(Images/Web2017/Background/contact-finish-bg.jpg) no-repeat center / cover; color: #fff; line-height: 40px; }

.ContactUsFinishedButton { background-color: none; border: 3px solid #fff; color: #fff; font-family: ThaiSansNeue; font-size: 30px; line-height: 48px; padding: 8px 30px; }

    .ContactUsFinishedButton:hover { color: #FFDD20; border: 3px solid #FFDD20; }

.ContactUsFinished .FrontButton { background-color: #fbcf14; border: 3px solid #fbcf14; color: #000; }

    .ContactUsFinished .FrontButton:hover { border: 3px solid #fff; color: #fff; }

.ContactUsFinishedButtonDiv { clear: left; margin: 25px auto; }
/*ContactUsFinished End*/


/*------------- Custom CSS Here!!! ----------*/
/*Header*/


.main-button { width: 100%; height: 36px; background: url(Images/Web2017/Button/button-open-store.png) no-repeat right top/ 515px auto; }

.button-open-store { float: right; text-align: center; margin-right: 10px; }

.button-training { float: right; text-align: center; margin-right: 35px; }

.OpenNewStoreLink { background-color: #14ae69; font-size: 20px; font-style: italic; height: 30px; line-height: 30px; text-align: center; display: block; padding: 0 15px; font-family: ThaiSansNeue; letter-spacing: 1px; }

.TrainingRegisLink { background-color: #57d3f7; font-size: 20px; font-style: italic; height: 30px; line-height: 30px; text-align: center; display: block; padding: 0 15px; font-family: ThaiSansNeue; letter-spacing: 1px; }

/* --- Features --- */
/*Banner sec*/
.features-new { width: 100%; margin: 0; padding: 0; font-family: ThaiSansNeue; font-size: 22px; }

.features-tab-header { width: 100%; padding: 10px 0; background-color: #122e89; position: fixed; top: 68px; z-index: 2; }
.features-info-panel { padding-top: 98px; }
.features-sticky { position: relative; z-index: 1; top: 68px; }

    .features-sticky .features-tab-header { padding: 12px 0; }

.features-bar { width: 30px; height: 1px; background-color: #030303; margin: 30px auto; }

.features-bar100 { width: 100px; height: 1px; background-color: #030303; margin: 30px auto; }

.features-bar-white { width: 100px; height: 1px; background-color: #fff; margin: 20px 0; clear: left; float: left; }
/*info */
.features-title { color: #f8fd2b; font-size: 30px; text-transform: uppercase; line-height: 52px; min-height: 52px; float: left; width: 10%; margin-top: 10px; font-family: ThaiSansNeueBold; }

    .features-title .ToggleFeature { color: #f8fd2b; }

.features-menu-panel { float: left; width: 90%; }

    .features-menu-panel ul { display: table; list-style-type: none; margin: 0; padding: 0 0 25px; width: 100%; }

        .features-menu-panel ul > li { line-height: 51px; height: 51px; background-position: center 0; background-repeat: no-repeat; margin: 0; float: left; width: 8.45%; padding: 0 3px; }

            .features-menu-panel ul > li a { display: block; font-family: csprajad; font-size: 12px; padding: 0; text-align: center; width: 100%; padding-top: 55px; line-height: 18px; color: #fff; }
            /* ---------- Begin feature tab icon ----------- */
            .features-menu-panel ul > li.tab-hilight { background-image: url(Images/Web2017/Icon/tab-1.png); }

            .features-menu-panel ul > li.tab-marketing { background-image: url(Images/Web2017/Icon/tab-2.png); }

            .features-menu-panel ul > li.tab-design { background-image: url(Images/Web2017/Icon/tab-3.png); width: 7%; }

            .features-menu-panel ul > li.tab-management { background-image: url(Images/Web2017/Icon/tab-4.png); }

            .features-menu-panel ul > li.tab-payment { background-image: url(Images/Web2017/Icon/tab-5.png); }

            .features-menu-panel ul > li.tab-tax { background-image: url(Images/Web2017/Icon/tab-6.png); }

            .features-menu-panel ul > li.tab-shipping { background-image: url(Images/Web2017/Icon/tab-7.png); }

            .features-menu-panel ul > li.tab-report { background-image: url(Images/Web2017/Icon/tab-8.png); }

            .features-menu-panel ul > li.tab-mobile { background-image: url(Images/Web2017/Icon/tab-9.png); }

            .features-menu-panel ul > li.tab-facebook { background-image: url(Images/Web2017/Icon/tab-10.png); }

            .features-menu-panel ul > li.tab-other { background-image: url(Images/Web2017/Icon/tab-12.png); }

            .features-menu-panel ul > li.tab-blog { background-image: url(Images/Web2017/Icon/tab-11.png); }

            .features-menu-panel ul > li:hover, .features-menu-panel ul > li.active, .features-menu-panel ul > li:focus { background-position: center 100% !important; }

                .features-menu-panel ul > li.active a, .features-menu-panel ul > li.active a:hover { color: #f9df04; }

            .features-menu-panel ul > li.tab-hilight.active a, .features-menu-panel ul > li.tab-hilight a:hover { }

            .features-menu-panel ul > li.tab-marketing.active a, .features-menu-panel ul > li.tab-marketing a:hover { color: #ff7200; }

            .features-menu-panel ul > li.tab-design.active a, .features-menu-panel ul > li.tab-design a:hover { color: #9dd7ff; }

            .features-menu-panel ul > li.tab-management.active a, .features-menu-panel ul > li.tab-management a:hover { color: #f9df04; }

            .features-menu-panel ul > li.tab-payment.active a, .features-menu-panel ul > li.tab-payment a:hover { color: #9dd7ff; }

            .features-menu-panel ul > li.tab-tax.active a, .features-menu-panel ul > li.tab-tax a:hover { color: #a2ff6a; }

            .features-menu-panel ul > li.tab-shipping.active a, .features-menu-panel ul > li.tab-shipping a:hover { color: #ff7200; }

            .features-menu-panel ul > li.tab-report.active a, .features-menu-panel ul > li.tab-report a:hover { color: #30ffb8; }

            .features-menu-panel ul > li.tab-mobile.active a, .features-menu-panel ul > li.tab-mobile a:hover { color: #a2ff6a; }

            .features-menu-panel ul > li.tab-facebook.active a, .features-menu-panel ul > li.tab-facebook a:hover { color: #9dd7ff; }

            .features-menu-panel ul > li.tab-other.active a, .features-menu-panel ul > li.tab-other a:hover { color: #e5d5ff; }

            .features-menu-panel ul > li.tab-blog.active a, .features-menu-panel ul > li.tab-blog a:hover { color: #ffa2f7; }
/* ---------- End feature tab icon ----------- */
/*------------- Common Features ---------------*/

.tab_content { position: relative; float: left; width: 100%; }

.gotopdiv { display: table; margin: auto; position: absolute; width: 62px; height: 62px; bottom: 20px; right: 20px; }

.features-totop { width: 62px; height: 62px; display: block; font-size: 0; background: url(Images/Web2017/Icon/arrow_back_to_top_grey.svg) no-repeat center center; cursor: pointer; }

    .features-totop.white { background: url(Images/Web2017/Icon/gotop-white.png) no-repeat center center; }

.FeaturesMainDiv .content-detail p, .features-content p { font-size: 23px; line-height: 30px; font-family: ThaiSansNeue; color: #303030; margin: 5px 0 25px; }

.tab_content .tile-icon-left { background-position: left center; background-repeat: no-repeat; padding: 10px 0 10px 50px; line-height: 36px; font-size: 30px; font-weight: bold; color: #303030; text-align: right; float: right; margin-bottom: 20px; margin-top: 40px; }

.tab_content .tile-icon-right,
.tile-icon-right { background-position: right center; background-repeat: no-repeat; padding: 10px 60px 10px 0; line-height: 36px; font-size: 30px; font-weight: bold; color: #303030; text-align: left; float: left; margin-bottom: 20px; margin-top: 40px; }

.tab_content .info-right { clear: right; text-align: right; font-size: 23px; line-height: 30px; margin-bottom: 20px; color: #555; }

.tab_content .info-left,
.info-left { clear: left; text-align: left; font-size: 23px; line-height: 30px; margin-bottom: 20px; color: #555; }

.FeatureButton { background: transparent; background: linear-gradient(to right, #ffdc1d 50%, rgba(0, 0, 0, 0) 50%); background-size: 200% 100%; background-position: right bottom; transition: all 0.5s ease; border: solid 3px #d7d7de; margin: 20px auto 30px; }

    .FeatureButton:hover { background-position: left bottom; border: solid 3px #ffdc1d; color: #101010; }

    .FeatureButton a { color: #010101; }

        .FeatureButton a:hover { color: #101010; }


.features-h1-title { font-size: 48px; font-weight: bold; font-family: ThaiSansNeueBold; width: 100%; text-align: center; line-height: 52px; min-height: 52px; margin-bottom: 20px; color: #212120; }

.features-p-info { font-size: 30px; line-height: 35px; width: 100%; color: #5d5f62; margin: 30px 0; }

.tab_content h6 { font-size: 30px; line-height: 35px; width: 100%; color: #303030; margin: 20px 0; font-family: ThaiSansNeue; clear: left; display: table; }

.tab_content ul { list-style-type: none; margin-top: 5px; }

ul.list-1-col, ul.list-2-col, ul.list-3-col, ul.list-4-col { width: 100%; float: left; clear: left; font-size: 23px; }

.tab_content ul.list-1-col li,
.tab_content ul.list-2-col li,
.tab_content ul.list-3-col li,
.tab_content ul.list-4-col li { background: url("Images/Web2017/Bullet/bullet-gray.png") no-repeat left 12px; padding-left: 15px; margin: 0 0 5px; font-family: CSPraJad; font-size: 17px; line-height: 28px; }

ul.list-1-col li { width: 100%; float: left; clear: left; }

ul.list-2-col li { width: 48%; float: left; }

ul.list-3-col li { width: 32%; float: left; }

ul.list-4-col li { width: 24%; float: left; }

ul.new-3-col li { width: 33%; float: left; }

.features-new .img-col-right { float: right !important; }

/*------------- Features - Common Css ---------------*/
.features-content { clear: left; float: left; display: block; width: 100%; padding: 0; }

    .features-content .text-col { color: #030303; font-size: 23px; line-height: 30px; text-align: center; }

    .features-content .img-col .mgt70 { margin-top: 70px; }

    .features-content .img-col .mgt40 { margin-top: 40px; }

    .features-content h1.title, .features-content .title { line-height: 40px; margin: 0; color: #303030; font-size: 36px; font-family: ThaiSansNeueBold; width: 100%; text-transform: uppercase; }

        .features-content h1.title.title48, .features-content .title.title48 { font-size: 48px; }

    .features-content .subtitle { width: 100%; font-size: 26px; text-align: center; line-height: 30px; color: #030303; margin-top: 20px; }

    .features-content .title-detail { width: 100%; text-align: center; color: #030303; font-size: 17px; font-family: CSPraJad; line-height: 28px; margin-bottom: 30px; margin-top: 10px; }

    .features-content .text-col .left { text-align: left; }

    .features-content .title-detail a, .features-content .title-info a, .features-content .subtitle a { color: #030303; }

        .features-content .title-detail a:hover, .features-content .title-info a:hover, .features-content .subtitle a:hover { color: #357FD3; }

    .features-content .text-col { color: #030303; font-size: 21px; line-height: 30px; text-align: center; }

    .features-content .img-col-right { float: right !important; }
/*.text-toggle { position: absolute; width: 100%; cursor: pointer; }
.wrapped-div .marketing-detail { display: none; opacity: 0; transition: opacity 1s linear; }
.wrapped-div .text-toggle:hover .marketing-detail { display: block; opacity: 1; transition: opacity 1s linear; }*/
/*------------- Features - Highlight---------------*/
.tab-highlight-1 { background: linear-gradient(#f6f6f3, #eaeae6); border-bottom: solid 2px #fff; padding: 0; }

.features-tab-hilight .features-content .text-col { padding: 100px 5%; }

.tab-highlight-1 .row.tab1-theme { background: url(Images/web2015/Banner/tab1-theme.webp) no-repeat 15% bottom; background-size: auto 90%; }

.tab-highlight-1 .row.tab1-management { background: url(Images/web2015/Banner/tab1-management-tool.webp) no-repeat 15% bottom; background-size: auto 90%; }

.tab-highlight-1 .row.tab1-responsive { background: url(Images/web2015/Banner/tab1-responsive.webp) no-repeat 5% bottom; background-size: auto 90%; }

.tab-highlight-1 .row.tab1-marketing { background: url(Images/web2015/Banner/tab1-marketing-tools.webp) no-repeat 15% bottom; background-size: auto 90%; }

.tab-highlight-1 .row.tab1-Highlight { background: url(Images/web2015/Banner/default-responsive.webp) no-repeat left bottom; background-size: auto 90%; }

.tab-highlight-2 { background-color: #d8e5fa; background: -moz-linear-gradient(top, #d8e5fa, #f9f8f7); background: -webkit-gradient(linear, 0 0, 0 100%, from(#d8e5fa), to(#f9f8f7)); background: -webkit-linear-gradient(top, #d8e5fa, #f9f8f7); background: -o-linear-gradient(top, #d8e5fa, #f9f8f7); background: linear-gradient(to bottom, #d8e5fa, #f9f8f7); }

.tab-highlight-3 { background: #D2E2F9 url(Images/web2015/Banner/tab-highlight-3.jpg) no-repeat center top; }

.tab-highlight-4 { background: #e4f3fd; }
/*------------- Features - Marketing---------------*/
.features-tab-marketing .features-content .text-col { padding: 80px 5%; }

.features-content.tab-marketing-intro { background: linear-gradient(#f6f6f3, #eaeae6); border-bottom: solid 3px #fff; padding: 0; }

.tab-marketing-intro .row.tab1-marketing { background: url(Images/web2015/Banner/banner-feature-marketing.webp) no-repeat 5% center; background-size: auto 85%; }

.tab-marketing-1 { background-color: #f9f8f7; padding: 50px 0; border-bottom: solid 3px #fff; }

    .tab-marketing-1 .title-detail { }

    .tab-marketing-1 .tab1-marketing-col { width: 100%; }

.tab-marketing-2 { background-color: #F4F4F2; }

    .tab-marketing-2 .wrapped-div { min-height: 400px; }

.features-tab-marketing .features-content.tab-marketing-2 .text-col { padding: 30px 10px 0; }

.marketing-list-div { clear: left; float: left; width: 70%; margin: 40px 10% 0 20%; }

.marketing-tool-1 { background: url(Images/web2015/Banner/marketing-tool-1.webp) no-repeat 5% center; padding: 50px 0; }

.marketing-tool-2 { background: url(Images/web2015/Banner/marketing-tool-2.webp) no-repeat 95% center; padding: 30px 0; }

.marketing-tool-3 { background: url(Images/web2015/Banner/marketing-tool-3.webp) no-repeat 5% center; padding: 30px 0; }

.marketing-tool-4 { background: url(Images/web2015/Banner/marketing-tool-4.webp) no-repeat 85% center; padding: 30px 0; }

.marketing-tool-5 { background: url(Images/web2015/Banner/marketing-tool-5.webp) no-repeat 5% center; padding: 30px 0; }

.marketing-tool-6 { background: url(Images/web2015/Banner/marketing-tool-6.webp) no-repeat 85% center; padding: 30px 0; }

.marketing-tool-7 { background: url(Images/web2015/Banner/marketing-tool-7.webp) no-repeat 5% center; padding: 30px 0; }

.marketing-tool-8 { background: url(Images/web2015/Banner/marketing-tool-8.webp) no-repeat 85% center; padding: 30px 0; }

.marketing-tool-9 { background: url(Images/web2015/Banner/marketing-tool-9.webp) no-repeat 5% center; padding: 30px 0; }

.marketing-tool-10 { background: url(Images/web2015/Banner/marketing-tool-10.webp) no-repeat 85% center; padding: 30px 0; }

.marketing-tool-11 { background: url(Images/web2015/Banner/marketing-tool-11.webp) no-repeat 5% center; padding: 30px 0; }

.marketing-tool-12 { background: url(Images/web2015/Banner/marketing-tool-12.webp) no-repeat 85% center; padding: 30px 0; }

.tab-marketing-3 { background-color: #122e89; border-top: solid 3px #fff; color: #fff; padding: 50px 0; }

    .tab-marketing-3 .row { padding: 20px 0 0; }

    .tab-marketing-3 .title, .tab-marketing-3 .subtitle, .tab-marketing-3 .tile-icon-right, .tab-marketing-3 .info-left, .tab-marketing-3 .title-detail { color: #fff; }

    .tab-marketing-3 .subtitle { font-weight: bold; margin-bottom: 10px; }

.features-tab-marketing .features-content.tab-marketing-3 .text-col { padding: 0 5% 0 10px; }

    .features-tab-marketing .features-content.tab-marketing-3 .text-col.tab-marketing-coupon1,
    .features-tab-marketing .features-content.tab-marketing-3 .text-col.tab-marketing-coupon2 { padding: 80px 4% 0 10px; }

.tab-marketing-coupon1 { background: url(Images/Web2017/Icon/tab2-icon1.png) no-repeat 10px 10px; }

.tab-marketing-coupon2 { background: url(Images/Web2017/Icon/tab2-icon2.png) no-repeat 10px 10px; }

.features-tab-marketing .features-content .text-col.tab-marketing-coupon1 { padding-left: 0; }

.features-tab-marketing .features-content .text-col.tab-marketing-coupon2 { padding-left: 0; }

.tab-marketing-3 .sample-div { clear: left; margin-top: 50px; font-style: italic; color: #feb591; text-align: left; }

.tab-marketing-3 .sample-title { width: 100%; }

.tab-marketing-3 .sample-detail { width: 100%; padding-left: 50px; }

.tab-marketing-3 .tab1-marketing-col { width: 100%; margin-bottom: 30px; }

.tab-marketing-4 { background-color: #e5e5e5; padding: 50px 0; }

    .tab-marketing-4 .title { color: #f75d4f; }

    .tab-marketing-4 .title-detail { line-height: 30px; }

.tab-marketing-coupon { margin-bottom: 30px; }

.features-tab-marketing .features-content.tab-marketing-4 .text-col { padding: 0 2%; }

.tab-marketing-coupon3 { background: url(Images/Web2017/Icon/tab2-icon3.png) no-repeat 10px top; padding-left: 100px !important; margin-top: 30px; text-align: left; }

.features-tab-marketing .features-content .text-col.tab-marketing-coupon3 .subtitle { margin: 0 0 10px; font-weight: bold; text-align: left; }

.features-tab-marketing .features-content .text-col.tab-marketing-coupon3 .title-detail { text-align: left; }

/*------------- Features - Design---------------*/
.features-tab-design .features-content .text-col { padding: 80px 5%; }

.features-content.tab-design-intro { background: linear-gradient(#f6f6f3, #eaeae6); border-bottom: solid 3px #fff; padding: 0; }

.tab-design-intro .row.tab-design { background: url(Images/web2015/Banner/banner-feature-design.webp) no-repeat 0 80%; background-size: 60% auto; }

.features-content.tab-design-1 { padding: 60px 0; }

    .features-content.tab-design-1 .banner-button { margin-top: 30px; }

/*------------- Features - Management---------------*/
.features-tab-management .features-content .text-col { padding: 80px 5%; }

.features-tab-management .features-content .text-toggle { top: 33%; }

.features-content.tab-management-intro { background-color: #f3f2f2; border-bottom: solid 3px #fff; padding: 0; }

.tab-management-intro .row.tab-management { background: url(Images/web2015/Banner/banner-feature-management.webp) no-repeat 0 bottom; background-size: 60% auto; min-height: 420px; }

.tab-management-1 { background-color: #f9f8f7; border-bottom: solid 3px #fff; }

    .tab-management-1 .row.management-1 { background: url(Images/web2015/Banner/tab4-management.webp) no-repeat 0 bottom; min-height: 550px; }

.features-content.tab-management-1 .text-col { padding: 80px 0; }

.tab-management-2 { background: linear-gradient(#f6f6f3, #eaeae6); border-bottom: solid 3px #fff; padding: 0; overflow: hidden; }

    .tab-management-2 .row.management-2 { padding: 50px 0; }

    .tab-management-2 .row.management-3 { background: url(Images/web2015/Banner/management-1.webp) no-repeat 0 bottom; }

    .tab-management-2 .row.management-4 { background: url(Images/web2015/Banner/management-2.webp) no-repeat 0 bottom; }

    .tab-management-2 .row.management-5 { background: url(Images/web2015/Banner/management-3.webp) no-repeat 0 center; min-height: 555px; }

.features-content.tab-management-2 .text-col { min-height: 550px; position: relative; padding: 50px 0; }

.tab-management-2 .row.management-4 ul.list-1-col { width: 60%; margin-left: 20%; }

.tab-management-2 ul.list-2-col { width: 80%; margin-left: 15%; }
/*------------- Features - Payment---------------*/
.features-tab-payment .features-content .text-col { padding: 50px 0; }

.features-content.tab-payment-intro { background-color: #F0F0F0; border-bottom: solid 3px #fff; padding: 0; }

.tab-payment-intro .row.tab-payment { background: url(Images/web2015/Banner/banner-feature-payment.webp) no-repeat 0 bottom; background-size: 65% auto; min-height: 420px; }

.tab-payment-1 { background: linear-gradient(#f9f8f7, #ebe9e9); border-bottom: solid 3px #fff; padding: 50px 0 0; }

.tab-payment-2 { background: linear-gradient(#f6f6f3, #eaeae6); border-bottom: solid 3px #fff; padding: 50px 0 0; }

.tab-payment-3 { background: linear-gradient(#f6f6f3, #eaeae6); border-bottom: solid 3px #fff; padding: 50px 0; }

.tab-payment-4 { /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#e2e9ed+0,e5ebf0+25,ebf1f4+50,eef3f6+62,e6e7e9+83,dfe1e3+100 */ background: #e2e9ed; /* Old browsers */ background: -moz-linear-gradient(top, #e2e9ed 0%, #e5ebf0 25%, #ebf1f4 50%, #eef3f6 62%, #e6e7e9 83%, #dfe1e3 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(top, #e2e9ed 0%,#e5ebf0 25%,#ebf1f4 50%,#eef3f6 62%,#e6e7e9 83%,#dfe1e3 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to bottom, #e2e9ed 0%,#e5ebf0 25%,#ebf1f4 50%,#eef3f6 62%,#e6e7e9 83%,#dfe1e3 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e2e9ed', endColorstr='#dfe1e3',GradientType=0 ); /* IE6-9 */ }

    .tab-payment-4 .bg-payment-inner { background-image: url(Images/web2015/Banner/payment-5.jpg); background-repeat: no-repeat; background-position: 0 bottom; background-size: auto 100%; padding: 40px 0; width: 100%; }

.tab-payment-5 { background: linear-gradient(#f7f9fa, #e0e2e4); padding: 80px 0 50px; }

.tab-payment-3 ul.list-3-col { margin: 30px 5% 0 15%; width: 80%; }

.tab-payment-5 ul.list-1-col { text-align: left; width: 70%; margin: 15px 10% 0 20%; }
/*------------- Features - Tax---------------*/
.features-tab-tax .features-content .text-col { padding: 50px 0; }

.features-content.tab-tax-intro { background-color: #F0F0F0; border-bottom: solid 3px #fff; }

.tab-tax-intro .row.tab-tax { background: url(Images/web2015/Banner/banner-feature-tax.webp) no-repeat 10% bottom; background-size: auto 90%; min-height: 420px; }

.tab-tax-1 { background-color: #f9f8f7; }

    .tab-tax-1 ul.list-3-col { width: 70%; margin: 30px 10% 0 20%; }

/*------------- Features - Shipping---------------*/
.features-tab-shipping .features-content .text-col { padding: 90px 0; }

.features-content.tab-shipping-intro { background-color: #F0F0F0; border-bottom: solid 3px #fff; }

.tab-shipping-intro .row.tab-shipping { background: url(Images/web2015/Banner/banner-feature-shipping.webp) no-repeat 0 bottom; background-size: auto 90%; }

.tab-shipping-1 { background-color: #f9f8f7; }

    .tab-shipping-1 .text-col { padding: 70px 0; }

    .tab-shipping-1 ul.list-3-col { width: 80%; margin: 30px 5% 0 15%; }

.tab-shipping-2 { background-color: #f3f2f2; padding-top: 30px; }

/*------------- Features - Report---------------*/
.features-content.tab-report-intro { background-color: #F0F0F0; border-bottom: solid 3px #fff; }

.tab-report-intro .row.tab-report { background: url(Images/web2015/Banner/banner-feature-report.webp) no-repeat 0 bottom; background-size: auto 90%; }

    .tab-report-intro .row.tab-report .text-col { padding: 100px 0; }

.tab-report-1 { background-color: #f9f8f7; }

    .tab-report-1 .text-col { padding: 70px 0; }

    .tab-report-1 ul.list-3-col { width: 80%; margin: 30px 5% 0 15%; }

/*------------- Features - Mobile---------------*/
.features-content.tab-mobile-intro { background-color: #F0F0F0; border-bottom: solid 3px #fff; }

.tab-mobile-intro .row.tab-mobile { background: url(Images/web2015/Banner/banner-feature-device.webp) no-repeat 0 bottom; }

    .tab-mobile-intro .row.tab-mobile .text-col { padding: 80px 0; }

.tab-mobile-1 { background-color: #f9f8f7; padding-top: 60px; text-align: center; }

    .tab-mobile-1 .text-col { padding: 40px 0; }

    .tab-mobile-1 .img-col { padding-top: 30px; }

.tab-mobile-2 { background-color: #F0F0F0; padding-top: 30px; }

    .tab-mobile-2 .text-col { padding: 70px 0; }

.features-tab-mobile .features-content .subtitle { line-height: 36px; }

/*------------- Features - Facebook---------------*/
.features-content.tab-facebook-intro { background-color: #F0F0F0; border-bottom: solid 3px #fff; }

.tab-facebook-intro .row.tab-facebook { background: url(Images/web2015/Banner/banner-features-facebook.webp) no-repeat 0 bottom; background-size: auto 85%; }

    .tab-facebook-intro .row.tab-facebook .text-col { padding: 80px 0; }

.tab-facebook-1 { background-color: #f9f8f7; padding: 50px 0 20px; text-align: center; }

.features-tab-facebook .features-content .title-detail { line-height: 36px; }

.tab-facebook-2 { background-color: #f9f8f7; }

    .tab-facebook-2 .img-col { margin-top: 30px; }

.tab-facebook-3 .text-col { padding: 70px 0; }

/*------------- Features - Blog---------------*/
.features-content.tab-blog-intro { background-color: #f3f2f2; border-bottom: solid 3px #fff; }

.tab-blog-intro .row.tab-blog { background: url(Images/web2015/Banner/banner-features-blog.webp) no-repeat 0 bottom; }

    .tab-blog-intro .row.tab-blog .text-col { padding: 80px 0; }

.tab-blog-1 { background-color: #f9f8f7; padding: 50px 0; }

    .tab-blog-1 ul.list-3-col { width: 90%; margin: 30px 0 0 10%; }

.tab-blog-2 { background-color: #f9f8f7; }

    .tab-blog-2 .text-col { padding: 20px 0; }

    .tab-blog-2 .img-col { padding-top: 50px; }

/*------------- Features - Search ---------------*/
.features-tab-search .features-content .text-col { padding: 50px 0; }

.features-content.tab-search-intro { background-color: #F0F0F0; border-bottom: solid 3px #fff; padding: 0; }

.tab-search-intro .row.tab-search { background: url(Images/web2015/Banner/banner-features-search.webp) no-repeat 10% bottom; }

    .tab-search-intro .row.tab-search .text-col { padding: 100px 0; }

.tab-search-1 { background-color: #FFF; border-bottom: solid 3px #fff; padding: 30px 0; }

    .tab-search-1 .img-col { padding-top: 50px; }

    .tab-search-1 .text-col { padding: 30px 0; }

.tab-search-2 { background-color: #faf9f9; border-bottom: solid 3px #fff; padding: 30px 0; }

.tab-search-3 { background-color: #f2f2f2; border-bottom: solid 3px #fff; padding: 30px 0; }

.tab-search-4 { background-color: #faf9f9; border-bottom: solid 3px #fff; padding: 30px 0; }

ul.list-1-col.search-list { width: 80%; margin: 0 5% 0 15%; }

    ul.list-1-col.search-list li { padding-left: 30px; background: url(Images/web2015/bullet/icon-search.jpg) no-repeat 0 2px; text-align: left; line-height: 26px; }

.tab-search-4 ul.list-1-col { width: 80%; margin: 0 5% 0 15%; }

.features-intro { background-color: #f5f5f5; color: #3e3d39; font-size: 24px; line-height: 30px; padding: 50px 0; text-align: center; }

.FeaturesMainDiv .Service .features-intro { background-color: #FFF; padding-bottom: 0; }

.features-intro.default-pricing { background-color: #fbfcfd; border-top: solid 1px #e7e8ea; }

    .features-intro.default-pricing .title { margin-bottom: 30px; }

    .features-intro.default-pricing .pricing-price { clear: left; width: 100%; font-size: 24px; line-height: 50px; color: #9a9a9a; margin-top: 20px; }

        .features-intro.default-pricing .pricing-price span.price { font-size: 48px; color: #357FD3; padding: 0 15px; }

    .features-intro.default-pricing .pricing-text { clear: left; width: 100%; font-size: 24px; line-height: 50px; color: #14ae6a; margin-bottom: 50px; }

.features-intro.default-service { border-top: solid 1px #e7e8ea; }

.features-intro.default-customer { background-color: #f6f6f6; }

.features-intro .info { width: 100%; font-size: 26px; line-height: 35px; font-family: ThaiSansNeue; }

    .features-intro .info span.hilight { font-weight: bold; }

    .features-intro .info p { font-size: 24px; font-family: ThaiSansNeue; }

.features-intro .more-button { display: table; margin: 20px auto 10px; }

a.features-more-button { clear: both; border: 4px solid #777; color: #030303; display: table; font-family: ThaiSansNeue; font-size: 30px; line-height: 36px; margin: 30px auto; padding: 10px 40px; transition: all 0.5s ease-in-out 0s; }

    a.features-more-button:hover { border: 4px solid #4286f5; background-color: #4286f5; color: #fff; transition: all 0.5s ease-in-out 0s; }

.featuresimgcenter { display: table; margin: auto; }

.features-intro a.HyperLink { color: #139acf; text-decoration: none; }

    .features-intro a.HyperLink:hover { color: #357FD3; }

.Default .features-intro .info { color: #777; }

.templatelist { background-color: #fff; border-top: solid 1px #b7b8b8; padding-top: 0; }

.templatelist-top { background: url(Images/Web2017/Background/default-template-background.jpg) repeat-x left top; margin-bottom: 45px; padding: 40px 0; }

    .templatelist-top .columns { padding: 0; }

.templatelist .title { line-height: 40px; height: 40px; margin-bottom: 0; }

.templatelist .sub-title { line-height: 30px; height: 30px; letter-spacing: 3px; width: 100%; font-size: 23px; text-align: center; margin-bottom: 20px; font-family: Arial; }
/*content*/


.features-img { width: 44%; display: inline-block; text-align: center; vertical-align: middle; }

.features-info { width: 50%; padding: 10px 1%; display: inline-block; vertical-align: middle; font-size: 23px; font-family: ThaiSansNeue; }

    .features-info h1, .features-info .subtitle { font-size: 36px; line-height: 36px; font-weight: bold; color: #010101; padding-bottom: 15px; text-align: left; width: 100%; margin: 0; font-family: ThaiSansNeue; }

    .features-info p { font-size: 23px; line-height: 30px; color: #303030; margin: 15px 0 30px; }

    .features-info a.HyperLink { color: #8ab8d0; text-decoration: none; }

        .features-info a.HyperLink:hover { color: #357FD3; }

.gotop { background: url(Images/Web2017/Icon/arrow_back_to_top_grey.svg) no-repeat center center; width: 62px; height: 62px; display: block; }
/*content popup*/

.overlay { background-color: rgba(0, 0, 0, 0.6); bottom: 0; cursor: default; left: 0; opacity: 0; position: fixed; right: 0; top: 0; visibility: hidden; z-index: 1501; -webkit-transition: opacity .5s; -moz-transition: opacity .5s; -ms-transition: opacity .5s; -o-transition: opacity .5s; transition: opacity .5s; }

    .overlay:target { visibility: visible; opacity: 1; }

.popup { background-color: #fff; border: 3px solid #fff; display: inline-block; left: 50%; opacity: 0; position: fixed; top: 60%; visibility: hidden; z-index: 1502; height: 80%; width: 780px; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); -webkit-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; -o-border-radius: 5px; border-radius: 5px; -webkit-transition: opacity .5s, top .5s; -moz-transition: opacity .5s, top .5s; -ms-transition: opacity .5s, top .5s; -o-transition: opacity .5s, top .5s; transition: opacity .5s, top .5s; /*overflow-y: scroll;*/ }

.overlay:target + .popup { top: 50%; opacity: 1; visibility: visible; }

.closePopup { background-color: #000; height: 32px; line-height: 25px; position: absolute; right: -20px; text-align: center; text-decoration: none; top: -20px; width: 32px; border: solid 3px #fff; -webkit-border-radius: 15px; -moz-border-radius: 15px; -ms-border-radius: 15px; -o-border-radius: 15px; border-radius: 15px; }

    .closePopup:before { color: #fff; content: "X"; font-weight: bold; }

    .closePopup:hover { background-color: #f00; }

/* Feature Details */

.FeatureContent { height: 100%; color: #000; line-height: 30px; overflow-y: scroll; padding: 0 40px; }

    .FeatureContent ul { list-style-type: none; margin-top: 5px; }

        .FeatureContent ul li, ul.ListNew li { background: url("Images/Web2017/Bullet/bullet5.gif") no-repeat scroll left 8px; padding-left: 15px; margin: 8px 0px 0px; }

            .FeatureContent ul li a { color: #303030; }

                .FeatureContent ul li a:hover { color: #357FD3; }
/*Content W=100%*/
.content-detail { clear: left; float: left; display: block; width: 100%; padding: 30px 0 40px; background: url(Images/Web2017/Background/features-content-line.jpg) no-repeat bottom center; }

    .content-detail.noline { background: none; padding: 40px 0; }

    .content-detail.lessgap { padding: 0 0 20px 0; }

    .content-detail.nopad-bottom { padding-bottom: 0; }

    .content-detail h1 { font-size: 23px; line-height: 30px; font-weight: normal; color: #303030; padding-bottom: 15px; text-align: left; }

    .content-detail h2 { font-size: 15px; line-height: 25px; font-weight: normal; color: #303030; padding-bottom: 5px; text-align: left; }

    .content-detail h1.center { text-align: center; }

.content-detail-img { width: 47%; padding-right: 2%; display: inline-block; text-align: center; vertical-align: top; padding-top: 30px; }

    .content-detail-img.right { width: 47%; padding-left: 2%; display: inline-block; text-align: center; vertical-align: middle; }

    .content-detail-img.large { width: 60%; }

.content-detail-info { width: 52%; padding: 20px 0; display: inline-block; vertical-align: middle; }

    .content-detail-info.small { width: 38%; }

.content-detail h6 { font-size: 24px; line-height: 30px; font-weight: bold; color: #000; margin: 5px 0; }

.content-detail p { line-height: 30px; color: #303030; margin: 5px 0 25px; }

.content-detail .upper { text-transform: uppercase; font-weight: bold; }
/*Content W=50%*/
.content-detail-half { display: inline-block; width: 48%; padding: 25px 2% 35px; background: url(Images/Web2017/Background/features-content-line-half.jpg) no-repeat bottom center; vertical-align: top; }

    .content-detail-half.noline { background: none; padding: 25px 2%; }

.content-detail-half-img { width: 100%; display: block; text-align: center; vertical-align: middle; min-height: 220px; margin-bottom: 10px; }

.content-detail-half-info { width: 100%; display: block; display: block; min-height: 200px; }

.MarketingTab.FeatureContent { overflow-y: auto; }

.features-content.content-detail { background: none; }

    .features-content.content-detail h1 { font-size: 36px; font-family: ThaiSansNeue; width: 80%; margin-left: auto; margin-right: auto; line-height: 45px; color: #010101; font-weight: bold; }

    .features-content.content-detail .features-info h1, .features-content.content-detail .subtitle { width: 100%; line-height: 45px; }

    .features-content.content-detail.center { text-align: center; }

    .features-content.content-detail p { margin: 15px auto; }

.features-content h4 { font-family: ThaiSansNeue; font-size: 26px; }

/* --- Pricing  --- */
/*Banner sec*/
.PricingBanner { width: 100%; height: 320px; margin: 0; background: url(Images/Banner/banner-pricing.jpg) no-repeat center center; position: relative; }

.PricingBannerText { background: url(Images/Banner/banner-pricing-text.png) no-repeat center top; position: absolute; top: 10px; left: 55%; display: block; height: 250px; width: 380px; }

.pricingbanner-register-button { display: block; font-size: 0; background: url("Images/Web2017/Button/regis-button-pricing.png") no-repeat center center; width: 70%; height: 42px; background-size: 100% auto; position: absolute; bottom: 0; left: 15%; }
/*Tab*/
.pricing-panel.features-content { margin: 20px 0; background: #F5F5F5; padding: 0; }

.pricing-menu-panel .top-bar { background-color: transparent; border-bottom: solid 5px #c0c4c2; min-height: 60px; }

    .pricing-menu-panel .top-bar ul { height: 55px; line-height: 55px; }

        .pricing-menu-panel .top-bar ul li { line-height: 55px; }

            .pricing-menu-panel .top-bar ul li a.pricing-tab { font-family: Cordia New; font-weight: bold; font-size: 30px; font-style: italic; padding: 0 25px 5px; color: #a09d9d; height: 60px; line-height: 40px; }

        .pricing-menu-panel .top-bar ul > li.active:not(.name) a { color: #515151; border-bottom: solid 5px #58c48f; background: url(Images/Web2017/Background/pricing-tab-selected.jpg) no-repeat center bottom; }

.pricing-panel .features-intro { background-color: #fff; }

    .pricing-panel .features-intro.default-customer { background-color: #f5f5f5; padding-bottom: 40px; margin-bottom: 15px; border-top: solid 1px #eee; color: #555; }

/*version*/
.pricing-info-panel { clear: left; float: left; display: block; width: 100%; padding: 0 0 50px; }

    .pricing-info-panel .intro { display: table; margin: 0 auto; width: 100%; padding: 0 0 30px 0; }

        .pricing-info-panel .intro h1 { line-height: 45px; color: #357FD3; margin: 0; }

        .pricing-info-panel .intro h2 { font-size: 24px; line-height: 35px; margin: 0; clear: left; width: 100%; text-align: center; color: #454545; font-weight: normal; }

    .pricing-info-panel .intro-logo { margin-bottom: 20px; position: relative; }

    .pricing-info-panel .intrologoimg { display: table; margin: auto; }

    .pricing-info-panel .intro-logo p.text { position: absolute; width: 100%; text-align: center; top: 30px; }

    .pricing-info-panel div.texttitle { position: absolute; width: 100%; text-align: center; top: 10px; z-index: 1; }

        .pricing-info-panel div.texttitle h1 { color: #357FD3; }

        .pricing-info-panel div.texttitle p { font-size: 23px; }

/*version column*/
.pricing-column-version { width: 33.25%; margin: 40px 0 20px; padding: 0 2%; float: right; text-align: center; min-height: 300px; border-right: solid 1px #c4c3c3; color: #5a5959; }

    .pricing-column-version.enterprise { border: 0; }

.pricing-column-img { width: 100%; min-height: 300px; margin-bottom: 20px; display: block; background: url(Images/Web2017/Background/pricing-down-arrow.jpg) no-repeat center bottom; }

.pricing-column-version .more-button { display: table; margin: 40px 10%; width: 80%; background: url(Images/Web2017/Background/btn_02.jpg) no-repeat center top; border-radius: 5px; }

    .pricing-column-version .more-button:hover { background: url(Images/Web2017/Background/btn_01.jpg) no-repeat center top; }

.version-info { clear: left; width: 100%; font-size: 24px; line-height: 35px; color: #5a5959; }

    .version-info a { color: #5a5959; }

a.pricing-more-button { clear: both; font-size: 30px; font-family: ThaiSansNeue; color: #fff; height: 40px; line-height: 40px; text-align: center; background: #14b06b url(Images/Web2017/Bullet/bullet-button-right-arrow.png) no-repeat 90% center; padding: 0px 35px 0px 20px; box-shadow: 1px -1px 0px 0px rgba(164, 164, 164, 0.6); display: block; transition: background 0.5s ease-out; }

    a.pricing-more-button:hover { color: #fff; background: #20d986 url(Images/Web2017/Bullet/bullet-button-right-arrow.png) no-repeat 90% center; transition: background 0.5s ease-out; }

.pricing-column-price { clear: left; width: 100%; font-size: 18px; line-height: 50px; color: #5a5959; }

    .pricing-column-price span.price { font-size: 48px; font-family: Arial; }

.pricing-column-retailprice { clear: left; width: 100%; line-height: 30px; color: #5a5959; }

ul.pricing-info-list { width: 100%; margin: 0; padding: 0; color: #616161; list-style-type: none; }

    ul.pricing-info-list li { line-height: 25px; min-height: 30px; background-color: #fff; width: 100%; clear: left; margin: 0; padding: 10px; }

/*service package column*/
.package-column { width: 33.25%; margin: 40px 0; padding: 20px 2%; float: right; text-align: center; min-height: 300px; border-right: solid 1px #c4c3c3; color: #5a5959; }

    .package-column.alacart { border: 0; }

.package-column-img { width: 100%; min-height: 280px; margin-bottom: 20px; display: block; }

ul.package-column-info { width: 100%; color: #5a5959; list-style-type: none; }

    ul.package-column-info li { line-height: 48px; min-height: 48px; width: 100%; clear: left; margin: 0; padding: 0; color: #bab9b9; }

        ul.package-column-info li a { color: #5a5959; text-decoration: underline; }

.package-column .more-button { display: table; margin: 40px 10%; width: 80%; }

a.package-more-button { clear: both; font-size: 20px; font-family: Cordia New; font-style: italic; font-weight: bold; color: #fff; height: 40px; line-height: 40px; text-align: center; background: #14ae6a url(Images/Web2017/Bullet/bullet-button-right-arrow.png) no-repeat 90% center; padding: 0px 35px 0px 20px; border-radius: 5px; box-shadow: 1px -1px 0px 0px rgba(164, 164, 164, 0.6); display: block; }

    a.package-more-button:hover { background-color: #2E2E2E; color: #357FD3; }

pricing-more-freebutton .package-column-price { clear: left; width: 100%; font-size: 18px; line-height: 50px; color: #5a5959; }

.package-column-price span.price { font-size: 48px; }


/*===== Default ======*/
.Default { position: relative; }
/*banner*/
.CustomStoreBanner, .DefaultBanner { /*width: 100%;height: 507px; margin: 0; background: url(Images/Banner/banner-default.jpg) no-repeat center center; text-shadow: 1px 1px #eee; font-family: Cordia New;font-weight: bold; font-style: italic;*/ position: relative; z-index: 0; }

.progressbanner { background: url("Images/Banner/banner-trial.jpg") no-repeat scroll center center rgba(0, 0, 0, 0); font-family: Cordia New; font-weight: bold; height: 162px; margin: 0; width: 100%; padding: 0; }

.banner-control { position: relative; overflow: hidden; width: 100%; }

.default-register-button { position: absolute; bottom: 30%; left: 57%; display: block; font-size: 0; background: url("Images/Web2017/Button/regis-button.png") no-repeat center center; width: 305px; height: 41px; box-shadow: 4px 4px 4px 0px rgba(50, 50, 50, 0.75); background-size: 100% auto; }

.default-adwords-button { position: absolute; bottom: 30%; left: 57%; display: block; font-size: 0; background: url("Images/Web2017/Button/regis-adwords-button.png") no-repeat center center; width: 305px; height: 41px; box-shadow: 4px 4px 4px 0px rgba(50, 50, 50, 0.75); background-size: 100% auto; }
/*trial form*/
.trial-form-panel { width: 100%; min-height: 0; padding: 30px 0 0; margin: 0; position: relative; z-index: 9999; clear: left; float: left; }

.trial-form { }

    .trial-form .input { width: 100%; margin-bottom: 20px; clear: left; float: left; min-height: 40px; position: relative; }

        .trial-form .input.signup { margin-right: 0; }

        .trial-form .input .Label { float: left; width: 30%; font-family: ThaiSansNeue; font-size: 26px; color: #1c1c1c; line-height: 40px; }

        .trial-form .input .TextBox { float: left; width: 70%; position: relative; }

        .trial-form .input .button-signup { letter-spacing: 1px; color: #f0f0f0; height: 50px; line-height: 46px; text-align: center; background-color: #343537; transition: background 0.5s ease-out; padding: 0 30px; border: solid 1px #343537; font-size: 24px; font-family: ThaiSansNeue; cursor: pointer; float: right; }

            .trial-form .input .button-signup:hover { background-color: #f0f0f0; transition: background 0.5s ease-out; color: #343537; }

    .trial-form input[type="text"] { border: solid 1px #4e4242; padding: 0 8px; font-size: 24px; font-family: ThaiSansNeue; color: #888; height: 40px; z-index: 1; background-color: #f0f0f0; }

        .trial-form input[type="text"]:focus { color: #000; border: solid 1px #000; }

.trial-form-progresspanel { width: 100%; padding: 40px 0; margin: 0; background: #FFFFFF url(Images/Web2017/Background/background-trialprogress.jpg) no-repeat center top; margin-top: 40px; }

    .trial-form-progresspanel .storename { font-size: 46px; color: #000; padding: 30px 0; font-family: ThaiSansNeueBold; }
    .trial-form-progresspanel .workinprogress { font-size: 40px; margin-top: 70px; color: #3b3b3b; }
        .trial-form-progresspanel .workinprogress .CommonTopic { font-family: ThaiSansNeueBold; }
        .trial-form-progresspanel .workinprogress .CommonDetail { font-size: 30px; margin-bottom: 10px; }
    .trial-form-progresspanel .loader { padding: 15px 0; }
    .trial-form-progresspanel .steptext { font-size: 30px; }

    .trial-form-progresspanel .viewstore-link { padding: 6px 40px; font-size: 30px; font-weight: bold; color: #fff; height: 40px; line-height: 120px; text-align: center; background-color: #14ae69; box-shadow: 1px -1px 0px 0px rgba(164, 164, 164, 0.6); width: 100%; border: 0; }

        .trial-form-progresspanel .viewstore-link:hover { color: #fff; background-color: #20d986; text-decoration: underline; }

.trial-form-post { width: 100%; min-height: 509px; padding: 20px 0; margin: 0; background: url(Images/Web2017/Background/background-trialpost.jpg) no-repeat center top; background-size: cover; }

    .trial-form-post .storename { font-size: 40px; color: #000; padding: 60px 0; }

    .trial-form-post .workinprogress { font-size: 40px; margin-top: 30px; color: #3b3b3b; }

    .trial-form-post .loader { background: url(../../Images/Trial/ajax-loader.gif) no-repeat center center; height: 19px; margin-top: 30px; width: 100%; }

/*form validator*/
.trial-form .validator-style { position: relative; border-radius: 3px; background-color: #ddd; padding: 5px; left: 0; top: 10px; box-shadow: 0 1px 1px #888; z-index: 2; float: left; }

    .trial-form .validator-style:after { content: ""; position: absolute; left: 30px; border-style: solid; top: -7px; border-width: 0 7px 7px; border-color: #ddd transparent; display: block; width: 0; z-index: 1; }

/*===== Page - No Content ======*/
.under-maintain { font-size: 20px; color: #888; text-align: center; padding: 80px 0; }

.FadeInText { animation: fadein 2s; -moz-animation: fadein 2s; /* Firefox */ -webkit-animation: fadein 2s; /* Safari and Chrome */ -o-animation: fadein 2s; /* Opera */ }

@keyframes fadein {
    from { opacity: 0; }

    to { opacity: 1; }
}

@-moz-keyframes fadein { /* Firefox */
    from { opacity: 0; }

    to { opacity: 1; }
}

@-webkit-keyframes fadein { /* Safari and Chrome */
    from { opacity: 0; }

    to { opacity: 1; }
}

@-o-keyframes fadein { /* Opera */
    from; { opacity: 0; }

    to { opacity: 1; }
}


/* Product */
.ProductMaster { clear: left; }

.ProductBanner { background: url(Images/Banner/bg-layout-package.jpg) no-repeat center top; height: 218px; }

    .ProductBanner .row .pdetail-row { left: 2%; width: 96%; }



.PromotionBanner { background: #57D3F7 url(Images/Banner/banner-promotion-list.jpg) no-repeat center top; height: 300px; }

.ClientBanner { background: #57D3F7 url(Images/Banner/banner-client.jpg) no-repeat center top; height: 304px; }

.ServiceBanner { background: #21aef5 url(Images/Banner/banner-service.jpg) no-repeat center top; height: 303px; }

.WebsiteBanner { background: #6E4D34 url(Images/Banner/Banner-Website-Theme.jpg) no-repeat center top; height: 315px; }


/*-- productdetail layout : takraonline --*/
.ProductDetailsResponsive.TakraOnline { margin-bottom: 50px; padding: 30px 3%; }
.area-name { float: left; width: 50%; text-align: center; }

.area-image { float: left; width: 48%; clear: left; padding: 0 40px 0 0; min-height: 350px; margin-top: 20px; }

.area-description { float: right; width: 50%; position: relative; bottom: 20px; margin-right: 2%; }

.area-option { float: right; width: 52%; clear: right; position: relative; margin-bottom: 10px; }

.area-price { float: right; width: 52%; clear: right; }

.area-button { float: right; width: 52%; margin-right: 0; clear: right; }

.area-other { clear: both; width: 100%; float: left; margin: 20px 0; padding: 0 20px; display: none; }

    .area-other .hide-option { display: none; }

.ProductDetailsResponsive.TakraOnline .area-name.ProductQuickInfoShortDescription { float: right; width: 52%; clear: right; text-align: left; margin-top: 10px; }

.ProductDetailsResponsive.TakraOnline .area-name h1 { font-family: ThaiSansNeueBold; font-size: 32px; text-align: left; color: #000; margin: 0 0 10px; }

    .ProductDetailsResponsive.TakraOnline .area-name h1.light { font-size: 28px; color: #454545; font-family: ThaiSansNeue; }

.ProductDetailsResponsive.TakraOnline .area-description { bottom: auto; }

.ProductDetailsResponsive.TakraOnline .ProductQuickInfoName { margin-bottom: 0; }

.ProductDetailsResponsive.TakraOnline .ProductQuickInfoShortDescription { margin-bottom: 0; line-height: 30px; color: #454545; }

.ProductDetailsResponsive.TakraOnline table.ProductDetailsResponsiveImage { width: auto; margin: auto; }

.ProductDetailsResponsive.TakraOnline div.ProductDetailsResponsiveImage { margin-top: 0; }

.ProductDetailsResponsive.TakraOnline .ProductDetailsResponsiveImage img { }

.ProductDetailsResponsive.TakraOnline .OptionGroupDetailsDatalist { width: 100%; }

.ProductDetailsResponsive.TakraOnline .OptionItemDetailsTop { min-width: 80px; line-height: 35px; margin-right: 5px; width: 80px; }
.ProductDetailsResponsive.TakraOnline .OptionItemDetailsLeft { margin: 0; clear: none; width: 50%; }
.ProductDetailsResponsive.TakraOnline .OptionItemDetails { margin-bottom: 10px; }
.ProductDetailsResponsive.TakraOnline .OptionDisplayText { font-size: 20px; font-weight: normal; }

.ProductDetailsResponsive.TakraOnline .OptionTextItemText.CommonTextBox { margin-left: 0; width: 200px !important; border: solid 2px #aba9a9; border-radius: 5px; }

.ProductDetailsResponsive.TakraOnline .OptionDropDownItem { width: 200px; position: relative; background: url(Images/Web2017/Bullet/product-detail-dropdown.png) no-repeat 96% center; overflow: hidden; border: solid 2px #aba9a9; border-radius: 5px; height: 35px; line-height: 32px; }

    .ProductDetailsResponsive.TakraOnline .OptionDropDownItem select { width: 115%; padding: 0 2px; background: none; border: 0; font-size: 16px; height: auto; height: 35px; }

.ProductDetailsResponsive.TakraOnline .CommonOptionItemValidator { position: absolute; bottom: 24px; }

.ProductDetailsResponsive.TakraOnline .TextOptionItemValidator { position: absolute; bottom: 27px; background: url(Images/Web2017/Bullet/RequiredFillBullet_Down.gif) no-repeat left center; padding-left: 20px; border-bottom: dotted 1px #f00; }

    .ProductDetailsResponsive.TakraOnline .TextOptionItemValidator img, .ProductDetailsResponsive.TakraOnline .TextOptionValidateDiv { display: none; }

.ProductDetailsResponsive.TakraOnline .ProductDetailsResponsiveAddToCart { width: 50%; }

    .ProductDetailsResponsive.TakraOnline .ProductDetailsResponsiveAddToCart .BtnStyle1 { line-height: 50px; font-size: 28px; font-family: ThaiSansNeueBold; color: #fff; background-color: #302e2e; border: solid 4px #3d3f3f; display: block; width: 100%; padding: 0; margin: 0; }

        .ProductDetailsResponsive.TakraOnline .ProductDetailsResponsiveAddToCart .BtnStyle1:hover { border-color: #4286f5; background-color: #357FD3; }

        .ProductDetailsResponsive.TakraOnline .ProductDetailsResponsiveAddToCart .BtnStyle1.Essential:hover { background-color: #20bfee; border: solid 4px #4fcef3; }

        .ProductDetailsResponsive.TakraOnline .ProductDetailsResponsiveAddToCart .BtnStyle1.Enterprise:hover { background-color: #f8ae0b; border: solid 4px #f9bb33; }

.ProductDetailsResponsive.TakraOnline .ButtonDiv { display: none; }

.ProductDetailsResponsive.TakraOnline .ProductDetailsResponsiveOurPrice { margin-top: 15px; padding-bottom: 0; }

.ProductDetailsResponsive.TakraOnline .DomainOptionRemark1 { color: #f00; position: absolute; bottom: 30px; left: 300px; }

.ProductDetailsResponsive.TakraOnline .DomainOptionRemark2 { position: absolute; bottom: 0; left: 90px; font-size: 20px; }

.ProductDetailsResponsive.TakraOnline .ProductDetailsResponsiveRetailPrice { clear: left; display: table; }

.ProductDetailsResponsive.TakraOnline .ProductQuickInfoPriceTitle { display: none; }

.ProductDetailsResponsive.TakraOnline ul { list-style-type: none; padding: 0; margin: 0 0 30px; list-style-image: none; }

    .ProductDetailsResponsive.TakraOnline ul.adwords { margin: 30px auto; text-align: left; width: 55%; }

    .ProductDetailsResponsive.TakraOnline ul li { background: url(Images/Web2017/Bullet/bullet-gray.png) no-repeat left 10px; padding-left: 18px; line-height: 25px; margin-bottom: 5px; }

.bar-dark { width: 110px; height: 2px; background-color: #6b6b6b; margin: 20px auto 20px 0; clear: right; float: left; }
/* --- Contact  --- */
.ContactBanner { width: 100%; height: 162px; margin: 0; background: url(Images/Banner/banner-contact.jpg) no-repeat center top; }

.HelpContentMenuSitemapDiv { position: relative; bottom: 46px; left: 45px; }
/* Content List */
.ContentMenuItem .CommonPageRight { padding-top: 25px; }

.ContentLayoutRight { font-family: CSPraJad; font-size: 17px; }

.ContentLayout h1, .ContentLayout h2, .ContentLayout h3, .ContentLayout h4, .ContentLayout h5, .ContentLayout h6 { line-height: 30px; margin-bottom: 12px; margin-top: 12px; font-family: ThaiSansNeue; }

.ContentLayout p { margin: 5px 0 20px; font-family: CSPraJad; font-size: 17px !important; }

.ContentLayout h1 { font-size: 32px; }

.ContentLayout h2 { font-size: 28px; }

.ContentLayout h3 { font-size: 26px; }

.ContentLayout h4 { font-size: 24px; }

.ContentLayout h5 { font-size: 23px; }

.ContentLayout h5 { font-size: 20px; }

.ContentLayout ul { list-style-type: none; margin: 10px 0 15px 10px; padding: 0; }

    .ContentLayout ul li { background: url("Images/Web2017/Bullet/bullet5.gif") no-repeat scroll left 8px; padding-left: 15px; margin: 8px 0 0; }

.ContentLayout a { color: #357FD3; }

    .ContentLayout a:hover { color: #4286f5; }

.ContentLayout ul.haslink li { background: url(Images/Web2017/Bullet/icon-page.gif) no-repeat left center; padding: 0 0 0 30px; margin: 0; }

    .ContentLayout ul.haslink li a { line-height: 40px; color: #111; }

.ContentLayout ul li a:hover { color: #4286f5; }

.ContentLayout div.pic { text-align: center; margin: 40px 0; }

/* Demo Selector */
.ThemeDemoToolbar { width: 100%; overflow: hidden; }

    .ThemeDemoToolbar .Wrapper { background-color: #F9F9F9; min-height: 40px; padding: 10px 0; box-shadow: inset 0px -3px 5px 0px rgba(50, 50, 50, 0.1); }

    .ThemeDemoToolbar .Logo { min-height: 35px; float: left; margin-right: 10px; margin-top: 2px; }

        .ThemeDemoToolbar .Logo a { text-decoration: none; display: block; }

    .ThemeDemoToolbar .ThemeDemoLabel { font-size: 24px; line-height: 35px; float: left; color: #357FD3; font-weight: bold; }

    .ThemeDemoToolbar .ThemeSelector { color: #313131; border-radius: 3px; box-shadow: 1px 0 2px #BBB; float: left; display: block; margin-left: 25px; background: #fff url(Images/Web2017/Bullet/Dropdown.jpg) no-repeat 98% center; padding: 0 20px 0 10px; height: 35px; line-height: 35px; }

.ThemeSelector:hover { color: #357FD3; }

.ThemeDemoToolbar .ThemeDemoAddCart.BtnStyle1 { background: #14B06B url(Images/Web2017/Icon/icon-cart-demo.png) no-repeat 10px center; line-height: 30px; float: right; margin-right: 0; padding: 0 30px 0 40px; }

.ThemeDemoToolbar .ThemeColumn { height: 0 !important; }

.ThemePreview .ThemeDemoAddCart { line-height: 30px; float: none; margin: 0 auto; }

.ThemeListBox { width: 409px; height: 433px; padding-left: 20px; overflow: hidden; float: left; background-color: #f9f9f9; border-top-right-radius: 4px; border-bottom-right-radius: 3px; border-left: solid 1px #eee; }

.ThemeItemPanel { margin-top: 12px; float: left; height: 44px; width: 327px; background: white; border-radius: 0px 5px 5px 0px; z-index: 1560; }


.ThemeItemList { }

.ThemeItem { float: left; clear: left; color: #454545; line-height: 30px; }

    .ThemeItem:hover { color: #357FD3; }

.ThemeNavigatorLeft { width: 30px; height: 30px; background: url(Images/Web2017/Button/NavigatorLeft.jpg) no-repeat center center; border-radius: 5px; float: right; margin-right: 10px; }

    .ThemeNavigatorLeft:hover { background: url(Images/Web2017/Button/NavigatorLeftHover.jpg) no-repeat center center; }

.ThemeNavigatorRight { width: 30px; height: 30px; background: url(Images/Web2017/Button/NavigatorRight.jpg) no-repeat center center; border-radius: 5px; float: right; margin-right: 20px; }

    .ThemeNavigatorRight:hover { background: url(Images/Web2017/Button/NavigatorRightHover.jpg) no-repeat center center; }

.NavButton { opacity: 1; width: 31px; height: 31px; float: left; }


.ThemeBox { background-color: #fff; display: inline-block; left: 50%; opacity: 0; position: fixed; top: 290px; visibility: hidden; height: 433px; box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.9); z-index: 1502; width: 621px; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); -webkit-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; -o-border-radius: 5px; border-radius: 5px; -webkit-transition: opacity .5s, top .5s; -moz-transition: opacity .5s, top .5s; -ms-transition: opacity .5s, top .5s; -o-transition: opacity .5s, top .5s; transition: opacity .5s, top .5s; /*overflow-y: scroll;*/ }

.overlay:target + .ThemeBox { top: 295px; opacity: 1; visibility: visible; }

.ThemePreview { width: 212px; height: 360px; padding: 19px; /*background: url("../../Images/Demo/Components/theme_preview.png") repeat-x scroll 0px 0px transparent;*/ border-top-left-radius: 4px; border-bottom-left-radius: 3px; float: left; }

.ThemeImage { margin-bottom: 20px; width: 180px; height: 140px; box-shadow: 0px 0px 7px rgba(0, 0, 0, 0.8); margin-left: -2px; /*border: 1px solid rgb(0, 0, 0);*/ }

.ThemeName { margin-bottom: 10px; color: #303030; font-weight: normal; line-height: 30px; }

.ThemeDescription { color: #777; line-height: 24px; height: 140px; font-family: 'CSPraJad'; font-size: 16px; }


.ThemeList { height: 390px; -webkit-transition: margin-left 0.5s; -moz-transition: margin-left 0.5s; -ms-transition: margin-left 0.5s; -o-transition: margin-left 0.5s; transition: margin-left 0.5s; }

.ThemeColumn { width: 175px; height: 390px; float: left; margin-right: 20px; }

.ThemeCategory { border-bottom: 1px solid #ddd; line-height: 30px; width: 175px; padding: 20px 0 5px; margin-bottom: 15px; float: left; }

.ThemeCategoryLink { list-style: none outside none; border: medium none; padding: 0px; float: left; font-weight: bold; }

.ThemeCategoryNumber { color: #14B06B; float: left; margin-left: 5px; }

.fixHeight { max-height: 100%; }

.rightcontent { background: url(Images/Content/Ecommerce1.gif) no-repeat; width: 100%; height: 320px; }

.rightcontent2 { background: url(Images/Content/Ecommerce2.gif) no-repeat; width: 100%; height: 194px; margin-top: 20px; padding: 115px 0 0 25%; }

/* --- Affiliate Landing Page  --- */
.AffiliateLandingBanner { width: 100%; height: 324px; margin: 0; background: url(Images/Banner/banner-bhongtongpartner.jpg) no-repeat center center; }

.AffiliateLandingCouponDiv { position: relative; bottom: 23px; background-color: #f9f9f9; border-bottom: 1px solid #eee; padding: 15px 0; width: 100%; line-height: 35px; position: relative; }

.AffiliateCouponDiscount { float: left; width: 50%; border-right: solid 1px #cacbcd; padding-right: 2%; }

    .AffiliateCouponDiscount .Label { color: #0178cc; font-weight: bold; float: right; margin-right: 20px; }

    .AffiliateCouponDiscount .Value { float: right; font-size: 15px; font-weight: bold; background-color: #d7d5d6; -webkit-box-shadow: -2px -2px 0px 0px rgba(50, 50, 50, 0.75); -moz-box-shadow: -2px -2px 0px 0px rgba(50, 50, 50, 0.75); box-shadow: -2px -2px 0px 0px rgba(50, 50, 50, 0.75); }

.AffiliateUseCoupon { float: right; width: 50%; padding-left: 2%; }

    .AffiliateUseCoupon .BtnStyle2 { }

.AffiliateLandingCouponDiv .ButtonStyle { border-radius: 18px; height: 35px; line-height: 35px; margin: 0; padding: 0 25px; min-width: 150px; text-align: center; }
/* ProductList TakraPackage */
.ProductListDefaultPagingControl.TakraPackage { display: none; }

.ProductListTakraPackageDataList { width: 100%; text-align: center; }
.CommonProductItemStyle.ProductListItemTakraPackage { width: 280px; margin: 20px 10px; background-color: #f8f7f5; padding: 10px; border-radius: 10px; }
.CommonProductImage.TakraPackage { min-height: 220px; }
    .CommonProductImage.TakraPackage img { max-width: 260px; max-height: 220px; }
.ProductListItemTakraPackage .CommonProductImagePanel { height: 100%; }
.CommonProductName.TakraPackage { line-height: 35px; min-height: 40px; }

.CommonProductDescription.TakraPackage { margin: 8px 0; }

.CommonProductButton.TakraPackage { }

.ProductListItemTakraPackage .OurPriceValue { font-size: 24px; line-height: 30px; }

.TakraPackageAddToCart { display: block; margin: 20px 0 0; height: 50px; line-height: 45px; width: 100%; }

    .TakraPackageAddToCart a { font-size: 24px; padding: 5px 0 !important; width: 100% !important; }

.TakraPackageColumn { display: table; margin: 20px auto; height: 50px; line-height: 45px; }

    .TakraPackageColumn a { font-size: 24px; }

.ProductListItemTakraPackageColumn { background: url(Images/web2015/Background/footer-border.png) no-repeat center top; margin-top: 10px; padding-top: 10px; }

/*CheckoutNotComplete*/
.CheckoutNotComplete { width: 100%; min-height: 250px; padding: 20px 0; margin: 0; background: url(Images/Web2017/Background/background-trialprogress.jpg) no-repeat center bottom; }

/* customer-site */
.customer-site { width: 100%; margin: 0; }

    .customer-site .CommonProductItemStyle { margin: 40px 1% 0; float: left; }

    .customer-site .ProductListItemColumn2 div.CommonProductImage { min-height: 205px; }

    .customer-site .ProductListItemColumn2 .CommonProductImage a { height: 205px; }

    .customer-site .ProductListItemColumn2 img { box-shadow: 0px 8px 5px 0px rgba(50, 50, 50, 0.5); }

    .customer-site .CommonProductName { margin-top: 0; min-height: 50px; }

    .customer-site .CommonProductInfo { margin-top: 10px; color: #454545; line-height: 30px; }

    .customer-site .paging-control { display: table; margin: 35px auto 0; clear: left; }

.CustomerAds { line-height: 40px; height: 40px; text-align: center; width: 100%; margin-bottom: 20px; background-color: #14AE69; border-radius: 5px; }

    .CustomerAds:hover { background-color: #20D986; }

.CustomerPageLink { color: #fff; font-size: 24px; }

    .CustomerPageLink:hover { color: #fff; text-decoration: underline; }

.CommonGridView.PaymentSlip { width: 60%; text-align: center; }

    .CommonGridView.PaymentSlip .CommonGridViewRowStyle > td { text-align: center; }


.payment-detail-img { width: 30%; padding-left: 2%; display: inline-block; text-align: center; vertical-align: top; }

    .payment-detail-img.bank { position: relative; top: 20px; height: 10px; }

.payment-detail ul { list-style-type: none; padding: 0; margin: 0 0 30px; }

    .payment-detail ul li { background: url(Images/Web2017/Bullet/Bullet2.gif) no-repeat left 15px; padding-left: 18px; line-height: 30px; }

.payment-detail p.new-sec { background: url("Images/Web2017/Background/features-line.jpg") no-repeat center center; padding: 30px 0; }

.payin-tax-left { float: left; width: 45%; }

.payin-tax-right { float: left; width: 45%; margin-left: 5%; }

span.sales-price { color: #14AE69; }

span.retail-price { color: #A8ACAD; text-decoration: line-through; }

/* Blog Category Box End */
.BlogAds { margin: 30px 0 20px; background: url(images/banner/blog-ads.jpg) no-repeat center center; width: 100%; min-height: 285px; position: relative; }

    .BlogAds .BlogAdsLink { display: block; width: 260px; height: 285px; font-size: 0; }

/* product detail layout - special for training course */
.TakraOnline.Training { padding: 0; color: #454545; line-height: 30px; text-align: center; margin-bottom: 0; }

    .TakraOnline.Training .Title { width: 100%; font-size: 36px; font-weight: bold; line-height: 40px; color: #303030; }

    .TakraOnline.Training .ProductQuickInfoName { width: 70%; min-height: 80px; margin: 0 auto 20px; }

    .TakraOnline.Training .ProductQuickInfoShortDescription { width: 100%; border-top: solid 1px #dad7d7; padding: 30px 0; }

    .TakraOnline.Training .area-image { float: left; width: 42%; clear: left; padding: 10px 30px; min-height: 230px; display: none; }

    .TakraOnline.Training .area-description { float: left; width: 50%; position: relative; bottom: 0; margin-right: 2%; text-align: left; }

    .TakraOnline.Training .area-option { float: right; width: 58%; clear: right; position: relative; margin-bottom: 20px; }

    .TakraOnline.Training .area-price { float: right; width: 42%; clear: left; text-align: center; }

    .TakraOnline.Training .area-button { float: right; width: 50%; margin-right: 6%; clear: right; }

    .TakraOnline.Training .area-other { clear: both; width: 100%; float: left; margin: 20px 0; padding: 0 20px; display: none; }

    .TakraOnline.Training .area-training-time { float: left; width: 49%; clear: left; margin-bottom: 15px; }

    .TakraOnline.Training .area-training-cost { float: right; width: 49%; margin-bottom: 15px; }

    .TakraOnline.Training .area-training-schedule { clear: both; width: 100%; margin: 20px 0 0; }

    .TakraOnline.Training .area-more-info { clear: both; margin: 20px 0; background: url(Images/Banner/training-contact.jpg) no-repeat center center; height: 100px; background-size: 100% auto; }

    .TakraOnline.Training .area-addcart { position: relative; float: right; margin-top: -40px; margin-right: 21%; height: 31px; background-size: 100% auto; width: 231px; }

        .TakraOnline.Training .area-addcart a.addcart-button { margin: 0; line-height: 31px; height: 31px; font-size: 0; background: url(Images/Web2017/Button/training-regis-button.jpg) no-repeat center center; }

            .TakraOnline.Training .area-addcart a.addcart-button:hover { background: url(Images/Web2017/Button/training-regis-button-hover.jpg) no-repeat center center; }

        .TakraOnline.Training .area-addcart a.free-addcart-button { background: url(Images/Web2017/Button/training-free-regis-button.jpg) no-repeat center center; }

            .TakraOnline.Training .area-addcart a.free-addcart-button:hover { background: url(Images/Web2017/Button/training-free-regis-button-hover.jpg) no-repeat center center; }

    .TakraOnline.Training .area-addcart-full { display: table; margin: 50px auto 30px; background: url(Images/Banner/area-addcart-full-button.jpg) no-repeat center center; height: 43px; background-size: 100% auto; width: 480px; }
    /* for adwords*/
    .TakraOnline.Training .adwords-addcart-div { display: table; margin: 20px auto 15px; width: 100%; background: url(Images/Banner/training-adwords-regis.jpg) no-repeat center bottom; height: 180px; background-size: 100% auto; }

    .TakraOnline.Training .training-addcart-div { display: table; margin: 20px auto 15px; width: 100%; background: url(Images/Banner/training-regis.jpg) no-repeat center bottom; height: 180px; background-size: 100% auto; }

    .TakraOnline.Training .facebookads-addcart-div { display: table; margin: 20px auto 15px; width: 100%; background: url(Images/Banner/training-adwords-regis.jpg) no-repeat center bottom; height: 180px; background-size: 100% auto; }

    .TakraOnline.Training .adwords-ads-div { display: table; margin: 0 auto 25px; width: 100%; background: url(Images/Banner/training-adwords-ads.jpg) no-repeat center bottom; height: 180px; background-size: 100% auto; }

    .TakraOnline.Training .photo-addcart-div { display: table; margin: 20px auto 15px; width: 100%; background: url(Images/Banner/photo-regis.jpg) no-repeat center bottom; height: 180px; background-size: 100% auto; }

    .TakraOnline.Training .photoservice-addcart-div { display: table; margin: 20px auto 15px; width: 100%; background: url(Images/Banner/photoservice.jpg) no-repeat center bottom; height: 180px; background-size: 100% auto; }

    .TakraOnline.Training .usingprogram-addcart-div { display: table; margin: 20px auto 15px; width: 100%; background: url(Images/Banner/training-usingprogram-ads.jpg) no-repeat center bottom; height: 180px; background-size: 100% auto; }

    .TakraOnline.Training a.addcart-button { clear: both; margin: 0; padding: 0; display: block; width: 100%; height: 180px; }

    .TakraOnline.Training .addcart-full-div { display: table; margin: 20px auto 15px; width: 100%; background: url(Images/Banner/training-regis-full.jpg) no-repeat center bottom; height: 180px; background-size: 100% auto; }

    .TakraOnline.Training .AdditionalTitle { width: 100%; font-size: 36px; font-weight: bold; line-height: 35px; color: #454545; padding: 35px 0 25px; background: url(Images/Web2017/Background/bg-training-line.jpg) no-repeat center bottom; border-top: solid 1px #dad7d7; }

    .TakraOnline.Training .AdditionalDetail { padding: 30px 0 10px; background: url(Images/Web2017/Background/bg-training-line.jpg) no-repeat center bottom; margin-bottom: 40px; clear: left; float: left; width: 100%; }

        .TakraOnline.Training .AdditionalDetail h4 { text-align: center; line-height: 35px; margin: 0 auto 20px; color: #454545; }

        .TakraOnline.Training .AdditionalDetail p { margin: 10px; }

.AdditionalDetail ul.benefit-list { list-style-type: none; padding: 0; margin: 10px 0 20px; clear: left; float: left; width: 100%; }

    .AdditionalDetail ul.benefit-list li { width: 24%; padding: 0px; margin: 10px 0; text-align: center; background: none; display: inline-block; }

.TakraOnline.Training .benefit { background: url(Images/Web2017/Background/gradient-background.jpg) no-repeat center top; }

.TakraOnline.Training .study { border-bottom: solid 1px #dad7d7; }

    .TakraOnline.Training .study .AdditionalTitle { background: none; }

.schedule { border-top: solid 1px #bbbaba; margin: 20px 0 0; padding-bottom: 20px; }

.schedule-table { width: 60%; line-height: 40px; color: #4c4c4c; display: table; margin: 10px auto; text-align: left; }

    .schedule-table .first-col { clear: both; float: left; width: 22%; }

    .schedule-table .second-col { float: right; width: 75%; padding-left: 30px; text-align: left; }

    .schedule-table .schedule-table-head { padding-top: 10px; padding-bottom: 10px; font-weight: bold; font-size: 30px; margin-bottom: 15px; }

.TakraOnline.Training .area-training-schedule .OptionGroupDetailsDatalist { margin-top: 0; }

.area-training-schedule .ContentMenuSitemapDiv { border-top: solid 1px #ccc; border-bottom: solid 1px #ccc; margin-bottom: 50px; }
/*.schedule-table tr:nth-child(odd) td{ }
.schedule-table tr:nth-child(even) td{ color: #14AE69;}*/
.area-map { clear: both; float: left; width: 49%; text-align: left; color: #454545; margin: 20px 0 30px; }

.area-map-div { border-radius: 10px; border: solid 1px #eee; margin-top: 30px; clear: left; float: left; width: 100%; }

.area-itinerary { float: right; width: 48%; text-align: left; margin: 70px 0 30px; }

    .area-itinerary .title-detail { font-family: CSPraJad; font-size: 17px; line-height: 30px; }

.area-map .subtitle { margin-bottom: 5px; font-size: 26px; }

.area-map .company { clear: left; float: left; width: 100%; margin: 15px 0 5px; }

.area-map .title-detail { font-family: CSPraJad; font-size: 17px; line-height: 30px; }

.area-itinerary .Label, .area-map .company .Label { clear: left; font-weight: bold; line-height: 36px; }

.area-itinerary .Data, .area-map .company .Data { float: left; line-height: 30px; clear: left; float: left; width: 100%; }

.area-itinerary .car { background: url(Images/Web2017/Icon/car.jpg) no-repeat left center; padding-left: 80px; clear: left; float: left; width: 100%; margin: 0 0 5px 0; }

.area-itinerary .bus { background: url(Images/Web2017/Icon/bus.jpg) no-repeat left center; padding-left: 80px; clear: left; float: left; width: 100%; margin: 0 0 5px 0; }

.area-itinerary .bts { background: url(Images/Web2017/Icon/bts.jpg) no-repeat left center; padding-left: 80px; clear: left; float: left; width: 100%; margin: 40px 0 5px; }

.area-itinerary .brt { background: url(Images/Web2017/Icon/brt.jpg) no-repeat left center; padding-left: 80px; clear: left; float: left; width: 100%; margin: 0 0 5px 0; }

.area-itinerary .mrt { background: url(Images/Web2017/Icon/mrt.jpg) no-repeat left center; padding-left: 80px; clear: left; float: left; width: 100%; margin: 0 0 5px 0; }

.product-image-intro { display: table; margin: 30px auto 0; width: 100%; }

.MapLinkEvent { cursor: pointer; }

.ModalBackgroundDark { background-color: #000; filter: alpha(opacity=80); opacity: 0.8; z-index: 9; }

.confirm-dialog { width: 90%; background-color: #fff; border: 3px solid #FFFFFF; border-radius: 5px; -webkit-box-shadow: 0px 0px 10px 0px #555; box-shadow: 0px 0px 10px 0px #555; }

    .confirm-dialog .closePopup { cursor: pointer; }

.TakraOnline.Training .OptionGroupDetailsDatalist { margin-left: 10%; margin-top: 20px; }

.TakraOnline.Training .OptionDisplayText { font-size: 24px; font-weight: normal; }

.line { background: url(Images/Web2017/Background/dot-line-title.jpg) repeat-x center center; width: 100%; height: 20px; clear: left; }
/*Productdetail marketing layout */
.TakraOnline.Training.Marketing .area-addcart a.addcart-button { background: url(Images/Web2017/Button/buy-marketing-button.jpg) no-repeat center center; }

    .TakraOnline.Training.Marketing .area-addcart a.addcart-button:hover { background: url(Images/Web2017/Button/buy-marketing-button-hover.jpg) no-repeat center center; }

.TakraOnline.Training.Marketing .google-addcart-div, .TakraOnline.Training.Marketing .facebook-addcart-div { background: url(Images/Banner/social-ads.jpg) no-repeat center bottom/100% auto; display: table; margin: 20px auto 15px; width: 100%; height: 180px; background-size: 100% auto; }

.TakraOnline.Training.Marketing .ProductQuickInfoName { margin: 0 auto 25px; width: 100%; }
/* Training Ads */
.TrainingAds { margin: 30px 0 20px; background: url(images/banner/training-ads.jpg) no-repeat center center; width: 100%; min-height: 285px; position: relative; }

    .TrainingAds .RegisterLink { position: absolute; bottom: 40px; font-style: normal; background: #14AE69 url(Images/Web2017/Button/ads-regis-button.png) no-repeat center center; width: 66%; height: 31px; margin: 0; left: 17%; }

/*trial form - footer*/
.trial-regis-footer { padding: 40px 0; background: #36c9f5; }

    .trial-regis-footer .trial-form-title { background-color: #14b069; height: 54px; width: 100%; line-height: 54px; color: #fff; font-size: 20px; }

    .trial-regis-footer .trial-form-title-icon { background: url(Images/Web2017/Icon/trial-form-title.jpg) no-repeat left center; padding-left: 230px; position: relative; }

    .trial-regis-footer .trial-form-title-bg { background: url(Images/Web2017/Background/trial-form-title-bg.jpg) no-repeat right center; }

    .trial-regis-footer .trial-form-corner { content: ""; position: absolute; left: 8px; border-style: solid; bottom: -12px; border-width: 15px 10px 0; border-color: #14b069 transparent; display: block; width: 0; z-index: 1; }

    .trial-regis-footer .trial-form-panel { min-height: inherit; padding: 0; margin: 0; position: inherit; }

    .trial-regis-footer .trial-form { padding: 10px 0 0; background: #36c9f5; border: 0; box-shadow: none; }

        .trial-regis-footer .trial-form input[type="text"] { border: solid 1px #fff; color: #fff; background: transparent; border-radius: 0; font-size: 30px; font-weight: normal; padding: 5px 8px; }

            .trial-regis-footer .trial-form input[type="text"]:focus { border: solid 2px #fcf204; background: #fcfcfc; box-shadow: 0px 0px 5px 5px rgba(0, 0, 0, 0.2); color: #454545; }

        .trial-regis-footer .trial-form .validator-style { background-color: #000; box-shadow: 0 1px 1px #000; }

            .trial-regis-footer .trial-form .validator-style:after { content: ""; position: absolute; border-color: #000 transparent; }

        .trial-regis-footer .trial-form .input.signup { height: 40px; line-height: 40px; text-align: center; }

        .trial-regis-footer .trial-form .input .button-signup { font-family: ThaiSansNeue; font-size: 30px; font-style: normal; color: #fff; text-align: center; border-radius: 0; width: 100%; display: block; border: 0; background: #fbaf5d; transition: background 0.5s ease-out, color 0.5s ease-out; }

            .trial-regis-footer .trial-form .input .button-signup:hover { color: #000; background: #fff301; transition: background 0.5s ease-out, color 0.5s ease-out; text-decoration: none; }

/* template list */
ul.template-list { width: 87%; list-style-type: none; float: none; margin: 0 auto; display: table; }

li.template-item { text-align: center; width: 32.75%; margin: 3px 0.25%; float: left; }

    li.template-item .TemplateItemStyle { max-height: 250px; height: 250px; overflow: hidden; }

    li.template-item .NewArrivalItem { height: 250px; width: 100%; overflow: hidden; background-position: top center; background-repeat: no-repeat; background-size: 100% 100%; opacity: 1; transform: scale(1,1); transition-timing-function: linear; transition-duration: .4s; -webkit-transform: scale(1,1); -webkit-transition-timing-function: linear; -webkit-transition-duration: .4s; -moz-transform: scale(1,1); -moz-transition-timing-function: linear; -moz-transition-duration: .4s; }

        li.template-item .NewArrivalItem .template-bg { width: 100%; height: 250px; opacity: 0; z-index: 1; transform: rotate(44deg) scale(1) skew(-6deg) translate(-400px); -webkit-transform: rotate(44deg) scale(1) skew(-6deg) translate(-400px); -moz-transform: rotate(44deg) scale(1) skew(-6deg) translate(-400px); -o-transform: rotate(44deg) scale(1) skew(-6deg) translate(-400px); -ms-transform: rotate(44deg) scale(1) skew(-6deg) translate(-400px); transition: 0.5s opacity linear, 0.5s transform linear; -webkit-transition: 0.5s opacity linear, 0.5s transform linear; }

        li.template-item .NewArrivalItem a { display: inline-block; text-decoration: none; color: #fff; font-family: ThaiSansNeueBold; font-size: 70px; padding-top: 100px; text-align: center; text-transform: uppercase; z-index: 2; opacity: 0; -webkit-transform: translateY(0px) translateZ(0); transform: translateY(-0px) translateZ(0); -webkit-transition: .5s opacity cubic-bezier(.23,1,.32,1),.5s -webkit-transform cubic-bezier(.23,1,.32,1); transition: .5s opacity cubic-bezier(.23,1,.32,1),.5s transform cubic-bezier(.23,1,.32,1); -moz-transform: translateY(0) translateZ(0); -moz-transition: .5s opacity cubic-bezier(.23,1,.32,1),.5s transform cubic-bezier(.23,1,.32,1); position: absolute; top: 0; left: 0; width: 100%; height: 250px; }

        li.template-item .NewArrivalItem.cozy { background-image: url("Images/New-Header/cozy-default.jpg"); }

        li.template-item .NewArrivalItem.passion { background-image: url("Images/New-Header/passion-default.jpg"); }

        li.template-item .NewArrivalItem.snazzy { background-image: url("Images/New-Header/snazzy-default.jpg"); }

        li.template-item .NewArrivalItem.cheery { background-image: url("Images/New-Header/cheery-default.jpg"); }

        li.template-item .NewArrivalItem.chic { background-image: url("Images/New-Header/chic-default.jpg"); }

        li.template-item .NewArrivalItem.exceptional { background-image: url("Images/New-Header/exceptional-default.jpg"); }

        li.template-item .NewArrivalItem:hover { transform: scale(1.02,1.02); transition-timing-function: linear; transition-duration: .4s; -webkit-transform: scale(1.02,1.02); -webkit-transition-timing-function: linear; -webkit-transition-duration: 0.6s; -moz-transform: scale(1.02,1.02); -moz-transition-timing-function: linear; -moz-transition-duration: .4s; position: relative; z-index: 0; }


        li.template-item .NewArrivalItem.cozy .template-bg { background: rgba(255,186,0,0.9); }

        li.template-item .NewArrivalItem.passion .template-bg { background: rgba(250,141,11,0.9); }

        li.template-item .NewArrivalItem.snazzy .template-bg { background: rgba(216,22,22,0.9); }

        li.template-item .NewArrivalItem.cheery .template-bg { background: rgba(3,173,239,0.9); }

        li.template-item .NewArrivalItem.chic .template-bg { background: rgba(255,83,141,0.9); }

        li.template-item .NewArrivalItem.exceptional .template-bg { background: rgba(24,99,173,0.9); }

        li.template-item .NewArrivalItem:hover .template-bg { opacity: 1; transform: rotate(44deg) scale(2.5) skew(-6deg) translate(0px); -webkit-transform: rotate(44deg) scale(2.5) skew(-6deg) translate(0px); -moz-transform: rotate(44deg) scale(2.5) skew(-6deg) translate(0px); -o-transform: rotate(44deg) scale(2.5) skew(-6deg) translate(0px); -ms-transform: rotate(44deg) scale(2.5) skew(-6deg) translate(0px); transition: 0.5s opacity linear, 0.5s transform linear; -webkit-transition: 0.5s opacity linear, 0.5s transform linear; z-index: 0; }

        li.template-item .NewArrivalItem:hover a { opacity: 1; -webkit-transform: translateY(-30px) translateZ(0); transform: translateY(-30px) translateZ(0); -webkit-transition: .6s opacity cubic-bezier(.23,1,.32,1),.6s -webkit-transform cubic-bezier(.23,1,.32,1); transition: .6s opacity cubic-bezier(.23,1,.32,1),.6s transform cubic-bezier(.23,1,.32,1); z-index: 1; }

/*-----Custom for our customer page ------*/
.CustomerSite ul.template-list { width: 100%; list-style-type: none; float: none; margin: 0 auto; display: table; }

.CustomerSite li.template-item { text-align: center; width: 33%; margin: 1px; float: left; }

    .CustomerSite li.template-item .NewArrivalItem a { font-family: ThaiSansNeue; font-size: 40px; line-height: 40px; padding-top: 130px; }
/*.CustomerSite li.template-item:nth-child(8n+1) .NewArrivalItem .template-bg { background: rgba(209,0,0,0.9); }
    .CustomerSite li.template-item:nth-child(8n+2) .NewArrivalItem .template-bg { background: rgba(255,119,29,0.9); }
    .CustomerSite li.template-item:nth-child(8n+3) .NewArrivalItem .template-bg { background: rgba(12,84,175,0.9); }
    .CustomerSite li.template-item:nth-child(8n+4) .NewArrivalItem .template-bg { background: rgba(0, 177,86,0.9); }
    .CustomerSite li.template-item:nth-child(8n+5) .NewArrivalItem .template-bg { background: rgba(158,189,25,0.9); }
    .CustomerSite li.template-item:nth-child(8n+6) .NewArrivalItem .template-bg { background: rgba(230,206,0,0.9); }
    .CustomerSite li.template-item:nth-child(8n+7) .NewArrivalItem .template-bg { background: rgba(3,173,239,0.9); }
    .CustomerSite li.template-item:nth-child(8n+0) .NewArrivalItem .template-bg { background: rgba(119,39,165,0.9); }*/

.CustomerSite .paging-control { display: table; margin: 35px auto 0; clear: left; }
/* transition: .5s opacity cubic-bezier(.23,1,.32,1),.5s transform cubic-bezier(.23,1,.32,1); */


.TakraOnline.Training .ProductQuickInfoShortDescription.photo-training { position: relative; border-top: 0; padding: 0; }

.TakraOnline.Training .ProductQuickInfoName.photo-training { position: absolute; width: 100%; top: 70px; }

.photo-training.more-button { margin: 10px auto 40px; }

h1.firstline { padding-bottom: 0; text-align: center; margin-bottom: 10px; line-height: 25px; }

.features-content.content-detail h1.firstline { margin: 15px auto 0; line-height: 25px; }

ul.new { list-style-type: none; width: 92%; margin: 30px auto; float: none; display: table; }

    ul.new li { background: url("Images/Web2017/Icon/icon-takra.jpg") no-repeat scroll left center; padding-left: 40px; margin: 8px 0px 0px; text-align: left; line-height: 28px; font-size: 17px; font-family: CSPraJad; }

/* stylesheet for PageScroll2id */


#navigation-menu { position: fixed; right: 10px; top: 65px; left: auto; bottom: auto; z-index: 9; text-shadow: none; font-size: 0.85em; list-style: none outside none; }

    #navigation-menu ul { overflow: hidden; }

    #navigation-menu li { margin: 0; }

    #navigation-menu a { display: block; padding: 0 22px 0 10px; font-size: 0; background: url(Images/Web2017/Bullet/nav-inactive.png) no-repeat right center; min-height: 28px; line-height: 28px; width: 240px; border: 0; }

        #navigation-menu a.mPS2id-highlight { color: #fff; background: url(Images/Web2017/Bullet/nav-active.png) no-repeat right center; font-size: 0; border: 0; min-height: 28px; line-height: 28px; }

            #navigation-menu a:hover, #navigation-menu a.mPS2id-highlight:hover { background: url(Images/Web2017/Bullet/nav-inactive.png) no-repeat right center rgba(18,146,209,0.5); color: #fff; font-size: 23px; border-radius: 5px; border: solid 1px #21aef5; width: auto; min-height: 28px; line-height: 28px; }

            #navigation-menu a.mPS2id-highlight:hover { background: url(Images/Web2017/Bullet/nav-inactive.png) no-repeat right center rgba(18,146,209,0.5); }

#content section { min-height: 900px; text-shadow: -1px -1px 0 rgba(0,0,0,0.65); -webkit-box-shadow: 0 -1px 0 rgba(0,0,0,0.6),inset 0 1px 0 rgba(255,255,255,0.3); box-shadow: 0 -1px 0 rgba(0,0,0,0.6),inset 0 1px 0 rgba(255,255,255,0.3); background: #362f2d; background: rgb(107,95,89); background: -moz-radial-gradient(center, ellipse cover, rgba(107,95,89,1) 0%, rgba(54,47,45,1) 100%); background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,rgba(107,95,89,1)), color-stop(100%,rgba(54,47,45,1))); background: -webkit-radial-gradient(center, ellipse cover, rgba(107,95,89,1) 0%,rgba(54,47,45,1) 100%); background: -o-radial-gradient(center, ellipse cover, rgba(107,95,89,1) 0%,rgba(54,47,45,1) 100%); background: -ms-radial-gradient(center, ellipse cover, rgba(107,95,89,1) 0%,rgba(54,47,45,1) 100%); background: radial-gradient(ellipse at center, rgba(107,95,89,1) 0%,rgba(54,47,45,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#6b5f59', endColorstr='#362f2d',GradientType=1 ); color: #d9d6d5; }

    #content section:nth-child(3n+2) { text-shadow: 1px 1px 0 rgba(255,255,255,0.45); -webkit-box-shadow: 0 -1px 0 rgba(0,0,0,0.2),inset 0 1px 0 rgba(255,255,255,0.5); box-shadow: 0 -1px 0 rgba(0,0,0,0.2),inset 0 1px 0 rgba(255,255,255,0.5); background: #c6b6a4; background: rgb(239,231,220); background: -moz-radial-gradient(center, ellipse cover, rgba(239,231,220,1) 0%, rgba(198,182,164,1) 100%); background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,rgba(239,231,220,1)), color-stop(100%,rgba(198,182,164,1))); background: -webkit-radial-gradient(center, ellipse cover, rgba(239,231,220,1) 0%,rgba(198,182,164,1) 100%); background: -o-radial-gradient(center, ellipse cover, rgba(239,231,220,1) 0%,rgba(198,182,164,1) 100%); background: -ms-radial-gradient(center, ellipse cover, rgba(239,231,220,1) 0%,rgba(198,182,164,1) 100%); background: radial-gradient(ellipse at center, rgba(239,231,220,1) 0%,rgba(198,182,164,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#efe7dc', endColorstr='#c6b6a4',GradientType=1 ); color: #25201e; }

    #content section:nth-child(3n+3) { text-shadow: 1px 1px 0 rgba(255,255,255,0.45); -webkit-box-shadow: 0 -1px 0 rgba(0,0,0,0.2),inset 0 1px 0 rgba(255,255,255,0.5); box-shadow: 0 -1px 0 rgba(0,0,0,0.2),inset 0 1px 0 rgba(255,255,255,0.5); background: #94cbce; background: rgb(214,251,252); background: -moz-radial-gradient(center, ellipse cover, rgba(214,251,252,1) 0%, rgba(148,203,206,1) 100%); background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,rgba(214,251,252,1)), color-stop(100%,rgba(148,203,206,1))); background: -webkit-radial-gradient(center, ellipse cover, rgba(214,251,252,1) 0%,rgba(148,203,206,1) 100%); background: -o-radial-gradient(center, ellipse cover, rgba(214,251,252,1) 0%,rgba(148,203,206,1) 100%); background: -ms-radial-gradient(center, ellipse cover, rgba(214,251,252,1) 0%,rgba(148,203,206,1) 100%); background: radial-gradient(ellipse at center, rgba(214,251,252,1) 0%,rgba(148,203,206,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d6fbfc', endColorstr='#94cbce',GradientType=1 ); color: #25201e; }

.content { padding: 1em 3em; }

    .content hr + a, .content hr + a + a { margin-right: 2em; }

.mPS2id-target .content h2:first-child:after { display: inline-block; position: relative; vertical-align: middle; content: "Current target class: mPS2id-target"; margin-left: 1em; font-size: 0.25em; line-height: 1.4em; font-style: italic; opacity: 0.7; width: 180px; font-family: arial,sans-serif; font-weight: normal; }

.ie8 .mPS2id-target .content h2:first-child:after { font-size: 0.95em; }

header, .content, footer { padding-right: 150px; }

.horizontal-layout { width: 700%; }

    .horizontal-layout header h1 { display: none; }

    .horizontal-layout #navigation-menu { right: auto; left: 3em; top: 4em; }

    .horizontal-layout #content { overflow: hidden; }

        .horizontal-layout #content section { width: 14.285%; float: left; min-height: 480px; -webkit-box-shadow: 0 -1px 0 rgba(0,0,0,0.3),inset 0 1px 0 rgba(255,255,255,0.3),-1px 0 0 rgba(0,0,0,0.6); box-shadow: 0 -1px 0 rgba(0,0,0,0.3),inset 0 1px 0 rgba(255,255,255,0.3),-1px 0 0 rgba(0,0,0,0.6); }

            .horizontal-layout #content section:nth-child(3n+2), .horizontal-layout #content section:nth-child(3n+3) { -webkit-box-shadow: 0 -1px 0 rgba(0,0,0,0.3),inset 0 1px 0 rgba(255,255,255,0.3),-1px 0 0 rgba(0,0,0,0.2),inset 1px 0 0 rgba(255,255,255,0.5); box-shadow: 0 -1px 0 rgba(0,0,0,0.3),inset 0 1px 0 rgba(255,255,255,0.3),-1px 0 0 rgba(0,0,0,0.2),inset 1px 0 0 rgba(255,255,255,0.5); }

    .horizontal-layout .content h2 { position: relative; padding-bottom: 50px; }

        .horizontal-layout .content h2 + p { margin-top: -50px; }

    .horizontal-layout .mPS2id-target .content h2:first-child:after { display: block; position: absolute; width: 100%; height: 50px; margin-left: 0; }

    .horizontal-layout header > *, .horizontal-layout footer > * { width: 10%; }

    .horizontal-layout header, .horizontal-layout .content, .horizontal-layout footer { padding-left: 150px; padding-right: 3em; }

.auto-layout { width: 6200px; height: 6200px; }

    .auto-layout header h1 { margin-left: 150px; }

    .auto-layout #navigation-menu { right: auto; left: 2em; }

    .auto-layout #content { height: 100%; }

        .auto-layout #content section { position: absolute; min-height: 600px; width: 600px; top: 0; left: 0; margin-left: 3em; -webkit-box-shadow: inset 1px 1px 0 rgba(255,255,255,0.2); box-shadow: inset 1px 1px 0 rgba(255,255,255,0.2); -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }

            .auto-layout #content section#section-2 { top: 0; left: 1800px; }

            .auto-layout #content section#section-3 { top: 1200px; left: 900px; }

            .auto-layout #content section#section-4 { top: 1200px; left: 2700px; }

            .auto-layout #content section#section-5 { top: 2400px; left: 1800px; }

            .auto-layout #content section#section-6 { top: 2400px; left: 3600px; }

            .auto-layout #content section#section-7 { top: 3600px; left: 2700px; }

    .auto-layout .content { padding-left: 150px; padding-right: 3em; }

/* Sticky menu */
.hidecontent { display: none !important; }

.showcontent { display: block; }

.showmenu { display: block; position: fixed; z-index: 10000; left: 0; top: 0; width: 100%; background-color: #fff; min-height: 45px; padding: 5px 10px; box-shadow: 0 0 10px #888; }

    .showmenu .Logo { min-height: 35px; float: left; margin-right: 10px; margin-top: 2px; }

        .showmenu .Logo a { text-decoration: none; display: block; }

    .showmenu .button-open-store { float: right; margin: 5px 0 5px 10px; }

    .showmenu .trial-form-panel { float: right; width: 62%; min-height: 40px; padding: 5px; position: relative; border-right: solid 2px #b4b4b4; }

    .showmenu .trial-form { width: 100%; display: table; border-radius: 0; box-shadow: none; background: none; padding: 0; }

        .showmenu .trial-form .input { width: 24%; margin-right: 1%; float: left; min-height: 30px; position: relative; margin-bottom: 0; }

            .showmenu .trial-form .input.signup { margin-right: 0; }

            .showmenu .trial-form .input .button-signup { font-family: ThaiSansNeue; font-size: 25px; letter-spacing: 1px; color: #fff; height: 30px; line-height: 30px; text-align: center; background-color: #14b06a; width: 100%; border: 0; border-radius: 0; }

    .showmenu .TrainingRegisLink { font-family: ThaiSansNeueBold; font-size: 25px; letter-spacing: 1px; color: #fff; height: 30px; line-height: 30px; text-align: center; width: 100%; border: 0; font-style: normal; }

    .showmenu .trial-form .input .button-signup:hover { color: #fff; background-color: #20d986; text-decoration: underline; }

    .showmenu .trial-form input[type="text"] { border: solid 1px #ececec; border-radius: 5px; padding: 5px; color: #555; height: 30px; font-family: ThaiSansNeue; font-size: 25px; z-index: 1; background: none; }

        .showmenu .trial-form input[type="text"]:focus { color: #000; }

    .showmenu .Logo.Dotted { padding-right: 20px; background: url(Images/Web2017/Bullet/dotted.jpg) no-repeat right center; }

    .showmenu .mini-header-label { min-height: 35px; float: left; margin: 2px 0 0 5px; line-height: 35px; font-size: 18px; font-family: ThaiSansNeue; color: #4c4d4d; }

        .showmenu .mini-header-label .phone1 { font-size: 32px; color: #0badde; float: left; margin-right: 5px; font-family: ThaiSansNeueBold; }

        .showmenu .mini-header-label .phone2 { font-size: 45px; font-family: ThaiSansNeueBold; color: #010101; float: left; line-height: 28px; font-weight: bold; }

    .showmenu ul.mini-header-button { float: right; background: url(Images/Web2017/Bullet/dotted.jpg) no-repeat right center; min-height: 31px; margin: 2px 0 0; padding-right: 8px; list-style: none; }

        .showmenu ul.mini-header-button li { float: left; border-right: solid 2px #b4b4b4; padding: 0 7px; margin: 0; }

            .showmenu ul.mini-header-button li:last-child { border: 0; }

            .showmenu ul.mini-header-button li a { display: block; font-size: 0; border-radius: 4px; }

                .showmenu ul.mini-header-button li a.mini-header-1 { background: url(Images/Web2017/Button/mini-header-1.svg) no-repeat center 0; width: 155px; height: 31px; }

                .showmenu ul.mini-header-button li a.mini-header-2 { background: url(Images/Web2017/Button/mini-header-2.svg) no-repeat center 0; width: 132px; height: 31px; }

                .showmenu ul.mini-header-button li a.mini-header-3 { background: url(Images/Web2017/Button/mini-header-3.svg) no-repeat center 0; width: 132px; height: 31px; }

                    .showmenu ul.mini-header-button li a.mini-header-1:hover,
                    .showmenu ul.mini-header-button li a.mini-header-2:hover,
                    .showmenu ul.mini-header-button li a.mini-header-3:hover { background-position: center 100%; }


/* icon-menu-nav */
#icon-menu-nav { position: fixed; right: auto; top: 65px; left: 10px; bottom: auto; z-index: 9; text-shadow: none; }

    #icon-menu-nav ul { overflow: hidden; list-style: none; }

    #icon-menu-nav li { margin: 0; }

    #icon-menu-nav a { display: block; padding: 0; font-size: 0; width: 75px; border: 0; font-size: 0; }

        #icon-menu-nav a.btn1 { background: url(Images/Web2017/Button/button1.png) no-repeat center center; height: 85px; line-height: 85px; z-index: 1; position: relative; }

        #icon-menu-nav a.btn2 { background: url(Images/Web2017/Button/button2.png) no-repeat center center; height: 94px; line-height: 94px; position: relative; bottom: 9px; z-index: 0; }

        #icon-menu-nav a.btn1:hover { background: url(Images/Web2017/Button/button1hover.png) no-repeat center center; }

        #icon-menu-nav a.btn2:hover { background: url(Images/Web2017/Button/button2hover.png) no-repeat center center; }

.intro-takra { margin-top: 6px; background: #00b4e9 url(Images/Banner/intro-takraonline.jpg) no-repeat center bottom; width: 100%; min-height: 190px; font-family: ThaiSansNeue; font-size: 30px; line-height: 38px; }

    .intro-takra .meet-button { background: #ffdc1d url(Images/Web2017/Bullet/blue-arrow.png) no-repeat center right; height: 58px; border-radius: 5px; padding: 10px 45px; margin: 40px 0 5px; float: left; clear: left; font-weight: bold; transition: background 0.5s ease-in-out; }

        .intro-takra .meet-button:hover { background: #fff url(Images/Web2017/Bullet/blue-arrow.png) no-repeat center right; transition: background 0.5s ease-in-out; }

    .intro-takra .label { background: none; float: left; clear: left; margin: 10px; }

/*web shopping page*/
.WebShoppingBanner { width: 100%; height: 300px; margin: 0; background: #21aef5 url(Images/Banner/banner-web-shopping.jpg) no-repeat center center; position: relative; }

.WebShopping .NotToDo { background: url(Images/Web2017/Background/webshoping-sec2.webp) no-repeat top center; padding-top: 140px; }

.WebShopping .sec2 { padding: 45px 0 15px; }

    .WebShopping .sec2 .titleLargeBlue { width: 100%; background: url("Images/Web2017/Background/border-small-dash.jpg") no-repeat scroll center bottom; margin-bottom: 30px; padding-bottom: 40px; }

.WebShopping .NotToDoList { margin-top: 25px; margin-bottom: 10px; }

    .WebShopping .NotToDoList p { display: none; padding: 10px 20px; text-align: left; }

.WebShopping .NotToDoImage { border: solid 1px #e0e1e1; padding: 1px 1px 25px; background: url("Images/Web2017/Icon/toggle-show.jpg") no-repeat scroll 95% 95%; }

    .WebShopping .NotToDoImage h3 { padding: 0 20px 10px; min-height: 85px; }

    .WebShopping .NotToDoImage.active { background: url("Images/Web2017/Icon/toggle-hide.jpg") no-repeat scroll 95% 95%; }



.WebShopping .ToDo { padding: 20px 0 160px; background: url(Images/Web2017/Background/webshoping-sec3.webp) no-repeat bottom center; }

.WebShopping .ToDoList { margin: 30px 0; }

    .WebShopping .ToDoList h2 { color: #0b81bc; }

/*business start up page*/
.BusinessStartupBanner { width: 100%; height: 300px; margin: 0; background: #21aef5 url(Images/Banner/banner-business-startup.jpg) no-repeat center center; position: relative; }

.BusinessStartUp .Problem { background: url(Images/Web2017/Background/startup-sec2.webp) no-repeat top center; padding-top: 220px; }

.BusinessStartUp .Good { background: url(Images/Web2017/Background/startup-sec3.webp) no-repeat top center; padding-top: 220px; }

.BusinessStartUp .sec2 { padding: 45px 0 15px; }

    .BusinessStartUp .sec2 .titleLargeBlue { width: 100%; background: url("Images/Web2017/Background/border-small-dash.jpg") no-repeat scroll center bottom; margin-bottom: 30px; padding-bottom: 40px; }


.BusinessStartUp .sec4 { padding: 50px 0; }

.BusinessStartUp .sec5 .row { padding-bottom: 25px; }

    .BusinessStartUp .sec5 .row h2 { color: #21aef5; }

div.BusinessStartUpList, div.BusinessStartUpList2 { list-style: none; padding: 0; margin: 0 auto; width: 100%; vertical-align: top; }

div.BusinessStartUpList2 { width: 67%; clear: left; }

div.BusinessStartUpList div.item { width: 31%; margin: 30px 1%; padding: 0 10px; display: inline-block; float: left; }

div.item h2 { color: #21aef5; }

div.item p { text-align: left; color: #7e7d7d; margin: 0; }

div.BusinessStartUpList div.item.item-four { margin-left: 15%; }

.BusinessStartUp .ReadmoreDiv { text-align: left; margin: 15px 0 0; cursor: pointer; }

.BusinessStartUp .ReadMore { line-height: 25px; padding: 8px 25px 8px 0; background: url("Images/Web2017/Icon/startup-toggle-show.png") no-repeat right center; color: #000; font-size: 23px; }

    .BusinessStartUp .ReadMore.active { background: url("Images/Web2017/Icon/startup-toggle-hide.png") no-repeat right center; }

ul.new.rightside { width: 100%; }

    ul.new.rightside li { background-position: left 4px; margin: 0 0 10px; }

.ContactUs .OptionRadioItemDiv { margin: 0; }

.ContactUs .OptionRadioItemRadioButtonList label { width: auto; }

.ContactUs .OptionRadioItemDiv .OptionRadioItemRadioButtonList tr { clear: left; width: 100%; }

.BgType3.Contact { padding: 1px 15px; border-radius: 10px; }


.OnlineShop .ContactUsFormLabel { padding-right: 22px; width: 42%; }

.OnlineShop .ContactUsForm { width: 55%; }

    .OnlineShop .ContactUsForm.ContactUsButtonDiv { margin: 15px 0 0 10px; padding: 0; width: 45%; clear: none; float: left; }

.OnlineShop .ContactUsButtonDiv a.BtnStyle1 { color: #fff; }

.SpecialBox1 { float: left; padding: 0 15px; width: 50%; }

.SpecialBox2 { float: right; padding: 0 15px; width: 50%; }

.SpecialBox3 { float: left; padding: 0 15px; width: 50%; }

.arrow_box { background-color: red; color: yellow; margin-top: 40px; border-radius: 200px; height: 250px; width: 250px; text-align: center; font-size: 24px; padding-top: 80px; }

/* New Form Css*/
.bg-new-form { background: #fff url(Images/Form/bg-form-main.jpg) no-repeat center top; }

    .bg-new-form.fb-course { background: #fff url(Images/Form/bg-form-main-facebook.jpg) no-repeat center top; }

    .bg-new-form.PromotionA { background: #fff url(Images/Form/bg-form-newyear.jpg) no-repeat center top; }

    .bg-new-form.Valentine { background: none; }

    .bg-new-form .PromotionValentine { background: #fff url(Images/Web2017/Background/bg-valentine-promotion.jpg) no-repeat center bottom; padding-bottom: 50px; }

    .bg-new-form.PromotionChinese { background: #fff url(Images/Form/bg-form-chinese-newyear.jpg) no-repeat center top; }

.bg-form-main-adword { background: #F9F5F2 url(Images/Form/bg-form-main-adword.jpg) no-repeat center top; }

.bg-form-main-facebook { background: #f9f6f3 url(Images/Form/bg-form-main-facebook.jpg) no-repeat center top; }

.bg-new-form.marketing-page-2 { background: #fff url(Images/Web2017/Background/bg-form-main-2.jpg) no-repeat center top; }

.bg-new-form.PromotionMarch2015 { background: #FCE14C url(Images/Form/bg-form-march-2015.jpg) no-repeat center top; }

.bg-new-form.PromotionApril { background: #003456; }

.PromotionApril2015 { background: #003456 url(Images/Form/bg-form-april-2015.jpg) no-repeat center bottom; }

.new-form .CommonErrorMessageDiv { font-family: Tahoma; }

.new-form .mgt20 { margin-top: 20px; }

.new-form .mgt25 { margin-top: 25px; }

.new-form .mgt40 { margin-top: 40px; }

.new-form .mgt60 { margin-top: 60px; }

.new-form .mgt100 { margin-top: 100px; }

.new-form .mgt80 { margin-top: 100px; }

.new-form .mg20 { margin: 20px 0; }

.new-form .mg30 { margin: 30px 0; }

.new-form .mg45 { margin: 45px 0; }

.new-form .mg15 { margin: 15px 0; }

.new-form .mgb15 { margin: 0 0 15px 0; }

.new-form .mgb30 { margin: 0 0 30px 0; }

.new-form .mgb60 { margin: 0 0 60px 0; }

.new-form .pdb20 { padding-bottom: 20px; }

.new-form .pdl50 { padding-left: 50px; }

.new-form .pdb40 { padding-bottom: 40px; }

.new-form .pd50 { padding-left: 50px; padding-right: 50px; }

.new-form .mgl20 { margin-left: 20px; }

.new-form .SocialButton { margin: 30px 0; }

    .new-form .SocialButton.mg15 { margin: 15px 0; }

    .new-form .SocialButton a { float: right; width: 50px; height: 50px; font-weight: normal; vertical-align: middle; line-height: 50px; color: #fff; text-decoration: none; margin-left: 10px; font-size: 0; }

.new-form .SocialLink a:hover { color: #000; }

.new-form .FaceBookIcon { background: url(Images/Form/form-fb-icon.png)no-repeat left center; }

.new-form .GoogleIcon { background: url(Images/Form/form-gp-icon.png)no-repeat left center; }

.new-form .PhoneIcon { background: url(Images/Form/form-phone-icon.png)no-repeat left center; }

.takralink { background-color: #01b1e7; border: 1px solid #82d2eb; border-radius: 15px; color: #fff; font-family: ThaiSansNeue; font-size: 30px; line-height: 44px; padding: 5px 20px; }

    .takralink.green { background-color: #12ca76; border: solid 1px #82e9c6; }

.fontfam, .font-dbadman { font-family: ThaiSansNeue; }

.font-pslxdisplay { font-family: ThaiSansNeueBold; }

.font-pinjohn { font-family: ThaiSansNeueBold; }

.font-thai { font-family: ThaiSansNeue; }

.font-thaibold { font-family: ThaiSansNeueBold; }

.font-csprajad { font-family: CSPraJad; }

.font-yellow { color: #fddc22; }

.font-yellow-1 { color: #f4e931; }

.font-yellow-2 { color: #fff200; }

.font-yellow-3 { color: #ffeb3b; }

.font-blue { color: #13aefb; }

.font-blue1 { color: #4096ef; }

.font-blue2 { color: #36c9f5; }

.font-blue3 { color: #156aeb; }

.font-blue4 { color: #007ef9; }

.font-blue5 { color: #1fafeb; }

.font-blue6 { color: #0487ca; }

.font-blue7 { color: #357FD3; }

.font-black { color: #18171a; }

.font-gray { color: #828688; }

.font-medium-gray { color: #6c6c6c; }

.font-red-2 { color: #df0024; }

.font-red-3 { color: #ff4f4f; }

.font-red-4 { color: #e71b06; }

.font-green { color: #12ca76; }

.font-green-2 { color: #009452; }

.font-green3 { color: #14b067; }

.font-green4 { color: #00c402; }

.font-green5 { color: #23b972; }

.font-green6 { color: #0e9b12; }

.font-navy { color: #284386; }

.font-navy-1 { color: #357FD3; }

.font-white { color: #fff; }

.font-white1 { color: #fbe9e7; }

.font-red { color: #d84734; }

.font-orange { color: #fd8c07; }

.font-orange1 { color: #ff7043; }

.font-pink { color: #ff0cac; }

.font-pink1 { color: #f6417c; }

.font-pink2 { color: #f36daa; }

.font-shadow { text-shadow: 2px 2px 1px #666; }

.font-shadow1 { text-shadow: 2px 2px 1px #000; }

.font-shadow2 { text-shadow: 2px 2px 3px #000; }

.font-shadow3 { text-shadow: 0px 0px 2px #fff; }

.font-shadow4 { text-shadow: 0 1px 0 #000; }

.font82 { font-size: 82px; font-weight: bold; }

.font76 { font-size: 76px; font-weight: bold; }

.font70 { font-size: 70px; font-weight: bold; }

.font60 { font-size: 60px; font-weight: bold; }

.font56 { font-size: 56px; font-weight: bold; }

.font52 { font-size: 52px; font-weight: bold; }

.font48 { font-size: 48px; font-weight: bold; }

.font46 { font-size: 46px; font-weight: bold; }

.font42 { font-size: 42px; font-weight: bold; }

.font40 { font-size: 40px; }

.font38 { font-size: 38px; }

.font36 { font-size: 36px; font-family: ThaiSansNeueBold; line-height: 40px; }

.font34 { font-size: 34px; }

.font32 { font-size: 32px; font-weight: bold; }

.font30 { font-size: 30px; }

.font26 { font-size: 26px; }

.font24 { font-size: 24px; line-height: 30px; }

.font21 { font-size: 23px; line-height: 30px; }

.font20 { font-size: 20px; font-weight: bold; line-height: 30px; }

.font19 { font-size: 20px; }

.font18 { font-size: 18px; }

.font-italic { font-style: italic; }

.font-line { text-decoration: underline; }

.codeboxdiv { position: absolute; margin-top: 13px; width: 220px; right: 20px; z-index: 1; }

.CodeBox { float: right; font-size: 20px; font-weight: bold; background-color: #ffdd20; border: solid 2px #fff; box-shadow: #696665 2px 1px; height: 25px; line-height: 25px; padding: 0 12px; border-radius: 10px; color: #0b0a0f; cursor: pointer; margin-left: 7px; }

    .CodeBox:hover { background-color: #01b1e7; color: #fff; }

.CodeBoxPopup { background: rgba(255,221,36,0.9); border-radius: 10px; border: solid 2px #fff; padding: 20px 20px 15px; }

    .CodeBoxPopup:after { border-color: #ffdd20 transparent; border-style: solid; border-width: 0 8px 15px; content: ""; display: block; right: 17px; position: absolute; top: -13px; width: 0; z-index: 1; }

    .CodeBoxPopup .close { background-color: #fff; border-radius: 10px; color: #8e8584; height: 15px; position: absolute; line-height: 15px; font-weight: bold; right: 10px; text-align: center; text-decoration: none; top: 10px; width: 15px; font-size: 20px; cursor: pointer; }

        .CodeBoxPopup .close:hover { color: red; }

.form-1 { background: rgba(40,36,36,0.4); display: table; padding: 20px 30px; }

.form-1-title { color: #fff; text-align: center; margin-bottom: 10px; }

.form-1.blue-gradient { background: rgba(0, 129, 248, 0.71); margin: 40px auto; }

.NewFormFilled { color: #fff; font-size: 15px; font-family: Tahoma; }

    .NewFormFilled.w50 { width: 50%; float: left; }

input[type="text"].NewFormTextBox { width: 98%; height: 40px; padding: 5px; color: #fff; font-size: 15px; border: solid 2px #fff; background-color: transparent; font-family: Tahoma; border-radius: 8px; margin: 8px 0; }

    input[type="text"].NewFormTextBox:focus { border: solid 2px #FFEA00; background-color: transparent; }

.NewFormFilledLabel { float: left; margin-right: 20px; line-height: 40px; }

.NewFormFilledNote { float: left; margin-left: 20px; line-height: 25px; margin-top: 10px; }

    .NewFormFilledNote.Training { float: none; width: 100%; text-align: center; font-family: ThaiSansNeue; font-size: 20px; margin-left: 0; margin-top: 20px; }

.NewFormFilledOption { float: left; line-height: 40px; width: 85%; margin-top: 5px; }

    .NewFormFilledOption .OptionRadioItemDiv { margin-left: 0; }

    .NewFormFilledOption .OptionRadioItemRadioButtonList { width: 100%; }

        .NewFormFilledOption .OptionRadioItemRadioButtonList tr { width: 25%; margin-right: 0; display: inline-block; }

        .NewFormFilledOption .OptionRadioItemRadioButtonList td { width: 100%; display: block; }

        .NewFormFilledOption .OptionRadioItemRadioButtonList label { width: auto; color: #fff; font-size: 13px; margin-left: 0; width: 75%; }

    .NewFormFilledOption input[type='radio'] { }

    .NewFormFilledOption.two-col .OptionRadioItemRadioButtonList tr { width: 48%; margin-right: 0; }

.NewFormFilledButton { clear: left; padding-top: 15px; float: left; }

.NewButton { background-color: #01b1e7; font-size: 30px; font-family: ThaiSansNeue; color: #fff; padding: 5px 30px; line-height: 44px; border-radius: 15px; border: solid 1px #82d2eb; transition: all 0.5s ease-out, color 0.5s ease-out, border 0.5s ease-out; }

.Ad-NewButton { background-color: #12ca76; border: solid 1px #82e9c6; }

.NewButton.BtnPromotion { background-color: #12ca76; border: solid 1px #6588f8; }

.NewButton.Btn2016Promotion { background-color: #357FD3; border: solid 1px #82e9c6; }

.NewFormFilledButton.Training .Ad-NewButton { display: block; width: 250px; margin: auto; text-align: center; line-height: 38px; }

.NewButton:hover, .takralink:hover { background-color: #ffdd20; color: #000; border: solid 1px #d0b000; transition: background 0.5s ease-out, color 0.5s ease-out, border 0.5s ease-out; }

.bg-pink { background-color: #fa286d; padding: 30px 0; color: #fff; border-top: solid 2px #ed175e; border-bottom: solid 2px #ed175e; }

.bg-blue { background-color: #01b1e7; padding: 30px 0; color: #fff; border-bottom: solid 2px #fff; }

.bg-blue1 { background-color: #46C5F4; padding: 40px 0 25px; color: #fff; }

.bg-red { background-color: #ba2626; padding: 30px 0; color: #fff; border-bottom: solid 2px #fff; }

.bg-green { background-color: #12ca76; padding: 30px 0; color: #fff; border-bottom: solid 2px #fff; }

.bg-navy { background-color: #284386; padding: 30px 0; color: #fff; border-bottom: solid 2px #fff; }

.bg-navy2 { background-color: #314085; padding: 40px 0; color: #fff; border-bottom: solid 2px #fff; }

.bg-navy3 { background-color: #034280; padding: 40px 0; color: #fff; border-bottom: solid 2px #fff; }

.bg-light-blue { background-color: #e9f4f9; padding: 15px 0; color: #343637; border-bottom: solid 2px #fff; }

.bg-white { padding: 30px 0; background-color: #fff; }

    .bg-white.footerline { border-top: solid 2px #b5b3b3; color: #6c6c6c; font-size: 23px; padding: 25px 0 10px; line-height: 20px; }

.bg-gray { background-color: #e6e4e4; padding: 50px 0 30px; color: #524f4f; border-bottom: solid 2px #fff; }

.box-gray { color: #383838; background-color: #fff; border-radius: 20px; padding: 0px 20px; }

.box-dark-gray { color: #fff; background-color: #848383; border-radius: 20px; padding: 0px 20px; border: solid 2px #2b9ed8; }

    .box-dark-gray.br-green { border: solid 2px #12ca76; }

.modal-box-gray { background-color: #fff; border-radius: 20px; padding: 20px; border: solid 2px #bbb; }

.short-bar { width: 100px; height: 5px; background-color: #625858; margin: 40px 0; }

.short-bar-yellow { width: 80%; height: 4px; background-color: #ffe00e; margin: 20px auto 35px; box-shadow: 2px 2px 5px #000; }

.short-bar-yellow1 { width: 200px; height: 4px; background-color: #fff200; margin: 30px auto; }

.short-bar-yellow2 { width: 70%; height: 3px; background-color: #ffe00e; margin: 15px auto; box-shadow: 2px 2px 2px #000; }

.short-bar-light { width: 100px; height: 3px; background-color: #7c7c7c; margin: 40px 0; }

.short-bar-white { width: 100px; height: 5px; background-color: #fff; margin: 40px auto; }

.short-bar-white1 { width: 100px; height: 2px; background-color: #fff; margin: 20px auto; }

.short-bar-white2 { width: 100px; height: 3px; background-color: #fff; margin: 40px 0; }

.medium-bar-white { width: 200px; height: 2px; background-color: #fff; margin: 40px auto; }

.medium-bar-dark1 { width: 200px; height: 2px; background-color: #303030; margin: 25px auto; }

.medium-bar-gray { width: 200px; height: 2px; background-color: #bbb; margin: 40px auto; }

.short-bar-navy { width: 100px; height: 3px; background-color: #284386; margin: 30px auto; }

.short-bar-dark { width: 100px; height: 1px; background-color: #424242; margin: 40px auto; }

.short-bar-dark1 { width: 200px; height: 2px; background-color: #777; margin: 40px auto; }

.short-bar-dark2 { width: 100px; height: 3px; background-color: #4e4242; margin: 40px 0; }

.short-bar-dark3 { width: 100px; height: 1px; background-color: #030303; margin: 25px auto; }

.short-bar-gray { width: 100px; height: 1px; background-color: #cecdcd; margin: 30px auto; }

.short-bar-green { width: 250px; height: 3px; background-color: #019074; margin: 30px auto; }

.detail-box { width: 90%; line-height: 40px; }

.new-form ul.sportlight-list { margin-bottom: 0; }

    .new-form ul.sportlight-list li { width: 31%; display: inline-block; text-align: center; line-height: 30px; margin: 0 0 10px; height: 220px; vertical-align: top; }

        .new-form ul.sportlight-list li a { width: 100%; height: 140px; display: table; background-position: center center; background-repeat: no-repeat; margin: 0 auto; }

            .new-form ul.sportlight-list li a.hilight-text { padding: 0; line-height: 24px; width: 100%; text-align: center; height: 70px; color: #555; }

            .new-form ul.sportlight-list li a.hilight-1 { background-image: url(Images/Form/form-hilight-1.jpg); }

            .new-form ul.sportlight-list li a.hilight-2 { background-image: url(Images/Form/form-hilight-2.jpg); }

            .new-form ul.sportlight-list li a.hilight-3 { background-image: url(Images/Form/form-hilight-3.jpg); }

            .new-form ul.sportlight-list li a.hilight-4 { background-image: url(Images/Form/form-hilight-4.jpg); }

            .new-form ul.sportlight-list li a.hilight-6 { background-image: url(Images/Form/form-hilight-5.jpg); }

            .new-form ul.sportlight-list li a.hilight-7 { background-image: url(Images/Form/form-hilight-6.jpg); }

ul.new-form-list { list-style: inside url(Images/Form/gray-circle.gif); margin: 30px 0; }

ul.ad-new-form-list { list-style: inside url(Images/Form/green-circle.gif); margin: 30px 0; }

    ul.new-form-list li,
    ul.ad-new-form-list li { font-size: 30px; line-height: 30px; margin-bottom: 8px; }

.contact-icon { background: url(Images/Form/form-support-icon.jpg) no-repeat left top; padding-left: 92px; margin-top: 30px; line-height: 35px; }

.contact-icon-green { background: url(Images/Form/ad-form-support-icon.jpg) no-repeat left top; }

.footer-lic { line-height: 35px; margin: 10px 0 5px; }

.SocialButtonFooter { margin: 10px 0; }

    .SocialButtonFooter a { float: right; width: 37px; height: 37px; font-weight: normal; vertical-align: middle; line-height: 37px; color: #fff; text-decoration: none; margin-left: 10px; font-size: 0; }

        .SocialButtonFooter a:hover { color: #000; }

    .SocialButtonFooter .FaceBookIcon { background: url(Images/Form/form-fb-icon2.jpg)no-repeat left center; }

    .SocialButtonFooter .GoogleIcon { background: url(Images/Form/form-gp-icon2.jpg)no-repeat left center; }

.social-div { width: 55%; }

.contact-div { width: 45%; }

.bg-gray .six.column { float: left; }

.bg-gray .six.columns { float: right; }

.font-cross-price { font-size: 30px; color: #8c8383; text-decoration: line-through; margin-top: 20px; }

.mobileBack { background: url(Images/Form/ad-mobile-form-page.png) no-repeat left bottom; background-size: 40% auto; }


.WaitingPanel { background: rgba(255,255,255,0.8); }

.fbads-item-img { width: 30%; float: left; }

.fbads-item-label { margin-top: 5px; width: 70%; float: left; font-size: 23px; font-style: italic; color: #1c1c1c; line-height: 30px; }

.fbads-benefit-img { width: 100%; text-align: center; min-height: 125px; height: 125px; background-position: center center; background-repeat: no-repeat; }

    .fbads-benefit-img.benefit1 { background-image: url(Images/Form/FBAds-Benefit-1.jpg); }

    .fbads-benefit-img.benefit2 { background-image: url(Images/Form/FBAds-Benefit-2.jpg); }

    .fbads-benefit-img.benefit3 { background-image: url(Images/Form/FBAds-Benefit-3.jpg); }

    .fbads-benefit-img.benefit4 { background-image: url(Images/Form/FBAds-Benefit-4.jpg); }

.fbads-benefit-label { width: 100%; font-size: 23px; line-height: 30px; color: #fff; text-align: center; }

.fbads-regisButton { line-height: 36px; padding: 10px 25px; display: table; margin: 30px auto; color: #232121; border: solid 4px #d8d8d8; font-size: 36px; transition: all 0.5s ease-out, color 0.5s ease-out, border 0.5s ease-out; }

    .fbads-regisButton.Yellow { color: #f4e931; border: solid 4px #f4e931; }

    .fbads-regisButton.smallFont { font-size: 24px; line-height: 30px; margin: 10px 0; }

    .fbads-regisButton.smallFont1 { font-size: 24px; line-height: 30px; width: 100%; text-align: center; }

        .fbads-regisButton.smallFont1.font-blue { color: #357FD3; }

    .fbads-regisButton:hover, .fbads-regisButton.Yellow:hover { border: solid 4px #284386; color: #284386; transition: all 0.5s ease-out, color 0.5s ease-out, border 0.5s ease-out; }

.fbads-moreButton { line-height: 36px; padding: 10px 25px 40px; display: table; margin: 30px auto; color: #232121; border: solid 4px #ffc81f; font-size: 36px; background: url(Images/Web2017/Bullet/more-toggle-hide.png) no-repeat center 55px; cursor: pointer; }

    .fbads-moreButton:hover { border: solid 4px #284386; color: #284386; }

    .fbads-moreButton.active { background: url(Images/Web2017/Bullet/more-toggle.png) no-repeat center 55px; }


.fbads-close { position: absolute; bottom: 5px; right: 0; font-size: 36px; color: #aaa; cursor: pointer; }

.fbads-toggle { width: 30px; height: 30px; display: table; margin: 15px auto; background: url(Images/Web2017/Bullet/more-toggle.png) no-repeat center center; cursor: pointer; }

.fbads-list-order ul { list-style-type: decimal; list-style-position: inside; }

.fbads-list ul { list-style: none; padding: 0; margin: 0; }

    .fbads-list ul li { padding-left: 30px; background: url(Images/Web2017/Bullet/circle-bullet.jpg) no-repeat 0 11px; font-size: 18px; }

    .fbads-list ul ul li { background: url(Images/Web2017/Bullet/hyphen-bullet.jpg) no-repeat 0 13px; }

#uxFBAdsToggle1 .bg-white { line-height: 36px; }

#uxMoreSec3Link { display: none; }

.lineNavy { border-bottom: solid 1px #a9b4cf; }

.line-lightgray { border-top: solid 5px #f5f5f5; }

.facebook-icon { background: url(Images/Form/fbads-fb-icon.jpg) no-repeat left center; line-height: 30px; padding-left: 40px; margin-top: 10px; font-size: 20px; }

.mail-icon { background: url(Images/Form/fbads-mail-icon.jpg) no-repeat left center; line-height: 30px; padding-left: 40px; font-size: 20px; }

.show-toggle { background: url(Images/Form/hide-toggle.png) no-repeat center center; bottom: -30px; font-size: 0; height: 60px; line-height: 60px; position: absolute; right: 43%; width: 150px; cursor: pointer; }

    .show-toggle.active { background: url(Images/Form/show-toggle.png) no-repeat center center; }

/* starting css for redesigning site */
/*-----------Top Menu-------------*/
ul.menu-item { float: left; margin: 7px 0; padding: 0; list-style-type: none; }

    ul.menu-item li { float: left; background: url(Images/new-header/icon-pipe.png) no-repeat right center; padding-right: 15px; margin-right: 15px; }

        ul.menu-item li:last-child { background: none; margin-right: 0; padding-right: 0; }

        ul.menu-item li a { color: #535353; display: block; font-size: 24px; line-height: 26px; margin-bottom: 4px; }

            ul.menu-item li a:hover { color: #000; text-decoration: underline; }

ul.link-social { float: left; margin: 0; padding: 0; list-style-type: none; }

    ul.link-social li { padding: 0 15px; float: right; height: 45px; line-height: 45px; border-right: solid 1px #c5c7c7; }

        ul.link-social li:last-child { border-left: solid 1px #c5c7c7; }

.link-social li a { float: right; width: 34px; height: 34px; font-weight: normal; vertical-align: middle; color: #fff; text-decoration: none; margin-top: 5px; font-size: 0; }

.link-social .FaceBookIcon { background: url(Images/new-header/icon-facebook.svg)no-repeat center center; }

.link-social .GoogleIcon { background: url(Images/new-header/icon-google.svg)no-repeat center center; }

.link-social .EmailIcon { background: url(Images/new-header/icon-mail.svg)no-repeat center center; }

.link-social .FaceBookIcon:hover { background: url(Images/new-header/icon-facebook-hover.svg)no-repeat center center; }

.link-social .GoogleIcon:hover { background: url(Images/new-header/icon-google-hover.svg)no-repeat center center; }

.link-social .EmailIcon:hover { background: url(Images/new-header/icon-mail-hover.svg)no-repeat center center; }

.contact-phone { float: right; margin: 0; line-height: 45px; }

.intro-label-phone { float: left; padding-left: 35px; background: url(Images/new-header/icon-mobile.png)no-repeat left center; color: #0badde; font-size: 32px; margin: 0 20px 0 30px; }

.label-phone { float: left; padding-left: 25px; background: url(Images/new-header/icon-dotted-pipe.svg)no-repeat left center; }

.PhoneContact { color: #2b2d2d; font-size: 45px; font-weight: bold; line-height: 40px; font-family: ThaiSansNeueBold; }

.header-container1 .eight.columns { width: auto; }

/*-----------Banner-------------*/
.new-banner { position: absolute; top: 13%; right: 15%; font-family: ThaiSansNeue; width: 475px; }

    .new-banner.longpanel { width: 520px; right: 12%; }

.Intro1 { font-size: 48px; font-weight: bold; line-height: 50px; color: #fff000; text-shadow: 1px 1px 0 #111; text-align: right; width: 100%; clear: left; float: left; }

.Intro2 { font-size: 30px; font-weight: bold; line-height: 35px; color: #fff; text-shadow: 1px 2px 0 #111; text-align: right; width: 110%; clear: left; float: right; margin-top: 20px; font-style: italic; }

    .Intro2.Font24 { font-size: 24px; line-height: 25px; margin-top: 10px; }

.Intro1NewYear { font-size: 48px; font-weight: bold; line-height: 50px; color: #ffff00; text-align: right; width: 100%; clear: left; float: left; text-shadow: none; }

.Intro2NewYear { font-size: 36px; font-weight: bold; line-height: 35px; color: #fff; text-align: right; width: 110%; clear: left; float: right; margin-top: 20px; font-style: italic; text-shadow: none; }

.default-pricing-button { height: 60px; line-height: 55px; text-align: center; background: transparent; background: linear-gradient(to right, #ffdc1d 50%, rgba(0,0,0,0.3) 50%); background-size: 200% 100%; background-position: right bottom; transition: all 0.5s ease; border: solid 2px #fff; clear: left; float: right; margin-top: 40px; }

    .default-pricing-button:hover { background-position: left bottom; border: solid 2px #ffdc1d; color: #000; }

    .default-pricing-button a { color: #fff; font-size: 30px; font-family: ThaiSansNeue; display: block; padding: 0 25px; }

        .default-pricing-button a:hover { color: #000; }

.newyear-pricing-button { height: 60px; line-height: 55px; text-align: center; background: transparent; background: linear-gradient(to right, #ffdc1d 50%, rgba(0,0,0,0) 50%); background-size: 200% 100%; background-position: right bottom; transition: all 0.5s ease; border: solid 2px #fff; clear: left; float: right; margin-top: 40px; }

    .newyear-pricing-button:hover { background-position: left bottom; border: solid 2px #ffdc1d; _color: #000; }

    .newyear-pricing-button a { color: #fff; font-size: 30px; font-family: ThaiSansNeue; display: block; padding: 0 25px; }

        .newyear-pricing-button a:hover { color: #00b4e9; }

.Intro2015NewYear { color: #fee88d; text-shadow: 1px 1px 1px #000; }

.Btn2015NewYear { background: transparent; background: linear-gradient(to right, #ffff00 50%, rgba(255,255,255,0) 50%); background-size: 200% 100%; background-position: right bottom; transition: all 0.5s ease; border: solid 2px #fff; clear: left; float: right; margin-top: 35px; }

    .Btn2015NewYear:hover { background-position: left bottom; border: solid 2px #ffff00; color: #050505; }

    .Btn2015NewYear a { color: #fff; }

        .Btn2015NewYear a:hover { color: #050505; }

.Intro2015Valentine { color: #fc1c7b; text-shadow: none; font-size: 46px; }

.Btn2015FreeCourese { clear: left; float: none; margin: 20px auto; display: table; }

/*-----------Body-------------*/
.CommonButtonFade { height: 60px; line-height: 55px; text-align: center; width: 250px; margin: auto; }

    .CommonButtonFade a { font-size: 26px; font-family: ThaiSansNeue; display: block; }
/*responsive design*/
.bg-gray-gradient { background: linear-gradient(#fff, #dcd9d3); padding: 60px 0; color: #524f4f; border-top: solid 2px #ddd; border-bottom: solid 2px #fff; }

.bg-yellow-gradient { background: linear-gradient(#FFF388 0px, #FFF388 80%, rgb(255, 255, 255) 80%, rgb(255, 255, 255) 100%); }

.responsive-button { background: transparent; background: linear-gradient(to right, #ffdc1d 50%, rgba(220,217,217,0.3) 50%); background-size: 200% 100%; background-position: right bottom; transition: all 0.5s ease; border: solid 3px #fff; }

    .responsive-button:hover { background-position: left bottom; border: solid 3px #ffdc1d; color: #101010; }

    .responsive-button a { color: #101010; }

        .responsive-button a:hover { color: #101010; }
/*service*/
.bg-light-gradient { background: linear-gradient(to top, #d1d1d1 0,#faf9f9 30px,#faf9f9 100%); padding: 60px 0 40px; color: #27282b; border-bottom: solid 2px #fff; }

.service-itm-box { width: 25%; float: left; font-family: ThaiSansNeue; text-align: center; background: url(Images/new-header/bar-pass-to.jpg)no-repeat right center; padding: 0 45px 20px 15px; }

    .service-itm-box.last { background: none; }

.title-img { margin: 0 auto; text-align: center; }

    .title-img .imgZoom { display: block; margin: 0 auto; opacity: 1; transform: scale(0.95,0.95); transition-timing-function: ease-out; transition-duration: 150ms; -webkit-transform: scale(0.95,0.95); -webkit-transition-timing-function: ease-out; -webkit-transition-duration: 150ms; -moz-transform: scale(0.95,0.95); -moz-transition-timing-function: ease-out; -moz-transition-duration: 150ms; }

        .title-img .imgZoom:hover { transform: scale(1.0,1.0); transition-timing-function: ease-out; transition-duration: 150ms; -webkit-transform: scale(1.0,1.0); -webkit-transition-timing-function: ease-out; -webkit-transition-duration: 150ms; -moz-transform: scale(1.0,1.0); -moz-transition-timing-function: ease-out; -moz-transition-duration: 150ms; position: relative; z-index: 99; }

.service-title { font-size: 30px; margin: 10px 0 15px; font-weight: bold; }

.service-detial { font-size: 24px; line-height: 32px; min-height: 64px; }

.service-contact { width: 76%; margin: 0 12%; text-align: left; }

.service-phone { background: url(Images/new-header/icon-phone.png)no-repeat left center; padding-left: 30px; line-height: 32px; height: 32px; font-size: 30px; }

.service-mail { background: url(Images/new-header/icon-mail-small.png)no-repeat left center; padding-left: 30px; line-height: 32px; height: 32px; font-size: 24px; }
/*service1*/
.bg-service { background-image: url(Images/new-header/bg-default-service.jpg); background-position: 0 0; background-repeat: repeat; position: relative; animation: animatedBackground 60s linear infinite; -webkit-animation: animatedBackground 60s linear infinite; }

@keyframes animatedBackground {
    from { background-position: 0 0; }

    to { background-position: 100% 0; }
}

@-webkit-keyframes animatedBackground {
    from { background-position: 0 0; }

    to { background-position: 100% 0; }
}

@-ms-keyframes animatedBackground {
    from { background-position: 0 0; }

    to { background-position: 100% 0; }
}

@-moz-keyframes animatedBackground {
    from { background-position: 0 0; }

    to { background-position: 100% 0; }
}

.bg-service .short-bar-gray { margin-left: 0; }

.bg-service-test { background: linear-gradient(180deg, rgba(0,0,0,0.5) 0%,rgba(255,255,255,0.5) 30%, rgba(255,255,255,1) 100%); position: relative; width: 100%; }

.service-img { margin-top: 100px; text-align: center; }

.service-button { background: transparent; background: linear-gradient(to right, #f83148 50%, #575757 50%); background-size: 200% 100%; background-position: right bottom; transition: all 0.5s ease; margin: 30px 0 0; }

    .service-button:hover { background-position: left bottom; color: #fff; }

    .service-button a { color: #fff; }

        .service-button a:hover { color: #fff; }
/* theme */
.bg-theme { padding: 0 0 40px; background: #faf9f9 url(Images/new-header/border-line-stripe.png) repeat-x top center; position: relative; border-top: solid 1px #fff; }

.theme-button { background: transparent; background: linear-gradient(to right, #34d891 50%, #4d4d4d 50%); background-size: 200% 100%; background-position: right bottom; transition: all 0.5s ease; margin: 30px auto 0; border: solid 2px #919191; }

    .theme-button:hover { background-position: left bottom; color: #fff; border: solid 2px #34d891; }

    .theme-button a { color: #fff; }

        .theme-button a:hover { color: #fff; }

.theme-label { width: 104px; height: 118px; margin: -5px auto 30px; }
/*customer*/
.bg-customer { padding: 70px 0 40px; background: linear-gradient(to top, #e0e0e0 0%, #fff 80%); border-top: solid 1px #eee; }

    .bg-customer .short-bar-gray { margin-left: 0; }

.customer-button-div { position: absolute; right: 15px; top: 0; }

.customer-button { background: transparent; background: linear-gradient(to right, #fff304 50%, transparent 50%); background-size: 200% 100%; background-position: right bottom; transition: all 0.5s ease; margin: 15px 0 0 auto; border: solid 3px #777; }

    .customer-button:hover { background-position: left bottom; color: #000; border: solid 3px #eaebbf; }

    .customer-button a { color: #777; }

        .customer-button a:hover { color: #000; }
/*image zoom when hover*/
a.serviceitem { text-decoration: none; display: block; width: 330px; height: 228px; float: left; margin: 0 3px 3px 0; opacity: 1; -webkit-transform: scale(0.95,0.95); -webkit-transition-timing-function: ease-out; -webkit-transition-duration: 150ms; -moz-transform: scale(0.95,0.95); -moz-transition-timing-function: ease-out; -moz-transition-duration: 150ms; }

    a.serviceitem:hover { -webkit-transform: scale(1.0,1.0); -webkit-transition-timing-function: ease-out; -webkit-transition-duration: 150ms; -moz-transform: scale(1.0,1.0); -moz-transition-timing-function: ease-out; -moz-transition-duration: 150ms; position: relative; z-index: 99; }

/*button transition form left to right when hover*/
.skillsDouble li { width: 100px; height: 40px; line-height: 40px; text-align: center; float: left; background: transparent; /* Old browsers */ background: linear-gradient(to right, transparent 50%, blue 50%); background-size: 200% 100%; background-position: right bottom; margin-left: 10px; transition: all 0.5s ease; border: solid 2px #eee; }

    .skillsDouble li:hover { background-position: right bottom; color: yellow; }

    .skillsDouble li a { color: #000; display: block; }

        .skillsDouble li a:hover { color: yellow; }
/*fadein - fadeout button*/
.test { font-family: Verdana; font-size: 23px; height: 200px; line-height: 200px; display: block; transition: background 0.5s ease-out, color 0.5s ease-out; background: #fff; color: #333; font-weight: bold; padding: 0 10px; }

    .test:hover { transition: background 0.5s ease-out, color 0.5s ease-out; background: #71A571; color: #fff; }

/* Fix for pricing page*/
.PricingBanner .new-banner { width: 580px; right: 12%; top: 15%; }

.PricingBanner .default-pricing-button { margin-top: 25px; height: 50px; line-height: 45px; }


    .PricingBanner .default-pricing-button a { padding-left: 40px; padding-right: 40px; }

.bg-pricing-1 { background: linear-gradient(to top, #eeedeb 0,#fefdfb 100%); padding: 40px 0; color: #27282b; border-bottom: solid 2px #fff; }

    .bg-pricing-1 .info { margin-top: 120px; }

    .bg-pricing-1 .title { line-height: 50px; }

    .bg-pricing-1 .detail { line-height: 35px; margin-top: 30px; }

    .bg-pricing-1 .customer-button { margin: 40px 0 0; }

.bg-blue1 .font70 { line-height: 50px; }

.bg-blue1 .font24 { font-weight: bold; line-height: 30px; }

.bg-pricing { background-color: #fff; padding: 70px 10px 50px; }

.feature-info { width: 37%; float: left; }

.pricing-version-info { width: 21%; float: right; }

.edition-compare .feature-info { width: 30%; float: left; }

.edition-compare .pricing-version-info { width: 17.5%; float: right; }

.pricing-row-title { min-height: 115px; text-align: center; padding: 15px 0; font-family: ThaiSansNeueBold; font-size: 72px; background-color: #eee; color: #2ac9f8; text-transform: uppercase; width: 100%; font-weight: bold; margin-top: 60px; }

    .pricing-row-title.enterprise { background: #ffc000 url(Images/new-header/title-enterprise.jpg) no-repeat center center; }

    .pricing-row-title.essential { background: #36c9f5 url(Images/new-header/title-essential.jpg) no-repeat center center; }

    .pricing-row-title.free { background: #B0B0B0 url(Images/new-header/title-free.jpg) no-repeat center center; }

    .pricing-row-title.supreme { background: #29af3c url(Images/new-header/title-supreme.jpg) no-repeat center center; margin-top: 0px; min-height: 175px; position: relative; }

    .pricing-row-title.business { background: #36c9f5 url(Images/new-header/title-business.jpg) no-repeat center center; }

    .pricing-row-title.enterprise1 { background: #ffc000 url(Images/new-header/title-enterprise-1.jpg) no-repeat center center; }

    .pricing-row-title.essential1 { background: #36c9f5 url(Images/new-header/title-essential-1.jpg) no-repeat center center; }

    .pricing-row-title.supreme1 { background: #29af3c url(Images/new-header/title-supreme-1.jpg) no-repeat center center; margin-top: 0px; min-height: 175px; position: relative; }

.pricenew .pricing-row-title.supreme { background: #29af3c url(Images/new-header/title-supreme-new.jpg) no-repeat center center; }

.pricing-row-title .supremetop { left: -2.5%; position: absolute; top: -35px; width: 105% !important; background: url(Images/new-header/title-supreme-top.jpg) no-repeat top center/ 100% auto; }

.edition-compare .pricing-row-title.enterprise,
.edition-compare .pricing-row-title.essential,
.edition-compare .pricing-row-title.supreme { background-size: 100% auto; }

.edition-compare .pricing-row-title.supreme { background-size: auto 85%; }

.edition-compare .pricing-row-title .supremetop { top: -18px; }

.pricing-row-price { min-height: 230px; font-size: 36px; padding: 15px 0; width: 100%; text-align: center; color: #333; line-height: 50px; font-weight: bold; border-right: solid 1px #a0a0a0; }

    .pricing-row-price.first { padding-top: 55px; font-weight: bold; border-left: solid 1px #a0a0a0; }

.pricing-row-head1 { min-height: 68px; background-color: #eee; color: #333; font-size: 30px; padding: 17px 15px 17px 40px; line-height: 30px; border: solid 1px #a0a0a0; border-collapse: collapse; width: 100%; border-right: 0; }

    .pricing-row-head1.featurebutton { padding: 0; }

.show-less-step { display: none; }

.pricing-version-info .pricing-row-head1 { border-left: 0; border-right: 0; }

.pricing-row-item { min-height: 68px; color: #333; border: solid 1px #a0a0a0; border-top: 0; border-collapse: collapse; width: 100%; font-size: 24px; padding: 17px 15px 17px 40px; line-height: 30px; }

.edition-compare .pricing-row-head1, .edition-compare .pricing-row-item { padding: 17px 15px; }

.version-row-item { min-height: 68px; color: #6a716d; border: solid 1px #a0a0a0; border-top: 0; border-left: 0; border-collapse: collapse; width: 100%; background: url(Images/Web2017/Icon/tick.png) no-repeat center center; text-align: center; font-weight: bold; padding: 17px 0; font-size: 0; }

    .version-row-item.nofeature { background: url(Images/Web2017/Icon/tick-no.png) no-repeat center center; }

    .version-row-item.first { background: none; }

    .version-row-item .product-item { font-size: 30px; }

.supremediv .version-row-item .product-item { color: #40c380; }

.price-value { line-height: 80px; font-size: 60px; color: #706f6f; margin-bottom: 20px; height: 70px; }

    .price-value .price { font-size: 72px; color: #323232; }

    .price-value.supreme { font-size: 70px; }

        .price-value.supreme .price { font-size: 84px; color: #29af3c; }

.pricing-button { width: auto; }

    .pricing-button a { font-family: ThaiSansNeue; font-size: 32px; font-style: normal; color: #fff; text-align: center; border-radius: 0; width: 90%; margin: 0 auto; display: block; background: #17d154; border: solid 2px #21b667; transition: all 0.5s ease-out, color 0.5s ease-out, border 0.5s ease-out; }

        .pricing-button a.small { font-size: 30px; line-height: 40px; margin-top: 10px; }

        .pricing-button a:hover { color: #fff; background: #ffc000; border: solid 2px #e8ba2d; transition: background 0.5s ease-out, color 0.5s ease-out, border 0.5s ease-out; text-decoration: none; }

.pricing-row-head1.featurebutton .pricing-button { height: auto; }

.fb-course-banner { background: url("Images/Form/bg-form-main-facebook.jpg") no-repeat scroll center top; height: 100%; margin: 0; position: relative; width: 100%; }

    .fb-course-banner .row { background: url(Images/Form/fb-mobile-form-page.png) no-repeat 10% bottom; background-size: 40% auto; padding: 30px 0; }

.free-compare { width: 80%; display: table; margin: auto; }

    .free-compare .feature-info { width: 46%; }

    .free-compare .pricing-version-info { width: 27%; }


/* Fix for google ads page*/
.GoogleAdsBanner { background: url("Images/Banner/banner-google-ads.jpg") no-repeat center center; height: 510px; margin: 0; position: relative; width: 100%; }

.bg-google-ads1 { border-top: solid 1px #fff; background: #E8472D; padding: 40px 0; color: #fff; }

.bg-google-ads2 { background: #fff url(Images/Web2017/Background/bg-google-ads.jpg) no-repeat center bottom; padding: 0; color: #333; line-height: 35px; }

    .bg-google-ads2 .row { padding: 50px 0; background: url(Images/Web2017/Background/google-1.png) no-repeat right bottom; background-size: auto; }

.bg-google-ads3 { background: #25b046; padding: 40px 0; color: #fff; }

.bg-google-ads5 { background: #E8472D; padding: 40px 0; color: #fff; }

    .bg-google-ads5 .row { padding: 0 10%; position: relative; }

.google-ad-totop { background: url(Images/Web2017/Icon/arrow_back_to_top_red.svg) no-repeat center center; }

/*Sticky Tab Menu*/
.StickyTabMenuPanel { display: table; margin: auto; }

    .StickyTabMenuPanel ul { display: table; list-style-type: none; margin: 0 auto; padding: 0; width: auto; }

        .StickyTabMenuPanel ul > li { line-height: 51px; height: 51px; width: 51px; background-position: center 0; background-repeat: no-repeat; margin: 0 8px; float: left; }

            .StickyTabMenuPanel ul > li a { padding: 51px 0 0; font-size: 0; display: block; text-align: center; height: 51px; width: 100%; }
            /* ---------- Begin feature tab icon ----------- */
            .StickyTabMenuPanel ul > li.tab-hilight { background-image: url(Images/Web2017/Icon/tab-1.png); }

            .StickyTabMenuPanel ul > li.tab-marketing { background-image: url(Images/Web2017/Icon/tab-2.png); }

            .StickyTabMenuPanel ul > li.tab-design { background-image: url(Images/Web2017/Icon/tab-3.png); }

            .StickyTabMenuPanel ul > li.tab-management { background-image: url(Images/Web2017/Icon/tab-4.png); }

            .StickyTabMenuPanel ul > li.tab-payment { background-image: url(Images/Web2017/Icon/tab-5.png); }

            .StickyTabMenuPanel ul > li.tab-tax { background-image: url(Images/Web2017/Icon/tab-6.png); }

            .StickyTabMenuPanel ul > li.tab-shipping { background-image: url(Images/Web2017/Icon/tab-7.png); }

            .StickyTabMenuPanel ul > li.tab-report { background-image: url(Images/Web2017/Icon/tab-8.png); }

            .StickyTabMenuPanel ul > li.tab-mobile { background-image: url(Images/Web2017/Icon/tab-9.png); }

            .StickyTabMenuPanel ul > li.tab-facebook { background-image: url(Images/Web2017/Icon/tab-10.png); }

            .StickyTabMenuPanel ul > li.tab-other { background-image: url(Images/Web2017/Icon/tab-12.png); }

            .StickyTabMenuPanel ul > li.tab-blog { background-image: url(Images/Web2017/Icon/tab-11.png); }

            .StickyTabMenuPanel ul > li:hover, .StickyTabMenuPanel ul > li.active, .StickyTabMenuPanel ul > li:focus { background-position: center 100% !important; }

                .StickyTabMenuPanel ul > li.active:not(.name) a, .StickyTabMenuPanel ul > li.active:not(.name) a:hover { }
/*Google Adwords Training*/
.AdwordsTraining { font-family: ThaiSansNeue; }

.adwords-course-banner { height: 100%; margin: 0; position: relative; width: 100%; background: url(Images/Web2017/Background/background-adwords-training.jpg) no-repeat center top; background-size: cover; }

    .adwords-course-banner .row { background: url(Images/Web2017/Background/adwords-training-1.png) no-repeat 0 bottom; padding: 0; }

    .adwords-course-banner .form-1 { width: 100%; }

.bg-adwords-course1 { border: 0; padding: 40px 0; color: #fff; font-size: 40px; background-color: #12ca76; }

    .bg-adwords-course1 h1 { font-size: 52px; line-height: 60px; color: #fff; font-family: ThaiSansNeue; font-weight: bold; }

.bg-adwords-course2 { border: 0; padding: 70px 0; background: #fff url(Images/Web2017/Background/bg-adwords-training-1.jpg) no-repeat right bottom; }

    .bg-adwords-course2 .font21 { line-height: 32px; }

.bg-adwords-course3 { border: 0; padding: 30px 0 40px; color: #fff; font-size: 40px; background-color: #156aeb; text-align: center; }

.bg-adwords-course4 { border: 0; padding: 40px 0; background: #fff url(Images/Web2017/Background/bg-adwords-training-2.jpg) no-repeat left bottom; line-height: 30px; background-size: 50% auto; }

.bg-adwords-course5 { border: 0; padding: 40px 0; background-color: #72757a; color: #fff; text-align: center; }

    .bg-adwords-course5 p { font-size: 23px; }

.bg-adwords-course6 { border-bottom: solid 2px #d9d7d7; padding: 50px 0 30px; background-color: #fff; text-align: center; }
/*Free Training*/
.FreeTraining { font-family: ThaiSansNeue; }

.free-course-banner { height: 100%; margin: 0; position: relative; width: 100%; background: url(Images/Web2017/Background/background-free-training.jpg) no-repeat center top; }

    .free-course-banner .row { background: url(Images/Web2017/Background/free-training-1.png) no-repeat right bottom/auto 98%; padding: 90px 0; }

    .free-course-banner h1 { width: 84%; margin-left: 8%; }

.bg-free-course1 { border: 0; padding: 40px 0; color: #fff; font-size: 40px; background-color: #f8a441; }

    .bg-free-course1 h1 { font-size: 52px; line-height: 60px; color: #fff; font-family: ThaiSansNeue; font-weight: bold; }

    .bg-free-course1 .nine.columns { padding-right: 50px; }

.bg-free-course2 { border: 0; padding: 70px 0 40px; background: #fff url(Images/Web2017/Background/bg-free-1.jpg) no-repeat right bottom; }

    .bg-free-course2 .font21 { line-height: 32px; }

.bg-free-course3 { border: 0; padding: 30px 0 40px; color: #fff; font-size: 40px; background-color: #009452; text-align: center; }

.bg-free-course4 { border-top: solid 2px #b5b5b2; padding: 0; background: #e1e1e0 url(Images/Web2017/Background/bg-free-2.jpg) no-repeat center bottom; background-size: auto 100%; position: relative; margin-top: 25px; clear: left; }

    .bg-free-course4 .row { padding: 30px 0; }

.bg-green-button { background-color: #00a651; padding: 10px 20px; color: #fff; font-size: 30px; font-weight: bold; float: left; margin: 20px 0; }

.free-adwords-button { background: transparent; background: linear-gradient(to right, #00a651 50%, transparent 50%); background-size: 200% 100%; background-position: right bottom; transition: all 0.5s ease; margin: 0; border: solid 3px #00a651; clear: left; height: 55px; line-height: 50px; }

    .free-adwords-button:hover { background-position: left bottom; color: #fff; border: solid 3px #00a651; }

    .free-adwords-button a { color: #000; font-size: 24px; font-family: ThaiSansNeue; }

        .free-adwords-button a:hover { color: #fff; }
/*Backend Course Training*/
.BackendTraining { font-family: ThaiSansNeue; }

.backend-course-banner { height: 100%; margin: 0; position: relative; width: 100%; background: url(Images/Web2017/Background/bg-backend-course.jpg) no-repeat center top; }

    .backend-course-banner .row { background: url(Images/Web2017/Background/bg-backend-course1.png) no-repeat 80% bottom; padding: 50px 0; }

    .backend-course-banner h1 { width: 60%; margin-left: 20%; line-height: 55px; }

.BackendTraining .short-bar-yellow { box-shadow: none; }

.backend-banner-label { position: absolute; left: 80%; top: -35px; }

.backend-course-box { background-color: #FFE00E; height: 40px; padding: 5px 15px; font-weight: bold; bottom: 20px; font-weight: bold; color: #000; display: table; margin: auto; position: relative; }

.bg-backend-course1 { border: 0; padding: 60px 0; color: #fff; font-size: 40px; background-color: #41a8f8; }

    .bg-backend-course1 h1 { font-size: 56px; line-height: 60px; color: #fff200; font-family: ThaiSansNeue; font-weight: bold; }

    .bg-backend-course1 .nine.columns { padding-right: 50px; }

.bg-backend-course2 { border: 0; padding: 70px 0 40px; background: #fff url(Images/Web2017/Background/bg-backend-course2.jpg) no-repeat center center; }

.BackendTraining .bg-white { color: #000; }

.BackendTraining .fbads-list ul { padding-left: 15px; }

    .BackendTraining .fbads-list ul li { padding-left: 20px; background: url(Images/Web2017/Bullet/bullet-gray.png) no-repeat 0 13px; }

.bg-white .border { border-bottom: solid 4px #777777; }

.bg-backend-course3 { background-color: #22b63b; color: #fff; padding: 50px 0; text-align: center; }

/*------------- Responsive Design Page ---------------*/
.features-new.responsive { position: relative; background: #fff; }

.features-responsive { background: url("Images/Web2017/Background/background-responsive-banner.webp") no-repeat center center; height: 703px; margin: 0; position: relative; width: 100%; padding: 50px 0; }

.features-responsive-2 h1 { color: #212120; font-weight: bold; }

.features-responsive-2 { background-color: #f0726f; text-align: center; font-family: ThaiSansNeue; padding: 50px 0; }

    .features-responsive-2 h1 { color: #fff; font-family: ThaiSansNeue; font-weight: bold; }

.features-responsive-3 { padding: 40px 0; border-top: 2px solid #d7d7de; width: 100%; }

.features-responsive-4 { padding: 0; position: relative; border-top: 2px solid #d7d7de; width: 100%; }

    .features-responsive-3 .tile-icon-right,
    .features-responsive-4 .tile-icon-right { font-size: 36px; font-weight: bold; padding-right: 0; width: 100%; }

    .features-responsive-4 .info-left { padding-bottom: 60px; }

.features-new.responsive .title-detail { margin-bottom: 30px; font-size: 17px; font-family: CSPraJad; line-height: 28px; }
/*Animation Frame*/
.cupsmoke { bottom: 30%; height: 220px; left: 60%; overflow: hidden; position: absolute; width: 200px; }

div.cupsmoke-1 { width: 120px; height: 200px; background: url(Images/Web2017/Background/smoke1.png) no-repeat left bottom; position: absolute; bottom: -15px; transition: background 2.5s linear; -webkit-transition: background 2.5s linear; -webkit-animation: fadein3 5.5s infinite; /* Chrome, Safari, Opera */ animation: fadein3 5.5s infinite; animation-delay: 2s; -webkit-animation-delay: 2s; }

div.cupsmoke-2 { width: 120px; height: 200px; background: url(Images/Web2017/Background/smoke2.png) no-repeat left bottom; position: absolute; left: 40px; bottom: -20px; -webkit-transition: background 2.5s linear; transition: background 2.5s linear; -webkit-animation: fadein2 5.5s infinite; /* Chrome, Safari, Opera */ animation: fadein2 5.5s infinite; animation-delay: 1s; -webkit-animation-delay: 1s; }

@keyframes fadein2 {
    0% { opacity: 0.2; }

    50% { opacity: 1; }

    80% { opacity: 0.2; }

    100% { opacity: 0; bottom: 30px; }
}

@keyframes fadein2 {
    0% { opacity: 0.2; }

    50% { opacity: 1; }

    80% { opacity: 0.2; }

    100% { opacity: 0; bottom: 30px; }
}

@-webkit-keyframes fadein2 {
    0% { opacity: 0.2; }

    50% { opacity: 1; }

    80% { opacity: 0.2; }

    100% { opacity: 0; bottom: 30px; }
}

@-ms-keyframes fadein2 {
    0% { opacity: 0.2; }

    50% { opacity: 1; }

    80% { opacity: 0.2; }

    100% { opacity: 0; bottom: 30px; }
}

@-moz-keyframes fadein2 {
    0% { opacity: 0.2; }

    50% { opacity: 1; }

    80% { opacity: 0.2; }

    100% { opacity: 0; bottom: 30px; }
}

@keyframes fadein3 {
    0% { opacity: 0.2; }

    50% { opacity: 1; }

    80% { opacity: 0.2; }

    100% { opacity: 0; bottom: 45px; }
}

@-webkit-keyframes fadein3 {
    0% { opacity: 0.2; }

    50% { opacity: 1; }

    80% { opacity: 0.2; }

    100% { opacity: 0; bottom: 45px; }
}

@-ms-keyframes fadein3 {
    0% { opacity: 0.2; }

    50% { opacity: 1; }

    80% { opacity: 0.2; }

    100% { opacity: 0; bottom: 45px; }
}

@-moz-keyframes fadein3 {
    0% { opacity: 0.2; }

    50% { opacity: 1; }

    80% { opacity: 0.2; }

    100% { opacity: 0; bottom: 45px; }
}

/* Download TakraOnline*/
.ContactUsFinishedButtonDiv.mgt30 { margin: 30px auto 50px; }

.DownloadCountButton { clear: left; margin: 40px auto 0; }

.CountButton { font-family: ThaiSansNeue; font-size: 30px; font-style: normal; color: #fff; text-align: center; border-radius: 0; min-width: 320px; display: block; border: 0; background: #36C9F5; transition: background 0.5s ease-out, color 0.5s ease-out; cursor: pointer; line-height: 40px; margin: 0 auto; padding: 5px 50px; }

    .CountButton.Back { width: 320px; }

    .CountButton:hover { color: #000; background: #fff301; transition: background 0.5s ease-out, color 0.5s ease-out; text-decoration: none; }


.DownloadFreeButton { background: transparent; background: linear-gradient(to right, #4d4d4d 50%, rgba(0, 0, 0, 0) 50%); background-size: 200% 100%; background-position: right bottom; transition: all 0.5s ease; border: solid 3px #666; margin: 40px auto; }

    .DownloadFreeButton:hover { background-position: left bottom; border: solid 3px #fff301; color: #101010; }

    .DownloadFreeButton a { color: #666; }

        .DownloadFreeButton a:hover { color: #FFF304; }

.PurchaseOnline .OptionItemDetailsTop { height: 40px; line-height: 40px; width: 130px; }

.PurchaseOnline .OptionDisplayText { font-weight: normal; font-size: 24px; line-height: 40px; }

.PurchaseOnline .OptionDropDownItem { background: url("Images/Web2017/Bullet/product-detail-dropdown.png") no-repeat scroll 96% center rgba(0, 0, 0, 0); border: 2px solid #aba9a9; border-radius: 5px; height: 38px; overflow: hidden; }

.PurchaseOnline .OptionTextItem .OptionTextItemText { height: 40px !important; line-height: 40px; }

.PurchaseOnline select { background: none; border: 0; font-family: "ThaiSansNeue"; font-size: 20px; padding: 4px; line-height: 38px; width: 110%; }

.PurchaseOnline .Option { float: left; border: 0; }

.PurchaseOnline .OptionItemDetailsLeft { font-family: Tahoma; }

.PurchaseOnline .CommonOptionItemValidator { position: absolute; font-size: 11px; margin-top: -25px; }

.PurchaseOnline .CommonButtonFade { float: left; margin-left: 10px; margin-top: 10px; width: auto; }

    .PurchaseOnline .CommonButtonFade a { color: #fff; border-radius: 0; line-height: 40px; padding: 0 30px; height: 40px; }

.PaymentDescription { padding: 10px 0; }

.PaymentDescription-Image { padding: 10px; float: left; }

.PaymentDescription-HeaderText { font-weight: bold; line-height: 28px; }


.pos-rel { position: relative; }

/*Product Banner*/
.BannerMessageDiv { display: table; margin: 20px auto; padding: 0 15px; text-shadow: 3px 1px 3px #111; }

    .BannerMessageDiv h1.Line1 { font-size: 96px; line-height: 70px; color: #fff; text-transform: uppercase; }

    .BannerMessageDiv .Line2 { font-size: 30px; padding: 8px 0; line-height: 35px; height: 50px; color: #fff; font-weight: bold; border-top: solid 2px #fff; border-bottom: solid 2px #fff; }

.bg-download-free { background-color: #FFD966; padding: 40px 0; line-height: 30px; }

.bg-download-free-faqs { background-color: #f1f1f1; padding: 50px 0; }

    .bg-download-free-faqs .AnsBlock { color: #14AE6A; font-weight: bold; width: 50px; text-decoration: underline; display: inline-block; }

.Anstitle { cursor: pointer; font-weight: bold; clear: left; float: left; padding: 15px 25px 8px 0; background-repeat: no-repeat; background-position: right 20px; background-image: url(Images/Web2017/Icon/toggle-show.png); line-height: 22px; }

    .Anstitle.active { background-image: url(Images/Web2017/Icon/toggle-hide.png); }

.AnsShow { clear: left; line-height: 30px; }

.bg-download-free-faqs .SubAnsBlock { clear: left; margin-left: 50px; }

    .bg-download-free-faqs .SubAnsBlock .title { font-weight: bold; text-decoration: underline; margin: 5px 0; }

    .bg-download-free-faqs .SubAnsBlock .list-1-col .title { font-weight: normal; text-decoration: underline; margin: 0 0 5px; }

.bg-download-free-faqs ul.list-1-col { list-style: none; padding-left: 0; }

    .bg-download-free-faqs ul.list-1-col li { background: url("Images/Web2017/Bullet/bullet-gray.png") no-repeat left 8px; padding-left: 25px; margin: 3px 0px; line-height: 25px; }

.DownloadCommunity { background: url("Images/Web2017/Background/bg-download-community.jpg") no-repeat center center; min-height: 703px; margin: 0; position: relative; width: 100%; background-size: auto 100%; }

    .DownloadCommunity .detail-box { line-height: 36px; }

    .DownloadCommunity .short-bar-dark1 { margin: 30px 0; }

    .DownloadCommunity h1 { margin: 50px 0 0; }

.DownloadCommunityInner { background-image: url(Images/Web2017/Background/bg-download-community-pattern.png); background-position: 0 0; background-repeat: repeat-x; position: relative; animation: animatedBackground 60s linear infinite; -webkit-animation: animatedBackground 60s linear infinite; }

.community-button-div { clear: left; float: none; margin: 40px 0; }

.DownloadCommunity .DownloadFreeButton { background: transparent; background: linear-gradient(to right, #ff4f4f 50%, rgba(0, 0, 0, 0) 50%); background-size: 200% 100%; background-position: right bottom; transition: all 0.5s ease; border: solid 3px #666; margin: 40px 0; }

    .DownloadCommunity .DownloadFreeButton:hover { background-position: left bottom; border: solid 3px #ff4f4f; color: #101010; }

    .DownloadCommunity .DownloadFreeButton a { color: #666; }

        .DownloadCommunity .DownloadFreeButton a:hover { color: #fff; }

.head-logo { background: none repeat scroll 0 0 rgba(255, 255, 255, 0.5); padding: 10px 0; width: 100%; }

    .head-logo.dark { padding: 15px 0 5px; background: linear-gradient(rgba(25,0,0,0.9), rgba(43,3,2,0.7)); }

.promotion-box-a { background: none repeat scroll 0 0 rgba(255, 255, 255, 0.75); border: 2px solid #fcd768; display: table; margin: 40px auto 25px; padding: 25px; width: 80%; }

    .promotion-box-a .bg-red { padding: 15px; color: #fff; }

    .promotion-box-a .font-red { color: #ee3425; }

    .promotion-box-a .bg-red-1 { display: table; margin: auto; background-color: #ee3425; padding: 15px; color: #fff; }

    .promotion-box-a .bg-yellow-1 { display: table; margin: auto; background-color: #fff500; padding: 15px; color: #ee3425; font-weight: bold; }

.bg-red-line { background: url(Images/Web2017/Background/red-line.png) repeat-x center center; width: 100%; display: block; min-height: 20px; }

.bg-yellow-line { background: url(Images/Web2017/Background/yellow-line.png) repeat-x center center; width: 100%; display: block; min-height: 20px; }

.pro-line { margin: 15px 0 10px 20px; width: 100%; line-height: 40px; }

.promotion-box-a.bg-dark { background: rgba(0,0,0,0.35); border: solid 3px #fcd768; }

.promotion-button { background: transparent; background: linear-gradient(to right, #ee3424 50%, transparent 50%); background-size: 200% 100%; background-position: right bottom; transition: all 0.5s ease; margin: 30px auto 30px 20px; border: solid 3px #ee3424; }

    .promotion-button:hover { background-position: left bottom; color: #fff; border: solid 3px #ee3424; }

    .promotion-button a { color: #333; }

        .promotion-button a:hover { color: #fff; }

.pro-list li { margin-top: 10px; margin-bottom: 15px; line-height: 42px; }

    .pro-list li .font-gray { color: #b3bebe; margin-left: 25px; }

.PromotionButton { background: url(Images/Web2017/Background/icon-box.png) no-repeat 25px 6px, linear-gradient(#ff271e, #b20904); font-size: 36px; font-family: ThaiSansNeue; color: #fff; padding: 6px 30px 0 80px; line-height: 50px; border: solid 1px #fa1005; transition: all 0.5s ease-out, color 0.5s ease-out, border 0.5s ease-out; display: table; margin: 0 auto 25px; }

    .PromotionButton:hover { background: url(Images/Web2017/Background/icon-box.png) no-repeat 25px 6px, linear-gradient(#a10600, #790500); color: #ffea00; border: solid 1px #790500; transition: background 0.5s ease-out, color 0.5s ease-out, border 0.5s ease-out; }

    .PromotionButton.Green { background: url(Images/Web2017/Background/icon-box.png) no-repeat 25px 6px, linear-gradient(#4ffaa3, #00a651); border: solid 1px #db8310; transition: background 0.5s ease-out, color 0.5s ease-out, border 0.5s ease-out; }

        .PromotionButton.Green:hover { background: url(Images/Web2017/Background/icon-box.png) no-repeat 25px 6px, linear-gradient(#ff271e, #b20904); color: #fff; border: solid 1px #db8310; transition: background 0.5s ease-out, color 0.5s ease-out, border 0.5s ease-out; }

.DownloadFormButton { background: linear-gradient(#ff271e, #b20904); font-size: 36px; font-family: ThaiSansNeue; color: #fff; padding: 0 20px; line-height: 50px; border: solid 1px #fa1005; transition: all 0.5s ease-out, color 0.5s ease-out, border 0.5s ease-out; display: table; margin: 20px 0; }

    .DownloadFormButton:hover { background: linear-gradient(#a10600, #790500); color: #ffea00; border: solid 1px #790500; transition: background 0.5s ease-out, color 0.5s ease-out, border 0.5s ease-out; }

.font-gold { color: #f1d897; }

.font-gold-1 { color: #e1b05a; }

.font-gold-2 { color: #fce58a; }

.promotion-price { margin: 20px 0 0; }

    .promotion-price .font-gold-2 { display: none; }

.new-form .red-icon .FaceBookIcon { background: url(Images/Form/red-icon-facebook.png)no-repeat left center; }

.new-form .red-icon .GoogleIcon { background: url(Images/Form/red-icon-google.png)no-repeat left center; }

.new-form .red-icon .PhoneIcon { background: url(Images/Form/red-icon-contact.png)no-repeat left center; }

.new-form .pink-icon .FaceBookIcon { background: url(Images/Form/pink-icon-facebook.png)no-repeat left center; }

.new-form .pink-icon .GoogleIcon { background: url(Images/Form/pink-icon-google.png)no-repeat left center; }

.new-form .pink-icon .PhoneIcon { background: url(Images/Form/pink-icon-contact.png)no-repeat left center; }

.new-form .yellow-icon .FaceBookIcon { background: url(Images/Form/yellow-icon-facebook.png)no-repeat left center; }

.new-form .yellow-icon .GoogleIcon { background: url(Images/Form/yellow-icon-google.png)no-repeat left center; }

.new-form .yellow-icon .PhoneIcon { background: url(Images/Form/yellow-icon-contact.png)no-repeat left center; }

.new-form .blue-icon .FaceBookIcon { background: url(Images/Form/blue-icon-facebook.png)no-repeat left center; }

.new-form .blue-icon .GoogleIcon { background: url(Images/Form/blue-icon-google.png)no-repeat left center; }

.new-form .blue-icon .PhoneIcon { background: url(Images/Form/blue-icon-contact.png)no-repeat left center; }

.NewButton { background-color: #01b1e7; font-size: 30px; font-family: ThaiSansNeue; color: #fff; padding: 5px 30px; line-height: 44px; border-radius: 15px; border: solid 1px #82d2eb; transition: all 0.5s ease-out, color 0.5s ease-out, border 0.5s ease-out; }

    .NewButton.BtnPromotion { background: linear-gradient(#fa2a1d,#b00c02); border: solid 1px #dc0b07; }

        .NewButton.BtnPromotion:hover { background: linear-gradient(#a10600, #790500); color: #ffea00; border: solid 1px #790500; transition: background 0.5s ease-out, color 0.5s ease-out, border 0.5s ease-out; }

.limittime { line-height: 40px; margin-top: 20px; clear: left; float: left; width: 100%; }

.bg-march-2015 { background: url(Images/Form/img-march-2015.png) no-repeat; background-position: 10% center; background-size: 65% auto; padding: 30px 0; }

.bg-april-2015 { background: url(Images/Form/img-april-2015.png) no-repeat; background-position: 10% center; background-size: 55% auto; padding: 30px 0; }


.PromotionButton.Pink { background: url(Images/Web2017/Background/icon-box.png) no-repeat 25px 6px, linear-gradient(#fe6182, #ed155b); font-size: 36px; font-family: ThaiSansNeue; color: #fff; padding: 6px 30px 0 80px; line-height: 50px; border: solid 1px #d72452; transition: all 0.5s ease-out, color 0.5s ease-out, border 0.5s ease-out; display: table; margin: 0 auto 25px; }

    .PromotionButton.Pink:hover { background: url(Images/Web2017/Background/icon-box.png) no-repeat 25px 6px, linear-gradient(#007ef9, #034280); color: #fff; border: solid 1px #007ef9; transition: background 0.5s ease-out, color 0.5s ease-out, border 0.5s ease-out; }

.NewButton.Pink { background-color: #01b1e7; font-size: 30px; font-family: ThaiSansNeue; color: #fff; padding: 5px 30px; line-height: 44px; border-radius: 15px; border: solid 1px #d72452; transition: all 0.5s ease-out, color 0.5s ease-out, border 0.5s ease-out; }

.NewButton.BtnPromotion.Pink { background: linear-gradient(#fe6182, #ed155b); border: solid 1px #d72452; }

    .NewButton.BtnPromotion.Pink:hover { background: linear-gradient(#007ef9, #034280); color: #fff; border: solid 1px #007ef9; transition: background 0.5s ease-out, color 0.5s ease-out, border 0.5s ease-out; }

.promotion-button.Navy { background: transparent; background: linear-gradient(to right, #0c79e4 50%, transparent 50%); background-size: 200% 100%; background-position: right bottom; transition: all 0.5s ease; margin: 30px auto 30px 20px; border: solid 3px #0c79e4; }

    .promotion-button.Navy:hover { background-position: left bottom; color: #fff; border: solid 3px #0c79e4; }

    .promotion-button.Navy a { color: #333; }

        .promotion-button.Navy a:hover { color: #fff; }



/*-----TFBO Promotion----*/
.TFBO-Page { padding: 30px 0; background-color: #f6f6f3; }

.TFBO-Title { padding-bottom: 30px; }

.TFBO-item-title { border-bottom: solid 1px #E7E7E7; margin-top: 2px; font-size: 26px; line-height: 40px; font-weight: bold; background-color: #f6f6f3; clear: left; float: left; width: 100%; padding: 5px 0 5px 20px; cursor: pointer; transition: background 0.5s ease-out; color: #666; }

    .TFBO-item-title .item-no { background-color: #36C9F5; border-radius: 50px; height: 30px; width: 30px; float: left; text-align: center; line-height: 23px; margin: 5px 20px 5px 0; color: #fff; transition: background 0.5s ease-out; }

    .TFBO-item-title:hover { transition: background 0.5s ease-out; background-color: #fafafa; color: #00c005; }

        .TFBO-item-title:hover .item-no { background-color: #00c005; transition: background 0.5s ease-out; }

.TFBO-item-title-hide { }

.TFBO-item-info { clear: left; float: left; width: 100%; padding: 25px 70px; line-height: 28px; color: #333; font-size: 21px; display: block; }

    .TFBO-item-info ul { padding: 0; margin: 0 0 20px; line-height: 28px; list-style-type: none; }

        .TFBO-item-info ul li { background: url(Images/Web2017/Bullet/bullet2.gif) no-repeat left center; line-height: 28px; padding-left: 20px; }


.bg-social { padding: 45px 0; background-color: #fff; }
/************************* New Css Website 2015 *******************************/
/*button fade action*/
.common-button { clear: left; float: left; }

a.common-btn1 { z-index: 0; background-color: #605d58; border: solid 1px #f8f4f1; color: #dad6d3; float: left; padding: 0 25px; font-family: ThaiSansNeue; transition: background 0.5s ease-out, border 0.5s ease-out; }
    /* dark */
    a.common-btn1:hover { border: solid 1px #fff; background-color: #0c0807; color: #fff; transition: background 0.5s ease-out, border 0.5s ease-out; }

a.common-btn2 { z-index: 0; background-color: #eeedeb; border: solid 1px #eeedeb; color: #0c0807; float: left; padding: 0 25px; font-family: ThaiSansNeue; transition: background 0.5s ease-out, border 0.5s ease-out; }
    /* light */
    a.common-btn2:hover { border: solid 1px #fff; background-color: #0c0807; color: #fff; transition: background 0.5s ease-out, border 0.5s ease-out; }

a.common-btn3 { z-index: 0; background-color: #2e2e2e; border: solid 1px #2e2e2e; color: #fff; float: left; padding: 0 25px; font-family: ThaiSansNeue; transition: background 0.5s ease-out, border 0.5s ease-out; }
    /* dark */
    a.common-btn3:hover { border: solid 1px #000; background-color: #000; color: #fff; transition: background 0.5s ease-out, border 0.5s ease-out; }

a.common-btn4 { z-index: 0; background-color: rgba(255,255,255,0.5); border: solid 1px #18160e; color: #18160e; float: left; padding: 0 25px; font-family: ThaiSansNeue; transition: background 0.5s ease-out, border 0.5s ease-out; }
    /* light */
    a.common-btn4:hover { border: solid 1px #18160e; background-color: #18160e; color: #fff; transition: background 0.5s ease-out, border 0.5s ease-out; }

a.common-btn5 { z-index: 0; background-color: rgba(255,255,255,0); border: solid 1px #000; color: #010201; float: left; padding: 0 25px; font-family: ThaiSansNeue; transition: background 0.5s ease-out, border 0.5s ease-out; }
    /* light */
    a.common-btn5:hover { border: solid 1px #010201; background-color: #010201; color: #fff !important; transition: background 0.5s ease-out, border 0.5s ease-out; }

a.common-btn6 { z-index: 0; background-color: #357FD3; color: #f8fd2b; float: left; padding: 0 30px; font-family: ThaiSansNeue; transition: background 0.5s ease-out; }
    /* blue-purple */
    a.common-btn6:hover { background-color: #3363ff; color: #f8fd2b; transition: background 0.5s ease-out; }

a.common-btn7 { z-index: 0; background-color: rgba(0,0,0,0.1); border: solid 1px #ddd; color: #666; float: left; padding: 0 25px; font-family: ThaiSansNeue; transition: background 0.5s ease-out; }
    /* light gray */
    a.common-btn7:hover { background-color: #666; color: #fff; transition: background 0.5s ease-out; }

a.common-btn8 { z-index: 0; background-color: rgba(255,255,255,0); border: solid 1px #000; color: #fff; float: left; padding: 0 25px; font-family: ThaiSansNeue; transition: background 0.5s ease-out, border 0.5s ease-out; }
    /* light */
    a.common-btn8:hover { border: solid 1px #010201; background-color: #010201; color: #fff; transition: background 0.5s ease-out, border 0.5s ease-out; }

a.common-btn9 { z-index: 0; background-color: rgba(255,255,255,0); border: solid 1px #fff; color: #fff; float: left; padding: 0 25px; font-family: ThaiSansNeue; transition: background 0.5s ease-out, border 0.5s ease-out; }
    /* light */
    a.common-btn9:hover { border: solid 1px #010201; background-color: #010201; color: #fff; transition: background 0.5s ease-out, border 0.5s ease-out; }

a.common-btn10 { z-index: 0; background-color: #4286f5; color: #fff; float: left; padding: 0 30px; font-family: ThaiSansNeue; transition: background 0.5s ease-out; width: 290px !important; text-align: center; }

    a.common-btn10:hover { background-color: #357FD3; color: #fff; transition: background 0.5s ease-out; }

a.common-btn11 { z-index: 0; background-color: #0b0b0b; color: #fff200; float: left; padding: 0 30px; font-family: ThaiSansNeue; transition: background 0.5s ease-out; }

    a.common-btn11:hover { background-color: #fff200; color: #0b0b0b; transition: background 0.5s ease-out; }
/*btn12 - bg-green font-white */
a.common-btn12 { z-index: 0; background-color: #2aaf3c; color: #fff; float: left; padding: 0 30px; font-family: ThaiSansNeue; transition: background 0.5s ease-out; }

    a.common-btn12:hover { background-color: #2dca42; color: #fff; transition: background 0.5s ease-out; }
/*btn12 - br-green font-green */
a.common-btn13 { z-index: 0; background-color: rgba(255,255,255,0); border: solid 1px #2aaf3c; float: left; padding: 0 30px; font-family: ThaiSansNeue; transition: background 0.5s ease-out; color: #2aaf3c; }

    a.common-btn13:hover { background-color: #2dca42; color: #fff; transition: background 0.5s ease-out; }
/*btn13 - bg light blue font-gray */
a.common-btn14 { z-index: 0; background-color: #bce4ff; border: solid 1px #bce4ff; float: left; padding: 0 30px; font-family: ThaiSansNeue; transition: background 0.5s ease-out; color: #4a4e6f; }

    a.common-btn14:hover { background-color: #357FD3; color: #fff; transition: background 0.5s ease-out; }

a.common-btn15 { z-index: 0; background-color: rgba(0,0,0,0); border: solid 1px #fff; color: #000; float: left; padding: 0 20px; font-family: ThaiSansNeue; transition: background 0.5s ease-out, border 0.5s ease-out; }
    /* light */
    a.common-btn15:hover { border: solid 1px #000; background-color: rgba(0,0,0,0.8); color: #fff; transition: background 0.5s ease-out, border 0.5s ease-out; }
a.common-btn16 { z-index: 0; background-color: #6A549D; border: solid 1px #6A549D; float: left; padding: 0 30px; font-family: ThaiSansNeue; transition: background 0.5s ease-out; color: #fff; }

    a.common-btn16:hover { background-color: #3d1368; color: #fff; transition: background 0.5s ease-out; }

/* Default page for PageScroll2id */
.default-nav-menu .nav-menu { }

.sticky-wrapper { clear: left; }

.nav-menu-div { position: relative; z-index: 1; }

    .nav-menu-div .sticky-wrapper { visibility: hidden; }

        .nav-menu-div .sticky-wrapper.default-nav-menu { visibility: visible; }

#nav-menu-sticky-wrapper { height: 0 !important; }

#nav-menu { z-index: 1; width: 300px !important; }

    #nav-menu ul { overflow: hidden; background: url(Images/web2015/background/nav-menu.png) no-repeat 6px 10px; padding-left: 0; list-style-type: none; width: 200px; }

    #nav-menu li { margin: 0; width: 100%; }

    #nav-menu a { display: block; padding: 0 0 0 25px; font-size: 0; min-height: 32px; line-height: 32px; width: 300px; border: 0; font-family: ThaiSansNeue; font-size: 0; color: #ccc; background: url(Images/web2015/background/nav-menu-item.png) no-repeat left center; }

        #nav-menu a.mPS2id-highlight { border: 0; min-height: 32px; line-height: 32px; color: #fff; font-family: ThaiSansNeue; font-size: 18px; font-weight: bold; text-shadow: 0px 0px 5px #000; }

        #nav-menu a:hover { color: #ffe347; background: url(Images/web2015/background/nav-menu-item-hover.png) no-repeat left center; font-size: 18px; width: auto; min-height: 32px; line-height: 32px; text-shadow: 0px 0px 5px #000; }

        #nav-menu a.mPS2id-highlight:hover { color: #fff; background: url(Images/web2015/background/nav-menu-item.png) no-repeat left center; }

        #nav-menu a.mPS2id-highlight:hover { }

.sticky-wrapper a.mPS2id-highlight { font-size: 0 !important; }

.sticky-wrapper.default-nav-menu a.mPS2id-highlight { font-size: 18px !important; }
/*----Quick Menu Sidebar ---*/
.quick-menu-div { position: relative; }

.quick-menu-wrapper { position: relative; float: right; width: 150px; height: 0; }

ul.quick-menu { width: 150px; margin: 0; padding: 0; list-style: none; z-index: 9; display: none; }

    ul.quick-menu li { clear: left; float: left; width: 100%; margin: 0; padding: 0; }

        ul.quick-menu li a { display: block; text-decoration: underline; border: 0; font-size: 0; }

            ul.quick-menu li a.menu-1 { background: url(Images/web2015/button/side-button-1.png) no-repeat left center; height: 45px; }

            ul.quick-menu li a.menu-2 { background: url(Images/web2015/button/side-button-2.png) no-repeat left center; height: 150px; }

            ul.quick-menu li a.menu-3 { background: url(Images/web2015/button/side-button-3.png) no-repeat left center; height: 73px; }

            ul.quick-menu li a.menu-4 { background: url(Images/web2015/button/side-button-4.png) no-repeat left center; height: 75px; }

/*-----------Default section 1-------------*/
.section-panel { position: relative; z-index: 0; }

#section-1 { background: #fff url(Images/web2015/background/sec-1-bg.png) repeat-x left top; border-bottom: solid 1px #fff; clear: left; }

.section-1-bg { width: 100%; padding: 0; position: relative; }

.section-1-left { position: relative; min-height: 450px; float: left; overflow: hidden; width: 50%; }

.section-1-right { float: right; width: 40%; margin-right: 5%; }

.section-1-rainbow { width: 98%; height: 180px; background: url(Images/web2015/background/sec-1-effect.png) no-repeat center top; background-size: 100% auto; position: absolute; top: -180px; -webkit-transition: background 5s linear; transition: background 5s linear; -moz-animation: toBottom 10s infinite; /* Firefox */ -webkit-animation: toBottom 10s infinite; /* Safari and Chrome */ -o-animation: toBottom 10s infinite; /* Opera */ animation: toBottom 10s infinite; z-index: 0; }

.section-1-img { width: 95%; min-height: 350px; background: url(Images/web2015/Banner/sec-1-image.png) no-repeat center center; position: absolute; bottom: -20px; -webkit-transition: background 2s ease-in-out; transition: background 2s ease-in-out; z-index: 1; -moz-animation: toTop 2s ease-in 2s; /* Firefox */ -webkit-animation: toTop 2s ease-in 2s forwards; /* Safari and Chrome */ -o-animation: toTop 2s ease-in 2s forwards; /* Opera */ animation: toTop 2s ease-in 2s forwards; }

.section-1-bg div.section-button { background-color: #3C75CF; }


.section-1-right .text-col { text-align: left; font-weight: normal; padding: 40px 0 60px; float: left; width: 100%; color: #3c3a3a; }

/*-----------Default section 2-------------*/
.section-2-bg { background: linear-gradient(to right, transparent 0, transparent 47%, #028275 47%, #028275 100% ); width: 100%; padding: 0; border-bottom: solid 1px #fff; }

.section-2-left { position: relative; min-height: 450px; float: left; overflow: hidden; text-align: center; width: 47%; }

.section-2-right { float: left; padding: 150px 0; text-align: center; width: 47%; }

.section-2-bg div.section-button { background-color: #028275; }

.short-bar-white2 { width: 50px; height: 1px; background-color: #fff; margin: 40px auto; clear: left; }

.go-top-button-div { position: absolute; height: 52px; width: 94%; bottom: 20px; }

.go-top-button { border-radius: 60px; box-shadow: 2px 3px 2px #333; background: url(Images/web2015/Button/arrow-bottom.png) no-repeat center center; width: 52px; height: 52px; display: table; margin: 0 auto; -webkit-transition: background 0.5s linear; transition: background 0.5s linear; }

    .go-top-button.sec-1 { background-color: #357FD3; }

    .go-top-button.sec-2 { background-color: #028275; }

    .go-top-button:hover { background-color: #111; -webkit-transition: background 0.5s linear; transition: background 0.5s linear; }

/*-----------Default section 3-------------*/
.section-3-bg { background-color: #323d43; padding: 50px 0; border-bottom: solid 1px #fff; }

.section-3-center { position: relative; text-align: center; width: 100%; float: right; }

.section-3-bg .section-button-div { margin-top: 40px; }

.section-3-bg h1 { margin-bottom: 0; }
/*-----------Default section 4-------------*/
.section-4-bg { background-color: #2a5fef; padding: 40px 0; border-bottom: solid 1px #fff; }

.section-4-center { position: relative; text-align: center; }

.section-4-bg .section-button-div { margin-top: 40px; }

.section-4-bg h1 { margin-bottom: 0; }

.section-4-clientmap { position: relative; z-index: 0; margin: 30px auto 0; width: 700px; height: 350px; }

.section-4-map { position: relative; z-index: 0; }

.section-4-client1, .section-4-client2, .section-4-client3 { position: absolute; z-index: 1; left: 0; top: 5px; }

.section-4-map { position: relative; z-index: 0; width: 700px; height: 350px; background: url(Images/web2015/Background/sec-4-map.png) no-repeat center top; position: absolute; -webkit-transition: background .5s linear; -moz-transition: background .5s linear; transition: background .5s linear; }

.section-4-client1 { width: 700px; height: 350px; background: url(Images/web2015/Background/sec-4-client1.png) no-repeat center top; -webkit-transition: background 1s linear; -moz-transition: background 1s linear; transition: background 1s linear; -moz-animation: toBottom 3s linear infinite; /* Firefox */ -webkit-animation: toBottom 3s linear infinite; /* Safari and Chrome */ -o-animation: toBottom 3s linear infinite; /* Opera */ animation: toBottom 3s linear infinite; }

.section-4-client2 { width: 700px; height: 350px; background: url(Images/web2015/Background/sec-4-client2.png) no-repeat center top; -webkit-transition: background 1s linear; -moz-transition: background 1s linear; transition: background 1s linear; -moz-animation: toBottom 3s infinite; /* Firefox */ -webkit-animation: toBottom 3s infinite; /* Safari and Chrome */ -o-animation: toBottom 3s infinite; /* Opera */ z-index: 0; animation-delay: 2.5s; -webkit-animation-delay: 2.5s; -moz-animation-delay: 2.5s; animation: toBottom 3s infinite; }

.section-4-client3 { width: 700px; height: 350px; background: url(Images/web2015/Background/sec-4-client3.png) no-repeat center top; -webkit-transition: background 1s linear; -moz-transition: background 1s linear; transition: background 1s linear; -moz-animation: toBottom 3s infinite; /* Firefox */ -webkit-animation: toBottom 3s infinite; /* Safari and Chrome */ -o-animation: toBottom 3s infinite; /* Opera */ animation: toBottom 3s infinite; -webkit-animation-delay: 3.5s; -moz-animation-delay: 3.5s; animation-delay: 3.5s; }


/*-----------Default section 5-------------*/
.section-5 { clear: left; float: left; width: 100%; position: relative; }

.section-5-bg { min-height: 500px; position: relative; z-index: 0; clear: left; background-color: #fff; background-position: right top; background-repeat: no-repeat; border-bottom: solid 2px #f2f3f5; width: 100%; }

    .section-5-bg.bg1 { background-image: url(Images/web2015/Banner/banner-partnership-1.jpg); }

    .section-5-bg.bg2 { background-image: url(Images/web2015/Banner/banner-partnership-2.jpg); }

.section-5-inner { width: 100%; }

.section-5-left { position: relative; min-height: 450px; float: left; width: 70%; padding: 60px 0 20px; margin-left: 20px; }

.section-5-inner .title { text-align: left; font-size: 60px; line-height: 64px; font-family: ThaiSansNeueBold; color: #1c1c1c; font-weight: normal; text-shadow: 1px 1px 2px #fff; margin-left: 10px; }

.section-5-inner .title-detail { clear: left; text-align: left; font-size: 24px; line-height: 24px; font-family: ThaiSansNeueBold; color: #1c1c1c; margin-left: 10px; margin-top: 30px; }

.section-5-inner .banner-button1 { margin-top: 20px; }

.section-5-form { clear: left; float: left; width: 100%; border-top: solid 1px #4e4242; }

.section-5 .Highlight1NoEffect { color: #2196f3; }

.section-5 .active .Highlight1 { -webkit-animation-name: FontHightlight1; -webkit-animation-timing-function: ease-out; -webkit-animation-duration: 20s; -webkit-animation-delay: 0s; -webkit-animation-iteration-count: infinite; animation-name: FontHightlight1; animation-timing-function: ease-out; animation-iteration-count: infinite; animation-duration: 20s; animation-delay: 0s; }

.section-5 .active .Highlight2 { -webkit-animation-name: FontHightlight2; -webkit-animation-timing-function: ease-out; -webkit-animation-duration: 20s; -webkit-animation-delay: 0s; -webkit-animation-iteration-count: infinite; animation-name: FontHightlight2; animation-timing-function: ease-out; animation-iteration-count: infinite; animation-duration: 20s; animation-delay: 0s; }


@keyframes BgPatner {
    0% { opacity: 1; }

    45% { opacity: 1; }

    55% { opacity: 0; }

    100% { opacity: 0; }
}

@-webkit-keyframes BgPatner {
    0% { opacity: 1; }

    45% { opacity: 1; }

    55% { opacity: 0; }

    100% { opacity: 0; }
}

@-ms-keyframes BgPatner {
    0% { opacity: 1; }

    45% { opacity: 1; }

    55% { opacity: 0; }

    100% { opacity: 0; }
}

@-moz-keyframes BgPatner {
    0% { opacity: 1; }

    45% { opacity: 1; }

    55% { opacity: 0; }

    100% { opacity: 0; }
}

@keyframes FontHightlight1 {
    0% { color: #1c1c1c; }

    20% { color: #2196f3; }

    100% { color: #2196f3; }
}

@-webkit-keyframes FontHightlight1 {
    0% { color: #1c1c1c; }

    20% { color: #2196f3; }

    100% { color: #2196f3; }
}

@-ms-keyframes FontHightlight1 {
    0% { color: #1c1c1c; }

    20% { color: #2196f3; }

    100% { color: #2196f3; }
}

@-moz-keyframes FontHightlight1 {
    0% { color: #1c1c1c; }

    20% { color: #2196f3; }

    100% { color: #2196f3; }
}

@keyframes FontHightlight2 {
    0% { color: #1c1c1c; }

    20% { color: #00c853; }

    100% { color: #00c853; }
}

@-webkit-keyframes FontHightlight2 {
    0% { color: #1c1c1c; }

    20% { color: #00c853; }

    100% { color: #00c853; }
}

@-ms-keyframes FontHightlight2 {
    0% { color: #1c1c1c; }

    20% { color: #00c853; }

    100% { color: #00c853; }
}

@-moz-keyframes FontHightlight2 {
    0% { color: #1c1c1c; }

    20% { color: #00c853; }

    100% { color: #00c853; }
}
/*-----------Default section 6 -------------*/
.section-6-bg { background-color: #f7f8f9; padding: 40px 0; border-top: solid 1px #e5e5e5; border-bottom: solid 1px #e5e5e5; }

.section-6-form { }

@keyframes toBottom {
    0% { opacity: 0.2; }

    50% { opacity: 1; }

    80% { opacity: 0.2; }

    100% { opacity: 0; top: 0; }
}

@-webkit-keyframes toBottom {
    0% { opacity: 0.2; }

    50% { opacity: 1; }

    80% { opacity: 0.2; }

    100% { opacity: 0; top: 0; }
}

@-ms-keyframes toBottom {
    0% { opacity: 0.2; }

    50% { opacity: 1; }

    80% { opacity: 0.2; }

    100% { opacity: 0; top: 0; }
}

@-moz-keyframes toBottom {
    0% { opacity: 0.2; }

    50% { opacity: 1; }

    80% { opacity: 0.2; }

    100% { opacity: 0; top: 0; }
}

@keyframes toTop {
    0% { opacity: 0; }

    100% { opacity: 1; bottom: 0; }
}

@-webkit-keyframes toTop {
    0% { opacity: 0; }

    100% { opacity: 1; bottom: 0; }
}

@-ms-keyframes toTop {
    0% { opacity: 0; }

    100% { opacity: 1; bottom: 0; }
}

@-moz-keyframes toTop {
    0% { opacity: 0; }

    100% { opacity: 1; bottom: 0; }
}


/*-----button effect : border slide-----*/
.section-button-div { display: table; margin: 0 auto; }

.btn-section { position: relative; color: #fbe9e7; display: block; text-align: center; font-family: ThaiSansNeue; height: 50px; line-height: 46px; font-size: 24px; }

div.section-button { width: 200px; height: 50px; position: relative; background: transparent; -webkit-transition: background 0.5s linear; -moz-transition: background 0.5s linear; transition: background 0.5s linear; overflow: hidden; }

    div.section-button:hover { }

.btn-section:hover { color: #fff; }

svg { position: absolute; top: 0; left: 0; }

    svg line { stroke-width: 2; fill: none; stroke-dasharray: 200; -webkit-transition: -webkit-transform .6s; -moz-transition: -moz-transform .6s; transition: transform .6s; }
        /* height for vertical + horizontal border*/
        svg line.left, svg line.right { stroke-dasharray: 50; }
/* height for vertical border*/

div.section-button:hover svg line.top { -webkit-transform: translateX(-400px); -moz-transform: translateX(-400px); transform: translateX(-400px); }

div.section-button:hover svg line.bottom { -webkit-transform: translateX(400px); -moz-transform: translateX(400px); transform: translateX(400px); }

div.section-button:hover svg line.left { -webkit-transform: translateY(100px); -moz-transform: translateY(100px); transform: translateY(100px); }

div.section-button:hover svg line.right { -webkit-transform: translateY(-100px); -moz-transform: translateY(-100px); transform: translateY(-100px); }

/*----for  section 1-----*/
svg.section-1-button line { stroke: #588fe7; }

div.section-button:hover svg.section-1-button line { stroke: #dbe7fa; }

/*----for  section 2-----*/
svg.section-2-button line { stroke: #646875; }

div.section-button:hover svg.section-2-button line { stroke: #646875; }

/*----for  section 3-----*/
svg.section-3-button line { stroke: #727c81; }

div.section-button:hover svg.section-3-button line { stroke: #c2ccd1; }

/*----for  section 4-----*/
svg.section-4-button line { stroke: #798bfc; }

div.section-button:hover svg.section-4-button line { stroke: #e7eafc; }

.btn-section-2 { position: relative; color: #1a1a1a; display: block; text-align: center; font-family: ThaiSansNeue; height: 50px; line-height: 46px; font-size: 24px; }

    .btn-section-2:hover { color: #357FD3; }
/*------------  Footer ----------------*/
.footer-nav-list { list-style: none; padding-bottom: 15px; clear: left; }
    /* Navigation Menu - List items */
    .footer-nav-list .logo { position: relative; }

        .footer-nav-list .logo a { background: url(Images/web2017/Background/logo.svg) no-repeat left top/auto 36px; height: 50px; display: block; text-decoration: none; }

    .footer-nav-list .phone-contact { font-family: ThaiSansNeue; height: 40px; line-height: 40px; font-size: 26px; color: #f0f0f0; border: 0; padding-left: 0; margin-left: 0; margin-bottom: 15px; }

    .footer-nav-list .license { color: #bcbcbc; font-family: ThaiSansNeueBold; font-size: 24px; line-height: 18px; margin-top: 15px; padding-top: 15px; background: url(Images/Web2015/Background/footer-border.png) no-repeat left top; clear: left; padding-left: 0; }

        .footer-nav-list .license a { color: #f7941d; font-size: 26px; }

.LayoutFooter ul.footer-link-social { border: none; margin-top: 10px; }

    .LayoutFooter ul.footer-link-social .common-button { margin-top: 25px; margin-right: 0; }

.wrapper { position: relative; }

.lic-copyright { font-family: Prompt-Regular; font-size: 10px; color: #454545; text-align: center; line-height: 22px; }
/* Banner */
.banner-button-div { position: absolute; bottom: 30px; width: 100%; }

.banner-button { display: table; margin: auto; }

    .banner-button.toLeft { margin-left: 0; }

.banner-button-div1 { position: absolute; top: 25%; left: 2%; width: 100%; }

.banner-text { display: table; margin: 0 0 50px; }

.banner-button1 { display: table; margin: 0; clear: both; }

    .banner-button a, .banner-button1 a { height: 50px !important; line-height: 46px !important; min-width: 150px !important; text-align: center; font-size: 24px; padding: 0 20px !important; margin: 0 10px 0 0; width: auto !important; }

        .banner-button a.wide, .banner-button1 a.wide { }

.banner-button2 { display: table; margin: 18px auto 0; }

    .banner-button2 a { height: 46px; line-height: 43px; width: 177px; text-align: center; font-size: 20px; padding: 0; margin: 12px 0; }

.banner-demo-div { position: absolute; top: 20%; width: 100%; text-align: center; }

.banner-demo-text { display: table; margin: 0 auto 30px; }

.banner-features-div1 { position: absolute; top: 20%; width: 100%; text-align: center; }

.banner-features-div2 { width: 38%; float: right; }

    .banner-features-div2 .banner-button a { margin-left: 0; }

.banner-features-text { display: table; margin: 0 auto 30px 0; text-align: left; }

.banner-features-button { position: absolute; top: 25%; width: 100%; }

.banner-features-text .title { font-size: 42px; }

.banner-features-text .subtitle { margin-top: 15px; font-size: 32px; }

.banner-pricing-div { position: absolute; top: 20%; width: 100%; text-align: center; }
/* Features */
.features-button { float: right; width: 15%; margin-top: 10px; }

    .features-button a { height: 50px; line-height: 46px; width: 150px; text-align: center; font-size: 24px; padding: 0; margin: 0; float: right; }

.base-banner { padding: 60px 0; text-align: center; background: url("Images/Banner/banner-feature.jpg") no-repeat scroll center top; margin: 0; }

/*Help-Content Banner */
.banner-help-text { display: table; margin: 20px auto; font-size: 42px; font-weight: bold; line-height: 55px; color: #000; }

.banner-help-div { position: absolute; top: 30%; width: 100%; text-align: center; }
/* --- Demo  --- */
.WebsiteDemoBanner { width: 100%; height: 450px; margin: 0; background: url(Images/Banner/banner-website-demo.jpg) no-repeat center center; }

.demo { clear: left; float: left; width: 100%; padding: 50px 0 70px; background: linear-gradient(#f9f8f7, #fff,#f9f8f7); }

    .demo ul { list-style-type: none; padding: 0; margin: 10px auto; padding-left: 10px; display: table; }

        .demo ul li { background: url(Images/Web2015/Bullet/demo-bullet.png) no-repeat left 14px; color: #010201; padding-left: 18px; line-height: 30px; font-size: 24px; float: left; margin-right: 15px; text-align: left; }

.demo-button-div { display: table; clear: left; width: auto; margin: 15px auto 0; }

.demo-button { height: 60px; line-height: 55px; border: solid 1px #010201; padding: 10px 0; text-align: center; width: 220px; font-family: ThaiSansNeue; font-size: 24px; transition: all 0.5s linear; color: #010201; background: #fff; }

    .demo-button:hover { color: #fff; background: #010201; border: solid 1px #010201; transition: all 0.5s linear; }

.demo-store-button { float: left; margin: 10px 25px; }

.demo-admin-button { float: left; margin: 10px 25px; }

    .demo-admin-button h6 { font-weight: normal; line-height: 28px; margin: 0; }

.demouser { clear: left; float: left; margin-top: 20px; }


.bg-pricing .free-table { width: 60%; display: table; margin: auto; }

    .bg-pricing .free-table .pricing-row-title { margin-top: 0; }

    .bg-pricing .free-table .feature-info { width: 60%; }

    .bg-pricing .free-table .pricing-version-info { width: 40%; }

        .bg-pricing .free-table .pricing-version-info .pricing-row-head1 { border-right: solid 1px #a0a0a0; }

.bg-pricing .business-table { width: 80%; display: table; margin: auto; }

    .bg-pricing .business-table .pricing-row-title { margin-top: 0; }

    .bg-pricing .business-table .feature-info { width: 40%; }

    .bg-pricing .business-table .pricing-version-info { width: 30%; }

    .bg-pricing .business-table .pricing-row-price .price-item { clear: left; margin-bottom: 20px; }

        .bg-pricing .business-table .pricing-row-price .price-item a { line-height: 40px; display: block; width: 100%; text-align: center; font-size: 30px; }

.CommonProductItemStyle.ProductListItemColumn { width: 49%; margin: 20px 0; }


/*pricing Banner */
.pricing-banner { background-color: #FBFBFB; }

    .pricing-banner .banner-features-text { font-size: 42px; line-height: 42px; font-weight: bold; padding: 0 0 0 10px; }

.business-banner { background: #e7e7e8 url(Images/web2015/banner/business-banner.jpg) no-repeat center top; height: 555px; }

    .business-banner .banner-features-text { font-size: 40px; line-height: 42px; padding: 0; font-family: ThaiSansNeueBold; }

    .business-banner .banner-features-div1 { top: 28%; }
/*eCommerce Banner */
.ecommerce-banner { background-color: #FBFBFB; }

    .ecommerce-banner .banner-features-text { font-size: 42px; line-height: 42px; font-weight: bold; padding: 0 0 0 10px; font-weight: 300; }

/*Onlineshop Banner*/
.onlineshop-banner { background-color: #FEFEFC; }

.banner-onlineshop-div { margin-top: 30px; }

    .banner-onlineshop-div .banner-button1 a { width: auto !important; }

.onlineshop-banner .banner-onlineshop-text { font-size: 42px; line-height: 42px; font-weight: bold; padding: 0 0 30px 10px; text-align: left; width: 100%; }

/*Blog-Content Banner */
.banner-blog-text { display: table; margin: 0 auto 20px 30px; font-size: 38px; font-weight: bold; line-height: 60px; text-align: left; color: #000; }

.banner-blog-div { position: absolute; top: 30%; width: 100%; }

    .banner-blog-div .banner-button { margin-left: 20px; }

/* specific - product list banner */

.DesignBanner { background: #6E4D34 url(Images/web2015/Banner/banner-design-service.jpg) no-repeat center top; height: 555px; }

.CatalogBanner { background: url(Images/web2015/Banner/banner-catalog.jpg) no-repeat center top; height: 555px; }
/*-----template----*/
.template-banner .banner-button-div { bottom: 50px; }

/*-----design----*/
.design-banner .banner-button-div { bottom: 18%; }

.design-banner .banner-button { width: 35%; margin-right: 0; }

    .design-banner .banner-button a { display: table; float: none; margin: auto; }

.design-banner { height: 550px; background: url(Images/web2015/Banner/banner-design.jpg) no-repeat center top; background-size: auto 100%; }

    .design-banner img { display: none; }
/* -----our client-----*/
.CustomerSite { padding: 30px 0; }

.client-banner .banner-button-div { bottom: 30px; }

.ClientViewMore { clear: left; float: left; margin: 0; position: absolute; width: 100%; height: 180px; top: 0; display: none; }

.ClientViewMoreLink { font-size: 30px; color: #fff; display: block; width: 250px; height: 180px !important; line-height: 180px; transition: background 0.5s ease-out; }

    .ClientViewMoreLink:hover { background: rgba(37,74,195,0.8); color: #fff; transition: background 0.5s ease-out; }

.CustomerSite div.CommonProductImage:hover .ClientViewMore { display: block; }

/*-----service----*/
.Service { padding: 30px 0 0; }

.service-banner .banner-button-div { bottom: 20%; }

.Service .title { font-size: 48px; font-family: ThaiSansNeueBold; text-transform: uppercase; line-height: 40px; font-weight: bold; }

.Service .subtitle { font-size: 30px; }

.Service .title-detail { margin-bottom: 30px; font-size: 17px; font-family: CSPraJad; line-height: 28px; }

.Service .text-col { padding: 35px 0; }

.bg-service-1 { background: #F8F7F5 url(Images/web2015/Banner/bg-service1.jpg) no-repeat left center; background-size: 62% auto; text-align: center; border-bottom: solid 2px #fff; }

.bg-service-2 { background: #F4F4F2 url(Images/web2015/Banner/bg-service2.jpg) no-repeat right center; background-size: auto 100%; text-align: center; border-bottom: solid 2px #fff; }

.bg-service-3 { background: #F8F7F5 url(Images/web2015/Banner/bg-service3.jpg) no-repeat left center; background-size: 62% auto; text-align: center; border-bottom: solid 2px #fff; }


.bg-service-1 .title { background: url(Images/web2015/Banner/bg-service-icon1.jpg) no-repeat center top; padding-top: 95px; }

.bg-service-2 .title { background: url(Images/web2015/Banner/bg-service-icon2.jpg) no-repeat center top; padding-top: 95px; }

.bg-service-3 .title { background: url(Images/web2015/Banner/bg-service-icon3.jpg) no-repeat center top; padding-top: 95px; }

.Service .banner-button a { width: auto; padding: 0 25px; }
/*----free ecommerce -----*/
.free-section { color: #3c3a3a; }

    .free-section section { clear: left; }

    .free-section .title { font-size: 36px; margin: 30px 0; font-family: ThaiSansNeueBold; }

    .free-section .subtitle { font-size: 26px; margin: 30px 0; line-height: 30px; }

    .free-section .title-detail { font-size: 20px; font-family: ThaiSansNeue; margin: 30px 0; line-height: 28px; }

    .free-section .title-detail-sec { margin-bottom: 30px; }

    .free-section .font60 { font-weight: normal; }

    .free-section .banner-button1 a { margin-left: 0; }

    .free-section .Highlight1 { -webkit-animation-name: FontHightlight1; -webkit-animation-timing-function: ease-in-out; -webkit-animation-duration: 10s; -webkit-animation-delay: 0s; -webkit-animation-iteration-count: infinite; animation-name: FontHightlight1; animation-timing-function: ease-in-out; animation-iteration-count: infinite; animation-duration: 10s; animation-delay: 0s; }

    .free-section .Highlight2 { -webkit-animation-name: FontHightlight2; -webkit-animation-timing-function: ease-in-out; -webkit-animation-duration: 10s; -webkit-animation-delay: 0s; -webkit-animation-iteration-count: infinite; animation-name: FontHightlight2; animation-timing-function: ease-in-out; animation-iteration-count: infinite; animation-duration: 10s; animation-delay: 0s; }


.bg-free-1 { background: #f9f8f7 url(Images/Web2015/Banner/bg-free-1.jpg) no-repeat center top; min-height: 186px; clear: left; }

    .bg-free-1 .title { font-size: 48px; font-family: ThaiSansNeueBold; color: #3c3a3a; line-height: 50px; margin-top: 70px; font-weight: bold; }


.bg-free-2 { background-color: #f5fbfd; background: url(Images/web2015/banner/bg-free-2.jpg) center bottom no-repeat; background: url(Images/web2015/banner/bg-free-2.jpg) center bottom no-repeat, -moz-linear-gradient(top, #fff, #f5fbfd); background: url(Images/web2015/banner/bg-free-2.jpg) center center no-repeat, -webkit-gradient(linear, 0 0, 0 100%, from(#fff), to(#f5fbfd)); background: url(Images/web2015/banner/bg-free-2.jpg) center bottom no-repeat, -webkit-linear-gradient(top, #fff, #f5fbfd); background: url(Images/web2015/banner/bg-free-2.jpg)center bottom no-repeat, -o-linear-gradient(top, #fff, #f5fbfd); background: url(Images/web2015/banner/bg-free-2.jpg) center bottom no-repeat, linear-gradient(to bottom, #fff, #f5fbfd); background-size: auto 85%; clear: left; }

    .bg-free-2 .title { font-size: 48px; line-height: 50px; }

    .bg-free-2 .text-col { text-align: left; font-weight: normal; padding: 30px 0 60px; float: right; width: 45%; text-shadow: 1px 0 0 #fff; }

.bg-free-3 { background-color: #ededed; background: -moz-linear-gradient(top, #fff, #ededed); background: -webkit-gradient(linear, 0 0, 0 100%, from(#fff), to(#ededed)); background: -webkit-linear-gradient(top, #fff, #ededed); background: -o-linear-gradient(top, #fff, #ededed); background: linear-gradient(to bottom, #fff, #ededed); }

    .bg-free-3 .row { background: url(Images/web2015/banner/bg-free-3.png) no-repeat right bottom; background-size: 50% auto; }

    .bg-free-3 .text-col { text-align: left; font-weight: normal; padding: 30px 0 50px; float: left; width: 40%; margin-left: 3%; }

    .bg-free-3 ul { list-style: none; padding: 0; margin: 20px 0; }

        .bg-free-3 ul li { background: url(Images/web2015/Bullet/bullet-blue.png) no-repeat left 12px; padding-left: 18px; line-height: 28px; font-weight: bold; }

.bg-free-4 { background-color: #e4f3fd; background: -moz-linear-gradient(top, #e4f3fd, #cbe9fd); background: -webkit-gradient(linear, 0 0, 0 100%, from(#e4f3fd), to(#cbe9fd)); background: -webkit-linear-gradient(top, #e4f3fd, #cbe9fd); background: -o-linear-gradient(top, #e4f3fd, #cbe9fd); background: linear-gradient(to bottom, #e4f3fd, #cbe9fd); }

    .bg-free-4 .row { background: url(Images/Web2015/Banner/bg-free-4.png) no-repeat 0 bottom; background-size: 55% auto; }

    .bg-free-4 .text-col { text-align: left; font-weight: normal; padding: 100px 0 120px; float: right; width: 40%; }

.bg-free-5 { background: #f9fcfe url(Images/Web2015/Banner/bg-free-5.jpg) no-repeat center bottom; min-height: 500px; }

    .bg-free-5 .text-col { text-align: left; font-weight: normal; padding: 60px 0; float: right; width: 40%; }
    .bg-free-5 .h1-title { font-size: 54px; font-family: ThaiSansNeueBlack; background: url(Images/Web2018/Icon/new-label.png) no-repeat right top; height: 116px; line-height: 66px; padding-top: 50px; padding-right: 120px; }
    .bg-free-5 .subtitle { font-size: 30px; }
.bg-free-6 { background-color: #357FD3; padding: 30px 0; }

    .bg-free-6 .row { background: url(Images/Web2015/Background/takra-logo-white3.png) no-repeat left center; min-height: 55px; line-height: 55px; }

    .bg-free-6 .text-col { text-align: left; font-weight: normal; padding: 0; float: right; width: 80%; }

    .bg-free-6 .title { float: left; margin: 0; border-left: solid 1px #b2bfea; border-right: solid 1px #b2bfea; padding: 5px 35px; font-weight: bold; }

    .bg-free-6 .subtitle-div { float: left; padding: 0 35px; }

    .bg-free-6 .subtitle { float: left; margin: 0; color: #fff; }

    .bg-free-6 .banner-button { float: right; margin: 5px 0 5px 20px; }

        .bg-free-6 .banner-button a { width: 170px; }


.bg-free-7 { background: #f1f1f5 url(Images/web2015/background/bg-free-7-main.png) repeat-x left bottom; }

    .bg-free-7 .bg-free-inner { width: 100%; background: url(Images/web2015/banner/bg-free-7.png) left bottom no-repeat; background-size: auto 95%; }

    .bg-free-7 .text-col { text-align: left; font-weight: normal; padding: 100px 0 130px; float: right; width: 40%; }

.bg-free-8 { background: #fffefd url(Images/Web2015/Banner/bg-free-8.jpg) no-repeat center top; background-size: 100% auto; }

    .bg-free-8 .row { background: url(Images/Web2015/Banner/bg-free-8.png) no-repeat 0 bottom; }

    .bg-free-8 .text-col { text-align: left; font-weight: normal; padding: 100px 0 150px; float: right; width: 40%; }

    .bg-free-8 .title { font-size: 48px; text-transform: uppercase; margin-bottom: 10px; font-weight: bold; }

    .bg-free-8 .subtitle { margin-top: 10px; }

.bg-free-9 { background-color: #faf9f9; background: -moz-linear-gradient(top, #dfdfdf, #faf9f9); background: -webkit-linear-gradient(top, #dfdfdf, #faf9f9); background: -webkit-linear-gradient(top, #dfdfdf, #faf9f9); background: -o-linear-gradient(top, #dfdfdf, #faf9f9); background: linear-gradient(to bottom, #dfdfdf, #faf9f9); padding: 20px 0; }

    .bg-free-9 .title { margin-bottom: 0; }

    .bg-free-9 .title1 { font-size: 48px; text-transform: uppercase; font-weight: bold; }

    .bg-free-9 .banner-button { margin-top: 30px; margin-bottom: 30px; }

.bg-free-10 { background-color: #fff; background: -moz-linear-gradient(top, #cdcdcd, #fff); background: -webkit-linear-gradient(top, #cdcdcd, #fff); background: -webkit-linear-gradient(top, #cdcdcd, #fff); background: -o-linear-gradient(top, #cdcdcd, #fff); background: linear-gradient(to bottom, #cdcdcd, #fff); padding: 40px 0 20px; color: #2aaf3c; }

    .bg-free-10 .title { font-size: 48px; text-transform: uppercase; font-weight: bold; margin-bottom: 0; margin-top: 0; color: #030303; }

    .bg-free-10 .subtitle { background: url("Images/web2015/Background/bg-product-title.png") no-repeat center bottom; padding-bottom: 30px; margin-top: 0; color: #030303; }

    .bg-free-10 ul.list-3-col { list-style: none; text-align: left; margin: 30px 0 30px 10%; width: 90%; }

        .bg-free-10 ul.list-3-col li { background: url(Images/web2015/Bullet/bullet-green.png) no-repeat left 10px; padding-left: 22px; line-height: 22px; min-height: 45px; color: #2aaf3c; font-size: 18px; font-weight: bold; }

            .bg-free-10 ul.list-3-col li a { color: #2aaf3c; font-size: 18px; font-weight: bold; }

                .bg-free-10 ul.list-3-col li a:hover { text-decoration: underline; }

.bg-free-11 { background: #f9fcfe url(Images/Web2015/Banner/bg-free-11.jpg) no-repeat right top; background-size: auto 100%; }

    .bg-free-11 .text-col { text-align: left; font-weight: normal; padding: 30px 0 70px; float: left; width: 42%; }


.bg-free-12 { position: relative; }

.bg-free-12-banner { background: url(Images/Web2015/Banner/bg-free-12.jpg) no-repeat center top; background-size: cover; width: 100%; position: relative; height: 420px; }

.bg-free-12 .bg-free-inner { position: relative; height: 100%; }

.bg-free-12 .row { position: relative; height: 100%; }

.bg-free-12 .text-col { position: absolute; top: 8%; right: 20px; text-align: right; }

.free-section .bg-free-12 .banner-button1 { float: right; }

    .free-section .bg-free-12 .banner-button1 a.common-btn15 { margin-left: 10px; margin-top: 5px; width: auto; padding: 0 25px; }

.bg-free-12 .title { font-size: 48px; font-weight: bold; }

.bg-free-12-trial { position: absolute; width: 100%; z-index: 1; bottom: 0; }

    .bg-free-12-trial .row .row { margin: 0; }

.bg-free-13 { clear: left; background: #fefefe url(Images/Web2015/Banner/bg-free-13.jpg) no-repeat center top; background-size: auto 100%; padding: 50px 0 0; min-height: 700px; }

    .bg-free-13 .row { background: url(Images/new-header/TakraOnline_logo.svg) no-repeat center top; background-size: auto 50px; padding-top: 20px; }

.free-section .bg-free-13 .title { margin-bottom: 10px; }

.bg-free-13 .subtitle { text-align: center; width: 100%; margin-top: 20px; font-size: 36px; }

.bg-free-14 { background: #f9fcfe url(Images/Web2015/Banner/bg-free-14.jpg) no-repeat center top; background-size: cover; }

    .bg-free-14 .text-col { text-align: left; font-weight: normal; padding: 150px 0; float: left; width: 42%; }

.bg-free-15 { background-color: #357FD3; color: #fff; padding: 50px 0; }

    .bg-free-15 .row { background: url(Images/new-header/TakraOnline_logo.svg) no-repeat center top; background-size: auto 50px; padding-top: 40px; }

.bg-free-16 { background: #f9f8f7 url(Images/Web2015/Banner/bg-free-16.jpg) no-repeat left bottom; background-size: 75% auto; }

    .bg-free-16 .text-col { text-align: left; font-weight: normal; padding: 100px 0 130px; float: right; width: 40%; }

.bg-free-17 { background-color: #fff; border-top: solid 6px #f2f3f5; border-bottom: solid 5px #f2f3f5; }

    .bg-free-17 .text-col { text-align: left; font-weight: normal; padding: 30px 80px 300px; background-position: center bottom; background-repeat: no-repeat; float: left; }

        .bg-free-17 .text-col.language { background-image: url(Images/Web2015/Banner/bg-free-17-1.jpg); }

        .bg-free-17 .text-col.payment { background-image: url(Images/Web2015/Banner/bg-free-17-2.jpg); border-left: solid 6px #f2f3f5; }

.bg-free-18 { background: #f2f1f1 url(Images/Web2015/Banner/bg-free-18.jpg) no-repeat 15% bottom; }

    .bg-free-18 .text-col { text-align: left; font-weight: normal; padding: 20px 0; float: right; width: 42%; }

    .bg-free-18 .title { margin-bottom: 10px; }

    .bg-free-18 .subtitle { margin-top: 10px; font-size: 30px; }

.bg-free-19 { background-color: #f0f3f5; background: -moz-linear-gradient(top, #f0f3f5, #777c7f); background: -webkit-gradient(linear, 0 0, 0 100%, from(#f0f3f5), to(#777c7f)); background: -webkit-linear-gradient(top, #f0f3f5, #777c7f); background: -o-linear-gradient(top, #f0f3f5, #777c7f); background: linear-gradient(to bottom, #f0f3f5, #777c7f); border-top: solid 2px #fff; }

    .bg-free-19 .row { background: url(Images/Web2015/Banner/bg-free-19.png) no-repeat 0 95%; padding-bottom: 220px; background-size: 70% auto; }

    .bg-free-19 .text-col { text-align: left; font-weight: normal; padding: 40px 80px 120px; float: left; }

    .bg-free-19 .five.text-col { padding: 20px; }

    .bg-free-19 ul.list-1-col { list-style: none; }

        .bg-free-19 ul.list-1-col li { background: url(Images/Web2015/Bullet/icon-check.png) no-repeat left 0; font-size: 17px; padding-left: 35px; margin: 2px 0; }
/*----takraonline business page---*/
.free-section.business .subtitle { margin: 30px 0 0; }

.free-section.business .title-detail { margin: 10px 0; }

.bg-business-1 { background: #fafafa url(Images/Web2015/Banner/bg-business-1.jpg) no-repeat center bottom; background-size: cover; padding: 30px 0 0; min-height: 780px; }

    .bg-business-1 .title-detail { font-size: 20px; }

.bg-business-2 { background-color: #357FD3; color: #fff43c; padding: 30px 0 60px; }

    .bg-business-2 .title-detail { color: #fff; font-size: 18px; }

.bg-business-3 { background: #f2f1f1 url(Images/Web2015/Banner/bg-business-3.jpg) no-repeat 15% bottom; }

    .bg-business-3 .text-col { text-align: left; font-weight: normal; padding: 30px 0; float: right; width: 42%; }

.free-section.business .bg-business-3 .title { margin-bottom: 15px; }

.free-section.business .bg-business-3 .subtitle { margin: 20px 0; }

.bg-business-4 { background: #f9fcfe url(Images/Web2015/Banner/bg-business-4.jpg) no-repeat center top; background-size: cover; padding: 90px 0; color: #fff; border-top: solid 2px #fff; border-bottom: solid 2px #fff; }

.bg-business-5 { background: #f9fcfe url(Images/Web2015/Banner/bg-business-5.jpg) no-repeat center top; background-size: cover; min-height: 550px; }

    .bg-business-5 .text-col { text-align: left; font-weight: normal; padding: 150px 0; float: left; width: 42%; color: #fff; }

    .bg-business-5 .banner-button1 { margin-top: 30px; }

.free-section.business .bg-business-5 .title { margin-bottom: 0; }

.free-section.business .bg-business-5 .subtitle { margin: 10px 0 20px; }

/*Free web workshop*/
.free-section .bg-free-course4 { margin-top: 0; }

.bg-web-workshop1 { background: #f9f9f9 url(Images/Web2015/Banner/bg-workshop-1.jpg) no-repeat right top; background-size: auto 100%; }

    .bg-web-workshop1 .text-col { text-align: left; font-weight: normal; padding: 30px 0 70px; float: left; width: 40%; }

.bg-web-workshop2 { background-color: #f8f6f6; color: #202224; padding: 50px 0; text-align: center; border-top: solid 2px #fff; }

.bg-web-workshop3 { background-color: #357FD3; padding: 50px 0; text-align: center; border-top: solid 2px #fff; }

    .bg-web-workshop3 .title-blue { color: #78bffc; margin: 10px 0; }

    .bg-web-workshop3 .title-yellow { color: #eeff41; margin: 10px 0; }

.bg-web-workshop4 { background-color: #fff; color: #202224; padding: 20px 0; text-align: center; border-top: solid 2px #fff; }

    .bg-web-workshop4 .subtitle { margin-bottom: 30px; }

    .bg-web-workshop4 .text-col-1 { width: 25%; float: left; padding: 0 10px; text-align: center; }

    .bg-web-workshop4 .text-col-2 { width: 25%; float: left; padding: 0 10px; text-align: center; }

    .bg-web-workshop4 .text-col-3 { width: 25%; float: left; padding: 0 10px; text-align: center; }

    .bg-web-workshop4 .text-col-4 { width: 25%; float: left; padding: 0 10px; text-align: center; }

.bg-web-workshop5 { background-color: #fff; color: #202224; padding: 20px 0; }

    .bg-web-workshop5 .text-col-1 { width: 33.33%; }

    .bg-web-workshop5 .text-col-2 { width: 33.33%; }

    .bg-web-workshop5 .text-col-3 { width: 33.33%; }

    .bg-web-workshop5 .specialbox { background-color: #ff5722; text-align: center; padding: 20px 0; width: 100%; clear: left; float: left; margin-top: 20px; }

    .bg-web-workshop5 .specialbox-text { border-bottom: solid 3px #fff; color: #fff; display: table; font-size: 36px; font-weight: bold; line-height: 45px; margin: auto; }

.bg-web-workshop7 { background-color: #fff; color: #202224; padding: 25px 0; clear: left; float: left; width: 100%; }

    .bg-web-workshop7 .title-detail { margin: 5px 0; }

.bg-web-workshop6 { background-color: #f8f6f6; color: #202224; padding: 20px 0; }

    .bg-web-workshop6 .text-col-1 { width: 42%; }

    .bg-web-workshop6 .text-col-2 { width: 58%; }

    .bg-web-workshop6 .title { line-height: 36px; margin-bottom: 0; }

    .bg-web-workshop6 .OptionDropDownItem { background: #fff url("Images/Web2017/Bullet/product-detail-dropdown.png") no-repeat scroll 96% center; border: 2px solid #aba9a9; border-radius: 5px; height: 38px; overflow: hidden; }

    .bg-web-workshop6 select { background: none; border: 0; font-family: "ThaiSansNeue"; font-size: 20px; padding: 4px; line-height: 35px; width: 110%; }

    .bg-web-workshop6 .Option { float: left; border: 0; }

    .bg-web-workshop6 .OptionItemDetailsTop { clear: left; float: left; line-height: 25px; font-size: 17px; font-weight: normal; margin-bottom: 0; }

    .bg-web-workshop6 .OptionItemDetailsLeft { clear: left; }

    .bg-web-workshop6 .banner-button1 { float: left; margin-top: 45px; }

        .bg-web-workshop6 .banner-button1 a { border-radius: 25px; font-size: 20px; width: auto; padding: 0 30px; margin-left: 10px; height: 40px; line-height: 35px; }

/*trial form over banner*/
.trialStoreBanner { background-color: #F6F6F3; }

.trial-form-div { width: 100%; min-height: 100px; padding: 20px 0; margin: 0; clear: left; float: left; }

.trialStoreBanner .new-banner { top: 20%; }

.trialStoreBanner .Intro1 { font-size: 48px; font-family: ThaiSansNeue; color: #373526; line-height: 50px; font-weight: normal; text-shadow: none; }

.trial-form-div .row { background: rgba(9,9,9, 0.6); padding: 20px 0; }

.trial-form-banner { }

    .trial-form-banner .input { width: 25%; margin-right: 1%; float: left; min-height: 40px; position: relative; }

        .trial-form-banner .input.signup { margin-right: 0; width: 22%; text-align: center; }

        .trial-form-banner .input .Label { display: none; float: left; width: 30%; font-family: ThaiSansNeue; font-size: 26px; color: #1c1c1c; line-height: 40px; }

        .trial-form-banner .input .TextBox { width: 10%; position: relative; }

        .trial-form-banner .input .button-signup { letter-spacing: 1px; color: #fdf512; height: 40px; line-height: 36px; text-align: center; background-color: #357FD3; transition: background 0.5s ease-out; padding: 0 30px; border: solid 1px #357FD3; font-size: 24px; font-family: ThaiSansNeue; cursor: pointer; float: right; width: 100%; }

            .trial-form-banner .input .button-signup:hover { background-color: #4286f5; transition: background 0.5s ease-out; color: #fff; }

    .trial-form-banner input[type="text"] { border: solid 1px #4e4242; padding: 0 8px; font-size: 24px; font-family: ThaiSansNeue; color: #888; height: 40px; z-index: 1; background-color: #f0f0f0; }

        .trial-form-banner input[type="text"]:focus { color: #000; border: solid 1px #000; }

    .trial-form .validator-style, .trial-form-banner .validator-style { font-family: Tahoma; font-size: 14px; line-height: 20px; }
/*Online Shop page*/
.OnlineShopBanner { width: 100%; height: 300px; margin: 0; background: url(Images/Banner/banner-onlineshop.jpg) no-repeat center center; position: relative; }

.OnlineShop .BgType1 { background-color: #ededed; border-bottom: solid 1px #fff; padding: 40px 0; }

.OnlineShop .BgType2 { background-color: #fff; border-top: solid 1px #ddd; border-bottom: solid 1px #ddd; padding: 45px 0; color: #555; }

    .OnlineShop .BgType2 .font24 { font-size: 24px; }

    .OnlineShop .BgType2 .row { margin-top: 40px; margin-bottom: 40px; }

.OnlineShop .BgType3 { background-color: #13aefb; padding: 40px 0; color: #fff; }

.OnlineShop .BgType4 { background-color: #F9F8F6; }

.OnlineShop .BgType5 { background-color: #FEFEFE; }

.OnlineShop .BgType3.Type3WithImg { background: #13aefb url(Images/Banner/banner-onlineshop-starter.jpg) no-repeat center center; padding: 80px 0; background-size: auto 100%; }

    .OnlineShop .BgType3.Type3WithImg .title.font40 { font-size: 40px; }

.OnlineShop .txtCenter { text-align: center; }

.OnlineShop .txtRight { text-align: right; }

.OnlineShop .txtLeft { text-align: left; }

.OnlineShop h1, .OnlineShop .title { line-height: 48px; margin: 0 0 20px; padding-bottom: 0; font-size: 36px; font-family: "Prompt"; }


.OnlineShop .titleLargeBlue { color: #35baff !important; line-height: 40px; font-size: 36px; }

.OnlineShop .titleLargeWhite { color: #fff !important; line-height: 40px; font-size: 36px; }

.OnlineShop .titleLargeGray { color: #ededed !important; line-height: 40px; font-size: 36px; }

.OnlineShop .titleLargeDark { color: #535353 !important; line-height: 40px; font-size: 36px; }

    .OnlineShop .titleLargeBlue.mgb30,
    .OnlineShop .titleLargeDark.mgb30,
    .OnlineShop .titleLargeGray.mgb30 { margin-bottom: 30px; }

.OnlineShop h2 { color: #555; line-height: 36px; font-size: 36px; font-weight: bold; margin: 20px 0; }

.OnlineShop h3 { color: #555; line-height: 36px; font-size: 30px; font-weight: normal; margin: 15px 0; }

.OnlineShop .bigSize { font-weight: bold; }

.OnlineShop .txtWhite { color: #fff; margin: 10px 0; }

.OnlineShop .txtBlue { color: #35baff; margin: 0; }

.OnlineShop p { color: #555; line-height: 24px; font-size: 26px; margin: 15px 0; }

.OnlineShop .BgType3 h2, .OnlineShop .BgType3 h3, .OnlineShop .BgType3 p, .OnlineShop .BgType3 a { color: #fff; }


.OnlineShop img { margin: 15px auto; }

.OnlineShop .img-mg50 { margin: 50px auto; }

.OnlineShop .img-mg30 { margin: 30px auto; }

.OnlineShop .img-mgt20, .img-mgt20 { margin: 20px auto; }

.OnlineShop .img-mgt50 { margin: 50px auto 0; }

.OnlineShop .img-mgt30 { margin: 30px auto 0; }

.OnlineShop .img-pdt30b50 { padding-top: 30px; padding-bottom: 50px; }

.OnlineShop .less-gap { padding-bottom: 10px; margin-bottom: 10px; }

.OnlineShop ul.question-list, .OnlineShop ul.answer-list, .OnlineShop ul.hilight-list { list-style-type: none; }

    .OnlineShop ul.question-list li, .OnlineShop ul.answer-list li { background: url("Images/Web2017/Icon/icon-question.jpg") no-repeat left top; padding: 2px 0 12px 90px; margin: 0 0 15px; line-height: 28px; font-size: 20px; }

    .OnlineShop ul.answer-list li { background: url("Images/Web2017/Icon/icon-true.jpg") no-repeat left top; }

    .OnlineShop ul.hilight-list li { width: 13.5%; display: inline-block; text-align: center; line-height: 30px; margin: 30px 0; height: 220px; vertical-align: top; font-size: 23px; }

        .OnlineShop ul.hilight-list li a { width: 130px; height: 130px; display: table; background-position: center 0; background-repeat: no-repeat; background-size: 100% auto; margin: 0 auto 20px; font-size: 16px; }

            .OnlineShop ul.hilight-list li a.hilight-text { padding: 0; line-height: 24px; width: 100%; text-align: center; height: 70px; color: #555; }

            .OnlineShop ul.hilight-list li a.hilight-1 { background-image: url(Images/Web2017/Icon/img-feature-1.jpg); }

            .OnlineShop ul.hilight-list li a.hilight-2 { background-image: url(Images/Web2017/Icon/img-feature-2.jpg); }

            .OnlineShop ul.hilight-list li a.hilight-3 { background-image: url(Images/Web2017/Icon/img-feature-3.jpg); }

            .OnlineShop ul.hilight-list li a.hilight-4 { background-image: url(Images/Web2017/Icon/img-feature-4.jpg); }

            .OnlineShop ul.hilight-list li a.hilight-5 { background-image: url(Images/Web2017/Icon/img-feature-5.jpg); }

            .OnlineShop ul.hilight-list li a.hilight-6 { background-image: url(Images/Web2017/Icon/img-feature-6.jpg); }

            .OnlineShop ul.hilight-list li a.hilight-7 { background-image: url(Images/Web2017/Icon/img-feature-7.jpg); }

            .OnlineShop ul.hilight-list li a:hover { background-position: center 100%; }

.OnlineShop .MoreButton { line-height: 36px; padding: 10px 50px; display: table; margin: 30px auto; color: #555; border: solid 4px #9e9d9d; font-size: 30px; transition: all 0.5s ease-in-out; }

.OnlineShop .MoreButtonLight { border: solid 4px #e4e3e3; }

.OnlineShop .ButtonSide { margin-left: 0; }

.OnlineShop .MoreButton:hover { color: #35baff !important; border: solid 4px #35baff; transition: all 0.5s ease-in-out; }

.OnlineShop .MoreButtonWhite { border: solid 4px #fff; color: #fff; }

    .OnlineShop .MoreButtonWhite:hover { color: #555; border: solid 4px #555; }

.OnlineShop .NavyColor { color: #2c4887 !important; }

.OnlineShop .PriceLabel { background-color: #13aefb; color: #FFFFFF; font-weight: 500; height: 50px; line-height: 50px; width: 120px; display: inline-block; font-size: 26px; margin: 20px auto; font-family: "Prompt"; }

.OnlineShop ul.payment-list { list-style-type: none; margin-top: 30px; }

    .OnlineShop ul.payment-list li { background: url("Images/Web2017/Bullet/bullet-onlineshop.jpg") no-repeat left 12px; padding: 2px 0 12px 25px; margin: 0; line-height: 30px; font-size: 24px; }

.OnlineShop ul.promotion-list { list-style-type: disc; list-style-position: inside; padding: 20px 0 50px; margin: auto; }

    .OnlineShop ul.promotion-list li { margin: 0 0 15px; line-height: 36px; font-size: 26px; }

.OnlineShop .PackageName { font-size: 30px; font-weight: bold; }

.OnlineShop section > div { padding-top: 70px !important; }

.OnlineShop .StripeBg { background: #fff url(Images/Web2017/Background/border-onlineshop.jpg) repeat-x left top; padding-top: 150px !important; border-top: solid 1px #fff; border-bottom: 0; }

.OnlineShop .dashedBorder { background: #fff url(Images/Web2017/Background/border-small-dash.jpg) no-repeat center bottom; border-top: solid 1px #fff; }

.OnlineShop .Backtotop { background: url(Images/Web2017/Background/back-to-top.jpg) no-repeat center center; margin-top: 30px; position: relative; }

    .OnlineShop .Backtotop .BackTopButtonDiv { display: table; margin: 18px auto; width: 100px; height: 50px; }

.OnlineShop .BackTopButton { display: block; font-size: 0px; width: 100px; height: 50px; }

.OnlineShop .text-div { float: left; }

.OnlineShop .image-div { float: right; }

.OnlineShop .title { margin-bottom: 30px; font-weight: 500; line-height: 48px; color: currentColor; }

.OnlineShop .subtitle { margin-top: 10px; font-weight: 300; line-height: 36px; color: currentColor; }

.WebShopping .sec3 { background-color: #3AA8F5; }

.BusinessStartUp .sec3 { background-color: #F2F1F4; }

/*----- Trial Signup ------*/
.TrialSignUpFinal { background-color: #fff; padding: 40px 0; }

.TrialFinal { width: 400px; display: table; margin: auto; }

    .TrialFinal .RegisterForm { width: 100%; clear: left; float: left; margin: 10px 0; }

    .TrialFinal .CommonTextBox, .TrialFinal .CountryAndStateListStateTextBox { height: 40px; border: solid 1px #bbb; padding: 5px 12px; background-color: #fdfdfd; font-family: CSPraJad; font-size: 17px; color: #8d8e90; width: 100%; }

    .TrialFinal .RegisterForm.NameInput { width: 49%; margin-right: 1%; }

    .TrialFinal .RegisterForm.LastnameInput { width: 49%; margin-left: 1%; clear: none; }

    .TrialFinal .banner-button { width: 100%; margin: 10px 0; }

        .TrialFinal .banner-button a { width: 100%; margin: 0; font-size: 30px; background-color: #4286f5; padding: 8px 0; height: auto; }
            .TrialFinal .banner-button a:hover { background-color: #357fd3; }
    .TrialFinal .ClientCityStatePanel { width: 100%; margin: 0; padding: 0; }

    .TrialFinal .CountryAndStateListDropDown { width: 100%; height: 40px; padding: 5px 12px; background: none; background-color: #fdfdfd; font-family: CSPraJad; font-size: 17px; margin: 0px; float: none; }

    .TrialFinal .ClientCityStatePanel .CommonAsterisk { display: none; }

    .TrialFinal .CustomerRegisterLabel { display: none; }

.TrialFinalForm { width: 100%; clear: left; float: left; margin: 20px 0; }

    .TrialFinalForm label { font-family: CSPraJad; font-size: 16px; color: #4286F5; float: left; height: 0; margin: 5px 0 -33px 10px; opacity: 0; position: relative; transition: opacity 0.2s ease-in 0s; z-index: 100; cursor: auto; background: none; line-height: 0; }

        .TrialFinalForm label.show { display: inline; opacity: 1; transition: opacity 0.3s ease-in 0s; line-height: 20px; }

    .TrialFinalForm input[type="text"].CommonTextBox, .TrialFinalForm input[type="password"].CommonTextBox { height: 40px; border: solid 1px #bbb; padding: 5px 12px; background-color: #fdfdfd; font-family: CSPraJad; font-size: 17px; color: #8d8e90; width: 100%; transition: background 0s ease 0s, height 0s ease 0s, padding 0s ease 0s, all 0.3s ease 0s; }

        .TrialFinalForm input[type="text"].CommonTextBox:hover, .TrialFinalForm input[type="password"].CommonTextBox:hover { background-color: #fafafa; border-color: #e6e6e6; }

        .TrialFinalForm input[type="text"].CommonTextBox:focus, .TrialFinalForm input[type="password"].CommonTextBox:focus { background-color: rgba(223, 235, 255, 0.3); background: url("Images/web2015/bullet/corner.png") no-repeat left top; border-color: #cad4e5; height: 60px; padding: 25px 12px 5px; transition: background 0s ease 0s, height 0s ease 0s, padding 0s ease 0s, all 0.3s ease 0s; }

.trial-form-banner .input input[type=submit].button-signup { -webkit-appearance: none; -webkit-border-radius: 0; border-radius: 0; }

#divWaiting { position: fixed; background: rgba(0,0,0,0.9); z-index: 2147483647 !important; overflow: hidden; text-align: center; top: 0; left: 0; height: 100%; width: 100%; color: #fff; font-size: 20px; font-family: CSPraJad; line-height: 20px; -webkit-backface-visibility: hidden; }

.banner-web-workshop { background-color: #FFDA7C; }

    .banner-web-workshop .banner-features-div1 { top: 12%; }

/*-- paruay ads --*/
.ParuayAds { margin: 10px 0 20px; display: block; width: 100%; min-height: 285px; clear: left; float: left; text-align: center; }

/*--- AffiliateLogin Begin ---*/
.bg-affiliate-1 { clear: left; background: #fbfbfb url(Images/Web2015/Background/bg-affiliate-1.jpg) no-repeat center bottom; padding: 80px 0 0; min-height: 680px; font-family: ThaiSansNeue; text-align: center; }

    .bg-affiliate-1 .title { font-size: 48px; color: #151515; line-height: 48px; font-weight: bold; }

    .bg-affiliate-1 .subtitle { width: 100%; font-size: 24px; text-align: center; line-height: 30px; color: #000; margin-top: 25px; }

.bg-affiliate-2 { clear: left; background-color: #1c1c1c; padding: 70px 0; font-size: 24px; line-height: 30px; font-family: ThaiSansNeue; text-align: center; color: #fbfbfb; }

.bg-affiliate-3 { clear: left; background: #fbfbfa url(Images/Web2015/Background/bg-affiliate-2.jpg) no-repeat center top; background-size: auto 100%; padding: 80px 0; min-height: 400px; font-family: ThaiSansNeue; font-size: 21px; color: #000; }

    .bg-affiliate-3 .title1 { clear: left; font-size: 24px; line-height: 30px; font-weight: bold; }

    .bg-affiliate-3 .title2 { clear: left; font-size: 36px; line-height: 30px; font-weight: bold; }

    .bg-affiliate-3 .subtitle { clear: left; line-height: 30px; margin: 15px 0; }

ul.affiliate-partner-list { clear: left; float: left; width: 100%; padding: 0; margin: 10px 0 0 15px; list-style-type: decimal; }

    ul.affiliate-partner-list li { line-height: 30px; }

    ul.affiliate-partner-list a.AffiliateRegisterLink { color: #ff1744; margin: 0 5px; }

.bg-affiliate-4 { clear: left; background-color: #e6e9ea; border-top: solid 2px #fff; padding: 40px 0; font-size: 24px; line-height: 30px; font-family: ThaiSansNeue; text-align: center; color: #000; }

    .bg-affiliate-4 .register-step { float: left; width: 25%; }

        .bg-affiliate-4 .register-step .image-item { clear: left; float: left; width: 100%; margin-bottom: 15px; }

        .bg-affiliate-4 .register-step .title { font-size: 36px; font-weight: bold; margin: 10px 0; clear: left; float: left; width: 100%; }

        .bg-affiliate-4 .register-step .info { margin: 0; clear: left; float: left; width: 100%; }

.bg-affiliate-5 { clear: left; background-color: #fff; padding: 50px 0; font-size: 21px; line-height: 30px; font-family: ThaiSansNeue; color: #000; }

    .bg-affiliate-5 .title1 { clear: left; font-size: 24px; line-height: 30px; font-weight: bold; text-align: center; }

    .bg-affiliate-5 .title2 { clear: left; font-size: 36px; line-height: 30px; font-weight: bold; text-align: center; }

.AffiliateLoginJoinAffiliateProgramDiv { clear: left; display: table; margin: 0 auto; text-align: center; padding: 30px 0; }

.AffiliateRegister { height: 50px; line-height: 45px; padding: 0 35px; color: #f8f8f7; font-size: 24px; margin: 0; }

.AffiliateLoginInformation { clear: left; float: left; width: 100%; }

    .AffiliateLoginInformation .ContentLayoutTop, .AffiliateLoginInformation .features-content { display: none; }

    .AffiliateLoginInformation .ContentLayoutRight, .AffiliateLoginInformation p, .AffiliateLoginInformation p span { min-height: 0; font-size: 21px !important; font-family: ThaiSansNeue !important; line-height: 30px; }
/*AffiliateLogin End*/

.bg-adwords-course6 .line-lightgray img { display: block !important; }

.OptionGroupDetailsTopPage .OptionDisplayText { color: #fff; }

.OptionGroupDetailsTopPage .OptionDropDownItem { background-color: #fff; }

/* new year 2016 promotion page*/
.NY2016-bar { width: 100%; clear: left; float: left; height: 6px; background: #001a33 url("Images/Web2017/Background/spb-topbar.jpg") no-repeat center center; }

.NY2016Banner { width: 100%; clear: left; float: left; background: #223D74 url("Images/Banner/Banner-SportBrand-Promotion.jpg") no-repeat center top; min-height: 505px; margin: 0; position: relative; }

.NY2016Form { margin: 15px 0; padding: 10px 15px; width: 35%; float: right; border: solid 3px #fff; font-family: 'DB Adman X'; }

    .NY2016Form .form-title { background: url("Images/Web2017/Background/spb-promotion-logo.png") no-repeat left top; padding-left: 85px; font-size: 25px; color: #fff; line-height: 36px; min-height: 100px; padding-top: 10px; }

.SignUpButtonDiv { clear: left; margin: 20px auto; display: table; width: 240px; }

.SignUpButton { display: block; background-color: #357FD3; border: solid 1px #6588f8; font-size: 30px; text-align: center; color: #fff; padding: 5px 0 8px; line-height: 36px; border-radius: 15px; transition: all 0.5s ease-out, color 0.5s ease-out, border 0.5s ease-out; }

    .SignUpButton:hover { background-color: #d11b4a; border: solid 1px #ff5782; color: #fff; }

.NY2016Form input.NewFormTextBox[type="text"], .NY2016Form .NewFormFilled { font-family: CSPraJad; }

.notation { font-family: CSPraJad; font-size: 14px; line-height: 16px; color: #fafbfd; }

.BG-NY2016 { width: 100%; clear: left; float: left; background-color: #f6f6f6; font-family: CSPraJad; border-top: solid 1px #fff; }

    .BG-NY2016 .image-column { width: 40%; float: left; }

    .BG-NY2016 .info-column { width: 60%; float: right; padding: 10px 10px 0 0; }

    .BG-NY2016 .info2-column { width: 60%; float: right; padding: 0 0 20px 0; }

.BG-NY2016-title { width: 100%; clear: left; float: left; margin: 10px 0; line-height: 40px; }

.BG-NY2016-item { font-family: CSPraJad; font-size: 15px; line-height: 24px; color: #040404; width: 100%; clear: left; float: left; }

    .BG-NY2016-item.bullet { background: url("Images/Web2017/Bullet/bullet-red.png") no-repeat left 10px; padding-left: 15px; }

    .BG-NY2016-item a { color: #c41a47; }

        .BG-NY2016-item a:hover { text-decoration: underline; }

.BG-NY2016-Winner { background-color: #a91c12; font-family: CSPraJad; font-size: 19px; line-height: 30px; width: 100%; clear: left; float: left; text-align: center; padding: 20px 0; color: #fff; }

.fb-course-banner.activity-promotion .row { min-height: 600px; background-size: auto 580px; }

.activity-promotion .form-1 { margin: 20px auto; }

.activity-promotion .HyperLink { color: #f4e931; }

    .activity-promotion .HyperLink:hover { color: #fff; }

.bg-light-blue.activity-promotion { padding: 10px 0 25px; border-bottom: 0; }

.activity-condition { display: table; width: auto; margin: auto; }

.newyear2016 { position: absolute; top: 110px; width: 100%; }

.newyear2016-text1 { clear: left; float: left; font-family: ThaiSansNeue; font-size: 36px; text-shadow: 1px 1px 1px #000; color: #fff; line-height: 40px; }

.newyear2016-text2 { clear: left; float: left; margin: 40px 0; font-family: ThaiSansNeue; font-size: 36px; text-shadow: 1px 1px 1px #000; color: #ffd42a; line-height: 30px; }

.newyear2016-label { clear: left; float: left; margin-bottom: 10px; font-size: 72px; line-height: 72px; width: 400px; font-weight: bold; color: #010101; text-transform: uppercase; text-shadow: 1px 0px 1px #fff; }

    .newyear2016-label .color-red { color: #de1c1c; }

a.newyear2016-btn { z-index: 0; background-color: #b71c1c; border: solid 3px #fff; color: #fff; float: left; padding: 0 25px; font-family: ThaiSansNeue; transition: background 0.5s ease-out, border 0.5s ease-out; }
    /* dark */
    a.newyear2016-btn:hover { border: solid 3px #fff; background-color: #ffc900; color: #000; transition: background 0.5s ease-out, border 0.5s ease-out; }


.bg-newyear2016 { background: url(Images/Web2017/Background/bg-newyear2016.jpg) no-repeat center bottom; background-size: cover; min-height: 200px; clear: left; padding: 30px 0; }

.bg-newyear2016-1 .title { font-size: 48px; font-family: ThaiSansNeueBold; color: #3c3a3a; line-height: 50px; margin-top: 70px; font-weight: bold; }

.bg-newyear2016 .common-button { line-height: 40px; }

.bg-newyear2016 .newyear2016-text2 { margin: 10px 0 30px; }

.LineOfficial { position: absolute; top: 120px; width: 100%; left: 10px; }

.LineOfficial-text1 { clear: left; float: left; font-family: ThaiSansNeue; font-size: 48px; color: #00c402; line-height: 50px; margin-bottom: 20px; font-weight: bold; }

.LineOfficial-text2 { clear: left; float: left; margin-bottom: 40px; font-family: ThaiSansNeue; font-size: 36px; line-height: 38px; color: #838783; text-shadow: 1px 0px 1px #fff; }

.LineOfficial-bar { clear: left; float: left; width: 100px; height: 3px; background-color: #00c402; margin: 20px 0; }
/* edit for default.aspx  - 11 jan 2016 */
.bg-free-3.bg-yellow { background-color: #f6e585; background: -moz-linear-gradient(top, #fce66c, #f6e585); background: -webkit-gradient(linear, 0 0, 0 100%, from(#fce66c), to(#f6e585)); background: -webkit-linear-gradient(top, #fce66c, #f6e585); background: -o-linear-gradient(top, #fce66c, #f6e585); background: linear-gradient(to bottom, #fce66c, #f6e585); }

.bg-free-11 .text-col, .bg-free-3 .text-col { padding-left: 80px; margin-left: 0; }

.bg-section2 { background-color: #323a43; color: #f2f4f1; }

    .bg-section2 .title { margin-top: 0; color: #00bcd4; }

    .bg-section2 a { width: 180px; }

    .bg-section2 .video-col { padding: 60px 0 60px 20px; width: 50%; }

    .bg-section2 .text-col { float: right; padding: 50px 0; width: 45%; margin-left: 5%; }

.SocialFooter { clear: left; float: left; width: 100%; font-family: ThaiSansNeue; }

.SocialFooterLabel { clear: left; float: left; width: 100%; font-size: 24px; line-height: 40px; color: #343537; background-color: #fff; padding: 20px 0; }

    .SocialFooterLabel .TitleLabel { float: left; margin-right: 15px; font-size: 30px; font-weight: bolder; font-style: italic; }

    .SocialFooterLabel .DetailLabel { float: left; }

    .SocialFooterLabel .TitleLabel1 { color: #405eae; }

.SocialFooterLink { clear: left; float: left; width: 100%; border-top: solid 1px #e5e5e5; border-bottom: solid 1px #e5e5e5; background-color: #f7f8f9; padding: 10px 0; }

.SocialLinkItem { float: left; width: 24.5%; min-height: 130px; margin: 0 0.25%; background-position: center center; background-repeat: no-repeat; position: relative; }

.SocialButton .fb_iframe_widget { width: 100% !important; }

    .SocialButton .fb_iframe_widget span { width: 200% !important; }

.SocialLinkItem.Youtube { background-image: url(Images/web2015/background/img-youtube.jpg); }

.SocialLinkItem.Instagram { background-image: url(Images/web2015/background/img-ig.jpg); }

.SocialLinkItem.Twitter { background-image: url(Images/web2015/background/img-twitter.jpg); }

.SocialLinkItem.Facebook { background-image: url(Images/web2015/background/img-facebook.jpg); }

.SocialLinkItem .SocialButton { position: absolute; right: 0; bottom: 20px; }

.SocialLinkItem.Youtube .SocialButton { right: 28px; }

.SocialLinkItem.Twitter .SocialButton { right: 15px; }

.SocialLinkItem.Facebook .SocialButton { left: 20px; }

.SocialLinkItem.Instagram .SocialButton { right: 10px; }

.SocialLinkItem .TwitterLink { clear: left; float: left; width: 100%; height: 130px; display: block; }

.SocialLinkItem .InstagramLink { clear: left; float: left; width: 100%; height: 130px; display: block; }

.WidgetPanel { width: 100%; margin: auto; display: table; }

    .WidgetPanel .fb_iframe_widget { width: 100% !important; }
/* like & share button */
.bg-line-official { background: #00c402 url(Images/web2015/background/bg-social-like.png) repeat-y center center; clear: left; float: left; width: 100%; font-family: ThaiSansNeue; }

.bg-line-official-inner { padding: 25px 0; background: url(Images/web2015/banner/Bg-Footer-LineOfficial.png) no-repeat right 30%; }

.bg-line-official .text-col .subtitle { margin: 0 0 5px; color: #f3f4f9; border-left: solid 1px #f3f4f9; padding-left: 30px; }

.bg-line-official .text-col { text-align: left; font-weight: normal; line-height: 26px; background: url(Images/web2015/background/bg-tk-exclusive.png) left center no-repeat; padding-left: 215px; }


.banner-control .orbit-container .orbit-slides-container li.banner-default1 { background: url(Images/Banner/default-banner1.jpg) no-repeat center center; background-size: 100% auto; }

.banner-control .orbit-container .orbit-slides-container li.banner-default2 { background: url(Images/Banner/default-banner2.jpg) no-repeat center center; background-size: 100% auto; }

.banner-control .orbit-container .orbit-slides-container li.banner-line { background: url(Images/Banner/banner-lineofficial.jpg) no-repeat center center; background-size: 100% auto; }

.banner-control .orbit-container .orbit-slides-container li.banner-facebook { background: url(Images/Banner/banner-facebookads-promo.jpg) no-repeat center center; background-size: 100% auto; }


.LayoutFooterLicense .row { position: relative; }

.LayoutFooterLicense .Certificate-banners { float: left; left: -10px; position: absolute; }

    .LayoutFooterLicense .Certificate-banners img { max-height: 50px; }

/*-----Begin Suanlum product detail style ----*/
.suanlum-banner { clear: left; float: left; width: 100%; height: 100%; margin: 0; padding: 0; position: relative; width: 100%; background: #fbfdfe url(Images/Web2017/Background/bg-suanlum.jpg) no-repeat center bottom/ cover; border-bottom: solid 3px #fff; min-height: 657px; }

.suanlum-banner-outer { background: url(Images/Web2017/Background/bg-logo-suanlum-partner.png) no-repeat right 30px; padding: 30px 0 0; }

.suanlum-banner-inner { background: url(Images/Web2017/Background/img-suanlum.png) no-repeat 95% bottom; }

.default-banner .suanlum-banner-inner { background: url(Images/Web2017/Background/img-stc.png) no-repeat center bottom; }

.suanlum-banner .row { min-height: 580px; }

.suanlum-text { text-align: left; }

.logo-suanlum-partner { background: url(Images/Web2017/Background/logo-suanlum-partner.png) no-repeat right top; height: 60px; width: 100%; }

.default-banner .row { position: relative; }

.btn-default-banner { position: absolute; bottom: 0; width: 60%; right: 0; }

    .btn-default-banner a { background-color: #47b268; font-size: 30px; font-family: ThaiSansNeueBold; color: #fdf512; padding: 8px 50px; line-height: 40px; transition: all 0.5s ease-out; display: table; margin: auto; float: none; }

        .btn-default-banner a:hover { background-color: #0161b1; color: #ffe900; }

.bg-suanlum-1 { background-color: #e6e8e7; clear: left; float: left; width: 100%; font-size: 50px; color: #006cb8; line-height: 60px; padding: 30px 0; text-align: center; }

.bullet-suanlum { background: url(Images/Web2017/Bullet/bullet-suanlum.png) no-repeat center 65%; width: 23px; height: 23px; padding: 0 8px; }

.bg-suanlum-2 { background-color: #fff; clear: left; float: left; width: 100%; font-size: 30px; color: #060a0b; line-height: 40px; padding: 80px 0; font-weight: bold; }

.suanlum-schedule { float: left; width: 48%; font-family: CSPraJad; font-size: 14px; text-align: center; }

    .suanlum-schedule .title { clear: left; float: left; width: 100%; margin: 0 0 15px; font-family: ThaiSansNeueBold; font-size: 36px; color: #1597fc; line-height: 40px; }

.bg-suanlum-2 .img-suanlum-place { float: left; width: 52%; padding: 0; }

.bg-suanlum-2 .suanlum-place { float: left; width: 100%; }

.bg-suanlum-2 .short-bar-dark4 { clear: left; float: left; width: 40%; height: 1px; background-color: #030303; margin: 10px 30% 0; }

.bg-suanlum-2 .title2 { clear: left; float: left; width: 100%; font-size: 24px; line-height: 30px; font-weight: bold; }

.bg-suanlum-2 .title3 { clear: left; float: left; width: 100%; font-size: 18px; }

.bg-suanlum-2 .title4 { clear: left; float: left; width: 100%; font-size: 20px; line-height: 30px; font-weight: bold; margin-top: 10px; }

.bg-suanlum-2 .title5 { clear: left; float: left; width: 100%; font-size: 15px; line-height: 22px; }

.bg-suanlum-3 { background: #0870b8 url(Images/Web2017/Background/bg-suanlum-3.jpg) no-repeat center top; clear: left; float: left; width: 100%; color: #fff; line-height: 30px; padding: 30px 0 40px; text-shadow: 2px 0 2px #000; text-align: center; font-family: ThaiSansNeueBold; font-size: 24px; }

    .bg-suanlum-3 .title1 { color: #eefb1c; font-size: 30px; }

    .bg-suanlum-3 .title2 { color: #eefb1c; }

.bg-suanlum-4 { background-color: #fff; clear: left; float: left; width: 100%; font-size: 30px; color: #060a0b; line-height: 40px; padding: 40px 0; }

    .bg-suanlum-4 .session-div { clear: left; float: left; font-weight: bold; width: 100%; margin-bottom: 20px; }

    .bg-suanlum-4 .session-title { background-color: #00a1e5; float: left; padding: 0 30px; color: #fff; font-size: 30px; font-weight: bold; line-height: 36px; min-height: 42px; border-radius: 20px; margin: 20px 0 10px; }

    .bg-suanlum-4 .logo-partner-div { clear: left; float: left; width: 100%; margin: 5px 0; }

    .bg-suanlum-4 .logo-partner { float: left; line-height: 45px; }

    .bg-suanlum-4 .row.br-line { border-top: solid 2px #eee; padding: 30px 0 0; margin-top: 10px; }

.bg-suanlum-5 { background-color: #fff; clear: left; float: left; width: 100%; font-size: 30px; color: #060a0b; line-height: 40px; }

    .bg-suanlum-5 .row { border-top: solid 2px #1a956a; padding: 20px 0 40px; }

    .bg-suanlum-5 .font21 { line-height: 36px; }

.bg-suanlum-6 { background: #0870b8 url(Images/Web2017/Background/bg-suanlum-6.jpg) no-repeat center top; clear: left; float: left; width: 100%; color: #fff; line-height: 40px; padding: 40px 0 20px; }

    .bg-suanlum-6 .bullet-suanlum { background-size: 12px auto; }

.bg-suanlum-option { clear: left; float: left; width: 100%; margin: 10px 0; font-family: CSPraJad; font-size: 21px; font-weight: bold; color: #fff; }

    .bg-suanlum-option .OptionDisplayText { font-family: CSPraJad; font-size: 21px; font-weight: bold; color: #fff; }

    .bg-suanlum-option .OptionGroupDetails { float: left; }

    .bg-suanlum-option .OptionItemDetailsTop { width: 160px; }

    .bg-suanlum-option .OptionDropDownItem { border: 1px solid #aba9a9; }

    .bg-suanlum-option select { background: #fff url(Images/Web2017/Background/option-drop.png) no-repeat 90% center; font-family: CSPraJad; font-size: 19px; color: #000; }

    .bg-suanlum-option .CommonButtonFade a { background-color: #fff200; color: #000; font-family: CSPraJad; font-size: 19px; font-weight: bold; border-radius: 20px; }

        .bg-suanlum-option .CommonButtonFade a:hover { background-color: #00deff; color: #fff; }

.bg-suanlum-7 { background-color: #fff; clear: left; float: left; width: 100%; font-size: 30px; color: #060a0b; line-height: 40px; padding: 40px 0; }

    .bg-suanlum-7 .suanlum-map { border: solid 3px #bbbaba; margin: 20px 0; }

    .bg-suanlum-7 .map-list { clear: left; float: left; width: 100%; }

    .bg-suanlum-7 .map-number { width: 30px; height: 30px; line-height: 26px; color: #fff; background-color: #237fbf; float: left; text-align: center; border-radius: 30px; margin: 5px 15px 5px 0; font-size: 24px; }

    .bg-suanlum-7 .map-info { float: left; font-family: CSPraJad; font-size: 18px; width: 80%; line-height: 30px; margin: 5px 0; }

    .bg-suanlum-7 .facebook-icon { background: url(Images/Web2017/Icon/suanlum-icon-facebook.png) no-repeat left center; line-height: 32px; padding-left: 40px; margin: 5px 0; font-family: CSPraJad; font-size: 18px; }

    .bg-suanlum-7 .mail-icon { background: url(Images/Web2017/Icon/suanlum-icon-email.png) no-repeat left center; line-height: 32px; padding-left: 40px; font-family: CSPraJad; font-size: 18px; margin: 5px 0; }

.banner-control .orbit-container .orbit-slides-container li.banner-suanlum { background: url(Images/Web2017/Background/bg-suanlum.jpg) no-repeat center center; background-size: 100% auto; }

.banner-suanlum .w100 { text-align: right; }

.banner-suanlum .suanlum-text { background: url(Images/Web2017/Background/txt-suanlum.png) no-repeat center 60px/ auto 320px; height: 450px; position: relative; }

.orbit-container .orbit-slides-container .banner-suanlum .w100 img { display: initial; }

.banner-suanlum-inner { position: absolute; top: 5px; width: 100%; left: 0; height: 100%; }

    .banner-suanlum-inner .row { background: url(Images/Web2017/Background/img-suanlum.png) no-repeat 90% bottom/auto 400px; height: 100%; text-align: right; }

    .banner-suanlum-inner .suanlum-button { width: 100%; clear: left; position: absolute; bottom: 10px; }

    .banner-suanlum-inner .banner-button1 { margin: 0 auto; }

.CustomerSite .features-menu-panel { display: table; margin: 15px auto; width: auto; float: none; width: 100%; padding: 0; }

    .CustomerSite .features-menu-panel ul { display: table; list-style-type: none; margin: 0 auto; padding: 0; width: 100%; }

        .CustomerSite .features-menu-panel ul > li { line-height: 40px; height: 45px; width: 19.5%; margin: 2px 0.25%; float: left; padding: 0; }

            .CustomerSite .features-menu-panel ul > li a { display: block; text-align: center; height: 45px; line-height: 40px; padding: 0 5px; width: 100%; font-size: 22px; color: #454545; font-family: ThaiSansNeue; background-color: #e1e3e5; }

                .CustomerSite .features-menu-panel ul > li a:hover { color: #fff; background-color: #357fd3; }

            .CustomerSite .features-menu-panel ul > li.active a { color: #fff; background-color: #4286f5; }


.CustomerSite .features-content { clear: left; float: left; display: block; width: 100%; padding: 20px 0; }

.CustomerSite .tab_content { float: left; position: relative; width: 100%; }

.features-menu-panel ul > li.active, .features-menu-panel ul > li:focus { color: #fff; }

    .features-menu-panel ul > li.active a:hover { color: #fff; }
/*******  AdsVideoTraining  *******/
.bg-AdsVideoTraining { background: url(Images/Web2017/Background/Bg-AdsVideoTraining.jpg) no-repeat center center/cover; clear: left; float: left; width: 100%; font-family: ThaiSansNeue; position: relative; min-height: 555px; padding: 10px 0 25px; }

.AdsVideoTraining-FB { background: url(Images/Web2017/Background/AdsVideoTraining-FB.png) no-repeat right bottom; width: 30%; height: 390px; position: absolute; left: 0; bottom: 0; }

.AdsVideoTraining-ADW { background: url(Images/Web2017/Background/AdsVideoTraining-ADW.png) no-repeat left bottom; width: 30%; height: 390px; position: absolute; right: 0; bottom: 0; }

.bg-AdsVideoTraining .row { background: url(Images/Web2017/Background/tk-logo-video.png) no-repeat center top; padding: 50px 10px 0; }

.bg-AdsVideoTraining .Ads-Title { clear: left; float: left; width: 100%; font-size: 46px; text-shadow: 1px 1px 1px #000; color: #fff; line-height: 48px; margin: 10px 0 30px; text-align: center; }

.bg-AdsVideoTraining .Ads-Info { clear: left; float: left; width: 100%; padding: 5px 20px; background: rgba(255,255,255,0.35); text-shadow: 1px 1px 1px #000; }

.bg-AdsVideoTraining .Ads-Info1 { clear: left; float: left; width: 100%; color: #fff; line-height: 32px; font-size: 42px; }

.bg-AdsVideoTraining .Ads-Info2 { clear: left; float: left; width: 100%; margin: 10px 0; height: 94px; }

.bg-AdsVideoTraining .Ads-BtnBar { clear: left; float: left; width: 100%; padding: 20px; }

.bg-AdsVideoTraining .Ads-FBBox { border: solid 3px #fff; padding: 6px; float: left; width: 49%; margin-right: 1%; text-align: right; position: relative; }

    .bg-AdsVideoTraining .Ads-FBBox .Ads-BtnBar { background: rgba(11,32,128,0.7); }

    .bg-AdsVideoTraining .Ads-FBBox .Ads-Info2 { background: url(Images/Web2017/Background/title-fb.png) no-repeat right top; }

.bg-AdsVideoTraining .Ads-ADWBox { border: solid 3px #fff; padding: 6px; float: left; width: 49%; margin-left: 1%; position: relative; }

    .bg-AdsVideoTraining .Ads-ADWBox .Ads-Info2 { background: url(Images/Web2017/Background/title-adw.png) no-repeat left top; }

    .bg-AdsVideoTraining .Ads-ADWBox .Ads-BtnBar { /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ff1300+0,481e1d+100&0.67+0,0.65+100 */ background: -moz-linear-gradient(left, rgba(255,19,0,0.67) 0%, rgba(72,30,29,0.65) 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(left, rgba(255,19,0,0.67) 0%,rgba(72,30,29,0.65) 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to right, rgba(255,19,0,0.67) 0%,rgba(72,30,29,0.65) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#abff1300', endColorstr='#a6481e1d',GradientType=1 ); /* IE6-9 */ }

.bg-AdsVideoTraining a.BtnMoreDetail { z-index: 0; background-color: rgba(255,255,255,0); border: solid 1px #fff; color: #fff; float: left; padding: 0 30px 2px; font-family: ThaiSansNeue; transition: background 0.5s ease-out, border 0.5s ease-out; line-height: 40px; font-size: 24px; }
    /* light */
    .bg-AdsVideoTraining a.BtnMoreDetail:hover { border: solid 1px #fff; background-color: #ffde00; color: #303030; transition: background 0.5s ease-out, border 0.5s ease-out; }

.bg-AdsVideoTraining .Ads-FBBox .Ads-BtnBar a.BtnMoreDetail { float: right; }

.Ads-FBBox .AdsVideoTraining-FB, .Ads-ADWBox .AdsVideoTraining-ADW { display: none; }

.MemorialBannerPanel { width: 100%; background-color: #010101; text-align: center; }

.DocumentDiv { width: 100%; padding: 20px; }

    .DocumentDiv a { padding: 8px 0px 8px 30px; width: 100%; vertical-align: middle; display: block; text-decoration: none; white-space: normal; text-align: left; background: url("Images/Icon/icon-category.png") no-repeat left center; font-family: ThaiSansNeueBold; font-size: 24px; line-height: 1.5; }

.ig-b- { display: inline-block; }

    .ig-b- img { visibility: hidden; }

    .ig-b-:hover { background-position: 0 -60px; }

    .ig-b-:active { background-position: 0 -120px; }

.ig-b-v-24 { width: 137px; height: 24px; background: url(//badges.instagram.com/static/images/ig-badge-view-sprite-24.png) no-repeat 0 0; }

.Default-Testimonial { border-top: solid 1px #fff; border-bottom: solid 1px #fff; color: #f2f4f1; background: #f9fcfe url(Images/web2015/Background/bg-testimonial.jpg) no-repeat left bottom; color: #323a43; }

.Testimonial-Section .testimonial-title { margin: 0 0 30px; color: #323a43; font-size: 56px; color: #323a43; font-weight: bold; }

.Testimonial-Section .testimonial-subtitle { margin: 0; color: #323a43; font-size: 48px; color: #323a43; line-height: 50px; font-weight: bold; }

.Testimonial-Section .short-bar { width: 180px; height: 2px; background-color: #323a43; margin: 35px 0 15px; }

.Testimonial-Section .web-link { background-color: #323a43; color: #f2f4f1; background: url(Images/web2015/Icon/icon-open.png) no-repeat right center; color: #323a43; line-height: 22px; font-size: 20px; padding-right: 27px; font-weight: normal; }

    .Testimonial-Section .web-link:hover { color: #357FD3; }

.Testimonial-Section .video-col { padding: 85px 20px; width: 50%; float: right; }

.Testimonial-Section .text-col { float: left; padding: 70px 0 50px; width: 48%; margin-left: 2%; }

.Testimonial-Section .button-div { clear: left; float: left; margin-top: 40px; }

.Testimonial-Section .btn-link { z-index: 0; background-color: #272d34; color: #fff; float: left; padding: 0 20px; font-family: ThaiSansNeue; transition: background 0.5s ease-out; font-size: 18px; line-height: 50px; }

    .Testimonial-Section .btn-link:hover { background-color: #357FD3; color: #fff; transition: background 0.5s ease-out; }

/*-----Customer Testimonial Page----*/
.testimonial-banner { color: #f2f4f1; background: #f9fcfe url(Images/web2015/Banner/testimonial-banner.webp) no-repeat left bottom; color: #323a43; position: relative; }

    .testimonial-banner .row { padding: 20px 0 0; font-weight: bold; }

    .testimonial-banner .testimonial-title { margin: 0 0 30px; font-size: 38px; line-height: 48px; }

    .testimonial-banner .testimonial-subtitle { margin: 0; font-size: 58px; text-shadow: 1px 0 2px #fff; }

    .testimonial-banner .short-bar { width: 180px; height: 3px; background-color: #323a43; margin: 35px 0 25px; }

    .testimonial-banner .web-link { background-color: #323a43; color: #f2f4f1; background: url(Images/web2015/Icon/icon-open-large.png) no-repeat right center; color: #323a43; line-height: 36px; font-size: 24px; padding-right: 32px; }

        .testimonial-banner .web-link:hover { color: #357FD3; }

    .testimonial-banner .video-col { padding: 50px 6%; width: 60%; float: left; }

    .testimonial-banner .text-col { float: right; padding: 60px 20px 40px; width: 38%; }

.Testimonial { padding: 30px 0 0; }

    .Testimonial .title { font-size: 48px; font-family: ThaiSansNeueBold; text-transform: uppercase; line-height: 40px; font-weight: bold; }

    .Testimonial .subtitle { font-size: 30px; }

    .Testimonial .title-detail { margin-bottom: 30px; font-size: 16px; font-family: CSPraJad; font-weight: bold; line-height: 20px; }

    .Testimonial .main-title-detail { margin-bottom: 30px; font-size: 22px; font-family: CSPraJad; font-weight: bold; line-height: 30px; }

    .Testimonial .bg-service-3 .text-col { padding: 75px 0 50px; }

    .Testimonial .bg-service-1 .text-col { padding: 45px 0; }

    .Testimonial .bg-service-2 .text-col { padding: 85px 0 50px; }

    .Testimonial .bg-service-2 { background-size: 60% auto; }

    .Testimonial .bar80 { width: 80px; height: 1px; background-color: #030303; margin: 45px auto; }

    .Testimonial .bar-white80 { width: 80px; height: 1px; background-color: #fff; margin: 50px auto; }

    .Testimonial .bg-service-1 .bar80 { margin: 25px auto; }

    .Testimonial .icon-online-marketing { background: url(Images/web2015/Icon/Testimonial-service-1.webp) no-repeat center top; width: 200px; height: 130px; font-size: 0; display: block; }

    .Testimonial .icon-design-service { background: url(Images/web2015/Icon/Testimonial-service-2.webp) no-repeat center top; width: 200px; height: 135px; font-size: 0; display: block; }

    .Testimonial .icon-training { background: url(Images/web2015/Icon/Testimonial-service-3.webp) no-repeat center top; width: 240px; height: 140px; font-size: 0; display: block; }

.service-icon-div { display: table; margin: auto; }

.Testimonial .bg-facebook { background: #fff url(Images/Web2017/Background/bg-facebook-ads2.webp) no-repeat center top; padding: 0; text-align: center; }

    .Testimonial .bg-facebook .row { padding: 60px 0; background: url(Images/Web2017/Background/facebook-ad-1.webp) no-repeat 20% top; background-size: 40% auto; min-height: 500px; }

.Testimonial .bg-support { background: url(Images/web2015/background/bg-support.webp) no-repeat center top; padding: 0; text-align: center; color: #fff; }

    .Testimonial .bg-support .row { padding: 80px 0 40px; text-align: center; }

    .Testimonial .bg-support .title-detail { min-height: 100px; }

.bg-support-item { float: left; width: 30%; padding: 10px; }

    .bg-support-item.item-center { float: left; width: 40%; padding: 10px; }

    .bg-support-item.item-right { float: right; }

.Testimonial .bg-free-12 .title { line-height: 48px; font-family: ThaiSansNeue; font-weight: normal; }

.Testimonial .bg-free-12 .banner-button1 { margin-top: 20px; }

.Testimonial .bg-free-12 .common-btn15 { margin: 10px 0 0 10px; width: 120px; }

/* free 2*/
.free2-button { margin: 40px 0; height: 60px; }

    .free2-button .common-btn10 { padding: 10px 30px; font-size: 24px; line-height: 40px; font-family: ThaiSansNeueBold; }

.bg-free2-1 { background: url(Images/web2017/Background/bg-free2-1.jpg) repeat-x left top; clear: left; float: left; width: 100%; border-bottom: solid 2px #fff; }

    .bg-free2-1 .row { padding: 0 20px; }

.bg-free2-1-inner { background: url(Images/web2017/Background/bg-free2-1img.jpg) no-repeat -20% top; min-height: 657px; }

.bg-free2-1 .text-col { float: right; font-family: ThaiSansNeueBold; padding: 140px 0 0; text-align: left; font-size: 48px; line-height: 50px; color: #121212; }

.bg-free2-1 .h1-title { margin: 0; }

.bg-free2-1 .h2-title { font-weight: normal; margin: 15px 0; font-size: 36px; }

.bg-free2-2 { background: url(Images/web2017/Background/bg-free2-2.jpg) repeat-x left top; clear: left; float: left; width: 100%; border-bottom: solid 2px #fff; }

    .bg-free2-2 .row { padding: 0 20px; }

.bg-free2-2-inner { background: url(Images/web2017/Background/bg-free2-2img.jpg) no-repeat right top; min-height: 657px; }

.bg-free2-2 .text-col { float: left; font-family: ThaiSansNeueBold; padding: 100px 0 0; text-align: left; font-size: 18px; color: #121212; }

.bg-free2-2 .h1-title { margin: 10px 0; font-size: 48px; color: #fc4c15; line-height: 50px; }

.bg-free2-2 .h2-title { margin: 20px 0; font-size: 42px; line-height: 45px; }

.bg-free2-2 .h3-title { margin: 25px 0; font-size: 34px; color: #0681ee; }

.bg-free2-2 .h4-title { margin: 20px 0; line-height: 24px; }


.bg-free2-2-button { z-index: 0; background: rgba(255,255,255,0.3) url(Images/web2017/bullet/arrow-right.png) no-repeat 95% 24px; border: solid 1px #1e1e1e; color: #1e1e1e; float: left; padding: 8px 20px !important; transition: background 0.5s ease-out, border 0.5s ease-out; font-size: 24px; line-height: 36px !important; font-family: ThaiSansNeueBold; width: 290px !important; text-align: center !important; height: auto !important; background-position-y: 20px !important; }

    .bg-free2-2-button:hover { border: solid 1px #0681ee; background: #0681ee url(Images/web2017/bullet/arrow-right-white.png) no-repeat 95% 24px; color: #fff; transition: background 0.5s ease-out, border 0.5s ease-out; }

.bg-free2-3 { background: #f2f1f6 url(Images/web2017/Background/bg-free2-3img.jpg) no-repeat right top/auto 100%; clear: left; float: left; width: 100%; border-bottom: solid 2px #fff; }

    .bg-free2-3.Testimonial-Section .video-col { padding: 142px 20px; width: 50%; float: right; }

    .bg-free2-3.Testimonial-Section .text-col { float: left; width: 48%; margin-left: 0; font-family: ThaiSansNeueBold; padding: 118px 0 30px; text-align: left; font-size: 18px; color: #121212; min-height: 657px; }

    .bg-free2-3 .web-link { color: #121212; background: url(Images/web2015/Icon/icon-open.png) no-repeat right center; line-height: 40px; font-size: 34px; padding-right: 27px; font-weight: normal; padding-bottom: 10px; }

        .bg-free2-3 .web-link:hover { color: #0681ee; }

    .bg-free2-3 .h1-title { margin: 0 0 10px; font-size: 48px; line-height: 50px; font-family: ThaiSansNeueBold; }

    .bg-free2-3.Testimonial-Section .video-col .h1-title { display: none; }

    .bg-free2-3 .h2-title { margin: 0 0 10px; }

    .bg-free2-3 .h3-title { clear: left; margin: 20px 0; line-height: 24px; }

    .bg-free2-3 .h4-title { margin: 20px 0; font-size: 24px; }

    .bg-free2-3 .free2-button { margin: 30px 0 40px; }

.bg-free2-4 { background: #fff url(Images/web2017/Background/bg-free2-4.jpg) no-repeat center top/auto 100%; clear: left; float: left; width: 100%; border-bottom: solid 2px #fff; }

    .bg-free2-4 .row { padding: 0 20px; }

    .bg-free2-4 .text-col { float: left; font-family: ThaiSansNeueBold; padding: 84px 0; text-align: left; color: #121212; min-height: 657px; }

    .bg-free2-4 .h1-title { margin: 0; color: #4286f5; font-weight: normal; line-height: 50px; font-size: 48px; }

        .bg-free2-4 .h1-title .font72 { font-size: 72px; }

    .bg-free2-4 .h2-title { margin: 30px 0; font-size: 30px; line-height: 36px; }

    .bg-free2-4 .h3-title { margin: 20px 0; font-size: 36px; }

.bg-free2-5 { background-color: #357FD3; clear: left; float: left; width: 100%; border-bottom: solid 2px #fff; }

    .bg-free2-5 .row { font-family: ThaiSansNeueBold; padding: 40px 0; }

    .bg-free2-5 .h1-title { color: #fff; line-height: 30px; font-size: 24px; }

    .bg-free2-5 .h2-title { color: #fee823; font-size: 34px; line-height: 40px; margin-top: 10px; font-weight: bold; }
        .bg-free2-5 .h2-title a { color: #fee823; }
/* What is free ecommerce */
.free2-button.whatis .common-btn10 { padding: 15px 30px; font-size: 28px; line-height: 40px; font-family: ThaiSansNeueBold; }

.bg-whatis-1 { background: url(Images/web2017/Background/bg-whatis-1.jpg) repeat-x left top; clear: left; float: left; width: 100%; border-bottom: solid 2px #fff; }

.bg-whatis-1-inner { background: url(Images/web2017/Background/bg-whatis-1img.png) no-repeat center bottom; }

.bg-whatis-1 .row { padding: 0 20px; }

.bg-whatis-1 .text-col { float: right; font-family: ThaiSansNeueBold; padding: 100px 0 0; text-align: left; font-size: 48px; line-height: 60px; color: #121212; min-height: 657px; position: relative; }

.bg-whatis-1 .h1-title { font-weight: bold; }

.bg-whatis-1 .font66 { font-size: 66px; }

.bg-whatis-1 .h3-title { font-size: 24px; line-height: 28px; }

.bg-whatis-1 .h4-title { font-family: ThaiSansNeue; font-size: 36px; line-height: 36px; }

.bg-whatis-1-footer { position: absolute; bottom: 50px; }

.bg-whatis-2 { background: url(Images/web2017/Background/bg-whatis-2img.jpg) repeat-x left top; clear: left; float: left; width: 100%; border-bottom: solid 2px #fff; }

    .bg-whatis-2 .row { padding: 0 20px; }

.bg-whatis-2-inner { background: url(Images/web2017/Background/bg-whatis-2img.jpg) no-repeat center bottom; }

.bg-whatis-2 .text-col { float: left; font-family: ThaiSansNeueBold; padding: 90px 0 0; text-align: left; line-height: 30px; font-size: 17px; color: #121212; min-height: 657px; }

.bg-whatis-2 .h1-title { margin: 10px 0; font-size: 48px; color: #148be0; line-height: 54px; }

.bg-whatis-2 .h2-title { margin: 25px 0 5px; font-size: 36px; line-height: 40px; }

.bg-whatis-2 .font44 { font-size: 44px; font-weight: bold; }

.bg-whatis-2 .h3-title { margin: 0 0 25px; font-size: 30px; line-height: 36px; }

.bg-whatis-2 .h4-title { margin: 25px 0; font-family: CSPraJad; }

.bg-whatis-2 .h5-title { margin: 20px 0; }

.bg-whatis-2 .web-link { color: #155198; font-family: CSPraJad; font-weight: bold; text-decoration: underline; }

    .bg-whatis-2 .web-link:hover { color: #148be0; }

.bg-whatis-3 { background: #E0F1FE url(Images/web2017/Background/bg-whatis-3img.jpg) no-repeat center top; clear: left; float: left; width: 100%; border-bottom: solid 2px #fff; }

    .bg-whatis-3 .row { padding: 0 20px; }

    .bg-whatis-3 .text-col { float: left; font-family: ThaiSansNeueBold; padding: 120px 0; text-align: left; color: #121212; min-height: 657px; }

    .bg-whatis-3 .h1-title, .bg-whatis-3 .h2-title { margin: 0; color: #f98701; font-weight: normal; line-height: 54px; font-size: 48px; }

    .bg-whatis-3 .h3-title { margin: 30px 0; font-size: 36px; line-height: 40px; }

.bg-whatis-4 { background: #FFFDFE url(Images/web2017/Background/bg-whatis-4.jpg) no-repeat center top; clear: left; float: left; width: 100%; border-bottom: solid 2px #fff; }

    .bg-whatis-4 .row { padding: 0 20px; background: url(Images/web2017/Background/bg-whatis-4img.png) no-repeat left bottom; min-height: 657px; }

    .bg-whatis-4 .text-col-title { width: 100%; float: left; padding: 75px 0 10px; text-align: center; font-family: ThaiSansNeueBold; }

    .bg-whatis-4 .text-col { float: right; padding: 20px 0 0; text-align: left; line-height: 30px; font-size: 17px; color: #121212; }

    .bg-whatis-4 .h1-title { margin: 0; font-size: 48px; color: #357FD3; line-height: 60px; }

    .bg-whatis-4 .h2-title { margin: 0; font-size: 48px; line-height: 60px; }

    .bg-whatis-4 .h3-title { margin: 10px 0 20px; font-family: CSPraJad; clear: left; float: left; width: 100%; }

        .bg-whatis-4 .h3-title.no-leading { margin: 0; }

    .bg-whatis-4 .text-col .title-clear { clear: left; float: left; width: 100%; }

    .bg-whatis-4 .free2-button { clear: left; float: left; width: 100%; margin: 15px 0; }

.features-title-mobile { display: none; width: 100%; text-align: center; margin: 0; }

    .features-title-mobile .ToggleFeature { display: block; cursor: pointer; }

    .features-title-mobile .ToggleFeatureIcon { background: url(Images/web2017/bullet/bullet-feature.png) no-repeat right 62%; padding-right: 35px; line-height: 56px; min-height: 56px; color: #f8fd2b; font-family: ThaiSansNeueBold; text-transform: uppercase; font-size: 30px; }

.features-menu-panel.hide { display: block !important; }

.features .sticky-wrapper { height: auto !important; }

.bg-business-class { background: #FBFDFF url(Images/web2017/Background/BG-BusinessClass.jpg) no-repeat center top; clear: left; float: left; width: 100%; }

    .bg-business-class .row { padding: 0 20px; }

    .bg-business-class .text-col { float: left; font-family: ThaiSansNeueBold; padding: 70px 0 0; text-align: left; color: #121212; min-height: 550px; }

    .bg-business-class .h1-title { margin: 0 0 15px; font-size: 72px; color: #0153ea; line-height: 54px; clear: left; float: left; width: 100%; }

    .bg-business-class .h2-title { margin: 15px 0 0; font-size: 42px; line-height: 46px; clear: left; float: left; width: 100%; }

    .bg-business-class .h3-title { margin: 0 0 20px; font-size: 24px; line-height: 1.2; clear: left; float: left; width: 100%; }

    .bg-business-class .h4-title { margin: 10px 0; font-family: ThaiSansNeue; clear: left; float: left; width: 100%; line-height: 30px; font-size: 18px; color: #121212; }

        .bg-business-class .h4-title .title-clear { clear: left; float: left; width: 100%; }

        .bg-business-class .h4-title.color { color: #0153ea; }


/*How can we help you?*/
.common-fb-btn { z-index: 0; background: #284386 url(Images/web2017/bullet/arrow-right-white.png) no-repeat 95% 24px; color: #fff; float: left; padding: 10px 35px 10px 30px; transition: background 0.5s ease-out, border 0.5s ease-out; font-size: 24px; line-height: 40px; font-family: ThaiSansNeueBold; border: solid 1px #fff; }

.common-adw-btn { z-index: 0; background: #cf3d30 url(Images/web2017/bullet/arrow-right-white.png) no-repeat 95% 24px; color: #fff; float: left; padding: 10px 35px 10px 30px; transition: background 0.5s ease-out, border 0.5s ease-out; font-size: 24px; line-height: 40px; font-family: ThaiSansNeueBold; border: solid 1px #fff; }


    .common-fb-btn:hover, .common-adw-btn:hover { border: 0; background: #0681ee url(Images/web2017/bullet/arrow-right-white.png) no-repeat 95% 24px; color: #fff; transition: background 0.5s ease-out, border 0.5s ease-out; border: solid 1px #fff; }

.bg-cando .row { padding: 0 10px; }

.bg-cando-1 { background: #EEEEEE url(Images/web2017/Background/bg-cando-1.jpg) no-repeat center top; clear: left; float: left; width: 100%; border-bottom: solid 1px #fff; }

    .bg-cando-1 .text-col { float: left; font-family: ThaiSansNeueBold; padding: 140px 0 50px; text-align: left; color: #121212; min-height: 657px; }

    .bg-cando-1 .h1-title { margin: 0; color: #357FD3; line-height: 54px; font-size: 48px; margin: 0 0 20px; }

    .bg-cando-1 .h2-title { line-height: 54px; font-size: 48px; }

    .bg-cando-1 .h3-title { margin: 0 0 40px; font-size: 42px; line-height: 46px; }

.bg-cando-2 { background: #F9FAFC url(Images/web2017/Background/bg-cando-2.jpg) no-repeat center top; clear: left; float: left; width: 100%; border-bottom: solid 1px #fff; }

    .bg-cando-2 .text-col { float: right; font-family: ThaiSansNeueBold; padding: 100px 0 50px; text-align: left; color: #121212; min-height: 657px; }

    .bg-cando-2 .h1-title { color: #357FD3; line-height: 54px; font-size: 48px; }

    .bg-cando-2 .h4-title { color: #357FD3; line-height: 54px; font-size: 48px; margin: 0 0 30px; }

    .bg-cando-2 .h2-title { margin: 0 0 30px; font-size: 42px; line-height: 46px; }

    .bg-cando-2 .h3-title { margin: 0 0 40px; font-size: 18px; line-height: 24px; clear: left; float: left; width: 100%; }

        .bg-cando-2 .h3-title .title-clear { clear: left; float: left; width: 100%; }

.bg-cando-3 { background: #FFFEF1 url(Images/web2017/Background/bg-cando-3.jpg) no-repeat center top; clear: left; float: left; width: 100%; border-bottom: solid 1px #fff; }

    .bg-cando-3 .text-col { float: left; font-family: ThaiSansNeueBold; padding: 80px 0 0; text-align: left; font-size: 18px; color: #121212; min-height: 657px; }

    .bg-cando-3 .h1-title { margin: 20px 0; font-size: 48px; color: #ff7b10; line-height: 50px; clear: left; float: left; width: 100%; }

        .bg-cando-3 .h1-title .title-clear { clear: left; float: left; line-height: 50px; }

        .bg-cando-3 .h1-title .title-clear1 { float: left; line-height: 50px; }

        .bg-cando-3 .h1-title .title-clear2 { clear: left; float: left; line-height: 78px; height: 80px; }

        .bg-cando-3 .h1-title .title-clear3 { float: left; line-height: 72px; height: 80px; margin-left: 5px; }

    .bg-cando-3 .font72 { font-size: 72px; line-height: 60px; }

    .bg-cando-3 .h2-title { margin: 30px 0; font-size: 42px; line-height: 45px; }

    .bg-cando-3 .h3-title { margin: 0 0 50px; font-size: 18px; line-height: 24px; clear: left; float: left; width: 100%; }

        .bg-cando-3 .h3-title .title-clear { clear: left; float: left; width: 100%; }

.bg-cando-4 { background: #F9FAFC url(Images/web2017/Background/bg-cando-4.jpg) no-repeat center top; clear: left; float: left; width: 100%; border-bottom: solid 1px #fff; }

    .bg-cando-4 .text-col { float: right; font-family: ThaiSansNeueBold; padding: 90px 0 0; text-align: left; font-size: 18px; color: #121212; min-height: 657px; width: 48%; }

    .bg-cando-4 .h1-title { margin: 10px 0; font-size: 48px; color: #1c3fa3; line-height: 50px; }

    .bg-cando-4 .h2-title { margin: 20px 0 30px; font-size: 42px; line-height: 45px; clear: left; float: left; width: 100%; }

        .bg-cando-4 .h2-title .title-clear { clear: left; float: left; width: 100%; }

    .bg-cando-4 .h3-title { margin: 0 0 30px; font-size: 18px; line-height: 24px; }

        .bg-cando-4 .h3-title a { color: #121212; }

            .bg-cando-4 .h3-title a:hover { color: #ff7b10; }

    .bg-cando-4 .h4-title { margin: 0; font-size: 24px; line-height: 30px; color: #135fdd; }

    .bg-cando-4 .free2-button { margin: 50px 0 20px; }

        .bg-cando-4 .free2-button a { margin-right: 15px; font-size: 23px; }

.bg-cando-5 { background: #F9FAFC url(Images/web2017/Background/bg-cando-5.jpg) no-repeat center top; clear: left; float: left; width: 100%; border-bottom: solid 1px #fff; }

    .bg-cando-5 .text-col { float: left; font-family: ThaiSansNeueBold; padding: 90px 0 0; text-align: left; font-size: 18px; color: #121212; min-height: 657px; }

    .bg-cando-5 .h1-title { margin: 10px 0; font-size: 48px; color: #038531; line-height: 50px; }

    .bg-cando-5 .h2-title { margin: 0 0 30px; font-size: 42px; line-height: 45px; clear: left; float: left; width: 100%; color: #038531; }

    .bg-cando-5 .h3-title { margin: 0 0 30px; font-size: 18px; line-height: 24px; }

    .bg-cando-5 .h4-title { margin: 0; font-size: 24px; line-height: 30px; color: #135fdd; }

        .bg-cando-5 .h4-title a { color: #135fdd; }

            .bg-cando-5 .h4-title a:hover { color: #ff7b10; }

    .bg-cando-5 .free2-button { margin: 50px 0 20px; }

        .bg-cando-5 .free2-button a { margin-right: 15px; }

.bg-cando-6 { background: url(Images/web2017/Background/bg-cando-6.jpg) repeat left top; clear: left; float: left; width: 100%; border-bottom: solid 1px #fff; }

    .bg-cando-6 .text-col { width: 100%; padding: 40px 0; text-align: center; }

    .bg-cando-6 .h1-title { margin: 0; font-size: 48px; color: #4286f5; line-height: 60px; font-family: ThaiSansNeueBold; }

    .bg-cando-6 .free2-button { margin: 30px auto 0; display: table; }

.bg-cando .bg-free2-5 .row { padding: 40px 0; }

/* default banner */
.bg-default { background: #FFDA7A url(Images/web2017/Background/bg-default.jpg) no-repeat center top; width: 100%; border-bottom: solid 1px #fff; }

    .bg-default .text-col { float: right; font-family: ThaiSansNeueBold; padding: 100px 0 50px; text-align: left; color: #0f0a0a; min-height: 657px; padding-right: 50px; }

    .bg-default .h1-title { line-height: 54px; font-size: 48px; margin: 0; background: url(Images/web2017/Background/bg-default-label.png) no-repeat right bottom; padding-top: 60px; padding-right: 120px; clear: left; float: left; font-weight: bold; }

    .bg-default .h2-title { line-height: 54px; font-size: 48px; clear: left; float: left; margin: 0 0 10px; font-weight: bold; }

    .bg-default .h3-title { margin: 0 0 40px; font-size: 36px; line-height: 40px; clear: left; float: left; }

    .bg-default .common-btn10 { z-index: 0; background-color: #357FD3; padding: 10px 0; width: 215px; font-size: 24px; line-height: 40px; font-family: ThaiSansNeueBold; border: solid 1px #357FD3; text-align: center; margin-right: 15px; }

    .bg-default .common-btn9 { z-index: 0; padding: 10px 0; width: 215px; font-size: 24px; line-height: 40px; font-family: ThaiSansNeueBold; text-align: center; }

        .bg-default .common-btn9:hover, .bg-default .common-btn10:hover { border: 0; background-color: #0681ee; border: solid 1px #0681ee; }



/*Store Signup Popup*/
.signup-popup-background { height: 100%; background: rgba(0,0,0,0.9); }

.signup-popup-panel { width: 400px; margin: auto; clear: left; float: left; }

    .signup-popup-panel .input-row { clear: left; float: left; width: 100%; min-height: 40px; margin: 10px auto; text-align: left; }

        .signup-popup-panel .input-row .Label { display: none; float: left; width: 30%; font-family: ThaiSansNeue; font-size: 26px; color: #1c1c1c; line-height: 40px; }

        .signup-popup-panel .input-row .TextBox { width: 10%; position: relative; }

        .signup-popup-panel .input-row .button-signup { letter-spacing: 1px; color: #fff; height: 50px; line-height: 36px; text-align: center; background-color: #4286f5; transition: background 0.5s ease-out; padding: 0 30px; border: solid 1px #357FD3; font-size: 24px; font-family: ThaiSansNeue; cursor: pointer; float: right; width: 100%; }

            .signup-popup-panel .input-row .button-signup:hover { background-color: #357FD3; transition: background 0.5s ease-out; color: #fff; }

    .signup-popup-panel input[type="text"] { border: solid 1px #4e4242; padding: 0 8px; font-size: 24px; font-family: ThaiSansNeue; color: #888; height: 50px; z-index: 1; background-color: #f0f0f0; }

        .signup-popup-panel input[type="text"]:focus { color: #000; border: solid 1px #000; }

    .signup-popup-panel .input-row .validator-style { font-family: CSPraJad; font-size: 15px; line-height: 20px; float: left; margin-top: 5px; }

    .signup-popup-panel .title { color: #fff; text-align: center; }

    .signup-popup-panel .input-row.title .title { font-size: 36px; font-weight: bold; clear: left; float: left; width: 100%; }

    .signup-popup-panel .input-row.title .sub-title { font-size: 24px; margin: 10px auto; clear: left; float: left; width: 100%; }

    .signup-popup-panel .close { background: url(Images/Icon/icon-delete2.svg) no-repeat left top; height: 22px; width: 22px; cursor: pointer; display: block; float: right; }

        .signup-popup-panel .close:hover { background-position: left bottom; }

.default-button { float: right; margin-top: 20px; }

.navigation-inner { float: left; width: 100%; }

/* Terms of service */

.terms { clear: left; float: left; width: 100%; padding: 40px 0; }

    .terms .row { padding: 0 10px; }

.term-title-col { clear: left; float: left; width: 100%; border-bottom: solid 1px #ececec; padding-bottom: 30px; margin-bottom: 20px; }

.terms .h1-title { font-size: 48px; color: #357FD3; line-height: 60px; font-family: ThaiSansNeueBold; width: 100%; text-align: center; }

.terms .h2-title { margin: 0; font-size: 36px; color: #555; line-height: 48px; font-family: ThaiSansNeue; width: 100%; text-align: center; margin-bottom: 10px; }

.term-detail-col { margin: 0 0 20px; clear: left; float: left; width: 100%; padding: 0 20px; }

.terms ol { clear: left; float: left; width: 100%; counter-reset: item; list-style-type: none; padding: 0; margin: 0; }

    .terms ol > li { font-family: ThaiSansNeueBold; font-size: 26px; line-height: 30px; color: #357FD3; clear: left; margin-top: 20px; display: block; }

        .terms ol > li:before { position: relative; content: counters(item, ".") ". "; counter-increment: item; }

    .terms ol ol { position: relative; margin-bottom: 20px; }

        .terms ol ol > li:before { position: absolute; left: 0; padding-left: 30px; } 

        .terms ol ol > li { padding-left: 80px; padding-right: 10px; font-family: CSPraJad; line-height: 28px; font-size: 17px; color: #121212; text-align: justify; }

        .terms ol ol.child-item > li { padding-left: 60px; }
            .terms ol ol.child-item > li:before { padding-left: 0; }

        .FreeTraining { background-color: #fff; }

.FreeEcomCourseTitle { padding: 20px 0 40px; }

    .FreeEcomCourseTitle h1 { color: #4096ef; }

    .FreeEcomCourseTitle h2 { color: #fb9408; }

    .FreeEcomCourseTitle h3 { font-weight: bold; font-size: 24px; }

    .FreeEcomCourseTitle .ProductQuickInfoShortDescription { margin: 20px 0; color: #454545; line-height: 30px; font-family: CSPraJad; font-size: 18px; }

    .FreeEcomCourseTitle .detail-list { display: table; margin: 20px auto; float: none; clear: left; text-align: left; width: 660px; }

        .FreeEcomCourseTitle .detail-list .left { float: left; width: 40%; padding-right: 10px; font-weight: bold; clear: left; }

        .FreeEcomCourseTitle .detail-list .right { float: left; }

.course-calendar { margin: 10px 0; }

.FreeEcomCourseTitle .ProductQuickInfoPrice { margin: 0 0 15px 0; color: #14960b; font-size: 36px; font-family: ThaiSansNeueBold; }

.FreeEcomCourseTitle .ProductQuickInfoOption { display: table; margin: 0 auto; float: none; }

.FreeEcomCourseTitle .ProductDetailsResponsiveAddToCart { margin-top: 10px !important; margin-left: 10px; }

.FreeEcomCourseDetail { background-color: #f5f6f8; padding: 0 0 40px; }

    .FreeEcomCourseDetail .row { padding: 0 10px; }

    .FreeEcomCourseDetail h2 { text-align: center; border-bottom: solid 1px #767d84; padding: 30px 0; margin-top: 0; }

    .FreeEcomCourseDetail .title { font-family: CSPraJad; font-weight: bold; font-size: 16px; margin: 25px 0 15px; line-height: 24px; }

    .FreeEcomCourseDetail .ProductDetailsResponsiveDescriptionLongDiv { margin-bottom: 30px; }

        .FreeEcomCourseDetail .ProductDetailsResponsiveDescriptionLongDiv ul { list-style-position: outside; }

            .FreeEcomCourseDetail .ProductDetailsResponsiveDescriptionLongDiv ul li { margin-left: 12px; padding-left: 0; }

.FreeTraining .ProductDetailsResponsiveAddToCart .common-btn10 { line-height: 30px; padding: 3px 40px 7px; border-radius: 30px; }

.SeminarMainDiv { background-color: #132088; padding: 20px 0; clear: left; float: left; width: 100%; }

    .SeminarMainDiv .row { padding: 0 10px; font-family: ThaiSansNeueBold; font-size: 24px; line-height: 30px; }

    .SeminarMainDiv .title { color: #f1e02f; padding: 5px 25px 12px 0; float: left; color: #f4f7fc; width: 23%; }

    .SeminarMainDiv .title1 { color: #54c7ff; font-size: 40px; line-height: 46px; width: 100%; float: left; }

    .SeminarMainDiv .info { color: #f1e02f; padding: 12px 35px 20px 35px; float: left; border-left: solid 2px #e8e8eb; }

        .SeminarMainDiv .info.first { width: 17%; }

        .SeminarMainDiv .info.second { width: 25%; }

        .SeminarMainDiv .info.third { width: 35%; }

.SeminarSchedule { background-color: #f5f6f8; padding: 0 0 40px 0; clear: left; float: left; width: 100%; }

    .SeminarSchedule .row { padding: 0 10px; font-family: CSPraJad; }

    .SeminarSchedule .main-row { border-top: solid 1px #767d84; padding: 15px 0px; clear: left; float: left; width: 100%; }

    .SeminarSchedule h2 { text-align: center; padding: 30px 0; margin: 0; }

    .SeminarSchedule .info { font-size: 16px; line-height: 24px; float: left; width: 33.33%; color: #1a1a1a; padding: 20px 15px 20px 0; }

        .SeminarSchedule .info.width80 { width: 30%; }

    .SeminarSchedule .title1 { clear: left; float: left; width: 100%; font-weight: bold; font-size: 24px; line-height: 36px; color: #69529a; padding-top: 30px; }

    .SeminarSchedule .title2 { clear: left; float: left; width: 100%; font-weight: bold; font-size: 20px; line-height: 30px; color: #1a1a1a; }

    .SeminarSchedule .title3 { clear: left; float: left; width: 100%; font-size: 16px; }

    .SeminarSchedule .title4 { clear: left; float: left; width: 100%; font-weight: bold; font-size: 18px; }

    .SeminarSchedule .title5 { clear: left; float: left; width: 100%; font-size: 18px; }

    .SeminarSchedule .title6 { clear: left; float: left; width: 100%; font-size: 18px; font-weight: bold; line-height: 60px; margin: 15px 0; }

    .SeminarSchedule .title7 { clear: left; float: left; width: 100%; font-size: 12px; }

    .SeminarSchedule .image { clear: left; float: left; width: 100%; margin: 15px 0; text-align: left; }


.SeminarFormDiv { background-color: #f2f1f7; padding: 25px 0 40px; clear: left; float: left; width: 100%; font-family: ThaiSansNeueBold; text-align: center; }

    .SeminarFormDiv .title1 { color: #1237ad; font-size: 48px; clear: left; float: left; width: 100%; }

        .SeminarFormDiv .title1 .big-font { font-size: 60px; }

    .SeminarFormDiv .title2 { color: #111; font-size: 24px; clear: left; float: left; width: 100%; line-height: 40px; margin-bottom: 40px; }

    .SeminarFormDiv .title3 { color: #111; font-size: 30px; clear: left; float: left; width: 100%; line-height: 40px; margin: 20px 0; }

.SeminarFormPanel { clear: left; display: table; width: 400px; margin: 15px auto; }

.SeminarForm { color: #8d8e90; font-size: 21px; font-family: CSPraJad; width: 100%; float: left; clear: left; margin: 0 0 18px; text-align: left; }

input[type="text"].SeminarFormTextBox { width: 98%; height: 60px; padding: 10px; line-height: 40px; color: #8d8e90; font-size: 21px; border: solid 1px #bbb; background-color: #fdfdfd; font-family: CSPraJad; margin: 0; }

    input[type="text"].SeminarFormTextBox:focus { border: solid 1px #0161b1; background-color: #fff; color: #333; }

.SeminarFormButton { clear: left; padding-top: 15px; float: left; width: 100%; }

    .SeminarFormButton a { background-color: #357FD3; font-size: 36px; font-family: ThaiSansNeueBold; color: #fdf512; padding: 10px 0; line-height: 40px; transition: all 0.5s ease-out; width: 100%; display: block; }

        .SeminarFormButton a:hover { background-color: #132088; color: #ffe900; }

.bg-seminar-post { background: url(Images/web2017/Background/bg-seminar-post.jpg) no-repeat center top; clear: left; float: left; width: 100%; color: #fff; line-height: 35px; padding: 30px 0 40px; text-align: center; font-family: ThaiSansNeueBlack; font-size: 24px; }

    .bg-seminar-post .title1 { color: #eefb1c; font-size: 30px; }

    .bg-seminar-post .title2 { color: #eefb1c; }


.bg-default-banner { background: #FAF5EC url(Images/web2017/Background/bg-training-4.jpg) no-repeat center top; clear: left; float: left; width: 100%; border-bottom: solid 1px #fff; }

.bg-default-banner-inner { background: url(Images/web2017/Background/img-training-4.png) no-repeat center top; width: 100%; }

.bg-default-banner .text-col { float: left; margin-left: 62%; font-family: ThaiSansNeueBold; padding: 90px 0 50px; text-align: left; min-height: 657px; color: #262528; }

.bg-default-banner .h1-title { line-height: 50px; font-size: 46px; font-weight: bolder; background: url(Images/web2017/Bullet/label-training-4.png) no-repeat right top; padding: 62px 10px 10px 0; font-family: ThaiSansNeueBold; }

.bg-default-banner .h2-title { line-height: 40px; font-size: 30px; margin-bottom: 20px; font-weight: bold; }
/* free 2*/
.bg-default-banner .banner-button1 { margin: 30px 0; height: 60px; }

    .bg-default-banner .banner-button1 .common-btn10 { padding: 12px 60px; font-size: 28px; background-color: #4286f5; line-height: 40px; font-family: ThaiSansNeueBold; height: auto; width: auto; }

        .bg-default-banner .banner-button1 .common-btn10:hover { background-color: #264BC4; }

/*-------- Paysbuy Promotion---------*/
.bg-facebook-1 { background: #EEEEEE url(Images/web2017/Background/bg-facebook-1.jpg) no-repeat center top; clear: left; float: left; width: 100%; border-bottom: solid 1px #fff; }

    .bg-facebook-1 .text-col { float: left; font-family: ThaiSansNeueBold; padding: 80px 0; text-align: left; color: #121212; min-height: 657px; }

    .bg-facebook-1 .h1-title { line-height: 54px; font-size: 48px; margin: 0 0 10px; }

    .bg-facebook-1 .h2-title { line-height: 54px; font-size: 48px; color: #0757ba; margin: 0 0 10px; }

    .bg-facebook-1 .h3-title { margin: 0 0 40px; font-size: 48px; line-height: 54px; }

    .bg-facebook-1 .h4-title { font-size: 30px; line-height: 40px; }

.bg-google-4 { background: #fff url(Images/web2017/Background/bg-google-4.jpg) no-repeat center top; clear: left; float: left; width: 100%; border-bottom: solid 1px #fff; }

    .bg-google-4 .text-col { float: left; font-family: ThaiSansNeueBold; padding: 120px 0 0 80px; text-align: left; font-size: 36px; color: #3c3c3c; min-height: 657px; }

    .bg-google-4 .h1-title { line-height: 52px; font-size: 48px; margin: 0; color: #e52a12; }

    .bg-google-4 .h2-title { line-height: 52px; font-size: 36px; margin: 0 0 20px; }

    .bg-google-4 .h3-title { line-height: 40px; font-size: 30px; }

    .bg-google-4 .h4-title { margin: 0 0 40px; color: #119e5a; }

    .bg-google-4 .title-clear1 { clear: left; float: left; width: 100%; }

.bg-paysbuy .row { padding: 0 20px; }

.bg-paysbuy .bg-free2-5 { background-color: #357FD3; }

    .bg-paysbuy .bg-free2-5 .row { padding: 40px 0; }

.Paysbuy-Promotion { background: url(Images/web2017/Background/bg-paysbuy1-pro30062017-1.jpg) no-repeat center top; width: 100%; height: 657px; }

.Paysbuy-Special-Promotion { background: url(Images/web2017/Background/bg-promotion-special.jpg) no-repeat center top; width: 100%; height: 244px; }

.bg-paysbuy .bg-google-4 .text-col { padding-top: 160px; padding-left: 0; }

.bg-paysbuy .bg-google-4 .h1-title { line-height: 60px; font-size: 48px; margin: 0; color: #010101; }

    .bg-paysbuy .bg-google-4 .h1-title .FontOrange { color: #cf3d30; }

.bg-paysbuy .bg-google-4 .h2-title { line-height: 52px; font-size: 40px; margin: 0 0 60px; color: #010101; }

.bg-fbonline { clear: left; float: left; width: 100%; background-color: #fff; }

    .bg-fbonline .video-col { float: left; font-family: ThaiSansNeueBold; padding: 70px 30px 20px 0; text-align: center; width: 58%; font-size: 24px; color: #0b0b0b; }

    .bg-fbonline .text-col { float: left; font-family: ThaiSansNeueBold; padding: 80px 0 20px; text-align: left; min-height: 560px; width: 42%; color: #1a1a1b; }

    .bg-fbonline .info-1 { line-height: 30px; margin-top: 20px; }

    .bg-fbonline .h1-title { line-height: 50px; font-size: 48px; margin-bottom: 10px; color: #202662; }

    .bg-fbonline .h2-title { line-height: 40px; font-size: 36px; margin-bottom: 20px; }

    .bg-fbonline .h3-title { line-height: 36px; font-size: 30px; margin-bottom: 10px; }

    .bg-fbonline .h4-title { line-height: 40px; font-size: 36px; color: #1169df; }

.bg-adwonline { clear: left; float: left; width: 100%; background-color: #fff; }

    .bg-adwonline .video-col { float: left; font-family: ThaiSansNeueBold; padding: 70px 30px 20px 0; text-align: center; width: 58%; font-size: 24px; color: #0b0b0b; }

    .bg-adwonline .text-col { float: left; font-family: ThaiSansNeueBold; padding: 80px 0 20px; text-align: left; min-height: 560px; width: 42%; color: #1a1a1b; }

    .bg-adwonline .info-1 { line-height: 30px; margin-top: 20px; }

    .bg-adwonline .h1-title { line-height: 50px; font-size: 48px; margin-bottom: 10px; color: #058246; }

    .bg-adwonline .h2-title { line-height: 40px; font-size: 36px; margin-bottom: 20px; }

    .bg-adwonline .h3-title { line-height: 36px; font-size: 30px; margin-bottom: 10px; }

    .bg-adwonline .h4-title { line-height: 40px; font-size: 36px; color: #098348; }

.bg-paysbuy .common-fb-btn { z-index: 0; background-color: #3c5a99; background-image: none; color: #fff; float: left; padding: 10px 0; transition: background 0.5s ease-out, border 0.5s ease-out; font-size: 30px; line-height: 40px; font-family: ThaiSansNeueBold; margin-right: 10px; width: 49%; margin-right: 1%; text-align: center; border: 0; }

    .bg-paysbuy .common-fb-btn:hover { background-color: #193a80; color: #fff; background-image: none; }

.bg-paysbuy .common-adw-btn { z-index: 0; background-color: #119e5a; background-image: none; color: #fff; float: left; padding: 10px 0; transition: background 0.5s ease-out, border 0.5s ease-out; font-size: 30px; line-height: 40px; font-family: ThaiSansNeueBold; margin-right: 10px; width: 49%; margin-right: 1%; text-align: center; border: 0; }

    .bg-paysbuy .common-adw-btn:hover { background-color: #00783e; color: #fff; background-image: none; }

.bg-paysbuy .common-fb-btn1 { z-index: 0; background: transparent url(Images/web2017/Bullet/btn-arrow-blue.png) no-repeat 96% center; color: #202662; float: left; padding: 8px 0 10px; transition: background 0.5s ease-out, border 0.5s ease-out; font-size: 24px; line-height: 38px; font-family: ThaiSansNeueBold; border: solid 2px #3c5a99; width: 49%; margin-right: 1%; text-align: center; }

.common-fb-btn1:hover { background: #193a80 url(Images/web2017/Bullet/btn-arrow-white.png) no-repeat 96% center; color: #fff; }

.common-adw-btn1 { z-index: 0; background: transparent url(Images/web2017/Bullet/btn-arrow-green.png) no-repeat 96% center; color: #07703e; float: left; float: left; padding: 8px 0 10px; transition: background 0.5s ease-out, border 0.5s ease-out; font-size: 24px; line-height: 38px; font-family: ThaiSansNeueBold; border: solid 2px #119e5a; width: 49%; margin-right: 1%; text-align: center; }

    .common-adw-btn1:hover { background: #119e5a url(Images/web2017/Bullet/btn-arrow-white.png) no-repeat 96% center; color: #fff; }

.short-bar-green2 { width: 120px; height: 7px; background-color: #008e7a; margin: 40px 0; }

.short-bar-navy1 { width: 120px; height: 7px; background-color: #2b4c8c; margin: 35px 0 30px; }

.banner-paysbuy { background: url(Images/web2017/Background/banner-paysbuy.jpg) no-repeat center top; width: 100%; height: 657px; clear: left; float: left; }

.banner-paysbuy-button { width: 620px; float: right; margin-top: 505px; }

.btn-paysbuy { line-height: 0; padding: 0; width: 60%; margin: 0 20%; box-shadow: 3px 3px 3px #222; color: #fdfb31; font-family: ThaiSansNeueBold; font-style: italic; text-align: center; display: block; border-radius: 60px; background: #0bae5f url(Images/web2017/Background/btn-paysbuy.png) no-repeat center center; font-size: 0; height: 65px; background-size: auto 55px; }

    .btn-paysbuy:hover { background: #34c65a url(Images/web2017/Background/btn-paysbuy.png) no-repeat center center; text-shadow: -2px -2px 0 #006b4a, 2px -2px 0 #006b4a, -2px 2px 0 #006b4a, 2px 2px 0 #006b4a; background-size: auto 55px; }

.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; }

    .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

.Dtac-Promotion { background: url(Images/web2017/Background/bg-dtac1.jpg) no-repeat center top; width: 100%; height: 657px; }

.banner-dtac { background: url(Images/web2017/Background/banner-dtac.jpg) no-repeat center top; width: 100%; height: 657px; clear: left; float: left; }

.banner-dtac-button { width: 620px; float: right; margin-top: 510px; }

.btn-dtac { line-height: 0; padding: 0; width: 60%; margin: 0 20%; box-shadow: 3px 3px 3px #004a73; color: #fdfb31; font-family: ThaiSansNeueBold; font-style: italic; text-align: center; display: block; border-radius: 60px; background: #0688ec url(Images/web2017/Background/btn-dtac.png) no-repeat center center; font-size: 0; height: 65px; text-shadow: -2px -2px 0 #006b4a, 2px -2px 0 #006b4a, -2px 2px 0 #006b4a, 2px 2px 0 #006b4a; background-size: auto 55px; }

    .btn-dtac:hover { background: #00c2ff url(Images/web2017/Background/btn-dtac.png) no-repeat center center; background-size: auto 55px; text-shadow: -2px -2px 0 #006b4a, 2px -2px 0 #006b4a, -2px 2px 0 #006b4a, 2px 2px 0 #006b4a; }


.common-default-btn1 { z-index: 0; background-color: #357FD3; color: #fff; float: left; padding: 10px 30px; transition: background 0.5s ease-out, border 0.5s ease-out; font-size: 24px; line-height: 40px; font-family: ThaiSansNeueBold; border: solid 1px #fff; margin-right: 10px; }

.common-default-btn2 { z-index: 0; background: transparent url(Images/web2017/bullet/arrow-right-white.png) no-repeat 95% 24px; color: #fff; float: left; padding: 10px 30px; transition: background 0.5s ease-out, border 0.5s ease-out; font-size: 20px; line-height: 40px; font-family: ThaiSansNeueBold; border: solid 1px #fff; }

.common-default-btn1:hover { background-color: #0c51ff; color: #fff; transition: background 0.5s ease-out, border 0.5s ease-out; border: solid 1px #0c51ff; }

.common-default-btn2:hover { background: #4286F5 url(Images/web2017/bullet/arrow-right-white.png) no-repeat 95% 24px; color: #fff; transition: background 0.5s ease-out, border 0.5s ease-out; border: solid 1px #4286F5; }

/* customer list carousel begin*/
.cycle-slideshow, .cycle-slideshow * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }

.cycle-slideshow { width: 100%; margin: 0 auto; }

.cycle-carousel-wrap { margin: 0px; padding: 0px; top: 0px; width: 100%; }

.cycle-slideshow img { position: absolute; top: 0; left: 0; padding: 0; display: block; }
    /* in case script does not load */
    .cycle-slideshow img:first-child { position: static; z-index: 100; }
/* pager */
.cycle-pager { text-align: center; width: 100%; z-index: 500; }

    .cycle-pager span { font-family: arial; font-size: 50px; width: 16px; height: 16px; display: inline-block; color: #ddd; cursor: pointer; }

        .cycle-pager span.cycle-pager-active { color: #D69746; }

    .cycle-pager > * { cursor: pointer; }

/* caption */
.cycle-caption { position: absolute; color: white; bottom: 15px; right: 15px; z-index: 700; }

/* overlay */
.cycle-overlay { font-family: tahoma, arial; position: absolute; bottom: 0; width: 100%; z-index: 600; background: black; color: white; padding: 15px; opacity: .5; }

/* prev / next links */
.cycle-prev, .cycle-next { position: absolute; top: 40%; width: 60px; z-index: 800; height: 60px; cursor: pointer; }

.cycle-prev { left: 0; background: url(Images/web2017/Icon/btn-prev.png) no-repeat 0 0; }

.cycle-next { right: 0; background: url(Images/web2017/Icon/btn-next.png) no-repeat 0 0; }

.cycle-prev:hover { background-position: left bottom; }

.cycle-next:hover { background-position: left bottom; }

.OurCustomerDiv { clear: left; float: left; width: 100%; }

.OurCustomerListTitle { clear: left; float: left; width: 100%; background-color: #fff; padding: 20px 0; text-align: center; color: #0f0a0a; }

    .OurCustomerListTitle .title1 { clear: left; font-size: 48px; font-family: ThaiSansNeueBlack, ThaiSansNeueBold; width: 100%; text-transform: uppercase; font-weight: bold; }

    .OurCustomerListTitle .title2 { clear: left; font-size: 30px; font-family: ThaiSansNeueBold; width: 100%; }

.OurCustomerList { clear: left; float: left; width: 100%; background-color: #f4f6fb; padding: 30px 0; }

    .OurCustomerList .container { position: relative; margin: 30px 0 20px; overflow: hidden; padding: 0 65px; width: 100%; }

.OurCustomerListItem { width: 33.33%; padding: 0 4px; margin-bottom: 15px; }

.OurCustomerList .TemplateItemStyle { max-height: 235px; height: 235px; overflow: hidden; }

.OurCustomerList .NewArrivalItem { height: 235px; width: 100%; overflow: hidden; background-position: top center; background-repeat: no-repeat; background-size: auto 100%; opacity: 1; transform: scale(1,1); transition-timing-function: linear; transition-duration: .4s; -webkit-transform: scale(1,1); -webkit-transition-timing-function: linear; -webkit-transition-duration: .4s; -moz-transform: scale(1,1); -moz-transition-timing-function: linear; -moz-transition-duration: .4s; }

    .OurCustomerList .NewArrivalItem .template-bg { width: 100%; height: 235px; opacity: 0; z-index: 1; transform: rotate(44deg) scale(1) skew(-6deg) translate(-400px); -webkit-transform: rotate(44deg) scale(1) skew(-6deg) translate(-400px); -moz-transform: rotate(44deg) scale(1) skew(-6deg) translate(-400px); -o-transform: rotate(44deg) scale(1) skew(-6deg) translate(-400px); -ms-transform: rotate(44deg) scale(1) skew(-6deg) translate(-400px); transition: 0.5s opacity linear, 0.5s transform linear; -webkit-transition: 0.5s opacity linear, 0.5s transform linear; }

    .OurCustomerList .NewArrivalItem a { display: block; white-space: normal; text-decoration: none; color: #fff; font-size: 36px; font-family: ThaiSansNeueBold; padding-top: 38%; text-align: center; text-transform: uppercase; z-index: 2; opacity: 0; -webkit-transform: translateY(0px) translateZ(0); transform: translateY(-0px) translateZ(0); -webkit-transition: .5s opacity cubic-bezier(.23,1,.32,1),.5s -webkit-transform cubic-bezier(.23,1,.32,1); transition: .5s opacity cubic-bezier(.23,1,.32,1),.5s transform cubic-bezier(.23,1,.32,1); -moz-transform: translateY(0) translateZ(0); -moz-transition: .5s opacity cubic-bezier(.23,1,.32,1),.5s transform cubic-bezier(.23,1,.32,1); position: absolute; top: 0; left: 0; width: 100%; height: 235px; }

    .OurCustomerList .NewArrivalItem:hover .template-bg { opacity: 1; transform: rotate(44deg) scale(2.5) skew(-6deg) translate(0px); -webkit-transform: rotate(44deg) scale(2.5) skew(-6deg) translate(0px); -moz-transform: rotate(44deg) scale(2.5) skew(-6deg) translate(0px); -o-transform: rotate(44deg) scale(2.5) skew(-6deg) translate(0px); -ms-transform: rotate(44deg) scale(2.5) skew(-6deg) translate(0px); transition: 0.5s opacity linear, 0.5s transform linear; -webkit-transition: 0.5s opacity linear, 0.5s transform linear; z-index: 0; }

    .OurCustomerList .NewArrivalItem:hover a { opacity: 1; -webkit-transform: translateY(-30px) translateZ(0); transform: translateY(-30px) translateZ(0); -webkit-transition: .6s opacity cubic-bezier(.23,1,.32,1),.6s -webkit-transform cubic-bezier(.23,1,.32,1); transition: .6s opacity cubic-bezier(.23,1,.32,1),.6s transform cubic-bezier(.23,1,.32,1); z-index: 1; }

/*----default promotion section---*/
.bg-default-promotion { clear: left; background-color: #fff; }

.promotion-item { width: 50%; float: left; margin: 30px 0; padding: 0 5px; }

.bg-promotion-top { width: 100%; padding: 13px; float: left; /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#0eb476+0,416bf3+84,2a57e9+100 */ background: #0eb476; /* Old browsers */ background: -moz-linear-gradient(-45deg, #0eb476 0%, #416bf3 84%, #2a57e9 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(-45deg, #0eb476 0%,#416bf3 84%,#2a57e9 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(135deg, #0eb476 0%,#416bf3 84%,#2a57e9 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0eb476', endColorstr='#2a57e9',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */ }

.bg-promotion-title { float: left; font-size: 18px; line-height: 24px; font-family: ThaiSansNeueBold; text-transform: uppercase; color: #fff; }

    .bg-promotion-title .engfont { font-family: Lovelo; }

.bg-promotion-body { clear: left; float: left; width: 100%; height: 305px; background-repeat: no-repeat; }

    .bg-promotion-body.paysbuy { background-image: url(Images/web2017/Background/hotpro-1-1.jpg); }

    .bg-promotion-body.free-training { background-image: url(Images/web2017/Background/hotpro-2-1.jpg); }

    .bg-promotion-body.dropship { background-image: url(Images/web2017/Background/hotpro-3-1.jpg); }

    .bg-promotion-body.Dtac { background-image: url(Images/web2017/Background/hotpro-dtac-1.jpg); }

    .bg-promotion-body.TKO2608 { background-image: url(Images/web2018/Background/hotpro-tko4-1.jpg); }

.bg-promotion-button { float: right; }

.common-promotion-btn { z-index: 0; background-color: transparent; color: #fff; float: left; padding: 10px 30px; transition: background 0.5s ease-out, border 0.5s ease-out; font-size: 18px; line-height: 30px; font-family: ThaiSansNeueBold; border: solid 1px #fff; }

    .common-promotion-btn:hover { background-color: #4286F5; color: #fff; border: solid 1px #fff; }

/******************************************/
/*-----dropship intro page 07-06-2017-----*/
/******************************************/

.bg-dropship .row { padding: 0 20px; }

.bg-dropship .bg-free2-5 .row { padding: 30px; }

.dropship-icon-scroll { background: url(Images/web2017/Icon/icon-slide-down-dark.png) no-repeat left top; width: 150px; height: 35px; position: absolute; bottom: 15px; right: 15px; animation: animatedDropshipBG 2s linear infinite; -moz-animation: animatedDropshipBG 2s linear infinite; /* Firefox */ -webkit-animation: animatedDropshipBG 2s linear infinite; /* Safari and Chrome */ -o-animation: animatedDropshipBG 2s linear infinite; /* Opera */ }

@keyframes animatedDropshipBG {
    from { background: url(Images/web2017/Icon/icon-slide-down-dark.png) no-repeat left top; }

    to { background: url(Images/web2017/Icon/icon-slide-down-dark-hover.png) no-repeat left top; }
}

@-webkit-keyframes animatedDropshipBG {
    from { background: url(Images/web2017/Icon/icon-slide-down-dark.png) no-repeat left top; }

    to { background: url(Images/web2017/Icon/icon-slide-down-dark-hover.png) no-repeat left top; }
}

@-ms-keyframes animatedDropshipBG {
    from { background: url(Images/web2017/Icon/icon-slide-down-dark.png) no-repeat left top; }

    to { background: url(Images/web2017/Icon/icon-slide-down-dark-hover.png) no-repeat left top; }
}

@-moz-keyframes animatedDropshipBG {
    from { background: url(Images/web2017/Icon/icon-slide-down-dark.png) no-repeat left top; }

    to { background: url(Images/web2017/Icon/icon-slide-down-dark-hover.png) no-repeat left top; }
}

.bg-dropship-1 { background: #f4f6fc url(Images/web2017/Background/bg-dropship-1.png) no-repeat center top; clear: left; float: left; width: 100%; border-bottom: solid 1px #fff; }

    .bg-dropship-1 .row { position: relative; }

    .bg-dropship-1 .text-col { float: left; font-family: ThaiSansNeueBold; padding: 80px 0; text-align: left; color: #121212; min-height: 657px; }

    .bg-dropship-1 .h1-title { line-height: 70px; font-size: 60px; }

    .bg-dropship-1 .h2-title { line-height: 60px; font-size: 48px; }

    .bg-dropship-1 .h3-title { line-height: 60px; font-size: 48px; color: #22a009; }

        .bg-dropship-1 .h3-title .large { font-size: 60px; }

.bg-dropship-button { clear: left; float: left; border: solid 1px #22a009; font-size: 24px; line-height: 40px; margin-top: 30px; }

    .bg-dropship-button .btn-label { float: left; background-color: #22a009; font-size: 36px; color: #fff; padding: 7px 25px 13px; }

    .bg-dropship-button .btn-dropship { float: left; background: transparent; /* Old browsers */ background: linear-gradient(to right, #3cbb22 50%, transparent 50%); background-size: 200% 100%; background-position: right bottom; transition: all 0.5s ease; }

        .bg-dropship-button .btn-dropship:hover { background-position: left bottom; }

        .bg-dropship-button .btn-dropship a { background: url(Images/web2017/bullet/arrow-right.png) no-repeat 95% 24px; color: #121212; float: left; padding: 10px 30px 10px 25px; transition: background 0.5s ease-out, border 0.5s ease-out; }

        .bg-dropship-button .btn-dropship:hover a { color: #fff; background: url(Images/web2017/bullet/arrow-right-white.png) no-repeat 95% 24px; }

.bg-dropship-2 { background: url(Images/web2017/Background/bg-dropship-2.jpg) no-repeat center top; clear: left; float: left; width: 100%; border-bottom: solid 1px #fff; }

    .bg-dropship-2 .text-col { float: left; font-family: ThaiSansNeueBold; padding: 120px 0 0; text-align: left; color: #fc4c15; min-height: 657px; }

    .bg-dropship-2 .h1-title { line-height: 70px; font-size: 60px; }

    .bg-dropship-2 .h2-title { line-height: 60px; font-size: 48px; margin-bottom: 30px; }

    .bg-dropship-2 .h3-title { font-size: 18px; line-height: 36px; background: url(Images/web2017/Bullet/icon-qa-30x30.png) no-repeat left 5px/25px auto; padding-left: 35px; color: #121212; font-family: CSPraJad; }

.bg-dropship-3 { background: url(Images/web2017/Background/bg-dropship-3.jpg) no-repeat center top; clear: left; float: left; width: 100%; border-bottom: solid 1px #fff; }

    .bg-dropship-3 .text-col { width: 47%; float: right; font-family: ThaiSansNeueBold; padding: 40px 0; text-align: left; color: #121212; min-height: 657px; }

    .bg-dropship-3 .h1-title { line-height: 40px; font-size: 36px; color: #22a009; }

    .bg-dropship-3 .h2-title { line-height: 66px; font-size: 60px; }

    .bg-dropship-3 .h3-title { line-height: 54px; font-size: 48px; }

    .bg-dropship-3 .h4-title { line-height: 54px; font-size: 36px; color: #22a009; margin-bottom: 20px; }

        .bg-dropship-3 .h4-title .large { font-size: 48px; }

    .bg-dropship-3 .h5-title { clear: left; float: left; width: 100%; font-size: 18px; line-height: 36px; background: url(Images/web2017/Bullet/icon-tick-25x25.png) no-repeat left 5px; padding-left: 35px; font-family: CSPraJad; }

        .bg-dropship-3 .h5-title .title-clear { clear: left; float: left; width: 100%; }

    .bg-dropship-3 .h6-title { clear: left; float: left; width: 100%; line-height: 36px; font-size: 30px; color: #515253; margin-top: 20px; }

        .bg-dropship-3 .h6-title .large { font-size: 36px; color: #22a009; }

        .bg-dropship-3 .h6-title a { line-height: 36px; font-size: 30px; color: #1d8708; text-decoration: underline; }

            .bg-dropship-3 .h6-title a:hover { text-decoration-color: #43c02a; color: #43c02a; }

.bg-dropship-4 { background: url(Images/web2017/Background/bg-dropship-4.jpg) no-repeat center top; clear: left; float: left; width: 100%; border-bottom: solid 1px #fff; }

    .bg-dropship-4 .text-col { float: left; font-family: ThaiSansNeueBold; padding: 80px 0; text-align: left; color: #22a009; min-height: 657px; }

    .bg-dropship-4 .h1-title { line-height: 60px; font-size: 48px; }

    .bg-dropship-4 .h2-title { line-height: 60px; font-size: 48px; color: #121212; }

    .bg-dropship-4 .h3-title { line-height: 50px; font-size: 36px; color: #121212; margin-top: 10px; }

        .bg-dropship-4 .h3-title .large { font-size: 48px; color: #22a009; }

    .bg-dropship-4 .h4-title { line-height: 40px; font-size: 36px; }

/******************************************/
/*-----dropship detail page 08-06-2017-----*/
/******************************************/
.bg-dsdetail-1 { background: #f4f6fc url(Images/web2017/Background/bg-dsdetail-1.jpg) no-repeat center top; clear: left; float: left; width: 100%; border-bottom: solid 1px #fff; }

    .bg-dsdetail-1 .row { position: relative; }

    .bg-dsdetail-1 .text-col { font-family: ThaiSansNeueBold; padding: 240px 0 0; color: #fff; min-height: 657px; float: right; padding-right: 20px; }

    .bg-dsdetail-1 .h1-title { line-height: 60px; font-size: 48px; }

        .bg-dsdetail-1 .h1-title .large { font-size: 60px; color: #1fa40a; }

.bg-dsdetail-2 { background: url(Images/web2017/Background/bg-dsdetail-2.jpg) no-repeat center top; clear: left; float: left; width: 100%; border-bottom: solid 1px #fff; }

    .bg-dsdetail-2 .text-col { float: left; font-family: ThaiSansNeueBold; padding: 220px 0 0 50px; color: #f5fd1c; min-height: 657px; }

    .bg-dsdetail-2 .h1-title { line-height: 54px; font-size: 48px; margin-bottom: 15px; clear: left; float: left; width: 100%; }

    .bg-dsdetail-2 .h2-title { line-height: 48px; font-size: 36px; color: #fff; clear: left; float: left; width: 100%; }

.bg-dsdetail-3 { background: url(Images/web2017/Background/bg-dsdetail-3.jpg) no-repeat center top; clear: left; float: left; width: 100%; border-bottom: solid 1px #fff; }

    .bg-dsdetail-3 .text-col { float: left; font-family: ThaiSansNeueBold; padding: 140px 0 0; color: #fff; min-height: 657px; float: right; width: 40%; }

    .bg-dsdetail-3 .h1-title { line-height: 54px; font-size: 48px; color: #23a7fb; margin-bottom: 15px; }

    .bg-dsdetail-3 .h2-title { line-height: 54px; font-size: 48px; }

.bg-dsdetail-4 { background: url(Images/web2017/Background/bg-dsdetail-4.jpg) no-repeat center top; clear: left; float: left; width: 100%; border-bottom: solid 1px #fff; }

    .bg-dsdetail-4 .text-col { float: left; font-family: ThaiSansNeueBold; padding: 100px 0 0; color: #121212; min-height: 657px; float: right; width: 50%; }

    .bg-dsdetail-4 .h1-title { line-height: 54px; font-size: 48px; color: #22a009; margin-bottom: 15px; clear: left; float: left; width: 100%; }

    .bg-dsdetail-4 .h2-title { line-height: 48px; font-size: 42px; clear: left; float: left; width: 100%; }

.bg-dsdetail-5 { background: url(Images/web2017/Background/bg-dsdetail-5.jpg) no-repeat center top; clear: left; float: left; width: 100%; border-bottom: solid 1px #fff; }

    .bg-dsdetail-5 .text-col { font-family: ThaiSansNeueBold; padding: 150px 0 0; color: #fff; min-height: 657px; float: right; width: 50%; }

    .bg-dsdetail-5 .h1-title { clear: left; float: left; width: 100%; font-size: 20px; line-height: 30px; background: url(Images/web2017/Bullet/icon-tick-25x25.png) no-repeat left 3px; padding-left: 40px; margin-bottom: 25px; font-family: CSPraJad; }

        .bg-dsdetail-5 .h1-title .large { line-height: 30px; font-size: 22px; font-weight: bold; }

        .bg-dsdetail-5 .h1-title .title-clear { clear: left; float: left; width: 100%; }

    .bg-dsdetail-5 .h2-title { clear: left; float: left; width: 100%; line-height: 42px; font-size: 36px; margin-top: 25px; }

        .bg-dsdetail-5 .h2-title .large { color: #15b06c; }

    .bg-dsdetail-5 .h3-title { clear: left; float: left; width: 100%; line-height: 42px; font-size: 36px; }

.bg-dsdetail-6 { background: url(Images/web2017/Background/bg-dsdetail-6.jpg) no-repeat center top; clear: left; float: left; width: 100%; border-bottom: solid 1px #fff; }

    .bg-dsdetail-6 .text-col { float: left; font-family: ThaiSansNeueBold; padding: 70px 0 0; color: #121212; min-height: 657px; }

    .bg-dsdetail-6 .h1-title { line-height: 60px; font-size: 48px; margin-bottom: 10px; }

        .bg-dsdetail-6 .h1-title .large { color: #22a009; font-size: 60px; }

    .bg-dsdetail-6 .h2-title { line-height: 60px; font-size: 36px; color: #22a009; }

        .bg-dsdetail-6 .h2-title .large { font-size: 48px; }

    .bg-dsdetail-6 .h3-title { line-height: 40px; font-size: 30px; }

        .bg-dsdetail-6 .h3-title .large { font-size: 36px; }



/******************************************/
/*-----Affiliate Intro page 26-06-2017-----*/
/******************************************/

.bg-affiliate-intro .row { padding: 0 20px; }

.bg-affiliate-intro .bg-free2-5 .row { padding: 30px; }

.bg-affiliate-intro-1 { background: #f4f6fc url(Images/web2017/Background/bg-affiliate-intro-1.jpg) no-repeat center top; clear: left; float: left; width: 100%; border-bottom: solid 1px #fff; }

    .bg-affiliate-intro-1 .row { position: relative; }

    .bg-affiliate-intro-1 .text-col { float: right; font-family: ThaiSansNeueBold; padding: 90px 0 0; text-align: left; color: #010101; min-height: 657px; }

    .bg-affiliate-intro-1 .h1-title { line-height: 70px; font-size: 60px; }

    .bg-affiliate-intro-1 .h2-title { line-height: 60px; font-size: 48px; }

    .bg-affiliate-intro-1 .h3-title { line-height: 60px; font-size: 48px; color: #fc4c15; }

        .bg-affiliate-intro-1 .h3-title .large { font-size: 60px; }

.bg-affiliate-intro-button { clear: left; float: left; border: solid 1px #fc4c15; font-size: 24px; line-height: 40px; margin-top: 30px; }

    .bg-affiliate-intro-button .btn-label { float: left; background-color: #fc4c15; font-size: 36px; color: #fff; padding: 7px 25px 13px; }

    .bg-affiliate-intro-button .btn-affiliate { float: left; background: transparent; /* Old browsers */ background: linear-gradient(to right, #ff7f57 50%, rgba(30,30,30,0.25) 50%); background-size: 200% 100%; background-position: right bottom; transition: all 0.5s ease; }

        .bg-affiliate-intro-button .btn-affiliate:hover { background-position: left bottom; }

        .bg-affiliate-intro-button .btn-affiliate a { background: url(Images/web2017/bullet/arrow-right-white.png) no-repeat 95% 24px; color: #fff; float: left; padding: 10px 30px 10px 25px; transition: background 0.5s ease-out, border 0.5s ease-out; }

        .bg-affiliate-intro-button .btn-affiliate:hover a { color: #fff; }

.bg-affiliate-intro-1.default { background-color: #f4f6fc; border-top: solid 1px #fff; background-position: center center; }

    .bg-affiliate-intro-1.default .text-col { min-height: 555px; padding: 80px 0 0 20px; width: 45%; }

    .bg-affiliate-intro-1.default .h1-title { line-height: 42px; font-size: 40px; font-family: ThaiSansNeueBold; }

    .bg-affiliate-intro-1.default .h2-title { line-height: 60px; font-size: 72px; font-family: ThaiSansNeueBold; }

    .bg-affiliate-intro-1.default .h3-title { line-height: 1; font-size: 40px; clear: left; color: #333; margin: 10px 0; }
    .bg-affiliate-intro-1.default .h4-title { line-height: 1.2; font-size: 28px; clear: left; }
    .bg-affiliate-intro-1.default .bar-dark { width: 250px; height: 2px; background-color: #454545; margin: 20px 0; }
    .bg-affiliate-intro-1.default .banner-button1 { margin-top: 25px; }

.bg-affiliate-intro-2 { background: url(Images/web2017/Background/bg-affiliate-intro-2.jpg) no-repeat center top; clear: left; float: left; width: 100%; border-bottom: solid 1px #fff; }

    .bg-affiliate-intro-2 .text-col { float: left; font-family: ThaiSansNeueBold; padding: 120px 0 0; text-align: left; color: #d21915; min-height: 657px; }

    .bg-affiliate-intro-2 .h1-title { line-height: 60px; font-size: 48px; }

    .bg-affiliate-intro-2 .h2-title { line-height: 70px; font-size: 60px; margin-bottom: 30px; }

    .bg-affiliate-intro-2 .h3-title { font-size: 18px; line-height: 36px; background: url(Images/web2017/Bullet/icon-qa-30x30.png) no-repeat left 5px/25px auto; padding-left: 35px; color: #010101; font-family: CSPraJad; }

.bg-affiliate-intro-3 { background: url(Images/web2017/Background/bg-affiliate-intro-3.jpg) no-repeat center top; clear: left; float: left; width: 100%; border-bottom: solid 1px #fff; }

    .bg-affiliate-intro-3 .text-col { width: 47%; float: right; font-family: ThaiSansNeueBold; padding: 40px 0; text-align: left; color: #010101; min-height: 657px; }

    .bg-affiliate-intro-3 .h1-title { line-height: 40px; font-size: 36px; color: #fc4c15; }

    .bg-affiliate-intro-3 .h2-title { line-height: 66px; font-size: 60px; }

    .bg-affiliate-intro-3 .h3-title { line-height: 54px; font-size: 48px; }

    .bg-affiliate-intro-3 .h4-title { line-height: 54px; font-size: 36px; color: #fc4c15; margin-bottom: 20px; }

        .bg-affiliate-intro-3 .h4-title .large { font-size: 48px; }

    .bg-affiliate-intro-3 .h5-title { clear: left; float: left; width: 100%; font-size: 18px; line-height: 36px; background: url(Images/web2017/Bullet/icon-tick-25x25.png) no-repeat left 5px; padding-left: 35px; font-family: CSPraJad; }

        .bg-affiliate-intro-3 .h5-title .title-clear { clear: left; float: left; width: 100%; }

    .bg-affiliate-intro-3 .h6-title { clear: left; float: left; width: 100%; line-height: 36px; font-size: 30px; color: #010101; margin-top: 20px; }

        .bg-affiliate-intro-3 .h6-title .large { font-size: 36px; color: #fc4c15; }

        .bg-affiliate-intro-3 .h6-title a { line-height: 36px; font-size: 30px; color: #fc4c15; text-decoration: underline; }

            .bg-affiliate-intro-3 .h6-title a:hover { color: #d21915; }

.bg-affiliate-intro-4 { background: url(Images/web2017/Background/bg-affiliate-intro-4.jpg) no-repeat center top; clear: left; float: left; width: 100%; border-bottom: solid 1px #fff; }

    .bg-affiliate-intro-4 .text-col { float: left; font-family: ThaiSansNeueBold; padding: 85px 0; text-align: left; color: #fc4c15; min-height: 657px; }

    .bg-affiliate-intro-4 .h1-title { line-height: 60px; font-size: 48px; }

    .bg-affiliate-intro-4 .h2-title { line-height: 60px; font-size: 48px; color: #010101; }

    .bg-affiliate-intro-4 .h3-title { line-height: 50px; font-size: 36px; color: #010101; margin-top: 10px; }

        .bg-affiliate-intro-4 .h3-title .large { font-size: 48px; color: #fc4c15; }

    .bg-affiliate-intro-4 .h4-title { line-height: 40px; font-size: 36px; }

/******************************************/
/*-----Affiliate detail page 26-06-2017-----*/
/******************************************/
.bg-affdetail-1 { background: #f4f6fc url(Images/web2017/Background/bg-affdetail-1.jpg) no-repeat center top; clear: left; float: left; width: 100%; border-bottom: solid 1px #fff; }

    .bg-affdetail-1 .row { position: relative; }

    .bg-affdetail-1 .text-col { font-family: ThaiSansNeueBold; padding: 170px 0 0; color: #fff; min-height: 657px; float: right; padding-right: 20px; }

    .bg-affdetail-1 .h1-title { line-height: 54px; font-size: 48px; }

    .bg-affdetail-1 .h2-title { line-height: 48px; font-size: 42px; color: #FD4D14; }

        .bg-affdetail-1 .h2-title .large { font-size: 54px; }

.bg-affdetail-2 { background: url(Images/web2017/Background/bg-affdetail-2.jpg) no-repeat center top; clear: left; float: left; width: 100%; border-bottom: solid 1px #fff; }

    .bg-affdetail-2 .text-col { float: left; font-family: ThaiSansNeueBold; padding: 130px 0 0; color: #030303; min-height: 657px; }

    .bg-affdetail-2 .h1-title { line-height: 54px; font-size: 48px; margin-bottom: 15px; clear: left; float: left; width: 100%; color: #FD4D14; }

    .bg-affdetail-2 .h2-title { line-height: 36px; font-size: 30px; clear: left; float: left; width: 100%; }

.bg-affdetail-3 { background: url(Images/web2017/Background/bg-affdetail-3.jpg) no-repeat center top; clear: left; float: left; width: 100%; border-bottom: solid 1px #fff; }

    .bg-affdetail-3 .text-col { float: left; font-family: ThaiSansNeueBold; padding: 140px 0 0; color: #030303; min-height: 657px; }

    .bg-affdetail-3 .h1-title { line-height: 54px; font-size: 48px; color: #FD4D14; margin-bottom: 15px; }

    .bg-affdetail-3 .h2-title { line-height: 36px; font-size: 30px; }

.bg-affdetail-4 { background: url(Images/web2017/Background/bg-affdetail-4.jpg) no-repeat center top; clear: left; float: left; width: 100%; border-bottom: solid 1px #fff; }

    .bg-affdetail-4 .text-col { float: left; font-family: ThaiSansNeueBold; padding: 130px 0 0; color: #121212; min-height: 657px; float: right; }

    .bg-affdetail-4 .h1-title { line-height: 54px; font-size: 48px; color: #FD4D14; margin-bottom: 15px; clear: left; float: left; width: 100%; }

    .bg-affdetail-4 .h2-title { line-height: 48px; font-size: 42px; clear: left; float: left; width: 100%; margin-bottom: 15px; }

        .bg-affdetail-4 .h2-title .large { font-size: 48px; color: #FD4D14; }

    .bg-affdetail-4 .h3-title { line-height: 36px; font-size: 30px; clear: left; float: left; width: 100%; }

.bg-affdetail-5 { background: url(Images/web2017/Background/bg-affdetail-5.jpg) no-repeat center top; clear: left; float: left; width: 100%; border-bottom: solid 1px #fff; }

    .bg-affdetail-5 .text-col { font-family: ThaiSansNeueBold; padding: 100px 0 0; color: #fff; min-height: 657px; float: right; width: 50%; }

    .bg-affdetail-5 .h1-title { clear: left; float: left; width: 100%; font-size: 20px; line-height: 30px; background: url(Images/web2017/Bullet/icon-tick-25x25.png) no-repeat left 3px; padding-left: 40px; margin-bottom: 20px; font-family: CSPraJad; }

        .bg-affdetail-5 .h1-title .large { line-height: 30px; font-size: 22px; font-weight: bold; }

        .bg-affdetail-5 .h1-title .title-clear { clear: left; float: left; width: 100%; }

    .bg-affdetail-5 .h2-title { clear: left; float: left; width: 100%; line-height: 42px; font-size: 36px; margin-top: 20px; }

        .bg-affdetail-5 .h2-title .large { color: #4286f5; }

    .bg-affdetail-5 .h3-title { clear: left; float: left; width: 100%; line-height: 42px; font-size: 36px; }

.bg-affdetail-6 { background: url(Images/web2017/Background/bg-affdetail-6.jpg) no-repeat center top; clear: left; float: left; width: 100%; border-bottom: solid 1px #fff; }

    .bg-affdetail-6 .text-col { float: left; font-family: ThaiSansNeueBold; padding: 70px 0 0; color: #121212; min-height: 657px; }

    .bg-affdetail-6 .h1-title { line-height: 60px; font-size: 48px; margin-bottom: 0; }

        .bg-affdetail-6 .h1-title .large { color: #FD4D14; font-size: 52px; }

    .bg-affdetail-6 .h2-title { line-height: 60px; font-size: 36px; color: #FD4D14; margin-top: 10px; }

        .bg-affdetail-6 .h2-title .large { font-size: 48px; }

    .bg-affdetail-6 .h3-title { line-height: 40px; font-size: 30px; }

        .bg-affdetail-6 .h3-title .large { font-size: 36px; }


.bg-cando .TKO-Event { clear: left; float: left; width: 100%; }

.bg-cando .bg-dropship-1 .text-col { padding-top: 60px; }

.h1-title-cando { color: #303030; line-height: 54px; font-size: 48px; clear: left; float: left; width: 100%; margin-bottom: 10px; }

.h2-title-cando { color: #22a009; line-height: 54px; font-size: 48px; clear: left; float: left; width: 100%; margin-bottom: 30px; }

.h3-title-cando { margin: 0 0 10px; font-size: 22px; line-height: 30px; clear: left; float: left; width: 100%; }

.ContactUsFinished.Unsubscribe { background-position: center top; background-size: auto 700px; }

.ContactUsFinished .UserLogin { background: rgba(255,255,255,0.8); padding: 40px 10px 20px; width: 450px; }

.ContactUsFinished .LoginPanel { display: table; }

.ContactUsFinished .CommonErrorMessageDiv { font-size: 16px; text-align: center; }
/*---- New Design Intro Page ----*/
.btn-newdesign-1 { float: left; margin: 30px 10px 30px 0; }

    .btn-newdesign-1 a { display: block; background-color: #4286f5; color: #fff; transition: background 0.5s ease-out, border 0.5s ease-out; font-size: 30px; line-height: 50px; font-family: ThaiSansNeueBlack; text-align: center; padding: 11px 30px; }

        .btn-newdesign-1 a:hover { background-color: #1f5cbe; color: #fff; }

.btn-newdesign-2 { float: left; margin: 30px 10px 30px 0; }

    .btn-newdesign-2 a { border: solid 2px #1f5cbe; color: #051f2e; float: left; padding: 10px 30px 10px 40px; text-align: center; transition: background 0.5s ease-out, border 0.5s ease-out; font-size: 24px; }

        .btn-newdesign-2 a:hover { background-color: #1f5cbe; color: #fff; }

.btn-newdesign-label { background: url(Images/web2017/bullet/btn-arrow-gray.png) no-repeat right 10px; padding-right: 22px; line-height: 48px; }

.btn-newdesign-2 a:hover .btn-newdesign-label { background-image: url(Images/web2017/bullet/btn-arrow-white.png); }

.bg-newdesign-1 { background: url(Images/web2017/Background/bg-newdesign-1.jpg) no-repeat center top; clear: left; float: left; width: 100%; border-bottom: solid 1px #fff; }

    .bg-newdesign-1 .text-col { float: left; font-family: ThaiSansNeueBold; padding: 130px 0 50px; text-align: left; min-height: 657px; text-align: center; width: 100%; }

    .bg-newdesign-1 .h1-title { margin: 0; color: #1f5cbe; font-size: 48px; }

    .bg-newdesign-1 .h2-title { margin: 0 0 30px; font-size: 72px; color: #4286f5; text-transform: uppercase; }

    .bg-newdesign-1 .h3-title { margin: 0; font-family: ThaiSansNeueBlack; text-align: left; background: url(Images/web2017/Icon/HDLabel.png) no-repeat left top; padding-left: 120px; display: inline-block; min-height: 110px; }

    .bg-newdesign-1 .h3-title-1 { color: #7a98c8; font-size: 30px; line-height: 40px; text-decoration: line-through; }

    .bg-newdesign-1 .h3-title-2 { color: #ff6101; font-size: 60px; line-height: 40px; }

    .bg-newdesign-1 .h4-title { font-size: 14px; font-family: CSPraJad; color: #ee601a; }

    .bg-newdesign-1 .btn-newdesign-1 { display: table; margin: 30px auto; float: none; width: 260px; }

.bg-newdesign-2 { background: #f7f9fc url(Images/web2017/Background/bg-newdesign-2.jpg) no-repeat center bottom; clear: left; float: left; width: 100%; border-bottom: solid 1px #fff; }

    .bg-newdesign-2 .text-col { float: left; font-family: ThaiSansNeueBold; padding: 80px 0 0 20px; text-align: left; color: #103269; min-height: 657px; }

    .bg-newdesign-2 .h1-title { margin: 0 0 20px; font-size: 48px; color: #1f5cbe; line-height: 50px; }

    .bg-newdesign-2 .h2-title { margin: 0 0 20px; font-size: 36px; line-height: 40px; color: #3168c2; }

    .bg-newdesign-2 .h3-title { font-size: 26px; line-height: 30px; }

.bg-newdesign-3 { background: #fbf7f5 url(Images/web2017/Background/bg-newdesign-3.jpg) no-repeat center top; clear: left; float: left; width: 100%; border-bottom: solid 1px #fff; }

    .bg-newdesign-3 .text-col { float: right; font-family: ThaiSansNeueBold; padding: 40px 0 0; text-align: left; color: #103269; min-height: 657px; width: 50%; }

    .bg-newdesign-3 .h1-title { margin: 0 0 20px; font-size: 36px; line-height: 42px; }

    .bg-newdesign-3 .h2-title { margin: 0 0 20px; font-size: 18px; line-height: 36px; font-family: CSPraJad; font-weight: bold; }

    .bg-newdesign-3 .h3-title { margin: 0; font-size: 18px; line-height: 36px; font-family: CSPraJad; }

        .bg-newdesign-3 .h3-title .large { font-size: 30px; font-family: ThaiSansNeueBold; }

    .bg-newdesign-3 .btn-newdesign-1 { width: 260px; }

/*---- Template Tuneup Intro Page ----*/

.bg-tuneup .bg-newdesign-1 { background: url(Images/web2017/Background/bg-tuneup-1.jpg) no-repeat center top; clear: left; float: left; width: 100%; border-bottom: solid 1px #fff; }

.bg-tuneup-2 { background: #f7f9fc url(Images/web2017/Background/bg-tuneup-2.jpg) no-repeat center bottom; clear: left; float: left; width: 100%; border-bottom: solid 1px #fff; }

    .bg-tuneup-2 .text-col { float: left; font-family: ThaiSansNeueBold; padding: 130px 0 0 20px; text-align: left; color: #103269; min-height: 657px; }

    .bg-tuneup-2 .h1-title { margin: 0 0 20px; font-size: 48px; color: #1f5cbe; line-height: 50px; }

    .bg-tuneup-2 .h2-title { margin: 0 0 20px; font-size: 36px; line-height: 40px; color: #3168c2; }

    .bg-tuneup-2 .h3-title { font-size: 26px; line-height: 30px; }

.bg-tuneup-3 { background: #F5F9FF url(Images/web2017/Background/bg-tuneup-3.jpg) no-repeat center bottom; clear: left; float: left; width: 100%; border-bottom: solid 1px #fff; }

    .bg-tuneup-3 .text-col { float: right; font-family: ThaiSansNeueBold; padding: 70px 0 0; text-align: left; color: #103269; min-height: 657px; width: 47%; }

    .bg-tuneup-3 .h1-title { margin: 0 0 20px; font-size: 36px; line-height: 42px; }

    .bg-tuneup-3 .h2-title { margin: 0 0 20px; font-size: 18px; line-height: 36px; font-family: CSPraJad; font-weight: bold; }

    .bg-tuneup-3 .h3-title { margin: 0; font-size: 18px; line-height: 36px; font-family: CSPraJad; }

        .bg-tuneup-3 .h3-title .large { font-size: 30px; font-family: ThaiSansNeueBold; }

    .bg-tuneup-3 .btn-newdesign-1 { width: 260px; }

/*---- Desing service comparison Page ----*/
.bg-design-compare { text-align: center; padding: 20px 0 50px; background-color: #f9f8f6; }

    .bg-design-compare .title1 { color: #1c1c1c; line-height: 54px; font-size: 42px; clear: left; width: 100%; font-family: ThaiSansNeueBold; }

    .bg-design-compare .title2 { color: #1c1c1c; line-height: 36px; font-size: 30px; clear: left; width: 100%; margin-bottom: 40px; font-family: ThaiSansNeueBold; }

    .bg-design-compare .table-compare { display: table; margin: auto; }

    .bg-design-compare .table-compare-col { width: 500px; float: right; margin: 0 10px; vertical-align: top; }

    .bg-design-compare .table-compare-col-1 { font-family: ThaiSansNeueBlack; }

        .bg-design-compare .table-compare-col-1 a { background-color: #94bdff; padding: 20px 0; display: block; }

            .bg-design-compare .table-compare-col-1 a:hover, .bg-design-compare .table-compare-col.new-design .table-compare-col-1 a:hover { background-color: #4286F5; }

    .bg-design-compare .table-compare-col.new-design .table-compare-col-1 { position: relative; }

        .bg-design-compare .table-compare-col.new-design .table-compare-col-1 a { background-color: #6c9ff2; padding: 20px 0; display: block; }

    .bg-design-compare .table-compare-col-2 { background-color: #3860a2; padding: 30px 0; font-family: ThaiSansNeueBlack; }

    .bg-design-compare .table-compare-col-3 { border: solid 2px #a1c4fc; border-top: 0; padding: 20px 0 30px; font-family: CSPraJad; color: #1c1c1c; font-size: 18px; line-height: 36px; }

        .bg-design-compare .table-compare-col-3 a { text-decoration: underline; color: #2c4f89; }

            .bg-design-compare .table-compare-col-3 a:hover { color: #ff8448; }

    .bg-design-compare .table-compare-col-4 { border: solid 2px #a1c4fc; border-top: 0; padding: 20px 10px; font-family: CSPraJad; color: #1c1c1c; font-size: 18px; line-height: 36px; min-height: 605px; position: relative; }

    .bg-design-compare .h1-title { margin: 0; color: #fff; font-size: 48px; display: inline-block; width: 100%; }

    .bg-design-compare .h2-title { font-size: 30px; color: #1c1c1c; margin: 5px 0; display: inline-block; width: 100%; }

    .bg-design-compare .h3-title { margin: 0; text-align: left; background: url(Images/web2017/Icon/HDLabel.png) no-repeat left 5px/55px auto; padding-left: 65px; display: inline-block; min-height: 60px; }

    .bg-design-compare .h3-title-1 { color: #7a98c8; font-size: 24px; line-height: 22px; text-decoration: line-through; }

    .bg-design-compare .h3-title-2 { color: #fff; font-size: 48px; line-height: 30px; }

    .bg-design-compare .h4-title { font-size: 14px; font-family: CSPraJad; color: #ffb400; }

    .bg-design-compare .h5-title { font-size: 30px; color: #256fe8; font-family: ThaiSansNeueBlack; line-height: 46px; }

        .bg-design-compare .h5-title a { color: #256fe8; text-decoration: none; }

    .bg-design-compare .h6-title { font-size: 30px; line-height: 36px; font-family: ThaiSansNeueBold; margin: 10px 0; }

    .bg-design-compare .h7-title { font-size: 18px; line-height: 30px; text-align: left; position: absolute; bottom: 30px; left: 30px; width: 90%; }

        .bg-design-compare .h7-title .large { font-size: 21px; }

    .bg-design-compare ul.compare-1 { width: 86%; margin: 20px 7%; line-height: 30px; padding: 0; list-style: none; }

        .bg-design-compare ul.compare-1 li { background: url(Images/web2017/Bullet/icon-checked.png) no-repeat left 5px; padding-left: 45px; text-align: left; margin-bottom: 5px; }

    .bg-design-compare ul.compare-2 { width: 86%; margin: 20px 7%; line-height: 30px; padding: 0; list-style: none; }

        .bg-design-compare ul.compare-2 li { background: url(Images/web2017/Bullet/bullet-list.png) no-repeat left 14px; padding-left: 15px; text-align: left; margin-bottom: 5px; }

    .bg-design-compare .btn-newdesign-1 { display: table; margin: 30px auto; float: none; width: 200px; }

        .bg-design-compare .btn-newdesign-1 a:hover { background-color: #ff8448; color: #fff; }

    .bg-design-compare .PopularLabel { margin: 0; text-align: left; background: url(Images/web2017/Icon/PopularLabel.png) no-repeat left top; height: 111px; width: 111px; position: absolute; right: 10px; top: -55px; }

    .bg-design-compare .table-compare-col-3 .btn-newdesign-1 { margin: 0 auto; }

        .bg-design-compare .table-compare-col-3 .btn-newdesign-1 a { text-decoration: none; color: #fff; }

            .bg-design-compare .table-compare-col-3 .btn-newdesign-1 a:hover { color: #ff8448; color: #fff; }

.bg-design { background: #fbffff url(Images/web2017/Background/banner-design.jpg) no-repeat center top; clear: left; float: left; width: 100%; border-bottom: solid 1px #fff; }

    .bg-design .bar-dark { width: 200px; height: 2px; background-color: #454545; margin: 25px 0; }
    .bg-design .text-col { float: left; font-family: ThaiSansNeueBold; padding: 80px 0 0 20px; text-align: left; min-height: 555px; width: 50%; }

    .bg-design .h1-title { margin: 0 0 10px; color: #051f2e; font-size: 40px; line-height: 1.2; }

    .bg-design .h2-title { margin: 0 0 20px; color: #051f2e; font-size: 26px; line-height: 1.2; font-family: ThaiSansNeue; clear: left; }

        .bg-design .h2-title .title-link { display: inline; }

        .bg-design .h2-title a { font-family: ThaiSansNeueBold; background: url(Images/web2017/Bullet/arrow-right.png) no-repeat right 10px; padding-right: 17px; color: #051f2e; }

            .bg-design .h2-title a:hover { background-image: url(Images/web2017/Bullet/arrow-blue-right.png); color: #4286f5; }

.btn-design { clear: left; float: left; margin: 15px 0; }

    .btn-design a { display: inline-block; background-color: transparent; color: #2a475c; transition: background 0.5s ease-out, border 0.5s ease-out; font-size: 24px; line-height: 46px; text-align: center; padding: 0 30px; border: solid 1px #b9becb; margin-right: 10px; }

        .btn-design a:hover { background-color: #4286f5; border: solid 1px #2a475c; color: #fff; }

.bg-design-compare .table-compare-col-5 { border: solid 2px #a1c4fc; border-top: 0; padding: 0; line-height: 30px; display: none; }

    .bg-design-compare .table-compare-col-5 a.btnToggleDesign { color: #f9f8f6; display: block; padding: 12px 0; width: 100%; text-align: center; font-family: ThaiSansNeueBold; font-size: 24px; background-color: #a1c4fc; cursor: pointer; }

    .bg-design-compare .table-compare-col-5 a:hover { background-color: #3860a2; }

    .bg-design-compare .table-compare-col-5 a span { background: url(Images/Web2017/Bullet/arrow-down-white.png) no-repeat right center; padding-right: 25px; }

    .bg-design-compare .table-compare-col-5.Active a.btnToggleDesign { background-color: #4286f5; }

        .bg-design-compare .table-compare-col-5.Active a.btnToggleDesign span { background-image: url(Images/Web2017/Bullet/arrow-up-white.png); }

.toggle-col { display: block; }

.bg-design-compare .btn-detail { display: table; margin: 15px auto 0; float: none; width: 200px; }

    .bg-design-compare .btn-detail a { color: #fff; display: inline-block; padding: 8px 0; width: 100%; text-align: center; font-size: 22px; background-color: #4286f5; font-family: ThaiSansNeueBold; line-height: 30px; }

        .bg-design-compare .btn-detail a:hover { background-color: #ff8448; }

.StoreSignupDiv { width: 100%; background-color: #333; padding: 20px 0 40px; clear: left; float: left; }

.signup-popup-panel.non-popup { width: 400px; margin: auto; clear: left; float: none; }




.TKO2-Event { background: url(Images/web2017/Background/bg-tko2-event1.jpg) no-repeat center top; width: 100%; height: 657px; }

.TKO2-Banner-Event { background: url(Images/web2017/Background/banner-tko2-event1.jpg) no-repeat center top; width: 100%; height: 657px; clear: left; float: left; }

    .TKO2-Banner-Event .row { height: 100%; position: relative; padding: 0; }

.TKO2-Event-Button { position: absolute; top: 63%; }

    .TKO2-Event-Button a { z-index: 0; background: rgba(1,11,0,0.5) url(Images/web2017/bullet/tko-white-arrow.png) no-repeat 95% center; border: solid 2px #f7f7f7; color: #fff; float: left; padding: 10px 45px 10px 40px; transition: background 0.5s ease-out, border 0.5s ease-out; font-size: 32px; line-height: 56px; font-family: ThaiSansNeueBold; }

        .TKO2-Event-Button a:hover { background-color: #5fa03c; color: #fff; }

.TKO2-Event-Info { color: #e6f506; font-size: 24px; background-color: #0b760e; line-height: 36px; font-family: ThaiSansNeueBold; }

    .TKO2-Event-Info .row { padding: 20px 20px 25px; }

    .TKO2-Event-Info .title1 { font-size: 40px; }

.TKO2-Event-Container .SeminarFormDiv .title1 { color: #0b760e; }

.TKO2-Event-Container input[type="text"].SeminarFormTextBox:focus { border: solid 1px #0b760e; }

.TKO2-Event-Container .SeminarFormButton a { background-color: #0b760e; color: #fdf512; }

    .TKO2-Event-Container.SeminarFormButton a:hover { background-color: #0b760e; color: #ffe900; }

.TKO2-Event-Container .suanlum-schedule .title { color: #0b760e; }

.TKO2-Event-Container .bg-seminar-post { background: url(Images/web2017/Background/bg-tko2-post.jpg) no-repeat center top; }

.TKO2-Event-Container .bg-free2-5 { background-color: #062102; }
.TKO2-Event-Container .SeminarSchedule .info { display: inline-block; float: none; width: 31.5%; padding: 20px 0; margin-right: 1%; vertical-align: top; }

.NewsEvent .highlight { color: #0c60d3; background: none; }



/*-----facebook ads service  page 08-11-2017-----*/
.bg-facebook-ads6 { background: #fff url(Images/Web2017/Background/bg-facebook-ads6.jpg)no-repeat center bottom; padding: 30px 0; color: #333; line-height: 35px; }

    .bg-facebook-ads6 ul.facebook-ads2-list li { color: #fff; text-shadow: 2px 2px 1px #000; }

.facebook-ad-totop { width: 58px; height: 58px; position: absolute; bottom: 0; right: 15px; display: block; font-size: 0; background: url(Images/Web2017/Icon/arrow_back_to_top.svg) no-repeat center center; cursor: pointer; display: none; height: 0; width: 0; }
/****** common class *****/
.bg-facebook-ads { font-family: ThaiSansNeueBold; color: #1c4398; }

    .bg-facebook-ads .h1-title { font-size: 48px; }

    .bg-facebook-ads .h2-title { font-size: 36px; }

    .bg-facebook-ads .h3-title { font-family: CSPraJad; color: #1a2b50; font-size: 18px; line-height: 24px; margin: 15px 0; clear: left; }

    .bg-facebook-ads .h4-title { font-size: 36px; color: #1a2b50; margin-bottom: 5px; }

    .bg-facebook-ads .h5-title { font-size: 30px; color: #1a2b50; margin-bottom: 5px; }

    .bg-facebook-ads .contact { float: left; }

    .bg-facebook-ads .contact-3 { line-height: 60px; font-size: 30px; margin-top: 5px; }

        .bg-facebook-ads .contact-3 a { color: #1c4398; text-decoration: underline; }

            .bg-facebook-ads .contact-3 a:hover { color: #ff5400; }

    .bg-facebook-ads .contact-1 { clear: left; float: left; font-size: 30px; line-height: 30px; }

    .bg-facebook-ads .contact-2 { clear: left; float: left; font-size: 60px; line-height: 30px; }

.bg-facebook-ads-button { clear: left; float: left; margin: 0 0 10px; padding-bottom: 25px; }

    .bg-facebook-ads-button .btn-facebook-ads { float: left; margin-right: 30px; margin-top: 8px; }

        .bg-facebook-ads-button .btn-facebook-ads a { background: #2a61d7 url(Images/web2017/icon/icon-phone.png) no-repeat 30px center; color: #fff; float: left; padding: 10px 40px 10px 70px; transition: background 0.5s ease-out, border 0.5s ease-out; line-height: 40px; text-decoration: none; font-size: 30px; border-radius: 50px; }

            .bg-facebook-ads-button .btn-facebook-ads a:hover { color: #fff; background-color: #1c4398; }

.icon-fbads { background: url(Images/web2017/Icon/icon-fbads.png) no-repeat left top; width: 100%; height: 50px; margin-bottom: 15px; background-size: auto 45px; }

/****** intro page class *****/
.bg-facebook-ads-1 { background: url(Images/web2017/Background/bg-fbads-1.jpg) no-repeat center top; clear: left; float: left; width: 100%; }

    .bg-facebook-ads-1 .row { position: relative; }

    .bg-facebook-ads-1 .text-col { float: left; padding: 55px 0 0 15px; min-height: 657px; }


.bg-facebook-ads-2 { background: url(Images/web2017/Background/bg-fbads-2.jpg) no-repeat center top; clear: left; float: left; width: 100%; }

    .bg-facebook-ads-2 .text-col { float: left; padding: 55px 0 0 15px; min-height: 657px; }

.bg-facebook-ads-3 { background: url(Images/web2017/Background/bg-fbads-3.jpg) no-repeat center top; clear: left; float: left; width: 100%; }

    .bg-facebook-ads-3 .text-col { float: left; padding: 80px 0 0 15px; min-height: 657px; }

.bg-facebook-ads-4 { background: url(Images/web2017/Background/bg-fbads-4.jpg) no-repeat center top; clear: left; float: left; width: 100%; }

    .bg-facebook-ads-4 .text-col { float: right; padding: 85px 10px 0 0; min-height: 657px; width: 49%; }

/****** detail page class *****/
.bg-facebook-service-1 { background: url(Images/web2017/Background/bg-fbads-detail-1.jpg) no-repeat center top; clear: left; float: left; width: 100%; }

    .bg-facebook-service-1 .clear-line { clear: left; width: 100%; }

    .bg-facebook-service-1 .text-col { float: left; padding: 95px 0 0 15px; min-height: 657px; }

.bg-facebook-service-2 { background: url(Images/web2017/Background/bg-fbads-detail-2.jpg) no-repeat center top; clear: left; float: left; width: 100%; }

    .bg-facebook-service-2 .text-col { float: right; padding: 110px 0 0 15px; min-height: 657px; width: 38%; }

    .bg-facebook-service-2 .clear-line { clear: left; width: 100%; }

.bg-facebook-service-3 { background: url(Images/web2017/Background/bg-fbads-detail-3.jpg) no-repeat center top; clear: left; float: left; width: 100%; }

    .bg-facebook-service-3 .text-col { float: left; padding: 110px 0 0 15px; min-height: 657px; }

    .bg-facebook-service-3 .clear-line { clear: left; width: 100%; }

.bg-facebook-service-4 { background: #eef0f2 url(Images/web2017/Background/bg-fbads-detail-4.jpg) no-repeat center bottom; clear: left; float: left; width: 100%; }

    .bg-facebook-service-4 .text-col { width: 100%; text-align: center; padding: 100px 10px 0; min-height: 657px; }

    .bg-facebook-service-4 .bg-facebook-ads-button { display: table; margin: 30px auto 0; float: none; }

        .bg-facebook-service-4 .bg-facebook-ads-button .btn-facebook-ads a { background-color: #1c4398; }

            .bg-facebook-service-4 .bg-facebook-ads-button .btn-facebook-ads a:hover { background-color: #2a61d7; }

        .bg-facebook-service-4 .bg-facebook-ads-button .h3-title { text-align: left; margin-top: 20px; clear: left; float: left; width: 100%; }

/* start of Landing Adword 2018*/
.bg-adwords-ads { font-family: ThaiSansNeueBold; color: #1c4398; }

.bg-adwords-ads-footer { background: url(Images/Web2017/Background/Adwords/Footer.jpg) no-repeat center; clear: left; float: left; width: 100%; min-height: 67px; }

.bg-adwords-ads-6 { background: url(Images/Web2017/Background/Adwords/F6.jpg) no-repeat center top; clear: left; float: left; width: 100%; min-height: 657px; }

    .bg-adwords-ads-6 .text-col { margin: auto; width: 75%; padding: 10px; padding-top: 40px; }

    .bg-adwords-ads-6 .h1-title { font-size: 48px; color: white; line-height: 60px; width: 100%; text-align: center; }

    .bg-adwords-ads-6 .yellowline { margin-left: auto; margin-right: auto; width: 70%; margin-top: 25px; border-bottom: solid 3px #ffed76; text-align: center; }

    .bg-adwords-ads-6 .h2-title { margin-top: 15px; font-size: 60px; color: white; line-height: 66px; width: 100%; text-align: center; }

    .bg-adwords-ads-6 .subpanel { margin: auto; display: table; }

    .bg-adwords-ads-6 .contact-2 { clear: left; float: left; font-size: 42px; line-height: 20px; color: black; }

    .bg-adwords-ads-6 .normal { margin-top: 20px; font-family: CSPraJad; font-weight: lighter; font-size: 18px; color: white; line-height: 25px; text-align: left; }

    .bg-adwords-ads-6 .bg-adwords-ads-button .btn-adwords-ads a { background: #ff3e70 url(Images/web2017/icon/icon-phone.png) no-repeat 30px center; color: #fff; float: left; padding: 10px 40px 10px 70px; transition: background 0.5s ease-out, border 0.5s ease-out; line-height: 40px; text-decoration: none; font-size: 30px; border-radius: 50px; }

        .bg-adwords-ads-6 .bg-adwords-ads-button .btn-adwords-ads a:hover { color: #fff; background-color: #1c4398; }

    .bg-adwords-ads-6 .bg-adwords-ads-button { float: left; }

.btn-adwords-line { float: left; margin-right: 30px; }

    .btn-adwords-line a { float: left; background: url(Images/Web2017/Button/addfriends_line.png) no-repeat; padding: 0px 8px 48px 186px; }

.bg-adwords-ads-6 .h11-title { font-size: 70px; }

.bg-adwords-ads-6 .h12-title { font-size: 100px; font-weight: bold; }

.bg-adwords-ads-6 .h13-title { font-size: 80px; font-weight: bold; }


.bg-adwords-ads-5 { background: url(Images/Web2017/Background/Adwords/F5.jpg) no-repeat center top; clear: left; float: left; width: 100%; min-height: 657px; }

    .bg-adwords-ads-5 .text-col { float: left; padding: 55px 0 0 15px; min-height: 657px; margin-left: 50px; }

    .bg-adwords-ads-5 .h1-title { margin-top: 55px; font-size: 64px; color: #009688; line-height: 60px; width: 100%; text-align: left; }

    .bg-adwords-ads-5 .h2-title { font-size: 36px; color: black; line-height: 30px; width: 100%; text-align: left; }

    .bg-adwords-ads-5 .normal { margin-top: 20px; font-family: CSPraJad; font-weight: lighter; font-size: 18px; color: black; line-height: 25px; text-align: left; }

    .bg-adwords-ads-5 .greenline { margin-top: 20px; border-bottom: solid 5px #009688; }

    .bg-adwords-ads-5 .bg-adwords-ads-button .btn-adwords-ads a { background: #009688 url(Images/web2017/icon/icon-phone.png) no-repeat 30px center; color: #fff; float: left; padding: 10px 40px 10px 70px; transition: background 0.5s ease-out, border 0.5s ease-out; line-height: 40px; text-decoration: none; font-size: 30px; border-radius: 50px; }

        .bg-adwords-ads-5 .bg-adwords-ads-button .btn-adwords-ads a:hover { color: #fff; background-color: #1c4398; }


.bg-adwords-ads-4 { background: url(Images/Web2017/Background/Adwords/F4.jpg) no-repeat center top; clear: left; float: left; width: 100%; min-height: 657px; }

    .bg-adwords-ads-4 .text-col { margin: auto; margin-left: auto; width: 78%; padding: 10px; margin-left: 19%; text-align: center; position: relative; }

    .bg-adwords-ads-4 .h1-title { font-size: 64px; color: #ff265e; text-align: center; line-height: 60px; }

    .bg-adwords-ads-4 .h11-title { font-size: 64px; color: black; text-align: center; line-height: 60px; margin-top: 5px; }

    .bg-adwords-ads-4 .h12-title { font-size: 78px; color: #ff265e; text-align: center; line-height: 60px; background-color: #f3f7fe; padding: 0px 25px; position: relative; display: inline-block; }

    .bg-adwords-ads-4 .h2-title { font-size: 38px; color: black; text-align: center; line-height: 60px; }

    .bg-adwords-ads-4 .yellowline { margin-top: 40px; border-bottom: solid 3px #ffed76; width: 100%; position: absolute; }

.bg-adwords-ads-3 { background: url(Images/Web2017/Background/Adwords/F3.jpg) no-repeat center top; clear: left; float: left; width: 100%; min-height: 657px; }

    .bg-adwords-ads-3 .text-col { border-radius: 10px; margin-top: 50px; margin-left: 620px; background-color: rgba(255, 255, 255, 0.8); float: left; padding-left: 25px; padding-top: 25px; padding-right: 25px; padding-bottom: 25px; }

    .bg-adwords-ads-3 .h1-title { font-weight: bold; font-size: 40px; color: black; line-height: 65px; text-align: left; }

    .bg-adwords-ads-3 .h2-title { font-size: 58px; color: #ffa533; line-height: 48px; text-align: left; }

    .bg-adwords-ads-3 .h3-title { font-size: 36px; line-height: 46px; }

.bg-adwords-ads-2 { background: url(Images/Web2017/Background/Adwords/F2.jpg) no-repeat center top; clear: left; float: left; width: 100%; }

    .bg-adwords-ads-2 .text-col { float: left; padding: 55px 0 0 15px; min-height: 657px; }

    .bg-adwords-ads-2 .h1-title { font-weight: bold; padding-top: 25px; font-size: 72px; color: black; line-height: 65px; width: 100%; text-align: left; }

    .bg-adwords-ads-2 .redbutton-title { margin-top: 20px; padding-bottom: 10px; padding-right: 10px; font-weight: bold; font-size: 54px; color: white; background-color: #ff265e; text-align: center; }

    .bg-adwords-ads-2 .normal { margin-top: 20px; font-family: CSPraJad; font-weight: lighter; font-size: 18px; color: black; line-height: 25px; text-align: left; }

    .bg-adwords-ads-2 .bg-adwords-ads-button .btn-adwords-ads a { background: #2979ff url(Images/web2017/icon/icon-phone.png) no-repeat 30px center; color: #fff; float: left; padding: 10px 40px 10px 70px; transition: background 0.5s ease-out, border 0.5s ease-out; line-height: 40px; text-decoration: none; font-size: 30px; border-radius: 50px; }

        .bg-adwords-ads-2 .bg-adwords-ads-button .btn-adwords-ads a:hover { color: #fff; background-color: #1c4398; }


.bg-adwords-ads-3 .yellowline { margin-top: 25px; border-bottom: solid 3px #ffed76; width: 60%; }

.bg-adwords-ads-1 { background: url(Images/Web2017/Background/Adwords/F1.jpg) no-repeat center top; clear: left; float: left; width: 100%; }

.bg-adwords-ads .row { position: relative; }

.bg-adwords-ads-1 .text-col { float: left; padding: 55px 0 0 15px; min-height: 725px; }

.bg-adwords-ads-1 .h1-title { font-weight: bold; padding-top: 85px; font-size: 48px; color: #ff8f00; line-height: 45px; width: 100%; text-align: left; }

.bg-adwords-ads-1 .h2-title { font-weight: bold; padding-top: 25px; font-size: 36px; color: black; line-height: 35px; width: 100%; text-align: left; }

.bg-adwords-ads-1 .normal1 { font-family: CSPraJad; font-weight: lighter; line-height: 40px; font-size: 18px; color: black; width: 100%; text-align: left; line-height: 25px; margin-top: 20px; }

.bg-adwords-ads-1 .normal2 { font-family: CSPraJad; font-weight: lighter; font-size: 18px; color: black; width: 100%; text-align: left; line-height: 25px; }

.bg-adwords-ads-1 .yellowline { margin-top: 25px; border-bottom: solid 3px #ffed76; width: 75%; }

.bg-adwords-ads-button { clear: left; float: left; margin: 0 0 10px; padding-bottom: 25px; width: 100%; }

    .bg-adwords-ads-button .btn-adwords-ads { float: left; margin-right: 30px; margin-top: 20px; }

        .bg-adwords-ads-button .btn-adwords-ads a { background: #ff8f00 url(Images/web2017/icon/icon-phone.png) no-repeat 30px center; color: #fff; float: left; padding: 10px 40px 10px 70px; transition: background 0.5s ease-out, border 0.5s ease-out; line-height: 40px; text-decoration: none; font-size: 30px; border-radius: 50px; }

            .bg-adwords-ads-button .btn-adwords-ads a:hover { color: #fff; background-color: #1c4398; }

    .bg-adwords-ads-button .contact { float: left; color: black; }

    .bg-adwords-ads-button .contact-1 { margin-top: 10px; clear: left; float: left; font-size: 30px; line-height: 30px; }

    .bg-adwords-ads-button .contact-2 { clear: left; float: left; font-size: 60px; line-height: 30px; }

.adword-header { padding-top: 5px; min-height: 58px; z-index: 2; }

    .adword-header .col { margin-left: 100px; margin-right: 100px; padding-right: 100px; padding-top: 5px; }

    .adword-header .logo a { background: url(Images/web2017/Background/logo.svg) no-repeat left center; background-size: auto 40px; float: left; position: relative; width: 200px; height: 44px; }

    .adword-header .HeaderContact { margin: 8px 0; }
.bg-adwords-ads-mobile { font-family: ThaiSansNeueBold; color: #1c4398; }

.bg-adwords-ads-mobile-1 { background-color: #e6eefe; clear: left; float: left; width: 100%; }

    .bg-adwords-ads-mobile-1 .text-col { text-align: center; background: url(Images/Web2017/Background/Adwords/M1-1.jpg) no-repeat center bottom; background-size: auto 500px; min-height: 700px; padding: 40px 0 380px; text-align: center; }


    .bg-adwords-ads-mobile-1 .h1-title { font-weight: bold; font-size: 54px; line-height: 58px; color: #ff8f00; width: 100%; text-align: center; }


.bg-adwords-ads-mobile-2 { background: url(Images/Web2017/Background/Adwords/M2.jpg) no-repeat center top; clear: left; float: left; width: 100%; background-size: contain; min-height: 1100px; }

.bg-adwords-ads-mobile-3 { background: url(Images/Web2017/Background/Adwords/M3.jpg) no-repeat center top; clear: left; float: left; width: 100%; min-height: 1100px; }

.bg-adwords-ads-mobile-4 { background-color: #FF8E01; clear: left; float: left; width: 100%; padding: 20px; min-height: 700px; }

    .bg-adwords-ads-mobile-4 .text-col { text-align: center; background: #fff url(Images/Web2017/Background/Adwords/M4-1.jpg) no-repeat center 130%; background-size: auto 450px; border-radius: 30px; min-height: 700px; padding-bottom: 380px; padding-top: 30px; box-shadow: 0 0 60px #bb9e79; }

    .bg-adwords-ads-mobile-4 .h1-title { font-weight: bold; font-size: 48px; color: black; }

    .bg-adwords-ads-mobile-4 .h2-title { padding-top: 5px; font-size: 54px; color: #ffa533; line-height: 48px; }

    .bg-adwords-ads-mobile-4 .h3-title { font-size: 72px; color: black; }


.bg-adwords-ads-mobile-5 { clear: left; float: left; width: 100%; padding: 20px; }

    .bg-adwords-ads-mobile-5 .text-col { text-align: center; background: #f1f5fa url(Images/Web2017/Background/Adwords/M5-1.jpg) no-repeat center 93%; background-size: auto 275px; border-radius: 30px; padding-bottom: 320px; padding-top: 30px; text-align: center; box-shadow: 0 0 60px #bb9e79; min-height: 700px; }

    .bg-adwords-ads-mobile-5 .h1-title { font-size: 72px; color: #ff265e; text-align: center; line-height: 60px; }

    .bg-adwords-ads-mobile-5 .h3-title { font-size: 54px; color: black; text-align: center; margin-top: 5px; }

    .bg-adwords-ads-mobile-5 .h4-title { font-size: 54px; color: #05bc86; line-height: 50px; margin-top: 20px; }

    .bg-adwords-ads-mobile-5 .h5-title { font-size: 48px; color: #05bc86; margin-top: 10px; }

.bg-adwords-ads-mobile-6 { background-color: #009688; clear: left; float: left; width: 100%; padding: 20px; }

    .bg-adwords-ads-mobile-6 .text-col { text-align: center; background: #fff url(Images/Web2017/Background/Adwords/M6-1.jpg) no-repeat center 98%; background-size: auto 340px; border-radius: 30px; min-height: 700px; padding: 30px 10% 320px; box-shadow: 0 0 60px #bb9e79; }

    .bg-adwords-ads-mobile-6 .h1-title { font-size: 54px; color: #009688; line-height: 50px; width: 100%; text-align: left; }

    .bg-adwords-ads-mobile-6 .h2-title { font-size: 30px; color: black; line-height: 30px; width: 100%; text-align: left; }

    .bg-adwords-ads-mobile-6 .normal { margin-top: 20px; font-family: CSPraJad; font-weight: lighter; font-size: 18px; color: black; line-height: 25px; text-align: left; }

    .bg-adwords-ads-mobile-6 .greenline { margin-top: 30px; border-bottom: solid 5px #009688; width: 70%; }

.bg-adwords-ads-mobile-7 { background: url(Images/Web2017/Background/Adwords/M7.jpg) no-repeat center bottom; clear: left; float: left; width: 100%; min-height: 700px; padding: 20px; }

    .bg-adwords-ads-mobile-7 .text-col { margin-top: 10px; padding-bottom: 35px; text-align: center; }

    .bg-adwords-ads-mobile-7 .h1-title { font-size: 50px; color: white; line-height: 50px; width: 100%; text-align: center; padding-bottom: 20px; }

    .bg-adwords-ads-mobile-7 .h11-title { font-size: 84px; color: white; line-height: 70px; width: 100%; text-align: center; padding-bottom: 20px; }

    .bg-adwords-ads-mobile-7 .yellowline { margin-left: auto; margin-right: auto; width: 90%; margin-top: 15px; border-bottom: solid 5px #ffed76; text-align: center; }

    .bg-adwords-ads-mobile-7 .h2-title { margin-top: 10px; font-size: 48px; color: white; line-height: 50px; width: 100%; text-align: center; }


    .bg-adwords-ads-mobile-7 .normal { padding-left: 50px; margin-top: 20px; font-family: CSPraJad; font-weight: lighter; font-size: 18px; color: white; line-height: 25px; text-align: left; }

.bg-adwords-ads-mobile .row { position: relative; }

.adword-header-mobile { width: 100%; text-align: center; padding-top: 5px; padding-bottom: 5px; }

.bg-adwords-ads-6 .contact-3 { clear: left; float: left; font-size: 42px; line-height: 20px; color: white; }

.bg-adwords-ads-6 .contact-4 { margin-top: 0px; clear: left; float: left; font-size: 30px; line-height: 20px; color: white; }

.FBFloat { position: fixed; width: 60px; height: 60px; bottom: 100px; right: 20px; }


/* end of Landing Adword 2018 */

/* new event 24-02-2018 */
.TKO3-Event { background: url(Images/web2018/Background/bg-TKO3-event1.jpg) no-repeat center top; width: 100%; height: 657px; }

.TKO3-Banner-Event { background: url(Images/web2018/Background/banner-TKO3-event1.jpg) no-repeat center top; width: 100%; height: 657px; clear: left; float: left; }

    .TKO3-Banner-Event .row { height: 100%; position: relative; padding: 0; }

.TKO3-Event-Button { position: absolute; top: 63%; width: 50%; }

    .TKO3-Event-Button a { z-index: 0; background: url(Images/web2017/bullet/tko-white-arrow.png) no-repeat 95% center; background-size: 15px auto; border: solid 2px #fff; color: #fff; padding: 4px 35px 6px 25px; transition: background 0.5s ease-out, border 0.5s ease-out; font-size: 24px; line-height: 40px; font-family: ThaiSansNeueBold; border-radius: 100px; display: table; margin: auto; }

        .TKO3-Event-Button a:hover { background-color: #713cbe; color: #fff; }

.TKO3-Event-Info { color: #ffeb3c; font-size: 24px; background-color: #1b0c3c; line-height: 30px; font-family: ThaiSansNeueBold; }

    .TKO3-Event-Info .row { padding: 20px 20px 30px; }

    .TKO3-Event-Info .title1 { font-size: 30px; color: #fff; line-height: 40px; margin-bottom: 15px; }
    .TKO3-Event-Info .title2 { font-size: 30px; }
    .TKO3-Event-Info .section-item-1 { width: 33%; float: left; }
    .TKO3-Event-Info .section-item-2 { width: 33%; float: left; border-left: solid 2px #fff; border-right: solid 2px #fff; padding: 0 50px; }
    .TKO3-Event-Info .section-item-3 { width: 33%; float: left; padding-left: 50px; }
.TKO3-Event-Container .SeminarFormDiv .title1 { color: #0685fe; }

.TKO3-Event-Container input[type="text"].SeminarFormTextBox:focus { border: solid 1px #69529a; }

.TKO3-Event-Container .SeminarFormButton a { background-color: #69529a; color: #fff; }

    .TKO3-Event-Container .SeminarFormButton a:hover { background-color: #251a57; color: #fff; }
.TKO3-Event-Container .bg-suanlum-2 { padding: 45px 0; }
.TKO3-Event-Container .suanlum-schedule .title { color: #69529a; }

.TKO3-Event-Container .bg-seminar-post { background: url(Images/web2017/Background/bg-TKO3-post.jpg) no-repeat center top; }

.TKO3-Event-Container .SeminarSchedule .info { display: inline-block; float: none; width: 31.5%; padding: 20px 0; margin-right: 1%; vertical-align: top; }
.TKO3-Event-Container .SeminarSchedule .clear-line { clear: left; float: left; width: 100%; }
.TKO3-Event-Container .SeminarSchedule .title6 { line-height: 30px; }
.TKO3-Event-Container .suanlum-place { height: 400px; }
.TKO3-Event-Container .bg-suanlum-2 .NewsEvent { margin-top: 40px; border-top: solid 1px #767d84; }
    .TKO3-Event-Container .bg-suanlum-2 .NewsEvent h1 { padding: 8px 0; }
.TKO3-Event-Container .bg-suanlum-2 .NewsEventList { border-bottom: 0; padding-bottom: 0; }
.TKO3-Event-Container .bg-suanlum-2 .NewsTopic { padding: 0 20px; }
.LayoutContactSocialFooter { background-color: #0c60d3; width: 100%; padding: 60px 0 80px; font-size: 30px; color: #fff; font-family: ThaiSansNeueBold; }
    .LayoutContactSocialFooter a { display: block; width: 100%; height: 100%; color: #fff; }
    .LayoutContactSocialFooter .title { font-size: 24px; width: 100%; margin: 0 0 30px; text-align: center; line-height: 36px; }
    .LayoutContactSocialFooter .tel-button-div { float: left; margin-right: 20px; }
    .LayoutContactSocialFooter .tel-button { float: left; margin-top: 5px; }
        .LayoutContactSocialFooter .tel-button a { background: #379ffe url(Images/web2017/icon/icon-phone.png) no-repeat 30px center; color: #fff; padding: 8px 30px 8px 70px; transition: background 0.5s ease-out, border 0.5s ease-out; line-height: 40px; text-decoration: none; font-size: 30px; border-radius: 50px; margin-top: 5px; }
            .LayoutContactSocialFooter .tel-button a:hover { background-color: #7439d1; color: #fff; }
    .LayoutContactSocialFooter .facebook-button-div { float: left; margin-right: 20px; }
    .LayoutContactSocialFooter .facebook-button { background: url(Images/Web2017/Button/FbChat.png) no-repeat; background-size: auto 55px; width: 55px; height: 55px; float: left; margin-top: 5px; }

    .LayoutContactSocialFooter .line-button-div { float: left; }
    .LayoutContactSocialFooter .line-button { float: left; background: url(Images/Web2017/Button/line-button.png) no-repeat; width: 215px; height: 55px; margin-top: 5px; }
    .LayoutContactSocialFooter .contact { float: left; margin-left: 15px; line-height: 30px; }
    .LayoutContactSocialFooter .contact-1 { float: left; width: 100%; }
    .LayoutContactSocialFooter .contact-2 { float: left; width: 100%; font-size: 42px; }
    .LayoutContactSocialFooter .tel-button-div .contact-2 { font-size: 60px; }
.LayoutFooterLicenseLogo { background-color: #080413; width: 100%; padding: 12px 0; text-align: center; }
    .LayoutFooterLicenseLogo .tk-logo { display: inline-block; width: 180px; position: relative; }
        .LayoutFooterLicenseLogo .tk-logo a { background: url(Images/web2017/Background/logo.svg) no-repeat left top/auto 40px; height: 50px; display: block; text-decoration: none; }

        .LayoutFooterLicenseLogo .tk-logo .lic-copyright { font-family: ThaiSansNeue; font-size: 12px; color: #fff; position: absolute; bottom: 0; left: 45px; line-height: 20px; }

.TopBlack .HeaderMenuNormal { border-bottom: solid 2px #7439d1; background-color: #21173c; padding: 0; }

.TopBlack a.HyperLink:hover { color: #fcd50c; }

.TopBlack div.highlight-menu a.HyperLink { background-color: #303030; }

    .TopBlack div.highlight-menu a.HyperLink:hover { background-color: #505050; color: #fcd50c; }

.HeaderContact { float: right; margin: 15px 0 10px; line-height: 30px; font-family: ThaiSansNeueBold; font-size: 30px; }
    .HeaderContact > div { float: left; margin-left: 15px; color: #fff; }
    .HeaderContact a:hover { color: #fff; }
.HeaderContactTel { font-size: 24px; font-family: ThaiSansNeueBlack; }
    .HeaderContactTel a { background: url(Images/web2017/icon/icon-phone.png) no-repeat left center; padding: 0 0 0 35px; color: #fff; font-family: ThaiSansNeueBold; font-size: 30px; }
/*.HeaderContactFB { background: url(Images/Web2017/Button/FbChat.png) no-repeat; background-size: auto 30px; width: 32px; height: 30px; }*/
/*.HeaderContactFB a { display: block; width: 100%; height: 100%; }*/
.HeaderContactFB a { background: url(Images/Web2017/Button/FbChat.png) no-repeat left top; color: #fff; padding: 0 0 0 35px; height: 30px; line-height: 24px; display: block; background-size: contain; }
.HeaderContactLine a { background: url(Images/web2017/icon/header-icon-line.png) no-repeat left top; color: #fff; padding: 0 0 0 35px; height: 30px; line-height: 24px; display: block; }
    .HeaderContactLine a:hover { background-position: left bottom; }

.RegisterFreeCourseFinished { background-color: #1c1c1c; padding: 100px 0 50px; color: #fafafa; font-family: ThaiSansNeueBold; }
    .RegisterFreeCourseFinished.Processing { padding: 100px 0 120px; }
    .RegisterFreeCourseFinished .CommonImage { clear: left; float: left; width: 100%; margin: 10px 0; }
    .RegisterFreeCourseFinished .CommonTopic { clear: left; float: left; width: 100%; font-size: 48px; }
    .RegisterFreeCourseFinished .CommonDetail { clear: left; float: left; width: 100%; font-size: 30px; line-height: 36px; margin: 10px 0; }

        .RegisterFreeCourseFinished .CommonDetail.Finished { color: #3ce730; margin-bottom: 30px; }
    .RegisterFreeCourseFinished .ContactDiv { margin: 10px 0; clear: left; float: left; width: 100%; color: #fafafa; font-size: 30px; font-family: ThaiSansNeueBold; }
        .RegisterFreeCourseFinished .ContactDiv a { color: #fafafa; }
            .RegisterFreeCourseFinished .ContactDiv a:hover { color: #14ae6a; }


/****** Landing page - Adwords 29000 class *****/

.AdwordsMaster { position: absolute; width: 100%; z-index: 9; }
    .AdwordsMaster .adword-header { background: rgba(112,1,147,0); transition: 0.25s background linear; }
    .AdwordsMaster .header-sticky .adword-header { background: rgba(51,47,121,0.8); }
    .AdwordsMaster .adword-header .row { padding: 0 10px; }

.bg-adwords2-ads { font-family: ThaiSansNeueBold; }
    .bg-adwords2-ads .floatfooter-panel { display: none; }
.bg-adwords2-ads-1 { background: url(Images/web2018/Background/bg-adwords2-ads-1.jpg) no-repeat center top; clear: left; float: left; width: 100%; color: #fff; }
    .bg-adwords2-ads-1 .row { position: relative; }
    .bg-adwords2-ads-1 .text-col { float: left; padding: 120px 0 0 15px; min-height: 725px; }
    .bg-adwords2-ads-1 .h1-title { font-size: 58px; font-family: ThaiSansNeueBlack; }
    .bg-adwords2-ads-1 .h2-title { font-size: 36px; line-height: 42px; margin-bottom: 20px; }
    .bg-adwords2-ads-1 .yellow-bar { width: 290px; height: 4px; background-color: #ffe012; margin: 30px 0; }

.bg-adwords2-ads-2 { background: url(Images/web2018/Background/bg-adwords2-ads-2.jpg) no-repeat center top; clear: left; float: left; width: 100%; color: #000; font-family: ThaiSansNeueBold; }
    .bg-adwords2-ads-2 .row { position: relative; }
    .bg-adwords2-ads-2 .text-col { float: left; padding: 70px 0 0 15px; min-height: 657px; }
    .bg-adwords2-ads-2 .h1-title { font-size: 44px; color: #0b71c0; }
    .bg-adwords2-ads-2 .h2-title { font-family: CSPraJad; font-size: 22px; clear: left; margin-bottom: 30px; font-weight: bold; }
    .bg-adwords2-ads-2 .h3-title { font-size: 33px; display: inline-block; line-height: 30px; margin: 20px 0; }
    .bg-adwords2-ads-2 .bubble-label { background-color: #1094fa; width: 106px; height: 106px; line-height: 80px; padding: 10px 0; text-align: center; color: #fff; font-size: 70px; border-radius: 120px; display: inline-block; vertical-align: top; margin-right: 15px; }
    .bg-adwords2-ads-2 .h4-title { font-size: 33px; color: #0b71c0; margin: 10px 0; }
    .bg-adwords2-ads-2 .blue-bar { width: 390px; height: 3px; background-color: #0b71c0; margin: 35px 0; }
    .bg-adwords2-ads-2 ul { padding: 0; margin: 0; list-style-type: none; }
        .bg-adwords2-ads-2 ul li { background: url(Images/web2018/icon/bullet-dashed.png) no-repeat left 8px; padding-left: 25px; margin-bottom: 5px; line-height: 1.4; }
    .bg-adwords2-ads-2 .clear-line { display: block; width: 100%; }
.bg-adwords2-ads-3 { background: url(Images/web2018/Background/bg-adwords2-ads-3.jpg) no-repeat center top; clear: left; float: left; width: 100%; color: #000; font-family: ThaiSansNeueBold; }
    .bg-adwords2-ads-3 .row { position: relative; padding: 70px 10px; min-height: 657px; }
    .bg-adwords2-ads-3 .text-col { float: right; padding: 50px 35px 50px 35px; box-shadow: 10px 0 32px #bb9e79; background-color: #fff; border-radius: 20px; width: 50%; }
    .bg-adwords2-ads-3 .h1-title { font-size: 45px; color: #0b95ff; }
    .bg-adwords2-ads-3 .h2-title { font-size: 60px; margin-bottom: 15px; color: #0b95ff; }
    .bg-adwords2-ads-3 .h3-title { font-size: 38px; margin-bottom: 10px; }
    .bg-adwords2-ads-3 .h4-title { font-size: 38px; }
    .bg-adwords2-ads-3 .h4-title-large { font-size: 55px; color: #0b95ff; }
    .bg-adwords2-ads-3 .bg-adwords-ads-button { padding: 0; margin-top: 20px; }
        .bg-adwords2-ads-3 .bg-adwords-ads-button .btn-adwords-ads a { background-color: #0b95ff; }
            .bg-adwords2-ads-3 .bg-adwords-ads-button .btn-adwords-ads a:hover { background-color: #be0fea; }

.bg-adwords2-ads-4 { background: url(Images/web2018/Background/bg-adwords2-ads-4.jpg) no-repeat center top; clear: left; float: left; width: 100%; color: #000; border-top: solid 20px #ff265e; border-bottom: solid 20px #ff265e; }
    .bg-adwords2-ads-4 .row { position: relative; padding: 115px 10px; min-height: 617px; }
    .bg-adwords2-ads-4 .text-col { float: left; width: 49%; }
    .bg-adwords2-ads-4 .video-col { float: right; width: 49%; }

    .bg-adwords2-ads-4 .h1-title { font-size: 45px; margin: 15px 0; font-family: ThaiSansNeue; }
    .bg-adwords2-ads-4 .h2-title { font-size: 58px; color: #ff265e; font-family: ThaiSansNeueBold; }
    .bg-adwords2-ads-4 .bg-adwords-ads-button { padding: 0; margin-top: 30px; }
        .bg-adwords2-ads-4 .bg-adwords-ads-button .btn-adwords-ads a { background-color: #ff265e; }
            .bg-adwords2-ads-4 .bg-adwords-ads-button .btn-adwords-ads a:hover { background-color: #be0fea; }


.bg-adwords2-ads-5 { background: url(Images/web2018/Background/bg-adwords2-ads-5.jpg) no-repeat center top; clear: left; float: left; width: 100%; color: #000; font-family: ThaiSansNeueBold; }
    .bg-adwords2-ads-5 .row { position: relative; padding: 30px 10px; min-height: 657px; text-align: center; }
    .bg-adwords2-ads-5 .text-col { float: left; width: 60%; margin-left: 20%; }
    .bg-adwords2-ads-5 .h1-title { font-size: 34px; }
    .bg-adwords2-ads-5 .h2-title { font-size: 52px; text-transform: uppercase; line-height: 50px; margin: 5px 0; }
    .bg-adwords2-ads-5 .h2-title-large { font-size: 62px; color: #ff265e; }
    .bg-adwords2-ads-5 .h3-title { font-size: 58px; line-height: 55px; }
    .bg-adwords2-ads-5 .h4-title { font-size: 38px; line-height: 55px; }
    .bg-adwords2-ads-5 .h4-title-large { font-size: 70px; color: #ff265e; }
    .bg-adwords2-ads-5 .h4-title-large1 { font-size: 55px; color: #ff265e; }
    .bg-adwords2-ads-5 .h5-title { font-size: 47px; text-decoration: line-through; line-height: 55px; }
    .bg-adwords2-ads-5 .h6-title { font-size: 52px; line-height: 60px; }
    .bg-adwords2-ads-5 .h6-title-large { font-size: 106px; color: #ff265e; }
    .bg-adwords2-ads-5 .h6-title-large1 { font-size: 76px; color: #ff265e; }
    .bg-adwords2-ads-5 .bg-adwords-ads-button { padding: 0; margin-top: 25px; display: inline-block; float: none; width: auto; }
        .bg-adwords2-ads-5 .bg-adwords-ads-button .btn-adwords-ads a { background-color: #0b95ff; }
            .bg-adwords2-ads-5 .bg-adwords-ads-button .btn-adwords-ads a:hover { background-color: #be0fea; }
    .bg-adwords2-ads-5 .pink-bar { width: 300px; height: 4px; background-color: #ff265e; margin: 25px 0 15px; display: inline-block; }

.bg-adwords2-ads-6 { /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#fa4d7a+0,be0fea+99 */ background: rgb(250,77,122); /* Old browsers */ background: -moz-linear-gradient(-45deg, rgba(250,77,122,1) 0%, rgba(190,15,234,1) 99%); /* FF3.6-15 */ background: -webkit-linear-gradient(-45deg, rgba(250,77,122,1) 0%,rgba(190,15,234,1) 99%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(135deg, rgba(250,77,122,1) 0%,rgba(190,15,234,1) 99%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fa4d7a', endColorstr='#be0fea',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */ clear: left; float: left; width: 100%; color: #fff; font-family: ThaiSansNeueBold; }
    .bg-adwords2-ads-6 .row { position: relative; padding: 90px 10px; min-height: 657px; }
    .bg-adwords2-ads-6 .text-col { display: table; width: 735px; margin: 0 auto; }

    .bg-adwords2-ads-6 .h1-title { font-size: 28px; font-family: CSPraJad; line-height: 1.5; margin-bottom: 30px; }
    .bg-adwords2-ads-6 .h2-title { font-size: 52px; text-transform: uppercase; }
    .bg-adwords2-ads-6 .bg-adwords-ads-button { padding: 0; margin-top: 25px; display: inline-block; float: none; width: auto; }
        .bg-adwords2-ads-6 .bg-adwords-ads-button .btn-adwords-ads { margin-top: 0; }
            .bg-adwords2-ads-6 .bg-adwords-ads-button .btn-adwords-ads a { background: #fe9711 url(Images/web2018/icon/icon-phone-large.png) no-repeat 20% center; width: 290px; min-height: 80px; font-size: 42px; padding: 10px 0 10px 35%; line-height: 54px; }
                .bg-adwords2-ads-6 .bg-adwords-ads-button .btn-adwords-ads a:hover { background-color: #be0fea; }

    .bg-adwords2-ads-6 .btn-adwords-line a { float: left; background: url(Images/web2018/icon/addfriends_line.png) no-repeat; padding: 0 0 0 300px; min-height: 80px; }
    .bg-adwords2-ads-6 .btn-adwords-fb, .bg-adwords2-ads-6 .btn-adwords-line { clear: left; float: left; margin-right: 20px; }
        .bg-adwords2-ads-6 .btn-adwords-fb a { float: left; background: url(Images/web2018/icon/fbmsg.png) no-repeat; padding: 0 0 0 300px; min-height: 80px; }
    .bg-adwords2-ads-6 .contact-phone { float: left; line-height: 50px; font-size: 84px; margin: 10px 0 0 0; }
    .bg-adwords2-ads-6 .contact-fb { float: left; }
        .bg-adwords2-ads-6 .contact-fb .contact-1 { float: left; width: 100%; font-size: 42px; line-height: 35px; margin-top: 0; }
        .bg-adwords2-ads-6 .contact-fb .contact-2 { float: left; width: 100%; font-size: 60px; line-height: 35px; }

.bg-adwords2-ads-7 { background: #820da0 url(Images/web2018/icon/tk-footer-logo.png) no-repeat center center; clear: left; float: left; width: 100%; height: 68px; }
    .bg-adwords2-ads-7 a { display: block; height: 68px; width: 100%; }

.floatfooter-panel { position: fixed; bottom: 0; left: 0; right: 0; background-color: white; display: none; z-index: 9999; }

    .floatfooter-panel a { width: 33.33%; float: left; text-align: center; height: 60px; padding: 0; }
        .floatfooter-panel a img { max-height: 60px; }
.sticky-bottom-tel { background-color: #FF8E01; }
.sticky-bottom-line { background-color: #36B419; }
.sticky-bottom-fb { background-color: #007FFF; }
.bg-free-4 .h1-title { line-height: 42px; font-size: 40px; font-family: ThaiSansNeueBold; }

.bg-free-4 .h2-title { line-height: 1.2; font-size: 30px; clear: left; color: #333; font-family: ThaiSansNeueBold; margin-bottom: 15px; }
.bg-free-4 .h3-title { line-height: 1.2; font-size: 18px; font-family: CSPraJad; font-weight: bold; margin-bottom: 15px; }

.bg-free-4 .h4-title { line-height: 1.2; font-size: 16px; margin-bottom: 15px; clear: left; font-family: CSPraJad; }
.bg-free-4 .bar-dark { width: 200px; height: 2px; background-color: #454545; margin: 15px 0; }


.Default-Testimonial .h1-title { line-height: 42px; font-size: 40px; font-family: ThaiSansNeueBold; }

.Default-Testimonial .h2-title { line-height: 1.2; font-size: 30px; clear: left; color: #333; font-family: ThaiSansNeueBold; margin-bottom: 15px; }
.Default-Testimonial .h3-title { line-height: 1.5; font-size: 17px; font-family: CSPraJad; margin-bottom: 15px; }

.Default-Testimonial .h4-title { line-height: 1.2; font-size: 18px; margin-bottom: 15px; clear: left; font-family: CSPraJad; text-decoration: underline; font-weight: bold; }
.Default-Testimonial .bar-dark { width: 200px; height: 2px; background-color: #454545; margin: 25px 0; }
.Default-Testimonial .video-col { position: relative; }
.Default-Testimonial .video-title-h1 { width: 100%; text-align: center; line-height: 1.5; font-size: 30px; font-family: ThaiSansNeueBold; margin-top: 20px; text-shadow: 1px 1px 5px #fff; position: absolute; bottom: 10px; }
.bg-free-12.default .text-col { padding: 0 0 20px 0; text-align: left; }
.bg-free-12.default .h1-title { line-height: 42px; font-size: 40px; font-family: ThaiSansNeueBold; }

.bg-free-12.default .h2-title { line-height: 1; font-size: 30px; clear: left; color: #333; font-family: ThaiSansNeueBold; margin-bottom: 20px; }
.bg-free-12.default .h3-title { line-height: 1.5; font-size: 16px; font-family: CSPraJad; margin-bottom: 20px; font-weight: bold; text-shadow: 1px 0px 10px #fff; }

.bg-free-12.default .bar-dark { width: 200px; height: 2px; background-color: #454545; margin: 25px 0; }
.bg-free-12.default .free2-button { margin: 20px 0 0; }
.bg-free-12.default .common-fb-btn, .bg-free-12.default .common-adw-btn { margin-right: 10px; font-size: 22px; padding: 8px 30px 8px 20px; }

/* HeaderMenu For Seminar*/
.HeaderMenuLogo { margin: 13px 0; float: left; }
    .HeaderMenuLogo img { height: 40px; }

/* new event 19-05-2018 */
.SeminarMasterPage .NewsEvent { clear: left; float: left; width: 100%; text-align: center; }
.SeminarMasterPage .NewsEventItemStyle { width: 32%; margin: 20px 0.25%; }
.SeminarMasterPage .NewsEventImage { margin-bottom: 10px; min-height: 0; max-height: none; }
    .SeminarMasterPage .NewsEventImage img { max-height: none; max-width: 100%; }


.tko4-Event { background: url(Images/web2018/Background/bg-tko4-event1.jpg) no-repeat center top; width: 100%; height: 657px; position: relative; z-index: 1; }
.tko4-banner-event { background: url(Images/web2018/Background/banner-tko4-event1.jpg) no-repeat center top; width: 100%; height: 727px; clear: left; float: left; }

    .tko4-banner-event .row { height: 100%; position: relative; padding: 0; }
.tko4-event-button { position: absolute; top: 72%; width: 50%; right: 0; }
    .tko4-event-button a { z-index: 0; background: url(Images/web2017/bullet/tko-white-arrow.png) no-repeat 95% center; background-size: 15px auto; border: solid 2px #fff; color: #fff; padding: 4px 0; transition: background 0.5s ease-out, border 0.5s ease-out; font-size: 24px; line-height: 40px; font-family: ThaiSansNeueBold; border-radius: 100px; }
.banner-default .swiper-slide .tko4-event-button a { width: 40%; margin: 0 30%; display: block; }
.tko4-event-button a:hover { background-color: #1189dd; color: #fff; }

.tko4-Event-Info { color: #ffeb3c; font-size: 24px; background-color: #0c60d3; line-height: 30px; font-family: ThaiSansNeueBold; }

    .tko4-Event-Info .row { padding: 20px 20px 30px; }

    .tko4-Event-Info .title1 { font-size: 30px; color: #fff; line-height: 40px; margin-bottom: 15px; }
    .tko4-Event-Info .title2 { font-size: 30px; }
    .tko4-Event-Info .section-item-1 { width: 33%; float: left; }
    .tko4-Event-Info .section-item-2 { width: 36%; float: left; border-left: solid 2px #fff; border-right: solid 2px #fff; padding: 0 50px; }
    .tko4-Event-Info .section-item-3 { width: 30%; float: left; padding-left: 50px; }
.tko4-Event-Container .SeminarFormDiv .title1 { color: #0685fe; }

.tko4-Event-Container input[type="text"].SeminarFormTextBox:focus { border: solid 1px #1d4db9; }

.tko4-Event-Container .SeminarFormButton a { background-color: #379ffe; color: #fff; }

    .tko4-Event-Container .SeminarFormButton a:hover { background-color: #1d4db9; color: #fff; }
.tko4-Event-Container .bg-suanlum-2 { padding: 25px 0; }
.tko4-Event-Container .img-suanlum-place { padding-top: 20px; }
.tko4-Event-Container .suanlum-schedule .title { color: #69529a; }

.tko4-Event-Container .bg-seminar-post { background: url(Images/web2017/Background/bg-tko4-post.jpg) no-repeat center top; }

.tko4-Event-Container .SeminarSchedule .info { display: inline-block; float: none; width: 31.5%; padding: 20px 10px 20px 0; margin-right: 1%; vertical-align: top; }
.tko4-Event-Container .SeminarSchedule .clear-line { clear: left; float: left; width: 100%; }
.tko4-Event-Container .SeminarSchedule .title6 { line-height: 30px; }
.tko4-Event-Container .suanlum-place { height: 400px; }
.tko4-Event-Container .bg-suanlum-2 .NewsEvent { margin-top: 40px; border-top: solid 1px #767d84; }
    .tko4-Event-Container .bg-suanlum-2 .NewsEvent h1 { padding: 8px 0; }
.tko4-Event-Container .bg-suanlum-2 .NewsEventList { border-bottom: 0; padding-bottom: 0; }
.tko4-Event-Container .bg-suanlum-2 .NewsTopic { padding: 0 18px; }

.TopNavy .HeaderMenuNormal { border-bottom: solid 2px #5cc4ff; background-color: #1255a8; padding: 0; }
.TopNavy a.HyperLink:hover { color: #fcd50c; }
.TopNavy div.highlight-menu a.HyperLink { background-color: #303030; }
    .TopNavy div.highlight-menu a.HyperLink:hover { background-color: #505050; color: #fcd50c; }

/* new event 25-08-2018 */

.tko5-Event { background: url(Images/web2018/Background/bg-tko5-event1.jpg) no-repeat center top; width: 100%; height: 657px; position: relative; z-index: 1; }
.tko5-banner-event { background: url(Images/web2018/Background/banner-tko5-event1.jpg) no-repeat center top; width: 100%; height: 727px; clear: left; float: left; }

    .tko5-banner-event .row { height: 100%; position: relative; padding: 0; }
.tko5-event-button { position: absolute; top: 64%; width: 50%; left: 0; }
    .tko5-event-button a { z-index: 0; background: url(Images/web2017/bullet/tko-white-arrow.png) no-repeat 95% center; background-size: 15px auto; border: solid 2px #fff; color: #fff; padding: 4px 0; transition: background 0.5s ease-out, border 0.5s ease-out; font-size: 24px; line-height: 40px; font-family: ThaiSansNeueBold; border-radius: 100px; }
.banner-default .swiper-slide .tko5-event-button a { width: 40%; margin: 0 30%; display: block; }
.tko5-event-button a:hover { background-color: #1189dd; color: #fff; }

.tko5-Event-Info { color: #ffeb3c; font-size: 24px; background-color: #1255a8; line-height: 30px; font-family: ThaiSansNeueBold; }

    .tko5-Event-Info .row { padding: 20px 20px 30px; }

    .tko5-Event-Info .title1 { font-size: 30px; color: #fff; line-height: 40px; margin-bottom: 15px; }
    .tko5-Event-Info .title2 { font-size: 30px; }
    .tko5-Event-Info .section-item-1 { width: 33%; float: left; }
    .tko5-Event-Info .section-item-2 { width: 36%; float: left; border-left: solid 2px #fff; border-right: solid 2px #fff; padding: 0 50px; }
    .tko5-Event-Info .section-item-3 { width: 30%; float: left; padding-left: 50px; }
.tko5-Event-Container .SeminarFormDiv .title1 { color: #1255a8; }

.tko5-Event-Container input[type="text"].SeminarFormTextBox:focus { border: solid 1px #1d4db9; }

.tko5-Event-Container .SeminarFormButton a { background-color: #1255a8; color: #fff; }

    .tko5-Event-Container .SeminarFormButton a:hover { background-color: #5cc4ff; color: #fff; }
.tko5-Event-Container .bg-suanlum-2 { padding: 25px 0; }
.tko5-Event-Container .img-suanlum-place { padding-top: 20px; }
.tko5-Event-Container .suanlum-schedule .title { color: #69529a; }

.tko5-Event-Container .bg-seminar-post { background: url(Images/web2018/Background/bg-tko5-post.jpg) no-repeat center top; }

.tko5-Event-Container .SeminarSchedule .info { display: inline-block; float: none; width: 31.5%; padding: 20px 10px 20px 0; margin-right: 1%; vertical-align: top; }
.tko5-Event-Container .SeminarSchedule .clear-line { clear: left; float: left; width: 100%; }
.tko5-Event-Container .SeminarSchedule .title6 { line-height: 30px; }
.tko5-Event-Container .suanlum-place { height: 400px; }
.tko5-Event-Container .bg-suanlum-2 .NewsEvent { margin-top: 40px; border-top: solid 1px #767d84; }
    .tko5-Event-Container .bg-suanlum-2 .NewsEvent h1 { padding: 8px 0; }
.tko5-Event-Container .bg-suanlum-2 .NewsEventList { border-bottom: 0; padding-bottom: 0; }
.tko5-Event-Container .bg-suanlum-2 .NewsTopic { padding: 0 18px; }
.tko5-Event-Container .bg-suanlum-2 .short-bar-dark4 { background-color: #043462; }
.tko5-Event-Container .bg-suanlum-2 .title2 { color: #043462; }
.tko5-Event-Container .bg-suanlum-2 .title3, .tko5-Event-Container .bg-suanlum-2 .title4, .tko5-Event-Container .bg-suanlum-2 .title5 { color: #0e0e0e; }
.tko5-Event-Container .SeminarSchedule h2 { color: #1a1a1a; }
.tko5-Event-Container .bg-seminar-post { color: #f2f4f9; /*margin-bottom: 60px;*/ }
.tko5-Event-Container .NewsEvent .highlight { color: #1255a8; }
.tko5-Event-Container .bg-web-workshop7 .main-row { /*border-top: solid 1px #a4a8ad;*/ padding: 15px 0px; clear: left; float: left; width: 100%; }
.tko5-Event-Container .area-map, .tko5-Event-Container .bg-web-workshop7 { color: #1c1c1c; }
.tko5-Event-Container .font-black { color: #1a1a1a; }
.tko5-Event-Container .LayoutContactSocialFooter { background-color: #1255a8; }

/*Pro 19000 07-09-2018*/

.bg-pro19000-ads { font-family: ThaiSansNeueBold; }
    .bg-pro19000-ads .floatfooter-panel { display: none; }
.bg-pro19000-ads-1 { background: url(Images/web2018/Background/bg-pro19000-ads-1.jpg) no-repeat center top; clear: left; float: left; width: 100%; color: #fff; padding-top: 60px; background-size: cover; min-height: 1181px; }
    .bg-pro19000-ads-1 .row { position: relative; }
.bg-pro19000-ads-1-text { width: 100%; float: left; margin-top: 50px; }
.bg-pro19000-ads-1 .text-col { display: table; margin: auto; }
.bg-pro19000-ads-1 .h1-title { font-size: 52px; font-family: ThaiSansNeueBold; text-align: center; color: #ffffff; }
.bg-pro19000-ads-1 .h2-title { font-size: 52px; font-family: ThaiSansNeueBold; text-align: center; color: #ffffff; float: left; margin-top: 10px; }
.bg-pro19000-ads-1 .h3-title { font-size: 62px; font-family: ThaiSansNeueBold; float: left; line-height: 46px; margin-top: 10px; }
.bg-pro19000-ads-1 .yellow-bar-div { display: table; margin: auto; }
.bg-pro19000-ads-1 .yellow-bar { width: 290px; height: 4px; background-color: #fbc020; margin: 30px 0; border-radius: 30px; }
.bg-pro19000-ads-1 .text-image-div { display: table; margin: auto; }
.bg-pro19000-ads-1 .text-image { background: url(Images/web2018/Background/text-image.png)no-repeat center top; width: 617px; height: 158px; float: left; }
.bg-pro19000-ads-1-register { width: 46%; float: left; margin-left: 27%; margin-top: 40px; }
.bg-pro19000-ads-1 .register-div { width: 100%; min-height: 613px; background: rgba(255, 255, 255, 0.85); border-radius: 5px; box-shadow: 2px 2px 5px #000000; }
    .bg-pro19000-ads-1 .register-div .title1 { color: #1255a8; font-size: 48px; font-family: ThaiSansNeueBold; text-align: center; padding-top: 30px; }
        .bg-pro19000-ads-1 .register-div .title1 .big-font { font-size: 60px; }
    .bg-pro19000-ads-1 .register-div .title2 { color: #111111; font-size: 24px; font-family: ThaiSansNeueBold; text-align: center; padding: 5px 0 35px; }
    .bg-pro19000-ads-1 .register-div .title3 { color: #111111; font-size: 30px; font-family: ThaiSansNeueBold; text-align: center; padding: 30px 0; }
        .bg-pro19000-ads-1 .register-div .title3 .bold { font-size: 34px; }

.Pro19000FormButton { clear: left; padding-top: 15px; float: left; width: 100%; }
    .Pro19000FormButton a { background-color: #eb646a; font-size: 36px; font-family: ThaiSansNeueBold; color: #fdfdfd; padding: 10px 0; line-height: 40px; transition: all 0.5s ease-out; width: 100%; display: block; text-align: center; }
        .Pro19000FormButton a:hover { background-color: #ff7076; color: #fdfdfd; }

.bg-pro19000-ads-2 { background: url(Images/web2018/Background/bg-pro19000-ads-2.jpg) no-repeat center top; clear: left; float: left; width: 100%; color: #000; font-family: ThaiSansNeueBold; background-size: cover; min-height: 657px; }
    .bg-pro19000-ads-2 .row { position: relative; }
    .bg-pro19000-ads-2 .text-col { float: right; padding: 150px 70px 0 15px; }
    .bg-pro19000-ads-2 .h1-title { font-size: 64px; color: #0b71c0; }
    .bg-pro19000-ads-2 .h2-title { font-size: 41px; clear: left; color: #0f0f0f; }
    .bg-pro19000-ads-2 .blue-bar { width: 390px; height: 3px; background-color: #0b71c0; margin: 35px 0; }
    .bg-pro19000-ads-2 .clear-line { display: block; width: 100%; }
.bg-pro19000-ads-3 { background: url(Images/web2018/Background/bg-pro19000-ads-3.jpg) no-repeat center top; clear: left; float: left; width: 100%; color: #000; font-family: ThaiSansNeueBold; min-height: 656px; background-size: cover; }
    .bg-pro19000-ads-3 .row { position: relative; padding: 68px 10px; min-height: 656px; }
    .bg-pro19000-ads-3 .text-col { float: left; padding: 50px 35px 50px 35px; box-shadow: 10px 0 32px #000; background-color: #fff; border-radius: 20px; width: 45%; }
    .bg-pro19000-ads-3 .h1-title { font-size: 51px; color: #fb8220; }
    .bg-pro19000-ads-3 .h2-title { font-size: 41px; margin-bottom: 15px; color: #072546; }
    .bg-pro19000-ads-3 .orange-bar { width: 326px; height: 5px; background-color: #fb8220; margin: 35px 0; border-radius: 30px; }

.bg-pro19000-ads-4 { background: url(Images/web2018/Background/bg-pro19000-ads-4.jpg) no-repeat center top; clear: left; float: left; width: 100%; color: #000; font-family: ThaiSansNeueBold; min-height: 657px; background-size: cover; }
    .bg-pro19000-ads-4 .row { position: relative; padding: 115px 10px; min-height: 617px; }
    .bg-pro19000-ads-4 .text-col { float: right; width: 49%; }

    .bg-pro19000-ads-4 .h1-title { font-size: 58px; margin: 15px 0; color: #ff265e; }
    .bg-pro19000-ads-4 .h2-title { font-size: 46px; color: #262626; }
    .bg-pro19000-ads-4 .pink-bar { width: 291px; height: 5px; background-color: #ff265e; margin: 35px 0; border-radius: 30px; }

.bg-pro19000-ads-5 { background: #332f79 url(Images/web2018/Background/bg-pro19000-ads-5.jpg) no-repeat center top; clear: left; float: left; width: 100%; color: #fff; font-family: ThaiSansNeueBold; min-height: 1129px; }
    .bg-pro19000-ads-5 .row { position: relative; padding: 30px 10px; min-height: 657px; text-align: center; }
    .bg-pro19000-ads-5 .text-col { float: left; width: 84%; margin-left: 8%; }
    .bg-pro19000-ads-5 .h1-title { font-size: 42px; line-height: 48px; }
    .bg-pro19000-ads-5 .h2-title { font-size: 53px; text-transform: uppercase; line-height: 50px; margin: 5px 0 20px; }

    .bg-pro19000-ads-5 .image-text1 { background: url(Images/web2018/Background/image-text1-ads5.png) no-repeat center top; height: 143px; margin-top: 30px; }
    .bg-pro19000-ads-5 .image-text2 { background: url(Images/web2018/Background/image-text2-ads5.png) no-repeat center top; height: 191px; }
    .bg-pro19000-ads-5 .orange-bar { width: 289px; height: 5px; background-color: #fca559; margin: 25px 0 15px; display: inline-block; }

.bg-pro19000-ads-6 { background-color: #1c1a3f; clear: left; float: left; width: 100%; color: #fff; font-family: ThaiSansNeueBold; }
    .bg-pro19000-ads-6 .row { position: relative; padding: 70px 10px; min-height: 657px; }
    .bg-pro19000-ads-6 .image-text1-ads6 { background: url(Images/web2018/Background/image-text1-ads6.png) no-repeat center top; height: 158px; }
    .bg-pro19000-ads-6 .text-col { display: table; width: 735px; margin: 0 auto; }

    .bg-pro19000-ads-6 .h1-title { font-size: 47px; font-family: ThaiSansNeue; color: #fff; margin-top: 55px; text-align: center; }
    .bg-pro19000-ads-6 .h2-title { font-size: 52px; text-transform: uppercase; }
    .bg-pro19000-ads-6 .bg-adwords-ads-button { padding: 0; margin-top: 25px; display: inline-block; float: none; width: auto; }
        .bg-pro19000-ads-6 .bg-adwords-ads-button .btn-adwords-ads { margin-top: 0; }
            .bg-pro19000-ads-6 .bg-adwords-ads-button .btn-adwords-ads a { float: left; background: url(Images/web2018/icon/tel-icon.png) no-repeat center top; padding: 0 0 0 297px; min-height: 83px; transition: none; }
                .bg-pro19000-ads-6 .bg-adwords-ads-button .btn-adwords-ads a:hover { background-position: center bottom; }

    .bg-pro19000-ads-6 .btn-adwords-line a { float: left; background: url(Images/web2018/icon/addfriends_line-icon.png) no-repeat center top; padding: 0 0 0 297px; min-height: 83px; }
        .bg-pro19000-ads-6 .btn-adwords-line a:hover { background-position: center bottom; }
    .bg-pro19000-ads-6 .btn-adwords-fb, .bg-pro19000-ads-6 .btn-adwords-line { clear: left; float: left; margin-right: 30px; }
        .bg-pro19000-ads-6 .btn-adwords-fb a { float: left; background: url(Images/web2018/icon/fbmsg-icon.png) no-repeat center top; padding: 0 0 0 297px; min-height: 83px; }
            .bg-pro19000-ads-6 .btn-adwords-fb a:hover { background-position: center bottom; }
    .bg-pro19000-ads-6 .contact-phone { float: left; line-height: 50px; font-size: 84px; margin: 10px 0 0 0; }
    .bg-pro19000-ads-6 .contact-fb { float: left; }
        .bg-pro19000-ads-6 .contact-fb .contact-1 { float: left; width: 100%; font-size: 42px; line-height: 35px; margin-top: 0; }
        .bg-pro19000-ads-6 .contact-fb .contact-2 { float: left; width: 100%; font-size: 60px; line-height: 35px; }

.bg-pro19000-ads-7 { background: #d55e63 url(Images/web2018/icon/tk-footer-logo.png) no-repeat center center; clear: left; float: left; width: 100%; height: 68px; }
    .bg-pro19000-ads-7 a { display: block; height: 68px; width: 100%; }

/*Pro 1900 11-09-2018*/
.bg-pro1900-ads { font-family: ThaiSansNeueBold; }
.bg-pro1900-ads { font-family: ThaiSansNeueBold; }
    .bg-pro1900-ads .floatfooter-panel { display: none; }
.bg-pro1900-ads-1 { background: url(Images/web2018/Background/bg-feture-pro-1900-01.jpg) no-repeat center top, linear-gradient(to bottom right, #4696fc, #9c6efb); clear: left; float: left; width: 100%; color: #fff; padding-top: 60px; background-size: auto 100%; min-height: 1181px; }
    .bg-pro1900-ads-1 .row { position: relative; }
.bg-pro1900-ads-1-text { width: 100%; float: left; margin-top: 50px; }
.bg-pro1900-ads-1 .text-col { display: table; margin: auto; color: #fff; }
.bg-pro1900-ads-1 .h1-title { font-size: 78px; font-family: ThaiSansNeueBold; text-align: center; }
    .bg-pro1900-ads-1 .h1-title .text-price-1900 { font-size: 150px; color: #f2eb28; }
.bg-pro1900-ads-1 .h3-title { font-size: 39px; font-family: ThaiSansNeueBold; text-align: center; line-height: 40px; margin-top: 10px; }
    .bg-pro1900-ads-1 .h3-title .text-hightlight { position: relative; font-size: 46px; }
        .bg-pro1900-ads-1 .h3-title .text-hightlight:before { position: absolute; content: ""; left: 0; top: 60%; right: 0; border-top: 1.5px solid; border-color: inherit; -webkit-transform: rotate(-5deg); -moz-transform: rotate(-5deg); -ms-transform: rotate(-5deg); -o-transform: rotate(-5deg); transform: rotate(-10deg); }
.bg-pro1900-ads-1-register { width: 554px; float: none; margin: 40px auto; }
.bg-pro1900-ads-1 .register-div { width: 100%; height: auto; background: rgba(255, 255, 255, 0.85); border-radius: 5px; box-shadow: 2px 2px 5px #000000; }
    .bg-pro1900-ads-1 .register-div .title1 { color: #3f7eff; font-size: 48px; font-family: ThaiSansNeueBold; text-align: center; padding-top: 30px; }
        .bg-pro1900-ads-1 .register-div .title1 .big-font { font-size: 60px; }
    .bg-pro1900-ads-1 .register-div .title2 { color: #111111; font-size: 24px; font-family: ThaiSansNeueBold; text-align: center; padding: 5px 0 35px; }
    .bg-pro1900-ads-1 .register-div .title3 { color: #111111; font-size: 30px; font-family: ThaiSansNeueBold; text-align: center; padding: 30px 0; }
        .bg-pro1900-ads-1 .register-div .title3 .bold { font-size: 34px; font-weight: bold; }

.Pro1900FormButton { clear: left; padding-top: 15px; float: left; width: 100%; }
    .Pro1900FormButton a { background-color: #ff7800; font-size: 36px; font-family: ThaiSansNeueBold; color: #fdfdfd; padding: 10px 0; line-height: 40px; transition: all 0.5s ease-out; width: 100%; display: block; text-align: center; }
        .Pro1900FormButton a:hover { background-color: #ff4800; color: #fdfdfd; }

.bg-pro1900-ads-2 { background: url(Images/web2018/Background/bg-feture-pro-1900-02.jpg) no-repeat center top; clear: left; float: left; width: 100%; color: #000; font-family: ThaiSansNeueBold; background-size: auto 100%; min-height: 657px; }
    .bg-pro1900-ads-2 .row { position: relative; }
    .bg-pro1900-ads-2 .text-col { float: left; padding: 75px 0 0; }
    .bg-pro1900-ads-2 .h1-title { font-size: 70px; color: #008be3; line-height: 80px; }
    .bg-pro1900-ads-2 .h2-title { font-size: 55px; clear: left; color: #303030; }
    .bg-pro1900-ads-2 .h3-title { font-size: 34px; clear: left; color: #303030; font-family: ThaiSansNeue; padding: 16px 0; line-height: 42px; }
    .bg-pro1900-ads-2 .h1-pro { font-size: 80px; color: #ff7800; margin-left: 65px; }
    .bg-pro1900-ads-2 .h2-pro { font-size: 75px; color: #303030; }
        .bg-pro1900-ads-2 .h2-pro .text-hightlight { line-height: 100px; font-size: 130px; color: #ff7800; }
    .bg-pro1900-ads-2 .h3-pro { font-size: 40px; color: #303030; }
        .bg-pro1900-ads-2 .h3-pro .text-hightlight { position: relative; font-size: 51px; }
            .bg-pro1900-ads-2 .h3-pro .text-hightlight:before { position: absolute; content: ""; left: 0; top: 60%; right: 0; border-top: 1.5px solid; border-color: inherit; -webkit-transform: rotate(-5deg); -moz-transform: rotate(-5deg); -ms-transform: rotate(-5deg); -o-transform: rotate(-5deg); transform: rotate(-10deg); }
        .bg-pro1900-ads-2 .h3-pro .clear-line { text-align: center; padding-right: 130px; }
    .bg-pro1900-ads-2 .clear-line { display: block; width: 100%; }

.bg-pro1900-ads-3 { background: url(Images/web2018/Background/bg-feture-pro-1900-03.jpg) no-repeat center top, linear-gradient(to right, #f7a74a, #c746a8); clear: right; float: right; width: 100%; color: #fff; font-family: ThaiSansNeueBold; background-size: auto 100%; min-height: 657px; }
    .bg-pro1900-ads-3 .row { position: relative; }
    .bg-pro1900-ads-3 .text-col { float: right; padding: 150px 0 0; }
    .bg-pro1900-ads-3 .h1-title { font-size: 70px; line-height: 75px; }
    .bg-pro1900-ads-3 .h2-title { font-size: 55px; clear: left; }
    .bg-pro1900-ads-3 .asset-pro1900 { background: url(Images/web2018/Background/asset-feture-pro-1900.jpg) no-repeat center; width: 543px; height: 39px; background-size: contain; margin-top: 25px; box-shadow: 4px 4px 4px #0000004d; }

.bg-pro1900-ads-4 { background: url(Images/web2018/Background/bg-feture-pro-1900-04.jpg) no-repeat center top; clear: left; float: left; width: 100%; color: #fff; font-family: ThaiSansNeueBold; background-size: auto 100%; min-height: 657px; }
    .bg-pro1900-ads-4 .row { position: relative; }
    .bg-pro1900-ads-4 .text-col { float: left; padding: 150px 0 0; color: #303030; text-transform: uppercase; }
    .bg-pro1900-ads-4 .h1-title { font-size: 70px; line-height: 80px; }
    .bg-pro1900-ads-4 .h2-title { font-size: 40px; clear: left; }
    .bg-pro1900-ads-4 .h3-title { font-size: 35px; clear: left; margin: 20px 0; font-family: ThaiSansNeue; }

.bg-pro1900-ads-5 { background: url(Images/web2018/Background/bg-feture-pro-1900-05.jpg) no-repeat center top, linear-gradient(to bottom right, #9a6cfb, #d15da4); clear: both; float: none; width: 100%; color: #fff; font-family: ThaiSansNeueBold; background-size: auto 100%; min-height: 690px; }
    .bg-pro1900-ads-5 .row { position: relative; }
    .bg-pro1900-ads-5 .text-col { float: none; padding: 115px 0 0; color: #fff; text-transform: uppercase; text-align: center; }
    .bg-pro1900-ads-5 .h1-title { font-size: 70px; line-height: 76px; }
    .bg-pro1900-ads-5 .h2-title { font-size: 40px; clear: left; line-height: 52px; margin: 15px 0 15px 10px; }
        .bg-pro1900-ads-5 .h2-title .clear-line { background: url(Images/web2018/icon/icon-qa-pro.png) no-repeat left 12px; padding: 3px 15px 3px 55px; background-size: 36px 36px; }
    .bg-pro1900-ads-5 .pro1900-col { width: 100%; }
    .bg-pro1900-ads-5 .pro1900-col-left { width: 49%; float: left; text-align: left; }
    .bg-pro1900-ads-5 .pro1900-col-right { width: 49%; float: right; text-align: left; }

.bg-pro1900-ads-6 { background: #fff url(Images/web2018/Background/bg-feture-pro-1900-06.jpg) no-repeat center top; clear: left; float: left; width: 100%; color: #fff; font-family: ThaiSansNeueBold; background-size: auto 100%; min-height: 763px; }
    .bg-pro1900-ads-6 .row { position: relative; }
    .bg-pro1900-ads-6 .text-col { float: left; padding: 80px 0 0; color: #303030; }
    .bg-pro1900-ads-6 .h1-title { font-size: 61px; text-align: center; }
        .bg-pro1900-ads-6 .h1-title .text-price-1900 { line-height: 78px; font-size: 130px; color: #ff8934; }
    .bg-pro1900-ads-6 .h2-title { font-size: 58px; text-align: center; line-height: 100px; }
    .bg-pro1900-ads-6 .h3-title { font-size: 35px; text-align: center; line-height: 42px; }
        .bg-pro1900-ads-6 .h3-title .text-hightlight { position: relative; font-size: 46px; }
            .bg-pro1900-ads-6 .h3-title .text-hightlight:before { position: absolute; content: ""; left: 0; top: 60%; right: 0; border-top: 1.5px solid; border-color: inherit; -webkit-transform: rotate(-5deg); -moz-transform: rotate(-5deg); -ms-transform: rotate(-5deg); -o-transform: rotate(-5deg); transform: rotate(-10deg); }
    .bg-pro1900-ads-6 .pro1900-contact { text-align: left; padding-left: 20%; }

    .bg-pro1900-ads-6 .bg-adwords-ads-button { padding: 0; margin-top: 20px; display: inline-block; float: none; width: auto; }
        .bg-pro1900-ads-6 .bg-adwords-ads-button .btn-adwords-ads { margin-top: 0; }
            .bg-pro1900-ads-6 .bg-adwords-ads-button .btn-adwords-ads a { float: left; background: url(Images/web2018/icon/tel-icon-1900.png) no-repeat center top; padding: 0 0 0 297px; min-height: 83px; transition: none; }
                .bg-pro1900-ads-6 .bg-adwords-ads-button .btn-adwords-ads a:hover { background-position: center bottom; }

    .bg-pro1900-ads-6 .btn-adwords-line a { float: left; background: url(Images/web2018/icon/addfriends_line-icon.png) no-repeat center top; padding: 0 0 0 297px; min-height: 83px; }
        .bg-pro1900-ads-6 .btn-adwords-line a:hover { background-position: center bottom; }
    .bg-pro1900-ads-6 .btn-adwords-fb, .bg-pro19000-ads-6 .btn-adwords-line { clear: left; float: left; margin-right: 30px; }
        .bg-pro1900-ads-6 .btn-adwords-fb a { float: left; background: url(Images/web2018/icon/fbmsg-icon.png) no-repeat center top; padding: 0 0 0 297px; min-height: 83px; }
            .bg-pro1900-ads-6 .btn-adwords-fb a:hover { background-position: center bottom; }
    .bg-pro1900-ads-6 .contact-phone { float: left; line-height: 50px; font-size: 83px; margin: 10px 0 0 0; }
    .bg-pro1900-ads-6 .contact-fb { float: left; }
        .bg-pro1900-ads-6 .contact-fb .contact-1 { float: left; width: 100%; font-size: 42px; line-height: 35px; margin-top: 0; color: #5f5f5f; }
        .bg-pro1900-ads-6 .contact-fb .contact-2 { float: left; width: 100%; font-size: 60px; line-height: 35px; }

.bg-pro1900-ads-7 { background: #1a7edb url(Images/web2018/icon/tk-footer-logo.png) no-repeat center center; clear: left; float: left; width: 100%; height: 68px; }
    .bg-pro1900-ads-7 a { display: block; height: 68px; width: 100%; }

/*TKOSeminar20181110*/
.FrontMasterTop.SeminarMasterPage .HeaderMenuNormal { background-color: #fe840e; border-bottom: 0; padding: 0; }
.tko6-Event { background: #fe9e0e url(Images/web2018/Background/bg-tko6-event1.jpg) no-repeat center top; width: 100%; height: 661px; position: relative; z-index: 1; }
.tko6-banner-event { background: url(Images/web2018/Background/banner-tko6-event1.jpg) no-repeat center top; width: 100%; height: 727px; clear: left; float: left; }

    .tko6-banner-event .row { height: 100%; position: relative; padding: 0; }
.tko6-event-button { position: absolute; top: 68%; width: 45%; right: 0; }
    .tko6-event-button a { z-index: 0; background: url(Images/web2018/bullet/tko-black-arrow.png) no-repeat 95% center; border: solid 2px #000000; color: #010101; padding: 4px 0; transition: background 0.5s ease-out, border 0.5s ease-out; font-size: 24px; line-height: 40px; font-family: ThaiSansNeueBold; border-radius: 100px; }
.banner-default .swiper-slide .tko6-event-button a, .txm-banner-event .tko6-event-button a { width: 40%; margin: 0 30%; display: block; text-align: center; }
.tko6-event-button a:hover { border: solid 2px #fc8720; color: #fff; background: #fc8720 url(Images/web2018/bullet/tko-white-arrow.png) no-repeat 95% center; }

.tko6-Event-Info { width: 100%; float: left; clear: left; background-color: #fe9e0e; min-height: 8px; }
.tko6-Event-Container .SeminarFormDiv .title1 { color: #fe840e; }
.tko6-Event-Container .bg-seminar-post .title1, .tko6-Event-Container .bg-seminar-post .title2, .tko6-Event-Container .bg-seminar-post .title3 { color: #000; }
.tko6-Event-Container .bg-seminar-post .title1 { font-size: 32px; }
.tko6-Event-Container .bg-seminar-post .title2, .tko6-Event-Container .bg-seminar-post .title3 { font-size: 26px; }
.tko6-Event-Container input[type="text"].SeminarFormTextBox:focus { border: solid 1px #1d4db9; }
.tko6-Event-Container .NewsEvent { padding: 45px 0 0; }
    .tko6-Event-Container .NewsEvent .row { border-bottom: 1px solid #a4a8ad; }
.tko6-Event-Container .SeminarFormButton a { background-color: #fe840e; color: #fff; }

    .tko6-Event-Container .SeminarFormButton a:hover { background-color: #fea957; color: #fff; }
.tko6-Event-Container .bg-suanlum-2 { padding: 25px 0 50px; background: #fef2e7; min-height: 507px; }
    .tko6-Event-Container .bg-suanlum-2 .title1 { font-size: 36px; color: #020202; font-family: Prompt-Bold; text-align: center; margin-top: 40px; }
.tko6-Event-Container .img-suanlum-place { padding-top: 28px; width: 58%; margin-left: 21%; }
.tko6-Event-Container .suanlum-schedule .title { color: #69529a; }

.tko6-Event-Container .bg-seminar-post { background: #fa8820 url(Images/web2018/Background/bg-tko6-post.jpg) no-repeat center top; }

.tko6-Event-Container .SeminarSchedule { background-color: #f2f1f7; }
    .tko6-Event-Container .SeminarSchedule .info { display: inline-block; float: none; width: 31.5%; padding: 20px 10px 20px 0; margin-right: 1%; vertical-align: top; }
    .tko6-Event-Container .SeminarSchedule .clear-line { clear: left; float: left; width: 100%; }
    .tko6-Event-Container .SeminarSchedule .title6 { line-height: 30px; }
.tko6-Event-Container .suanlum-place { height: 400px; }
.tko6-Event-Container .bg-suanlum-2 .NewsEvent { margin-top: 40px; border-top: solid 1px #767d84; }
    .tko6-Event-Container .bg-suanlum-2 .NewsEvent h1 { padding: 8px 0; }
.tko6-Event-Container .bg-suanlum-2 .NewsEventList { border-bottom: 0; padding-bottom: 0; }
.tko6-Event-Container .bg-suanlum-2 .NewsTopic { padding: 0 18px; }
.tko6-Event-Container .bg-suanlum-2 .short-bar-dark4 { background-color: #043462; }
.tko6-Event-Container .bg-suanlum-2 .title2 { color: #043462; }
.tko6-Event-Container .bg-suanlum-2 .title3, .tko6-Event-Container .bg-suanlum-2 .title4, .tko6-Event-Container .bg-suanlum-2 .title5 { color: #0e0e0e; }
.tko6-Event-Container .SeminarSchedule h2 { color: #1a1a1a; }
.tko6-Event-Container .bg-seminar-post { color: #f2f4f9; /*margin-bottom: 60px;*/ }
.tko6-Event-Container .NewsEvent .highlight { color: #fe840e; }
.tko6-Event-Container .bg-web-workshop7 .main-row { /*border-top: solid 1px #a4a8ad;*/ padding: 15px 0px; clear: left; float: left; width: 100%; }
.tko6-Event-Container .area-map, .tko6-Event-Container .bg-web-workshop7 { color: #1c1c1c; }
.tko6-Event-Container .font-black { color: #1a1a1a; }
.tko6-Event-Container .LayoutContactSocialFooter { background-color: #1255a8; }

.SeminarMasterPage .LayoutContactSocialFooter { background-color: #3a3a3a; }
.SeminarMasterPage .LayoutFooterLicenseLogo { background-color: #0c0c0c; }

.bg-intro-20181110 { background: url(Images/web2018/background/bg-intro-left-20181110.png)no-repeat left bottom, url(Images/web2018/background/bg-intro-right-20181110.png)no-repeat right top; background-color: #f2f1f7; min-height: 653px; float: left; clear: left; width: 100%; }

.bg-intro-20181110-left { float: left; width: 50%; padding-top: 44px; }
    .bg-intro-20181110-left .title1 { font-size: 30px; color: #000000; font-family: Prompt-Bold; line-height: 44px; }
    .bg-intro-20181110-left .title2 { font-size: 48px; color: #020202; font-family: Prompt-Bold; line-height: 52px; }
    .bg-intro-20181110-left .title-image1 { background: url(Images/web2018/background/e-commerce_tune-up.png)no-repeat left center; float: left; width: 100%; height: 135px; margin-top: 38px; margin-bottom: 15px; }
.bg-intro-20181110-right { float: left; width: 50%; margin-top: 44px; padding-left: 50px; border-left: 3px solid #fe840e; }
    .bg-intro-20181110-right .title1 { font-size: 24px; color: #000000; font-family: Prompt-Regular; margin-top: 70px; }
    .bg-intro-20181110-right .title2 { font-size: 24px; color: #000000; font-family: Prompt-Bold; line-height: 34px; }
    .bg-intro-20181110-right .title3 { font-size: 24px; color: #000000; font-family: Prompt-Regular; font-style: italic; margin-top: 15px; }
    .bg-intro-20181110-right .title4 { font-size: 24px; color: #000000; font-family: Prompt-Bold; line-height: 30px; }
    .bg-intro-20181110-right .title5 { font-size: 18px; color: #000000; font-family: Prompt-Regular; line-height: 28px; margin-top: 20px; margin-bottom: 30px; }
    .bg-intro-20181110-right .title-image1 { background: url(Images/web2018/background/takraonline-bw.png)no-repeat left center; float: left; width: 100%; height: 51px; margin: 25px 0; }
    .bg-intro-20181110-right .title-image2 { background: url(Images/web2018/background/maxidea_studio-bw.png)no-repeat left center; float: left; width: 100%; height: 61px; margin-bottom: 8px; }

.bg-speaker-pum-20181110 { background: #fd8b0e url(Images/web2018/background/bg-speaker-pum-20181110.jpg)no-repeat center bottom; min-height: 657px; float: left; clear: left; width: 100%; background-size: cover; }
    .bg-speaker-pum-20181110 .row { padding: 143px 0; position: relative; }
    .bg-speaker-pum-20181110 .title1 { font-size: 30px; color: #000000; font-family: Prompt-Bold; }
    .bg-speaker-pum-20181110 .title2 { font-size: 48px; color: #f1f1f7; font-family: Prompt-Bold; line-height: 70px; }
        .bg-speaker-pum-20181110 .title2 span { font-size: 24px; }
    .bg-speaker-pum-20181110 .title3 { font-size: 34px; color: #f2f1f7; font-family: Prompt-Bold; }
    .bg-speaker-pum-20181110 .title4 { font-size: 48px; color: #f2f1f7; font-family: Prompt-Bold; margin: 15px 0 10px; }
    .bg-speaker-pum-20181110 .title5 { font-size: 48px; color: #f2f1f7; font-family: Prompt-Bold; }
    .bg-speaker-pum-20181110 .title-image1 { background: url(Images/web2018/background/bg-takraonline-pum-20181110.png)no-repeat left center; background-size: 382px auto; float: left; width: 100%; height: 84px; margin-bottom: 24px; }
    .bg-speaker-pum-20181110 .title-image2 { background: url(Images/web2018/background/pum-image.png)no-repeat left center; width: 907px; height: 646px; float: left; position: absolute; right: -168px; bottom: 0; }

.bg-banner-bottom-20181110 { background: url(Images/web2018/background/bg-schedule-left.png)no-repeat left bottom, url(Images/web2018/background/bg-schedule-right.png)no-repeat right bottom; background-color: #fd8b0e; min-height: 340px; width: 100%; float: left; clear: left; }
.bg-banner-bottom-20181110-left { width: 50%; float: left; padding-left: 190px; padding-top: 30px; }
    .bg-banner-bottom-20181110-left .title1 { font-size: 30px; color: #ffffff; font-family: Prompt-Bold; text-align: center; width: 314px; }
    .bg-banner-bottom-20181110-left .title2 { font-size: 51px; color: #020202; font-family: Prompt-Bold; text-transform: uppercase; }
    .bg-banner-bottom-20181110-left .title3 { font-size: 76px; color: #ffffff; font-family: Prompt-Bold; }
    .bg-banner-bottom-20181110-left .title4 { font-size: 54px; color: #020202; font-family: Prompt-Bold; }
        .bg-banner-bottom-20181110-left .title4 span { color: #ffffff; font-size: 35px; }
    .bg-banner-bottom-20181110-left .title-image1 { background: url(Images/web2018/background/20181110-2019.png)no-repeat right center; background-size: 213px auto; float: left; width: 275px; height: 61px; }

.bg-banner-bottom-20181110-right { width: 50%; float: left; padding-top: 100px; }
    .bg-banner-bottom-20181110-right .title1 { color: #ffea00; font-size: 48px; font-family: Prompt-Bold; text-align: center; }
    .bg-banner-bottom-20181110-right .title2 { color: #ffffff; font-size: 30px; font-family: Prompt-Bold; text-align: center; line-height: 34px; margin-top: 20px; }
    .bg-banner-bottom-20181110-right .button-row { display: table; margin: auto; margin-top: 60px; }
        .bg-banner-bottom-20181110-right .button-row .buttontoregister { color: #fdfdfd; font-size: 30px; font-family: Prompt-Bold; border: 2px solid #ffffff; padding: 10px 87px; background-color: #fe840e; }
            .bg-banner-bottom-20181110-right .button-row .buttontoregister:hover { background-color: #ff9630; }

.schedule-20181110 { background-color: #fff; }
.agenda-20181110-row { background: url(Images/web2018/background/bg-agenda.png)no-repeat center center; width: 100%; min-height: 193px; float: left; clear: left; margin-top: 45px; margin-bottom: 45px; }
    .agenda-20181110-row .row { padding: 46px 0; }
    .agenda-20181110-row .title1 { font-size: 48px; font-family: Prompt-Bold; color: #f78508; text-align: center; }
        .agenda-20181110-row .title1 span { font-size: 36px; color: #000000; }
    .agenda-20181110-row .title2 { font-size: 36px; font-family: Prompt-Bold; color: #000000; text-align: center; margin-top: 5px; }
.schedule-20181110 .block1 { float: left; clear: left; width: 100%; }
    .schedule-20181110 .block1 .row { padding: 0 162px; }
    .schedule-20181110 .block1 .outblock { background: url(Images/web2018/background/bg-block-20181110.png)repeat center center; width: 934px; height: 145px; padding: 5px; float: left; }
        .schedule-20181110 .block1 .outblock .inblock { background-color: #fff; min-height: 135px; width: 100%; float: left; }
            .schedule-20181110 .block1 .outblock .inblock .title1 { color: #000000; font-size: 30px; font-family: Prompt-Bold; text-align: center; margin-top: 15px; }
            .schedule-20181110 .block1 .outblock .inblock .title2 { color: #000000; font-size: 18px; font-family: Prompt-Bold; text-align: center; margin-top: 10px; }
            .schedule-20181110 .block1 .outblock .inblock .title3 { color: #ff830f; font-size: 36px; font-family: Prompt-Bold; text-align: center; margin-top: 12px; }
.schedule-20181110 .block2 { float: left; clear: left; width: 100%; margin-top: 14px; }
    .schedule-20181110 .block2 .row { padding: 0 162px; }
        .schedule-20181110 .block2 .row .block { float: left; width: 100%; min-height: 248px; background-color: #f9870b; position: relative; }
            .schedule-20181110 .block2 .row .block .blockleft { float: left; width: 45%; padding-top: 30px; padding-left: 50px; }
                .schedule-20181110 .block2 .row .block .blockleft .title1 { color: #000000; font-size: 30px; font-family: Prompt-Bold; line-height: 36px; }
                .schedule-20181110 .block2 .row .block .blockleft .title2 { color: #ffffff; font-size: 30px; font-family: Prompt-Bold; margin-top: 18px; }
            .schedule-20181110 .block2 .row .block .blockright { float: left; width: 55%; }
                .schedule-20181110 .block2 .row .block .blockright .title1 { color: #ffffff; font-size: 18px; font-family: Prompt-Regular; margin-top: 30px; line-height: 22px; }
                .schedule-20181110 .block2 .row .block .blockright .title2 { color: #ffffff; font-size: 18px; font-family: Prompt-Regular; line-height: 22px; margin-top: 22px; }
            .schedule-20181110 .block2 .row .block .dontmiss1 { float: left; width: 135px; height: 135px; position: absolute; background: url(Images/web2018/background/dontmiss1_20181110.png)no-repeat center center; right: 30px; top: 55px; }
.schedule-20181110 .block3 { float: left; clear: left; width: 100%; margin-top: 14px; }
    .schedule-20181110 .block3 .row { padding: 0 162px; }
    .schedule-20181110 .block3 .outblock { background: url(Images/web2018/background/bg-block-20181110.png)repeat center center; width: 934px; height: 214px; padding: 5px; float: left; }
        .schedule-20181110 .block3 .outblock .inblock { background-color: #fff; min-height: 204px; width: 100%; float: left; }
    .schedule-20181110 .block3 .row .blockleft { float: left; width: 45%; padding-top: 30px; padding-left: 50px; }
        .schedule-20181110 .block3 .row .blockleft .title1 { color: #000000; font-size: 30px; font-family: Prompt-Bold; line-height: 36px; }
        .schedule-20181110 .block3 .row .blockleft .title2 { color: #ff830f; font-size: 30px; font-family: Prompt-Bold; margin-top: 18px; }
    .schedule-20181110 .block3 .row .blockright { float: left; width: 55%; }
        .schedule-20181110 .block3 .row .blockright .title1 { color: #000000; font-size: 18px; font-family: Prompt-Regular; margin-top: 30px; line-height: 22px; }
        .schedule-20181110 .block3 .row .blockright .title2 { color: #000000; font-size: 18px; font-family: Prompt-Regular; line-height: 22px; text-decoration: underline; }
.schedule-20181110 .block4 { float: left; clear: left; width: 100%; margin-top: 14px; }
    .schedule-20181110 .block4 .row { padding: 0 162px; }
        .schedule-20181110 .block4 .row .block { float: left; width: 100%; min-height: 248px; background-color: #f9870b; position: relative; }
            .schedule-20181110 .block4 .row .block .blockleft { float: left; width: 45%; padding-top: 30px; padding-left: 50px; }
                .schedule-20181110 .block4 .row .block .blockleft .title1 { color: #000000; font-size: 30px; font-family: Prompt-Bold; line-height: 36px; }
                .schedule-20181110 .block4 .row .block .blockleft .title2 { color: #ffffff; font-size: 30px; font-family: Prompt-Bold; margin-top: 18px; }
            .schedule-20181110 .block4 .row .block .blockright { float: left; width: 55%; }
                .schedule-20181110 .block4 .row .block .blockright .title1 { color: #000000; font-size: 18px; font-family: Prompt-Regular; margin-top: 30px; line-height: 22px; }
            .schedule-20181110 .block4 .row .block .dontmiss1 { float: left; width: 135px; height: 135px; position: absolute; background: url(Images/web2018/background/dontmiss1_20181110.png)no-repeat center center; right: 30px; top: 55px; }
.schedule-20181110 .block5 { float: left; clear: left; width: 100%; margin-top: 14px; }
    .schedule-20181110 .block5 .row { padding: 0 162px; }
        .schedule-20181110 .block5 .row .block { float: left; width: 100%; min-height: 204px; background-color: #f9e50b; position: relative; }
            .schedule-20181110 .block5 .row .block .blockleft { float: left; width: 45%; padding-top: 30px; padding-left: 50px; }
                .schedule-20181110 .block5 .row .block .blockleft .title1 { color: #000000; font-size: 30px; font-family: Prompt-Bold; line-height: 36px; }
                .schedule-20181110 .block5 .row .block .blockleft .title2 { color: #f9870b; font-size: 30px; font-family: Prompt-Bold; margin-top: 18px; }
            .schedule-20181110 .block5 .row .block .blockright { float: left; width: 55%; }
                .schedule-20181110 .block5 .row .block .blockright .title1 { color: #000000; font-size: 18px; font-family: Prompt-Regular; margin-top: 30px; line-height: 22px; }
            .schedule-20181110 .block5 .row .block .dontmiss2 { float: left; width: 135px; height: 135px; position: absolute; background: url(Images/web2018/background/dontmiss2_20181110.png)no-repeat center center; right: 30px; top: 30px; }
.schedule-20181110 .block6 { float: left; clear: left; width: 100%; margin-top: 14px; }
    .schedule-20181110 .block6 .row { padding: 0 162px; }
    .schedule-20181110 .block6 .outblock { background: url(Images/web2018/background/bg-block-20181110.png)repeat center center; width: 934px; height: 214px; padding: 5px; float: left; position: relative; }
        .schedule-20181110 .block6 .outblock .inblock { background-color: #fff; min-height: 204px; width: 100%; float: left; }
    .schedule-20181110 .block6 .row .blockleft { float: left; width: 45%; padding-top: 30px; padding-left: 50px; }
        .schedule-20181110 .block6 .row .blockleft .title1 { color: #000000; font-size: 30px; font-family: Prompt-Bold; line-height: 36px; }
        .schedule-20181110 .block6 .row .blockleft .title2 { color: #ff830f; font-size: 30px; font-family: Prompt-Bold; margin-top: 10px; }
    .schedule-20181110 .block6 .row .blockright { float: left; width: 55%; }
        .schedule-20181110 .block6 .row .blockright .title1 { color: #000000; font-size: 18px; font-family: Prompt-Regular; margin-top: 30px; line-height: 22px; }
    .schedule-20181110 .block6 .row .dontmiss1 { float: left; width: 135px; height: 135px; position: absolute; background: url(Images/web2018/background/dontmiss1_20181110.png)no-repeat center center; right: 30px; top: 38px; }
.schedule-20181110 .block7 { float: left; clear: left; width: 100%; margin-top: 14px; margin-bottom: 68px; }
    .schedule-20181110 .block7 .row { padding: 0 162px; }
    .schedule-20181110 .block7 .outblock { background: url(Images/web2018/background/bg-block-20181110.png)repeat center center; width: 934px; height: 214px; padding: 5px; float: left; }
        .schedule-20181110 .block7 .outblock .inblock { background-color: #fff; min-height: 204px; width: 100%; float: left; }
    .schedule-20181110 .block7 .row .blockleft { float: left; width: 45%; padding-top: 30px; padding-left: 50px; }
        .schedule-20181110 .block7 .row .blockleft .title1 { color: #000000; font-size: 30px; font-family: Prompt-Bold; line-height: 36px; }
        .schedule-20181110 .block7 .row .blockleft .title2 { color: #ff830f; font-size: 30px; font-family: Prompt-Bold; margin-top: 18px; }
    .schedule-20181110 .block7 .row .blockright { float: left; width: 55%; }
        .schedule-20181110 .block7 .row .blockright .title1 { color: #000000; font-size: 18px; font-family: Prompt-Regular; margin-top: 22px; line-height: 22px; }
        .schedule-20181110 .block7 .row .blockright .title2 { color: #000000; font-size: 18px; font-family: Prompt-Regular; line-height: 22px; margin-top: 25px; }
        .schedule-20181110 .block7 .row .blockright .title3 { color: #f9870b; font-size: 18px; font-family: Prompt-Regular; line-height: 22px; margin-top: 25px; }

/*>>>>>>> Seminar ECOM TUNE UP 20181022>>>>>>>>*/
.Seminar-Panel { position: absolute; width: 100%; height: 100%; display: table; }

.Seminar-EcomTuneUp-Banner-01 { background: #f48925 url(Images/web2018/Background/bg-seminar-ecom-tune-up-01.jpg) no-repeat center top; float: left; width: 100%; clear: left; font-family: Prompt-Bold; text-align: center; background-size: auto 100%; height: 690px; position: relative; }
    .Seminar-EcomTuneUp-Banner-01 .row { display: table-cell; vertical-align: middle; }
    .Seminar-EcomTuneUp-Banner-01 .text-col { font-weight: bold; }
    .Seminar-EcomTuneUp-Banner-01 .h1-title { font-size: 78px; line-height: 78px; }
    .Seminar-EcomTuneUp-Banner-01 .h2-title { font-size: 55px; clear: left; }
    .Seminar-EcomTuneUp-Banner-01 .h3-title { font-size: 34px; clear: left; padding: 16px 0; line-height: 42px; }
    .Seminar-EcomTuneUp-Banner-01 .clear-line { display: block; width: 100%; }
    .Seminar-EcomTuneUp-Banner-01 .text-rotate { position: absolute; -ms-transform: skewY(-5deg); -webkit-transform: skewY(-5deg); transform: skewY(-5deg); font-size: 110px; line-height: 110px; padding: 0 10px; }
    .Seminar-EcomTuneUp-Banner-01 .text-ecom { color: #fff; font-size: 55px; margin-left: 10px; }
    .Seminar-EcomTuneUp-Banner-01 .clear-line.S03 { color: #fff; font-size: 120px; line-height: 110px; }
    .Seminar-EcomTuneUp-Banner-01 .clear-line.S05 { position: relative; font-size: 55px; right: 8%; }

.Seminar-EcomTuneUp-Banner-02 { background-color: #efefef; float: left; width: 100%; clear: left; font-family: Prompt-Bold; text-align: center; background-size: auto 100%; height: 290px; position: relative; }
    .Seminar-EcomTuneUp-Banner-02 .row { display: table-cell; vertical-align: middle; }
    .Seminar-EcomTuneUp-Banner-02 .h2-title { font-size: 22px; line-height: 34px; font-family: Prompt-Medium; font-weight: bold; }
    .Seminar-EcomTuneUp-Banner-02 .grid-3 { display: table; margin: 18px auto; }
    .Seminar-EcomTuneUp-Banner-02 .grid-3-row { display: table-row; }
    .Seminar-EcomTuneUp-Banner-02 .grid-3-col { display: table-cell; padding: 10px 15px; }
        .Seminar-EcomTuneUp-Banner-02 .grid-3-col:nth-child(1) { font-weight: bold; vertical-align: middle; }
            .Seminar-EcomTuneUp-Banner-02 .grid-3-col:nth-child(1) .text-ecom { font-size: 38px; color: #ff830f; }
        .Seminar-EcomTuneUp-Banner-02 .grid-3-col:nth-child(2) { background-color: #ff830f; color: #fff; font-weight: bold; line-height: 24px; vertical-align: middle; }
            .Seminar-EcomTuneUp-Banner-02 .grid-3-col:nth-child(2) .text-ecom { font-size: 18px; font-weight: 600; }
        .Seminar-EcomTuneUp-Banner-02 .grid-3-col:nth-child(3) { font-weight: bold; font-size: 24px; vertical-align: middle; text-align: left; }

.Seminar-EcomTuneUp-Banner-03 { float: left; width: 100%; clear: left; font-family: Prompt-Bold; text-align: center; background-size: auto 100%; height: 480px; position: relative; }
    .Seminar-EcomTuneUp-Banner-03 .row { display: table-cell; vertical-align: middle; }
    .Seminar-EcomTuneUp-Banner-03 .text-col { font-weight: bold; }
    .Seminar-EcomTuneUp-Banner-03 .clear-line { display: block; width: 100%; line-height: 48px; }
    .Seminar-EcomTuneUp-Banner-03 .text-asset-01 { font-family: Prompt-Medium; font-size: 130px; position: absolute; left: 22%; top: 15%; }
    .Seminar-EcomTuneUp-Banner-03 .text-asset-02 { font-family: Prompt-Medium; font-size: 130px; position: absolute; right: 25%; bottom: 0; }
    .Seminar-EcomTuneUp-Banner-03 .h2-title { font-size: 30px; clear: left; }
    .Seminar-EcomTuneUp-Banner-03 .clear-line .text-ecom { font-size: 48px; color: #fe8c0e; }
    .Seminar-EcomTuneUp-Banner-03 .clear-line.S02 { font-size: 24px; }
    .Seminar-EcomTuneUp-Banner-03 .clear-line.S06 { font-size: 36px; }

.Seminar-EcomTuneUp-Banner-04 { float: left; width: 100%; clear: left; font-family: Prompt-Bold; text-align: center; background-size: auto 100%; height: 480px; position: relative; background-color: #efefef; }
    .Seminar-EcomTuneUp-Banner-04 .row { display: table-cell; vertical-align: middle; }
    .Seminar-EcomTuneUp-Banner-04 .text-col { font-weight: bold; }
    .Seminar-EcomTuneUp-Banner-04 .clear-line { display: block; width: 100%; line-height: 48px; }
    .Seminar-EcomTuneUp-Banner-04 .text-asset-01 { font-family: Prompt-Medium; font-size: 130px; position: absolute; left: 10%; top: 15%; }
    .Seminar-EcomTuneUp-Banner-04 .text-asset-02 { font-family: Prompt-Medium; font-size: 130px; position: absolute; right: 10%; top: 38%; }
    .Seminar-EcomTuneUp-Banner-04 .h2-title { font-size: 36px; clear: left; }
    .Seminar-EcomTuneUp-Banner-04 .h3-title { font-size: 30px; clear: left; }
    .Seminar-EcomTuneUp-Banner-04 .clear-line .text-ecom-01 { font-size: 48px; color: #fe8c0e; }
    .Seminar-EcomTuneUp-Banner-04 .clear-line .text-ecom-02 { font-size: 38px; color: #fe8c0e; }
    .Seminar-EcomTuneUp-Banner-04 .clear-line .text-ecom-03 { font-size: 36px; color: #000; }
    .Seminar-EcomTuneUp-Banner-04 .clear-line .text-ecom-04 { font-size: 36px; color: #fe8c0e; }
    .Seminar-EcomTuneUp-Banner-04 .clear-line.S03 { width: 250px; border-bottom: solid 4px #fe8c0e; margin: 40px auto; }

.Seminar-EcomTuneUp-Banner-05 { background: #f48925 url(Images/web2018/Background/bg-seminar-ecom-tune-up-02.jpg) no-repeat center top; float: right; width: 100%; clear: left; font-family: Prompt-Bold; text-align: center; background-size: auto 100%; height: 690px; position: relative; }
    .Seminar-EcomTuneUp-Banner-05 .row { display: table-cell; vertical-align: middle; }
    .Seminar-EcomTuneUp-Banner-05 .bg-mobile { display: none; }
    .Seminar-EcomTuneUp-Banner-05 .text-col { font-weight: bold; float: right; width: 40%; text-align: left; padding: 0 10px 0 25px; color: #fff; }
    .Seminar-EcomTuneUp-Banner-05 .h2-title { font-size: 48px; clear: left; line-height: 52px; }
    .Seminar-EcomTuneUp-Banner-05 .clear-line .text-ecom { font-size: 24px; }
    .Seminar-EcomTuneUp-Banner-05 .clear-line.S01 { color: #000; text-transform: uppercase; font-size: 30px; }
    .Seminar-EcomTuneUp-Banner-05 .clear-line.S03 { background: url(Images/web2018/Background/asset-bg-seminar-ecom-tune-up.png) no-repeat center left; width: 80%; height: 100px; background-size: contain; }
    .Seminar-EcomTuneUp-Banner-05 .clear-line.S04 { font-size: 34px; }
    .Seminar-EcomTuneUp-Banner-05 .clear-line.S06 { font-size: 24px; }
    .Seminar-EcomTuneUp-Banner-05 .clear-line.S07 { font-size: 72px; }

/*Seminar CountDown 20181019*/
.SeminarCountDown { float: left; width: 100%; clear: left; font-family: Prompt-Bold; background-image: linear-gradient(#fec10e, #fe860e); }
    .SeminarCountDown h1 { text-align: center; font-size: 30px; font-family: Prompt-Bold; font-weight: bold; margin-top: 50px; margin-bottom: 25px; }
    .SeminarCountDown ul { text-align: center; margin: 50px 0; }
    .SeminarCountDown li { display: inline-block; font-size: 20px; list-style-type: none; padding: 10px 45px 30px; text-transform: uppercase; color: #fff; line-height: 1; }
        .SeminarCountDown li span { display: block; font-size: 80px; font-weight: bold; }

.grid-container { display: grid; grid-template-columns: auto auto auto; padding: 10px; }
.grid-item { font-size: 30px; text-align: center; padding: 5px; }
.facebook-panel { vertical-align: bottom; width: 1170px; height: 172px; }
.iframe-container { overflow: hidden; padding-top: 55%; position: relative; }
    .iframe-container iframe { border: 0; height: 100%; left: 0; position: absolute; top: 0; width: 100%; }

/*SeminarFeedback 20181022*/
.SeminarFeedback { float: left; width: 100%; clear: left; font-family: Prompt-Bold; padding: 25px 0; }
    .SeminarFeedback h1 { text-align: center; font-size: 30px; font-weight: bold; font-family: Prompt-Bold; margin: 35px 0; }

/*<<<<<< END Seminar ECOM TUNE UP <<<<<<*/


/*--- <START> Sale Page Ecommerce Get Discount 20181105 ---*/
.bg-salepage-get-discount .h0-title { font-family: Prompt-Bold; font-size: 90px; }
.bg-salepage-get-discount .h1-title { font-family: Prompt-Bold; font-size: 48px; line-height: 56px; }
.bg-salepage-get-discount .h2-title { font-family: Prompt-Regular; font-size: 30px; line-height: 36px; }
.bg-salepage-get-discount .h3-title { font-family: Prompt-Regular; font-size: 24px; line-height: 32px; }
.bg-salepage-get-discount .h4-title { font-family: Prompt-Regular; }
.bg-salepage-get-discount .h5-title { font-family: Prompt-Regular; }
.bg-salepage-get-discount span.text-bold { font-family: Prompt-Bold; }
.bg-salepage-get-discount span.color-yellow { color: #ffea05; }
.bg-salepage-get-discount span.color-blue { color: #0f66d2; }
.bg-salepage-get-discount span.color-pink { color: #ff1744; }
.bg-salepage-get-discount span.color-white { color: #fff; }
.bg-salepage-get-discount span.color-orange { color: #fd6407; }

.bg-salepage-get-discount .grid-container { display: grid; grid-template-columns: auto auto auto auto auto; padding: 10px; }
.bg-salepage-get-discount .grid-item { text-align: center; margin: 5px; }

.bg-salepage-get-discount-form { background: url(Images/web2018/Background/SalePageEcommerceWebsite/bg-02.jpg) no-repeat center top; clear: left; float: left; width: 100%; background-size: auto 100%; min-height: 727px; }
    .bg-salepage-get-discount-form .text-col { display: table; width: 90%; color: #042a5a; margin: 30px auto 60px auto; }
    .bg-salepage-get-discount-form .form-contact-desktop { display: block; }
    .bg-salepage-get-discount-form .form-contact-mobile { display: none; }
    .bg-salepage-get-discount-form .h1-title { margin: 40px 0; }
    .bg-salepage-get-discount-form .h3-title { margin: 40px 0; }
    .bg-salepage-get-discount-form .h3-title { margin: 40px 0 10px 0; }
    .bg-salepage-get-discount-form .get-discount-title { display: table-cell; width: 50%; }
    .bg-salepage-get-discount-form .get-discount-form { display: table-cell; width: 50%; }
    .bg-salepage-get-discount-form .register-div { text-align: center; }
        .bg-salepage-get-discount-form .register-div .bg-title { background-color: #000; border-radius: 10px; padding: 10px 15px; width: 400px; margin: 0 auto; }
    .bg-salepage-get-discount-form .form-contact-list .clear-line { margin: 5px 0; }
    .bg-salepage-get-discount-form .contact-phone-icon { background: url(Images/web2018/Background/SalePageEcommerceWebsite/icon.png) no-repeat; background-position-y: 0%; background-size: 100%; width: 30px; height: 30px; display: inline-block; margin-right: 10px; vertical-align: bottom; }
    .bg-salepage-get-discount-form .contact-line-icon { background: url(Images/web2018/Background/SalePageEcommerceWebsite/icon.png) no-repeat; background-position-y: 27%; background-size: 100%; width: 30px; height: 30px; display: inline-block; margin-right: 10px; vertical-align: bottom; }
    .bg-salepage-get-discount-form .contact-facebook-icon { background: url(Images/web2018/Background/SalePageEcommerceWebsite/icon.png) no-repeat; background-position-y: 52%; background-size: 100%; width: 30px; height: 30px; display: inline-block; margin-right: 10px; vertical-align: bottom; }
    .bg-salepage-get-discount-form .SeminarForm { text-align: center; }
        .bg-salepage-get-discount-form .SeminarForm.Option .OptionGroupDetails select { width: 400px; height: 60px; padding: 10px; line-height: 40px; font-size: 21px; border: solid 1px #bbb; background-color: #fdfdfd; margin: 0; }
        .bg-salepage-get-discount-form .SeminarForm .SeminarFormTextBox { width: 400px; color: #000; }
    .bg-salepage-get-discount-form .SeminarFormButton { width: 400px; float: none; margin: 0 auto; }
        .bg-salepage-get-discount-form .SeminarFormButton a { color: #fff; }
            .bg-salepage-get-discount-form .SeminarFormButton a[disabled="disabled"] { pointer-events: none; background-color: #d4d4d4; }

.GetDisCountCountDown { float: left; width: 100%; clear: left; font-family: Prompt-Bold; }
    .GetDisCountCountDown h1 { text-align: center; font-size: 30px; font-family: Prompt-Bold; font-weight: bold; margin-top: 50px; margin-bottom: 25px; }
    .GetDisCountCountDown ul { text-align: center; margin: 25px 0; }
    .GetDisCountCountDown li { display: inline-block; font-size: 14px; list-style-type: none; padding: 15px 0; text-transform: uppercase; color: #fff; line-height: 1; width: 72px; border-radius: 15px; margin: 5px 7px; }
        .GetDisCountCountDown li span { display: block; font-size: 30px; font-weight: bold; }

.bg-salepage-get-discount-01 { background-color: #2a81ed; background: url(Images/web2018/Background/SalePageEcommerceWebsite/bg-01.jpg) no-repeat center top; clear: left; float: left; width: 100%; background-size: auto 100%; min-height: 727px; position: relative; overflow-x: hidden; }
    .bg-salepage-get-discount-01 .text-col { margin: 110px 0 0 25px; }
    .bg-salepage-get-discount-01 .row { position: relative; }
    .bg-salepage-get-discount-01 .h1-title { margin: 30px 0; }
    .bg-salepage-get-discount-01 .h3-title { color: #fff; margin: 30px 0; }
    .bg-salepage-get-discount-01 .bulleted-list { background: url(Images/web2018/Background/SalePageEcommerceWebsite/icon.png) no-repeat; background-position-y: 75%; background-size: 100%; width: 25px; height: 25px; display: inline-block; margin-right: 10px; }
    .bg-salepage-get-discount-01 .content-image { background: url(Images/web2018/Background/SalePageEcommerceWebsite/hand-ipad.png) no-repeat; position: absolute; width: 100%; height: 100%; background-size: auto 100%; left: 25%; }

.bg-salepage-get-discount-02 { background-color: #ffea05; float: left; clear: left; width: 100%; }
    .bg-salepage-get-discount-02 .text-col { margin: 120px 0; }
    .bg-salepage-get-discount-02 .h1-title { text-align: center; }


.bg-salepage-get-discount-03 { background-color: #0f66d2; min-height: 727px; float: left; clear: left; width: 100%; position: relative; }
    .bg-salepage-get-discount-03 .text-col { margin: 110px 0 0 20px; }
    .bg-salepage-get-discount-03 .h1-title { margin: 30px 0; }
    .bg-salepage-get-discount-03 .h3-title { color: #fff; margin: 30px 0; }
    .bg-salepage-get-discount-03 .bulleted-list { background: url(Images/web2018/Background/SalePageEcommerceWebsite/icon.png) no-repeat; background-position-y: 97%; background-size: 100%; width: 25px; height: 25px; display: inline-block; margin-right: 10px; }
    .bg-salepage-get-discount-03 .content-image { background: url(Images/web2018/Background/SalePageEcommerceWebsite/mobile-2.png) no-repeat; position: absolute; width: 100%; height: 100%; background-size: auto 100%; left: 45%; }

.bg-salepage-get-discount-04 { background-color: #fbfbfb; background: url(Images/web2018/Background/SalePageEcommerceWebsite/bg-04.jpg) no-repeat center top; clear: left; float: left; width: 100%; background-size: auto 100%; min-height: 727px; position: relative; }
    .bg-salepage-get-discount-04 .text-col { margin: 110px 0 0 10px; }
    .bg-salepage-get-discount-04 .h1-title { margin: 30px 0; }
    .bg-salepage-get-discount-04 .h2-title { margin: 30px 0; text-decoration: underline; color: #0f66d2; }
    .bg-salepage-get-discount-04 .h3-title { margin: 30px 0; }
    .bg-salepage-get-discount-04 .content-image { background: url(Images/web2018/Background/SalePageEcommerceWebsite/mobile-macbook.png) no-repeat; position: absolute; width: 100%; height: 100%; background-size: auto 682px; left: 42%; }

.bg-salepage-get-discount-05 { background-color: #ffea05; float: left; clear: left; width: 100%; }
    .bg-salepage-get-discount-05 .text-col { margin: 80px 0; }
    .bg-salepage-get-discount-05 .h1-title { text-align: center; margin: 30px 0; }

.bg-salepage-get-discount-06 { background-color: #ffe9f2; background: url(Images/web2018/Background/SalePageEcommerceWebsite/bg-05.jpg) no-repeat center top; clear: left; float: left; width: 100%; background-size: auto 100%; min-height: 727px; position: relative; }
    .bg-salepage-get-discount-06 .text-col { margin: 70px 0 0 10px; }
    .bg-salepage-get-discount-06 .h1-title { margin: 50px 0; }
    .bg-salepage-get-discount-06 .h3-title { color: #fff; margin-top: 100px; }
    .bg-salepage-get-discount-06 .content-image { background: url(Images/web2018/Background/SalePageEcommerceWebsite/salepage.png) no-repeat; position: absolute; width: 100%; height: 100%; background-size: auto 100%; left: 50%; }

.bg-salepage-get-discount-07 { background-color: #0f66d2; float: left; clear: left; width: 100%; position: relative; }
    .bg-salepage-get-discount-07 .text-col { text-align: center; margin: 90px auto; }
    .bg-salepage-get-discount-07 .bg-asset-01 { font-family: Prompt-Bold; font-size: 110px; color: #ffea05; position: absolute; left: 10%; top: 10%; }
    .bg-salepage-get-discount-07 .bg-asset-02 { font-family: Prompt-Bold; font-size: 110px; color: #ffea05; position: absolute; right: 10%; bottom: 10%; }
    .bg-salepage-get-discount-07 .h1-title { color: #fff; line-height: 62px; }

.bg-salepage-get-discount-08 { position: relative; float: left; clear: left; width: 100%; }
    .bg-salepage-get-discount-08 .text-col { text-align: center; margin: 40px auto; }
    .bg-salepage-get-discount-08 .h2-title { margin-bottom: 30px; }

.bg-salepage-get-discount-09 { background-color: #ffea05; background: url(Images/web2018/Background/SalePageEcommerceWebsite/bg-06.jpg) no-repeat center top; clear: left; float: left; width: 100%; background-size: auto 100%; min-height: 727px; position: relative; }
    .bg-salepage-get-discount-09 .text-col { text-align: center; margin: 70px auto; }
    .bg-salepage-get-discount-09 .h1-title { line-height: 80px; font-size: 46px; }
    .bg-salepage-get-discount-09 .h2-title { line-height: 48px; }
    .bg-salepage-get-discount-09 .border-panel { position: absolute; width: 100%; bottom: 0; }
    .bg-salepage-get-discount-09 .border { border-bottom: solid 3px #ff1744; width: 30%; height: 10px; margin: 0 auto; }
    .bg-salepage-get-discount-09 .content-image { background: url(Images/web2018/Background/SalePageEcommerceWebsite/awards.png) no-repeat; position: absolute; width: 100%; height: 100%; background-position: bottom center; background-size: auto 340px; }


.bg-salepage-get-discount-10 { float: left; clear: left; width: 100%; }
    .bg-salepage-get-discount-10 .text-col { text-align: center; margin: 40px auto; }
    .bg-salepage-get-discount-10 .feedback-group { display: table; width: 100%; }
    .bg-salepage-get-discount-10 .feedback-item { display: table-cell; width: 33%; }
    .bg-salepage-get-discount-10 .h1-title { margin: 50px auto; }

.bg-salepage-get-discount-11 { background-color: #0f66d2; background: url(Images/web2018/Background/SalePageEcommerceWebsite/bg-07.jpg) no-repeat center top; clear: left; float: left; width: 100%; background-size: auto 100%; min-height: 480px; position: relative; }
    .bg-salepage-get-discount-11 .text-col { text-align: center; margin: 70px auto; }
    .bg-salepage-get-discount-11 .button-row { margin: 70px auto; }
    .bg-salepage-get-discount-11 .buttontoregister { color: #fdfdfd; font-size: 30px; font-family: Prompt-Bold; border: 2px solid #ffffff; padding: 10px 87px; }
        .bg-salepage-get-discount-11 .buttontoregister:hover { background-color: #0a67d9; }

.bg-salepage-get-discount .LayoutContactSocialFooter { background-color: #293039; padding: 30px 0; float: left; clear: left; width: 100%; padding: 50px; }
    .bg-salepage-get-discount .LayoutContactSocialFooter .content-footer-title { text-align: center; }
    .bg-salepage-get-discount .LayoutContactSocialFooter .h2-title { margin: 40px auto; }
    .bg-salepage-get-discount .LayoutContactSocialFooter .contact-group { margin: 20px auto 60px auto; float: left; clear: left; width: 100%; }
.bg-salepage-get-discount-footer .bg-pro1900-ads-7 { background: #333b46 url(Images/web2018/icon/tk-footer-logo.png) no-repeat center center; clear: left; float: left; width: 100%; height: 68px; }
/*--- <END> Sale Page Ecommerce Get Discount 20181105 ---*/

/*--- <START> Flash Sale 20181107 ---*/
.banner-flashsale { min-height: 580px; float: left; clear: left; width: 100%; background: url(Images/web2018/Background/banner-flashsale.jpg) no-repeat center; background-size: auto 100%; position: relative; }
    .banner-flashsale .row { position: relative; }
    .banner-flashsale .text-col { color: #fff; text-align: left; padding: 90px 0 80px 10px; }
    .banner-flashsale .h1-title { font-family: ThaiSansNeue; font-weight: bold; font-size: 52px; line-height: 52px; }
    .banner-flashsale .h3-title { font-family: ThaiSansNeue; font-weight: bold; font-size: 30px; }
    .banner-flashsale .content-icon { background: url(Images/web2018/Background/banner-flashsale-icon.png) no-repeat center center; background-size: contain; width: 380px; height: 80px; }
    .banner-flashsale .content-image { background: url(Images/web2018/Background/banner-flashsale-content.png) no-repeat center; position: absolute; background-size: auto 95%; width: 100%; height: 100%; background-position: bottom; right: 2%; }
    .banner-flashsale .bar-white { margin: 37px 0; }
    .banner-flashsale .banner-default-button a { color: #fff; border: solid 1px #fff; }
        .banner-flashsale .banner-default-button a:hover { background-color: #d10034; }

.bg-flashsale { float: left; clear: left; width: 100%; }
    .bg-flashsale .row { position: relative; }
    .bg-flashsale .h1-title { font-family: ThaiSansNeue; font-weight: bold; font-size: 48px; }
    .bg-flashsale .h2-title { font-family: ThaiSansNeue; font-weight: bold; font-size: 36px; }
    .bg-flashsale .h3-title { font-family: ThaiSansNeue; font-weight: bold; font-size: 30px; }
    .bg-flashsale .bulleted-list { background: url(Images/web2018/icon/flashsale-bulleted-list.png) no-repeat; display: inline-block; width: 30px; height: 30px; background-size: contain; margin-right: 15px; position: relative; top: 10px; }
    .bg-flashsale .space-list { display: inline-block; width: 30px; height: 30px; margin-right: 15px; }
    .bg-flashsale .bar-pink { border-bottom: solid 3px #e21f2b; width: 55%; height: 5px; margin: 32px 0; }
    .bg-flashsale br.new-line { display: none; }

.bg-flashsale-01 { min-height: 626px; position: relative; background: url(Images/web2018/Background/bg-flashsale-01.jpg) no-repeat center; background-size: auto 100%; }
    .bg-flashsale-01 .text-col { float: right; width: 45%; margin: 90px 0 0 10px; }
    .bg-flashsale-01 .content-image { background: url(Images/web2018/Background/img-flashsale-content-01.png) no-repeat center; position: absolute; background-size: auto 100%; width: 100%; height: 100%; }
    .bg-flashsale-01 .content-icon { background: url(Images/web2018/Background/flashsale-icon.png) no-repeat center center; background-size: contain; width: 260px; height: 80px; }

.bg-flashsale-02 { background-color: #ff2760; min-height: 627px; position: relative; }
    .bg-flashsale-02 .text-col { float: left; width: 50%; margin: 80px 0 0 30px; }
    .bg-flashsale-02 .h1-title { color: #fcff00; }
    .bg-flashsale-02 .h3-title { color: #fff; margin: 40px 0; }
    .bg-flashsale-02 .content-image { background: url(Images/web2018/Background/FlashSale-countdown.gif) no-repeat center; position: absolute; background-size: auto 100%; width: 100%; height: 100%; }

.bg-flashsale-03 { min-height: 628px; position: relative; background: url(Images/web2018/Background/bg-flashsale-02.jpg) no-repeat center; background-size: auto 100%; }
    .bg-flashsale-03 .text-col { float: right; width: 45%; margin: 90px 0 0 10px; }
    .bg-flashsale-03 .h1-title { color: #353b44; }
    .bg-flashsale-03 .h2-title { color: #ff2760; text-transform: uppercase; margin: 20px 0; }
    .bg-flashsale-03 .h3-title { color: #353b44; }
    .bg-flashsale-03 .content-image { background: url(Images/web2018/Background/img-flashsale-content-02.png) no-repeat center; position: absolute; background-size: auto 100%; width: 100%; height: 100%; }
    .bg-flashsale-03 .banner-default-button { padding: 14px 0; }
        .bg-flashsale-03 .banner-default-button a { background-color: #e21f2b; border: 0; color: #fff; font-family: ThaiSansNeue; font-weight: bold; font-size: 28.5px; }
/*--- <END> Flash Sale 20181107 ---*/


/*TakraOnlineXMaxidea20181122*/
.TakraOnlineXMaxidea20181122 .bg-intro-20181110-left .title1 { font-size: 36px !important; }
.TakraOnlineXMaxidea20181122 .bg-intro-20181110-left .title2 { font-size: 30px !important; }
.TakraOnlineXMaxidea20181122 .bg-intro-20181110-left .title3 { font-size: 24px !important; }
.TakraOnlineXMaxidea20181122 .bg-intro-20181110-left .title-image1 { background: url(Images/web2018/background/asset_txm_details_20181122.png)no-repeat left center; background-size: contain; height: 200px; margin-top: 20px; }
.TakraOnlineXMaxidea20181122 .bg-intro-20181110-right { margin: 50px 0; }
    .TakraOnlineXMaxidea20181122 .bg-intro-20181110-right .title1 { margin: 0; line-height: 28px; }
    .TakraOnlineXMaxidea20181122 .bg-intro-20181110-right .title4 { margin: 20px 0; }

.TakraOnlineXMaxidea20181122 .bg-banner-bottom-20181110 { min-height: 505px; }
.TakraOnlineXMaxidea20181122 .bg-banner-bottom-20181110-left { padding-left: 120px; padding-top: 55px; }
    .TakraOnlineXMaxidea20181122 .bg-banner-bottom-20181110-left .title1 { font-size: 72px; width: 100%; text-align: left; }
    .TakraOnlineXMaxidea20181122 .bg-banner-bottom-20181110-left .title2 { font-size: 48px; text-transform: none; line-height: 60px; }
    .TakraOnlineXMaxidea20181122 .bg-banner-bottom-20181110-left .title3 { font-size: 30px; color: #000 !important; margin-bottom: 20px; }
    .TakraOnlineXMaxidea20181122 .bg-banner-bottom-20181110-left .title4 { font-size: 24px; margin: 20px 0; }
        .TakraOnlineXMaxidea20181122 .bg-banner-bottom-20181110-left .title4 span { font-size: 24px; font-family: Prompt-Regular; }
.TakraOnlineXMaxidea20181122 .bg-banner-bottom-20181110-right .title2 { font-size: 26.5px; color: #000; margin-top: 0; margin-bottom: 20px; }

.TakraOnlineXMaxidea20181122 .schedule-20181110 .row .block .blockleft { width: 95% !important; padding-left: 129px; }
.TakraOnlineXMaxidea20181122 .schedule-20181110 .row .block .blockright { width: 5% !important; }
.TakraOnlineXMaxidea20181122 .schedule-20181110 .blockleft .title1 { font-size: 48px !important; color: #000 !important; line-height: 54px !important; font-family: Prompt-Bold !important; }
.TakraOnlineXMaxidea20181122 .schedule-20181110 .blockleft .title2 { font-size: 24px !important; color: #000 !important; line-height: 32px !important; font-family: Prompt-Bold !important; }
.TakraOnlineXMaxidea20181122 .schedule-20181110 .blockleft .title3 { font-size: 18px !important; color: #000 !important; line-height: 26px !important; font-family: Prompt-Regular !important; }
.TakraOnlineXMaxidea20181122 .schedule-20181110 .outblock { width: 100% !important; height: auto !important; }
.TakraOnlineXMaxidea20181122 .schedule-20181110 .bg-preview { padding: 15px 0; }
.TakraOnlineXMaxidea20181122 .schedule-20181110 .txm-preview-video { width: 100%; object-fit: contain; }
.TakraOnlineXMaxidea20181122 .schedule-20181110 .free-group { width: 716px; margin: 0 auto 50px auto; }
.TakraOnlineXMaxidea20181122 .schedule-20181110 .bg-preview-video { overflow: hidden; padding-bottom: 56.25%; position: relative; height: 0; }
    .TakraOnlineXMaxidea20181122 .schedule-20181110 .bg-preview-video iframe { left: 0; top: 0; height: 100%; width: 100%; position: absolute; }

.TakraOnlineXMaxidea20181122 .schedule-20181110 .block1 .outblock .inblock { padding-left: 129px; padding-top: 20px; }
    .TakraOnlineXMaxidea20181122 .schedule-20181110 .block1 .outblock .inblock .title1 { text-align: left; }
        .TakraOnlineXMaxidea20181122 .schedule-20181110 .block1 .outblock .inblock .title1 span { font-size: 30px; color: #f9870b; }
    .TakraOnlineXMaxidea20181122 .schedule-20181110 .block1 .outblock .inblock .title2 { text-align: left; }
.TakraOnlineXMaxidea20181122 .schedule-20181110 .block2 .row .block { min-height: 146px; }
    .TakraOnlineXMaxidea20181122 .schedule-20181110 .block2 .row .block .blockleft .title1 { color: #f9e50b !important; }
        .TakraOnlineXMaxidea20181122 .schedule-20181110 .block2 .row .block .blockleft .title1 span { color: #fff !important; }
    .TakraOnlineXMaxidea20181122 .schedule-20181110 .block2 .row .block .blockleft .title2 { margin-top: 0; }
.TakraOnlineXMaxidea20181122 .schedule-20181110 .block3 .block { position: relative; }
.TakraOnlineXMaxidea20181122 .schedule-20181110 .block3 .row .blockleft { padding-top: 50px; padding-bottom: 70px; }
.TakraOnlineXMaxidea20181122 .schedule-20181110 .block3 .outblock .dontmiss1 { float: left; width: 135px; height: 135px; position: absolute; background: url(Images/web2018/background/dontmiss1_20181110.png)no-repeat center center; right: 30px; top: 55px; }

.TakraOnlineXMaxidea20181122 .schedule-20181110 .block4 { height: 100%; }
    .TakraOnlineXMaxidea20181122 .schedule-20181110 .block4 .row .block { background-color: #ffbc07; height: 517px; }
        .TakraOnlineXMaxidea20181122 .schedule-20181110 .block4 .row .block .text-col { font-family: Prompt-Bold; text-align: center; }
        .TakraOnlineXMaxidea20181122 .schedule-20181110 .block4 .row .block .title1 { font-size: 48px !important; margin: 65px auto; line-height: 64px; }
        .TakraOnlineXMaxidea20181122 .schedule-20181110 .block4 .row .block .title2 { font-size: 36px; line-height: 48px; }
            .TakraOnlineXMaxidea20181122 .schedule-20181110 .block4 .row .block .title2 span { font-size: 36px !important; }
        .TakraOnlineXMaxidea20181122 .schedule-20181110 .block4 .row .block .title3 { font-size: 24px !important; line-height: 36px; }
.TakraOnlineXMaxidea20181122 .SeminarCountDown h1 { margin-top: 30px; margin-bottom: 0; }
.TakraOnlineXMaxidea20181122 .SeminarFeedback { background-color: #f2f1f7; }

.TakraOnlineXMaxidea20181122 .line-between { float: left; clear: both; width: 100%; margin-top: 24px !important; margin-bottom: 24px !important; }
.TakraOnlineXMaxidea20181122 .schedule-20181110 .block-title { float: left; width: 100%; clear: left; height: 340px; text-align: center; }
    .TakraOnlineXMaxidea20181122 .schedule-20181110 .block-title.footer { height: 240px; }
    .TakraOnlineXMaxidea20181122 .schedule-20181110 .block-title .title1 { font-size: 60px; font-family: Prompt-Bold; color: #fd8b0e; line-height: 80px; }
    .TakraOnlineXMaxidea20181122 .schedule-20181110 .block-title .title2 { font-size: 48px; font-family: Prompt-Bold; line-height: 64px; }
    .TakraOnlineXMaxidea20181122 .schedule-20181110 .block-title .title3 { font-size: 36px; font-family: Prompt-Bold; line-height: 58px; }
.TakraOnlineXMaxidea20181122 .schedule-20181110 .block3 .blockcenter { display: table; margin: auto; padding: 50px 0 90px 0; }
    .TakraOnlineXMaxidea20181122 .schedule-20181110 .block3 .blockcenter .text-col { float: left; clear: left; width: auto; }
    .TakraOnlineXMaxidea20181122 .schedule-20181110 .block3 .blockcenter .title1 { font-size: 48px; font-family: Prompt-Bold; }
    .TakraOnlineXMaxidea20181122 .schedule-20181110 .block3 .blockcenter .title2 { font-size: 30px; font-family: Prompt-Bold; line-height: 48px; }
    .TakraOnlineXMaxidea20181122 .schedule-20181110 .block3 .blockcenter .title3 { font-size: 24px; font-family: Prompt-Bold; line-height: 36px; margin-top: 30px; }
    .TakraOnlineXMaxidea20181122 .schedule-20181110 .block3 .blockcenter .title4 { font-size: 18px; font-family: Prompt-Regular; line-height: 24px; }
    .TakraOnlineXMaxidea20181122 .schedule-20181110 .block3 .blockcenter ul.bullet-list-1 { margin-left: 40px !important; }


.TakraOnlineXMaxidea20181122 ul { margin: 0 !important; }
.TakraOnlineXMaxidea20181122 li { margin-top: 5px !important; }
.TakraOnlineXMaxidea20181122 ul.bullet-list-1 { list-style-position: inside; list-style: none; }
    .TakraOnlineXMaxidea20181122 ul.bullet-list-1 li::before { content: "•"; padding-right: 8px; }
.TakraOnlineXMaxidea20181122 ul.bullet-list-2 { list-style-position: inside; list-style: none; margin-left: 20px !important; }
    .TakraOnlineXMaxidea20181122 ul.bullet-list-2 li::before { content: "-"; padding-right: 8px; margin-left: 15px; }

.TakraOnlineXMaxidea20181122 .button-row { display: table; margin: auto; margin-top: 60px; }
    .TakraOnlineXMaxidea20181122 .button-row .buttontoregister { color: #fdfdfd; font-size: 30px; font-family: Prompt-Bold; border: 2px solid #ffffff; padding: 10px 87px; background-color: #fe840e00 !important; }
        .TakraOnlineXMaxidea20181122 .button-row .buttontoregister:hover { background-color: #ff9630; }

.TakraOnlineXMaxidea20181122 .tmx-banner-panel { position: relative; }
    .TakraOnlineXMaxidea20181122 .tmx-banner-panel .banner-desktop { display: inline-block; }
    .TakraOnlineXMaxidea20181122 .tmx-banner-panel .banner-mobile { display: none; }
    .TakraOnlineXMaxidea20181122 .tmx-banner-panel .txm-banner { background-image: url(../Images/web2018/Background/tmx_banner_20181122.jpg); object-fit: cover; height: 657px; }
.TakraOnlineXMaxidea20181122 .bg-banner-bottom-20181110-right .asset-price { width: 100%; text-align: center; }
.TakraOnlineXMaxidea20181122 .bg-banner-bottom-20181110-right .txm-price { width: 100%; height: 178px; object-fit: contain; }
.TakraOnlineXMaxidea20181122 .bg-banner-bottom-20181110-right .txm-price-normal { object-fit: contain; }
.TakraOnlineXMaxidea20181122 .txm_details_20181122 .title1 { font-size: 48px; font-family: Prompt-Bold; }
.TakraOnlineXMaxidea20181122 .txm_details_20181122 .title2 { font-size: 36px; font-family: Prompt-Bold; line-height: 48px; }
.TakraOnlineXMaxidea20181122 .txm_details_20181122 .title3 { font-size: 24px; font-family: Prompt-Bold; line-height: 32px; margin: 0; }
.TakraOnlineXMaxidea20181122 .txm_details_20181122 .title4 { font-size: 18px; font-family: Prompt-Regular; line-height: 28px; }
.TakraOnlineXMaxidea20181122 .bullet-list { background: url(Images/web2018/icon/icon-txm-2018-11-21.png) no-repeat; position: relative; top: 5px; width: 25px; height: 25px; background-size: 100%; margin-right: 15px; display: inline-block; background-position-y: 100%; }

.TakraOnlineXMaxidea20181122 .row { height: 100% !important; }
.TakraOnlineXMaxidea20181122 .txm-block-1 { background-color: #f38105; float: left; clear: left; width: 100%; height: 465px; }
    .TakraOnlineXMaxidea20181122 .txm-block-1 .text-col { float: left; clear: left; width: auto; }
    .TakraOnlineXMaxidea20181122 .txm-block-1 .title1 { font-size: 36px; font-family: Prompt-Bold; color: #ffea00; }
    .TakraOnlineXMaxidea20181122 .txm-block-1 .title2 { font-size: 24px; font-family: Prompt-Regular; color: #fff; margin: 35px auto; }
.TakraOnlineXMaxidea20181122 .block-center { display: table; margin: auto; }
.TakraOnlineXMaxidea20181122 .block-1col { width: 100%; height: 100%; }
.TakraOnlineXMaxidea20181122 .block-2col { display: table; width: 100%; height: 100%; padding: 0 20px; }
    .TakraOnlineXMaxidea20181122 .block-2col .text-col { float: left; width: auto; }
.TakraOnlineXMaxidea20181122 .block-2col-left { display: table-cell; width: 50%; height: 100%; vertical-align: top; padding: 50px 0; }
.TakraOnlineXMaxidea20181122 .block-2col-right { display: table-cell; width: 50%; height: 100%; vertical-align: top; padding: 50px 0; }
.TakraOnlineXMaxidea20181122 .axis-x-center { display: table; margin: auto; height: 100%; }
.TakraOnlineXMaxidea20181122 .axis-y-center { display: table-cell; width: 100%; height: 100%; vertical-align: middle; }
.TakraOnlineXMaxidea20181122 .new-line { display: none; }
.TakraOnlineXMaxidea20181122 .new-line-2 { display: none; }
.TakraOnlineXMaxidea20181122 .bullet-space { display: none; }
.TakraOnlineXMaxidea20181122 .bullet-space-2 { display: none; }
.TakraOnlineXMaxidea20181122 .bg-intro-20181110 { padding: 0 20px; }
/*[END]TakraOnlineXMaxidea20181122*/

/* BannerTakraOnlinexMaxidea */
.txm-banner-event { background: url(Images/web2018/Background/txm-banner-1600x727.jpg) no-repeat center top; width: 100%; height: 727px; clear: left; float: left; background-size: auto 100%; }
    .txm-banner-event .row { height: 100%; position: relative; padding: 0; }
    .txm-banner-event .tko6-event-button { top: 72%; }


.banner-all-feature { background-color: #0f66d2; float: left; clear: left; height: 200px; width: 100%; }
    .banner-all-feature .axis-x { display: table; margin: auto; height: 100%; }
    .banner-all-feature .axis-y { display: table-cell; vertical-align: middle; }
    .banner-all-feature .banner-default-button { margin: 0; }
        .banner-all-feature .banner-default-button a { border-color: #fff; color: #fff; }

.ProductListItemTakraPackageNewDesign { width: 33.3%; display: table-cell; }
.package-row1, .package-row2, .package-row3, .package-row4 { border: solid 1px #000; }
/* End BannerTakraOnlinexMaxidea */

/* FooterSignUp */
.FooterSignUp { float: left; clear: both; width: 100%; position: relative; }
    .FooterSignUp .BackgroundBanner { position: absolute; width: 1920px; height: 100%; left: 50%; transform: translateX(-50%); z-index: 0; }
        .FooterSignUp .BackgroundBanner .image-bg-banner { object-fit: cover; width: 100%; height: 100%; }
    .FooterSignUp .ElementGroup { display: table; width: 90%; position: relative; z-index: 2; margin: 90px auto; }
    .FooterSignUp .FooterSignUp-Left { display: table-cell; width: 50%; vertical-align: top; padding: 35px 10px; }
    .FooterSignUp .FooterSignUp-Right { display: table-cell; width: 50%; vertical-align: top; padding: 35px 5px; }
    .FooterSignUp .text-col { float: left; width: 100%; }
    .FooterSignUp .contact-col { float: left; width: 100%; text-align: left; }
    .FooterSignUp .h1-title { font-family: ThaiSansNeueBold; font-size: 40px; }
    .FooterSignUp .h2-title .space { margin: 30px auto; line-height: 1.15; }
    .FooterSignUp .h3-title { font-family: ThaiSansNeueBold; font-size: 30px; line-height: 1.4; }
    .FooterSignUp .h4-title { font-family: ThaiSansNeue; font-size: 20px; }
    .FooterSignUp .icon-phone { background: url(Images/web2018/Background/SalePageEcommerceWebsite/icon.png) no-repeat; background-position-y: 0%; background-size: 100%; width: 30px; height: 30px; display: inline-block; margin-right: 10px; position: relative; top: 8px; }
    .FooterSignUp .icon-line { background: url(Images/web2018/Background/SalePageEcommerceWebsite/icon.png) no-repeat; background-position-y: 27%; background-size: 100%; width: 30px; height: 30px; display: inline-block; margin-right: 10px; position: relative; top: 8px; }
    .FooterSignUp .icon-facebook { background: url(Images/web2018/Background/SalePageEcommerceWebsite/icon.png) no-repeat; background-position-y: 52%; background-size: 100%; width: 30px; height: 30px; display: inline-block; margin-right: 10px; position: relative; top: 8px; }
    .FooterSignUp .FormInfo-Button a { background-color: #0f66d2; }
        .FooterSignUp .FormInfo-Button a:hover { background-color: #134789; color: #fff; }

.FormInfo { background: none; clear: left; float: left; width: 100%; background-size: auto 100%; }
    .FormInfo .text-col { display: table; width: 90%; color: #042a5a; margin: 30px auto 60px auto; }
    .FormInfo .form-contact-desktop { display: block; }
    .FormInfo .form-contact-mobile { display: none; }

    .FormInfo .register-div { text-align: center; }
        .FormInfo .register-div .bg-title { background-color: #000; border-radius: 10px; padding: 10px 15px; width: 400px; margin: 0 auto; }
    .FormInfo .FormInfo-Form { text-align: center; margin: 18px auto; }
        .FormInfo .FormInfo-Form.Option .OptionGroupDetails select { width: 98%; max-width: 400px; height: 60px; padding: 10px; line-height: 40px; font-size: 21px; border: solid 1px #bbb; background-color: #fdfdfd; margin: 0; }
    .FormInfo .FormInfo-Button { width: 98%; float: none; margin: 0 auto; max-width: 400px; }
        .FormInfo .FormInfo-Button a { color: #fff; }

    .FormInfo input[type="text"].FormInfo-TextBox { width: 98%; max-width: 400px; height: 60px; padding: 10px; line-height: 40px; color: #000; font-size: 21px; border: solid 1px #bbb; background-color: #fdfdfd; font-family: CSPraJad; margin: 0; }
        .FormInfo input[type="text"].FormInfo-TextBox:focus { border: solid 1px #0161b1; background-color: #fff; color: #333; }

.FormInfo-Button { clear: left; padding-top: 15px; float: left; width: 100%; }
    .FormInfo-Button a { background-color: #357FD3; font-size: 36px; font-family: ThaiSansNeueBold; color: #fff; padding: 10px 0; line-height: 36px; transition: all 0.5s ease-out; width: 100%; max-width: 400px; height: 60px; display: block; margin: auto; }
        .FormInfo-Button a:hover { background-color: #132088; color: #ffe900; }
/* End FooterSignUp */

/* Global TK Class */
.TK .header-col { margin-top: 50px; margin-bottom: 15px; }
.TK .body-col { }
.TK .text-center { text-align: center; }
.TK .text-left { text-align: left; }
.TK .text-decoration, .TK .text-through { text-decoration: line-through; }
.TK .text-underline { text-decoration: underline; }
.TK .grid-container { grid-template-columns: 33.3% 33.3% 33.3%; }
.TK .h0-title { font-size: 72px; font-family: ThaiSansNeueBlack; line-height: 1; }
.TK .h1-title { font-size: 48px; font-family: ThaiSansNeueBold; line-height: 1.1; }
.TK .h2-title { font-size: 36px; font-family: ThaiSansNeueBold; }
.TK .h3-title { font-size: 30px; font-family: ThaiSansNeueBold; }
.TK .h4-title { font-size: 24px; font-family: ThaiSansNeue; }
.TK .h5-title { font-size: 21px; font-family: ThaiSansNeue; }
.TK .font-bold { font-family: ThaiSansNeueBlack; }
.TK .line-button-div { float: left !important; }
.TK .line-button { float: left; background: url(Images/Web2017/Button/line-button.png) no-repeat center; width: 215px; height: 55px; margin-top: 5px; background-size: contain; }
.TK .facebook-button-div { float: left !important; }
.TK .facebook-button { float: left; background: url(Images/Web2019/button/facebook-button.png) no-repeat center; width: 215px; height: 55px; margin-top: 5px; background-size: contain; }
.TK a.btnStyle-tk1 { padding: 15px 60px; border: solid 2px; border-color: #fff; }
    .TK a.btnStyle-tk1:hover { background-color: rgba(0,0,0,0.3); }

.TK .display-only--mobile { display: none; }
.TK .display-less--teblet { display: none; }

.TK .mobile-float--center { }

.TK-Axis-X { display: table; margin: auto; }
    .TK-Axis-X.left { margin: 0; }
    .TK-Axis-X.right { margin-right: 0; }
.TK-Axis-Y { display: table-cell; vertical-align: middle; height: 100%; }
.TK-List { float: left; clear: left; }
    .TK-List li { padding-left: 40px; text-align: left; }
    .TK-List ul { list-style: none; padding: 0; }

.TK-table { display: table; width: 100%; }
.TK-table--2col { display: table-cell; width: 50%; vertical-align: middle; }

.TK-1col { float: left; width: 100%; }
.TK-2col { float: left; width: 50%; }
.TK-3col { float: left; width: 33.3%; }
.TK-Clear { clear: both; }
.TK-Visible-Desktop { display: block; }
.TK-Visible-Mobile { display: none; }
.TK-Box { float: left; clear: both; }
.TK-btn { border: solid 1px #000; font-size: 24px; line-height: 1; width: 100%; text-align: center; float: left; clear: both; }
    .TK-btn:hover { color: #fff; background-color: #357fd3; border: solid 1px #357fd3; }
    .TK-btn.btn-md { width: 100%; min-width: 220px; padding: 15px 10px; }
.TK-Ignore-Width { position: absolute; width: 100%; height: 100%; z-index: 0; left: 50%; transform: translateX(-50%); }
.TK-Line-Bottom { height: 80px; width: 50%; border-bottom: solid 3.5px; margin: auto; display: table; }
.TK-Spacing-Y { min-height: 10px; float: left; clear: both; width: 100%; }
br.TK-New-Line { display: none; }
br.TK-New-Line--sm { display: none; }
.TK-Asset-Image { float: left; clear: both; width: 100%; height: auto; margin: 10px 0; }
    .TK-Asset-Image img { object-fit: contain; max-width: 100%; max-height: 100%; width: auto; height: auto; }
/* End Global TK Class */

/* Business Class 2 */

.bg-salepage-get-discount-01.bg-business { min-height: 657px; background: #eef0f1; }
    .bg-salepage-get-discount-01.bg-business .stretch-image { position: absolute; width: 1600px; height: 100%; left: 50%; transform: translateX(-50%); }
    .bg-salepage-get-discount-01.bg-business .content-image { background: url(Images/web2018/Background/img-BusinessClass.png) no-repeat bottom right; background-size: auto 100%; left: 0; }
    .bg-salepage-get-discount-01.bg-business .box1 { display: table; margin: 0; }
    .bg-salepage-get-discount-01.bg-business .text-col { margin-top: 50px; }
.BusinessBannerNewDesign_20181200 .bg-salepage-get-discount-01.bg-business .h1-title { font-size: 72px; font-family: ThaiSansNeueBold; color: #246ee6; float: left; clear: left; width: 100%; margin: 0 auto; }
.BusinessBannerNewDesign_20181200 .bg-salepage-get-discount-01.bg-business .h2-title { font-size: 30px; font-family: ThaiSansNeueBold; color: #000; float: left; clear: left; width: 100%; }
.BusinessBannerNewDesign_20181200 .bg-salepage-get-discount-01.bg-business .h3-title { font-size: 24px; font-family: ThaiSansNeueBold; color: #000; float: left; clear: left; width: 100%; margin: 15px auto; line-height: 1.2; font-weight: bold; }
.BusinessBannerNewDesign_20181200 .bg-salepage-get-discount-01.bg-business .h4-title { font-size: 21px; font-family: ThaiSansNeueBold; color: #000; float: left; clear: left; width: 100%; }
    .BusinessBannerNewDesign_20181200 .bg-salepage-get-discount-01.bg-business .h4-title.color { font-size: 24px; color: #246ee6; margin: 20px auto; }
    .BusinessBannerNewDesign_20181200 .bg-salepage-get-discount-01.bg-business .h4-title li { padding-left: 35px; background-size: 23px auto; background-position-y: -105px; line-height: 1.3; }
.BusinessBannerNewDesign_20181200 .bg-salepage-get-discount-01.bg-business .TK-List ul { margin: 0; }

.TK-List.business li { background: url(Images/web2018/icon/icon-business.png) no-repeat; background-position-y: -165px; }
.OurTemplate-20181200 { }
    .OurTemplate-20181200 .body-col { margin: 30px auto; }
    .OurTemplate-20181200 .grid-item { margin-bottom: 20px; }
    .OurTemplate-20181200 .box1 { margin: 20px; }
.DetailList-20181200 { position: relative; width: 100%; height: 100%; float: left; clear: both; z-index: 1; }
    .DetailList-20181200 .TK-Ignore-Width { background-color: #216be4; width: 1920px; }
    .DetailList-20181200 .TK-List.business li { background-position-y: -129px; }
    .DetailList-20181200 .row { position: relative; z-index: 5; }
    .DetailList-20181200 .h2-title { color: #ffea05; }
    .DetailList-20181200 .h3-title { color: #ffea05; }
    .DetailList-20181200 .h4-title { color: #fff; }
    .DetailList-20181200 .body-col { margin-bottom: 75px; }
    .DetailList-20181200 .TK-Text-Col { margin-top: 27px; }
    .DetailList-20181200 .line-button-div { margin-top: 30px; }

.OurCustomer-20181200 { float: left; clear: both; width: 100%; }
    .OurCustomer-20181200 .body-col { padding-bottom: 70px; }
    .OurCustomer-20181200::after, .BusinessClass .bg-salepage-get-discount-10::after { content: ''; position: absolute; left: 25%; width: 50%; border-bottom: solid 3.5px #216be4; }

.TK-Confirm { float: left; clear: both; width: 100%; }
    .TK-Confirm .header-col { margin-bottom: 50px; }
    .TK-Confirm img { width: 1900px; height: 360px; object-fit: cover; max-width: none; position: relative; left: 50%; transform: translateX(-50%); }

.FAQ-20181200 { float: left; clear: both; width: 100%; }
    .FAQ-20181200 .body-col { margin: 50px auto 70px auto; }
    .FAQ-20181200 .h2-title { font-family: ThaiSansNeueBlack; color: #0f66d2; line-height: 1.3; }
    .FAQ-20181200 .h4-title { margin: 30px auto 60px auto; line-height: 1.2; }
    .FAQ-20181200 .answers { font-family: ThaiSansNeueBlack; }
    .FAQ-20181200 .clear-line { border: solid 1px #cbd3e3; border-radius: 30px; padding: 35px 40px; }
    .FAQ-20181200 .box1 .clear-line { height: 245px; margin: 6px; }
    .FAQ-20181200 .box2 .clear-line { height: 390px; margin: 6px; }
    .FAQ-20181200 .box2 { display: block !important; }

.BusinessPackage20181200 .CommonProductItemStyle.ProductListItemTakraPackage { border: solid 1px #9ea5b5; }
.BusinessPackage20181200 .box0 { float: left; clear: both; width: 100%; position: relative; margin-bottom: 50px; z-index: 1; }
    .BusinessPackage20181200 .box0 .TK-Box { position: relative; z-index: 5; padding: 35px 0; }
    .BusinessPackage20181200 .box0 .bg-image { background: url(Images/web2018/Background/banner-09-title-inner.jpg) no-repeat center top; width: 1600px; height: 100%; position: absolute; z-index: 0; left: 50%; transform: translateX(-50%); }
.BusinessPackage20181200 .CommonProductItemStyle.ProductListItemTakraPackage { width: 96%; }
.BusinessPackage20181200 .TakraPackageAddToCart a { background-color: #2b6ad1; border: none; color: #fff; }
    .BusinessPackage20181200 .TakraPackageAddToCart a:hover { background-color: #063d98; }
.BusinessPackage20181200 .PackageItem.Recommend .TakraPackageAddToCart a { background-color: #ee3220; }
    .BusinessPackage20181200 .PackageItem.Recommend .TakraPackageAddToCart a:hover { background-color: #a80f00; }
.BusinessPackage20181200 .ProductListItemTakraPackage { padding: 0; }
.BusinessPackage20181200 .CommonProductButton.TakraPackage { float: none; clear: both; }
.BusinessPackage20181200 .box1 .btn-toggle { position: absolute; height: 100%; cursor: pointer; left: 10px; top: 0; display: table; }
    .BusinessPackage20181200 .box1 .btn-toggle .bth-vertical { display: table-cell; vertical-align: middle; }
    .BusinessPackage20181200 .box1 .btn-toggle.Active a { background-position-y: bottom !important; }
.BusinessPackage20181200 .PackageItem.Recommend .box1 .btn-toggle a { background: url(Images/Web2018/icon/icon-view-more-02.png) no-repeat; background-position-y: top; background-size: 35px; width: 35px; height: 35px; float: left; clear: both; }
.BusinessPackage20181200 .PackageItem .box1 .btn-toggle a { background: url(Images/Web2018/icon/icon-view-more-01.png) no-repeat; background-position-y: top; background-size: 35px; width: 35px; height: 35px; float: left; clear: both; }
.BusinessPackage20181200 .PackageItem .btn-toggle { display: none; }

.BusinessPackage20181200 .group1 { float: left; clear: both; width: 100%; margin-top: 20px; }
.BusinessPackage20181200 .group2 { float: left; clear: both; width: 100%; }
.BusinessPackage20181200 .group3 { float: left; clear: both; width: 100%; }
.BusinessPackage20181200 .group4 { float: left; clear: both; width: 100%; margin: 10px auto; }
.BusinessPackage20181200 .group5 { float: left; clear: both; width: 100%; margin-top: 25px; margin-bottom: 35px; }

.BusinessPackage20181200 .group1 .h1-title { float: left; clear: both; width: 100%; }

.BusinessPackage20181200 .PackageItem .box1 { background-color: #fff; border-top-left-radius: 10px; border-top-right-radius: 10px; padding: 17px; }
.BusinessPackage20181200 .PackageItem.Recommend .box1 { background-color: #216be4; border-top-left-radius: 10px; border-top-right-radius: 10px; }
.BusinessPackage20181200 .h0-title { display: block; font-weight: bold; }
.BusinessPackage20181200 .PackageItem .box1 .h0-title { color: #2b6ad1; }
.BusinessPackage20181200 .PackageItem.Recommend .box1 .h0-title { color: #fff; }

.BusinessPackage20181200 .box1 { position: relative; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; }
    .BusinessPackage20181200 .box1.Desktop { border-bottom-left-radius: 0; border-bottom-right-radius: 0; }
    .BusinessPackage20181200 .box1.Active { border-bottom-left-radius: 0; border-bottom-right-radius: 0; }
    .BusinessPackage20181200 .box1 .sticker { position: absolute; width: 90px; height: 90px; background-color: #ffd303; top: -20px; right: 10px; border-radius: 50px; text-align: center; }
        .BusinessPackage20181200 .box1 .sticker p { font-family: ThaiSansNeueBold; font-size: 27px; line-height: 83px; }
.BusinessPackage20181200 .PackageItem .box1 .sticker { display: none; }
.BusinessPackage20181200 .PackageItem.Recommend .box1 .sticker { display: block; }

.BusinessPackage20181200 .box1 .h1-title { display: block; }
.BusinessPackage20181200 .box1 .h2-title { display: block; }
.BusinessPackage20181200 .PackageItem.Recommend .box1 .h2-title { color: #ffd303; }
.BusinessPackage20181200 .box1 .h3-title { display: block; }
.BusinessPackage20181200 .PackageItem.Recommend .box1 .h3-title { color: #fff; }
.BusinessPackage20181200 .box1 .h4-title { display: block; }

.BusinessPackage20181200 .box2 { margin: 0 auto; position: relative; }
    .BusinessPackage20181200 .box2 .h1-title { font-size: 60px; }
    .BusinessPackage20181200 .box2 .h4-title .color { color: #ea1400; }
    .BusinessPackage20181200 .box2 .group4 .line-height { display: block; margin: auto; height: 35px; width: 80%; border-bottom: solid 1px #474747; }
    .BusinessPackage20181200 .box2 .TK-List ul { margin-left: 10px; }
    .BusinessPackage20181200 .box2 .TK-List li { background-size: 20px auto; background-position-y: -85px; }
/* End Business Class 2 */

/* Promotion 8900 */
.promotion8900 .TK .h1-title { font-size: 48px; font-family: Prompt-Bold; line-height: 1.2; }
.promotion8900 .TK .h2-title { font-size: 36px; font-family: Prompt-Bold; line-height: 1; }
.promotion8900 .TK .h3-title { font-size: 30px; font-family: Prompt-Bold; line-height: 1; }
.promotion8900 .TK .h4-title { font-size: 24px; font-family: Prompt-Regular; line-height: 1.1; }
.promotion8900 .TK .h5-title { font-size: 22px; font-family: Prompt-Regular; line-height: 1.2; }
.promotion8900 .bg-salepage-get-discount-form .h1-title span { color: #f13136; }
.Promotion8900_Footer { float: left; clear: both; width: 100%; padding: 70px 0 55px 0; }
    .Promotion8900_Footer .TK-List ul { margin: 0; }
    .Promotion8900_Footer .TK-List li { background: url(Images/web2018/bullet/bullet-agree-white.png) no-repeat; background-size: 27px; background-position: 0 4px; }
    .Promotion8900_Footer .button-row { margin-top: 25px; }
    .Promotion8900_Footer .box1 .h4-title { margin-top: 23px; }
    .Promotion8900_Footer .box2 .h1-title { margin: 10px 0; }
    .Promotion8900_Footer .box2 .h3-title { margin-top: 18px; }
    .Promotion8900_Footer .h1-title { line-height: 1.1; }
    .Promotion8900_Footer .h2-title { }
    .Promotion8900_Footer .h3-title { }
    .Promotion8900_Footer .h4-title { }

.promotion8900 .button-row a { padding: 15px 30px; border: solid 2px #eae32b; color: #fff; }
.promotion8900 .buttontoregister .h2-title { font-family: ThaiSansNeueBold; }
.promotion8900 .FAQ-20181200 .height-space { height: 25px; width: 100%; display: block; }
.promotion8900 .FAQ-20181200 .answers, .promotion8900 .FAQ-20181200 b { font-family: Prompt-Bold; }
.promotion8900 .FAQ-20181200 .h3-title { margin-bottom: 25px; color: #0f66d2; }
.promotion8900 .FAQ-20181200 .box1 .clear-line { min-height: 260px; height: auto; }
.promotion8900 .FAQ-20181200 .box2 .clear-line { min-height: 335px; height: auto; }

.promotion8900 .OurCustomer-20181200 .row { margin-bottom: 45px; }
.promotion8900 .OurCustomer-20181200 .h2-title { color: #fb200a; }
.promotion8900 .OurCustomer-20181200 .h3-title { line-height: 2; }
.promotion8900 .OurCustomer-20181200::after { content: none; position: initial; border: none; }
.promotion8900 .OurCustomer-20181200 .body-col { padding-bottom: 0; }

.banner-pro8900-01 { float: left; clear: both; width: 100%; position: relative; height: auto; overflow-x: hidden; }
    .banner-pro8900-01 .TK-Ignore-Width { width: 1600px; }
    .banner-pro8900-01 .image-content { background: url(Images/web2018/Background/img-pro-banner-8900-2018.png) no-repeat bottom right; width: 100%; height: 100%; background-size: auto 639px; }
    .banner-pro8900-01 .TK-Spacing-Y { margin-top: 110px; }
    .banner-pro8900-01 .TK-List { margin-top: 15px; }
        .banner-pro8900-01 .TK-List ul { margin: 0; }
        .banner-pro8900-01 .TK-List li { line-height: 1.5; background: url(Images/web2018/bullet/bullet-agree-white.png) no-repeat; background-size: 27px; background-position: 0 5px; }
    .banner-pro8900-01 .TK-Box { margin-bottom: 25px; }
        .banner-pro8900-01 .TK-Box .e01 { text-decoration: underline; line-height: 1.5; color: #fff; }
        .banner-pro8900-01 .TK-Box .e02-1 { font-size: 28px; color: #fff; font-family: Prompt-Medium; line-height: 1.5; }
        .banner-pro8900-01 .TK-Box .e02-2 { font-size: 38px; color: #fff; font-family: Prompt-Medium; line-height: 1.5; }
        .banner-pro8900-01 .TK-Box .e03 { font-family: Prompt-Medium; text-decoration: line-through; line-height: 1.5; color: #fff; }
        .banner-pro8900-01 .TK-Box .e04 { font-family: Prompt-Bold; color: #fff; line-height: 1.5; margin-top: 15px; }
    .banner-pro8900-01 .TK .h1-title { line-height: 1.1; }
    .banner-pro8900-01 .TK .h1-title { color: #fff; }
.promotion8900 .banner-pro8900-01 .TK .h4-title { font-family: Prompt-Regular; color: #fff; }

.promotion8900 .SeminarFormButton a { background-color: #f13036; }
    .promotion8900 .SeminarFormButton a:hover { background-color: #c70006; }
.promotion8900 .bg-salepage-get-discount-form { background: #f3f3f9 url(Images/web2018/Background/bg-form-pro8900.jpg) no-repeat center top; }
    .promotion8900 .bg-salepage-get-discount-form .register-div .bg-title { background-color: #292929; }
    .promotion8900 .bg-salepage-get-discount-form .get-discount-title { width: 60%; }
    .promotion8900 .bg-salepage-get-discount-form .get-discount-form { width: 40%; }
    .promotion8900 .bg-salepage-get-discount-form .h1-title { margin: 10px auto; color: #000; }
    .promotion8900 .bg-salepage-get-discount-form .h2-title { margin: 10px auto; color: #000; }
    .promotion8900 .bg-salepage-get-discount-form .get-discount-title .h3-title { margin: 0 0 50px 0; font-family: Prompt-Bold; color: #000; }
    .promotion8900 .bg-salepage-get-discount-form .h3-title .header-title { margin-bottom: 10px; }
    .promotion8900 .bg-salepage-get-discount-form .form-contact-mobile { color: #000; }
    .promotion8900 .bg-salepage-get-discount-form .contact-phone-icon { background: url(Images/web2018/bullet/icon-phone-pink.png) no-repeat center; background-size: contain; }
    .promotion8900 .bg-salepage-get-discount-form .contact-line-icon { background: url(Images/web2018/bullet/icon-line-pink.png) no-repeat center; background-size: contain; }
    .promotion8900 .bg-salepage-get-discount-form .contact-facebook-icon { background: url(Images/web2018/bullet/icon-fb-pink.png) no-repeat center; background-size: contain; }

.promotion8900 .bg-salepage-get-discount-10 .text-col { margin: 0 auto; }
.promotion8900 .bg-salepage-get-discount-02 { background-color: #f13036; }
    .promotion8900 .bg-salepage-get-discount-02 .text-col { margin: 80px auto; }
    .promotion8900 .bg-salepage-get-discount-02 .h1-title { color: #fff; }
.promotion8900 .bg-salepage-get-discount-03 { min-height: 820px; overflow-x: hidden; }
    .promotion8900 .bg-salepage-get-discount-03 .text-col { margin: 40px 0 85px 10px; float: left; clear: both; width: 52%; }
    .promotion8900 .bg-salepage-get-discount-03 .stretch { position: absolute; width: 1600px; height: 100%; left: 50%; transform: translateX(-50%); }
    .promotion8900 .bg-salepage-get-discount-03 .content-image { background: url(Images/web2018/Background/img-pro-dagger-2018.png) no-repeat bottom right; background-size: auto 727px; position: unset; }
    .promotion8900 .bg-salepage-get-discount-03 .h4-title { font-family: Prompt-Bold !important; }
    .promotion8900 .bg-salepage-get-discount-03 .TK-List { margin-top: 32px; }
        .promotion8900 .bg-salepage-get-discount-03 .TK-List ul { margin: 0; }
        .promotion8900 .bg-salepage-get-discount-03 .TK-List li { line-height: 1.5; background-size: 27px; background-position: 0 5px; }
        .promotion8900 .bg-salepage-get-discount-03 .TK-List li { line-height: 1.5; background: url(Images/web2018/bullet/bullet-agree-white.png) no-repeat; background-size: 27px; background-position: 0 5px; }

.promotion8900 .DetailList-20181200 .header-col .h2-title { padding-left: 8px; }
.promotion8900 .DetailList-20181200 ul { margin: 0; }
.promotion8900 .DetailList-20181200 .TK-List li { background: url(Images/web2018/bullet/bullet-more-white.png) no-repeat; background-size: 27px; background-position: 0; }

.FansPage-20181200 { float: left; clear: both; width: 100%; background-repeat: no-repeat; height: auto; }
    .FansPage-20181200 .Group { display: table; width: 100%; }
    .FansPage-20181200 .TK-2col { display: table-cell; height: 100%; vertical-align: middle; float: none; }
    .FansPage-20181200 .TK-Box { padding-left: 40px; }
    .FansPage-20181200 .h2-title { color: #23468c; }
    .FansPage-20181200 .h4-title { color: #2a2829; font-family: Prompt-Bold !important; }
    .FansPage-20181200 ul { margin: 0; }
    .FansPage-20181200 .TK-List.pro8900 li { background: url(Images/web2018/bullet/bullet-agree-skyblue.png) no-repeat; background-size: 27px; background-position: 0 5px; }

/*---------- dynamic class  ----------*/
.promotion8900 .banner-pro8900-01 { background: url(Images/web2018/Background/bg-banner-pro8900.jpg) no-repeat center; min-height: 727px; background-size: auto 100%; }
.promotion8900 .bg-salepage-get-discount-03 { background: linear-gradient(to top, #fc1c03 0%, #f16c4a 50%, #fee018 100%); }
.promotion8900 .FansPage-20181200 { background: url(Images/web2018/Background/bg-new-feed-fb-2018.jpg) center; min-height: 480px; background-size: auto 100%; }
.promotion8900 .Promotion8900_Footer { background: linear-gradient(to top, #fc1c03 0%, #f16c4a 50%, #fee018 100%); }
.promotion8900 .TK-List li { padding-left: 40px; }
.promotion8900 .TK-Line-Bottom { border-color: #ff1744; }
.promotion8900 .DetailList-20181200 .TK-Ignore-Width { background-color: #282727; }
/* End Promotion 8900 */

/* Design Service */
.DesignService_20181200 { }
    .DesignService_20181200 .TK-List ul { margin: 0; }
    .DesignService_20181200 .DetailList-20181200 .TK-List li { background: url(Images/web2018/bullet/bullet-more-white.png) no-repeat; background-size: 27px; background-position: 0 5px; }

    .DesignService_20181200 .package-service-20181200 { padding: 50px 0; }
.package-service-20181200 .TK-Box { }
.package-service-20181200 .TK-List li { background: url(Images/web2017/Bullet/icon-checked.png) no-repeat left 7px; background-size: 20px; }
.package-service-20181200 .h4-title { color: unset; font-family: ThaiSansNeueBold; }

.package-service-20181200 .h1-title { margin: 0 0 30px; }
.DesignService_20181200 .bg-newdesign-1 { background: url(Images/web2018/Background/bg-new-design-service-2018-02.jpg) no-repeat center top; }
    .DesignService_20181200 .bg-newdesign-1 .text-col { padding: 50px 0; }
    .DesignService_20181200 .bg-newdesign-1 .TK-table--2col:nth-child(1) .TK-Box { padding: 80px; border: solid 6px #2b74ea; }
    .DesignService_20181200 .bg-newdesign-1 .TK-table--2col:nth-child(1) .h0-title { color: #2b74ea; font-family: ThaiSansNeueBold; }
    .DesignService_20181200 .bg-newdesign-1 .TK-table--2col:nth-child(1) .h1-title { color: #000; line-height: 1; }
    .DesignService_20181200 .bg-newdesign-1 .TK-table--2col:nth-child(1) .h2-title { margin: 0; }
    .DesignService_20181200 .bg-newdesign-1 .TK-table--2col:nth-child(1) .h3-title { margin: 35px 0 0; }
    .DesignService_20181200 .bg-newdesign-1 .TK-table--2col:nth-child(1) .h5-title { font-size: 18px; color: #ee601a; }
    .DesignService_20181200 .bg-newdesign-1 .TK-table--2col:nth-child(1) .h3-title-2 { font-family: ThaiSansNeueBlack; }
    .DesignService_20181200 .bg-newdesign-1 .TK-table--2col:nth-child(2) .h2-title { margin-bottom: 17px; }

.DesignService_20181200 .OurCustomer-20181200::after, .DesignService_20181200 .BusinessClass .bg-salepage-get-discount-10::after { position: unset; }
.DesignService_20181200 .OurCustomer-20181200 .body-col { padding: 0; }

.DesignService_20181200 .bg-salepage-get-discount-01.bg-business { background: #fafafa url(Images/web2018/Background/bg-banner-new-design-service-2018.jpg) no-repeat center; background-size: auto 100%; }
    .DesignService_20181200 .bg-salepage-get-discount-01.bg-business .content-image { background: url(Images/web2018/Background/img-banner-new-design-service-2018.png) no-repeat bottom right; background-size: auto 90%; }
    .DesignService_20181200 .bg-salepage-get-discount-01.bg-business .text-col { color: #1d1d1d; }
    .DesignService_20181200 .bg-salepage-get-discount-01.bg-business .h1-title { line-height: 1; color: #246ee6; }
    .DesignService_20181200 .bg-salepage-get-discount-01.bg-business .h3-title { font-size: 30px; line-height: 1; color: #1d1d1d; }
    .DesignService_20181200 .bg-salepage-get-discount-01.bg-business .h4-title { font-size: 24px; color: #1d1d1d; }

.DesignService_20181200 .DetailList-20181200 .h1-title { color: #ffea05; }
.DesignService_20181200 .OurCustomer-20181200 .header-col { margin-top: 90px; }
.DesignService_20181200 .bg-salepage-get-discount-10 .text-col { margin: 40px auto 0 auto; }
.DesignService_20181200 .FAQ-20181200 .clear-line { padding: 35px 20px; }
.DesignService_20181200 .TK-Line-Bottom { border-bottom: solid 4px #216be4; }
/* End Design Service */

/* Promotion 8900 Facebook Ads */
.promotion8900.facebookAds .FansPage-20181200 .TK-2col { vertical-align: top; padding: 20px 0; }
.promotion8900.facebookAds .FansPage-20181200 .TK .header-col { margin-top: 25px; }
.promotion8900.facebookAds .FansPage-20181200 .TK .h1-title { color: #23468c; }
.promotion8900.facebookAds .FansPage-20181200 .TK .h3-title { color: #23468c; }
.promotion8900.facebookAds .FansPage-20181200 .TK .h4-title { color: #23468c; font-family: Prompt-regular !important; }

.promotion8900.facebookAds .bg-salepage-get-discount-form .contact-phone-icon { background: url(Images/web2018/bullet/icon-phone-blue.png) no-repeat center; background-size: contain; }
.promotion8900.facebookAds .bg-salepage-get-discount-form .contact-line-icon { background: url(Images/web2018/bullet/icon-line-blue.png) no-repeat center; background-size: contain; }
.promotion8900.facebookAds .bg-salepage-get-discount-form .contact-facebook-icon { background: url(Images/web2018/bullet/icon-fb-blue.png) no-repeat center; background-size: contain; }
.promotion8900.facebookAds .bg-salepage-get-discount-form .register-div .bg-title { background-color: #292929; }
.promotion8900.facebookAds .SeminarFormButton a { background-color: #224793; }
    .promotion8900.facebookAds .SeminarFormButton a:hover { background-color: #142f67; }
.promotion8900.facebookAds .bg-salepage-get-discount-form .h1-title .text-color { color: #1d3c7f; }
.promotion8900.facebookAds .bg-salepage-get-discount-form .h1-title span { color: #1b5dda; }
.promotion8900 .bg-salepage-get-discount-form .get-discount-title .h3-title { margin-bottom: 30px; }
.promotion8900.facebookAds .bg-salepage-get-discount-form { background: #f3f3f9 url(Images/web2018/Background/SalePageEcommerceWebsite/bg-02.jpg) no-repeat center top; }
    .promotion8900.facebookAds .bg-salepage-get-discount-form .form-contact-list .clear-line { font-family: Prompt-Regular; }

.promotion8900.facebookAds .banner-pro8900-01 { background: url(Images/web2018/Background/bg-pro8900-facebook-ads-2018-01.jpg) no-repeat center; background-size: auto 100%; }
    .promotion8900.facebookAds .banner-pro8900-01 .TK-Box { color: #fff; }
.promotion8900.facebookAds .DetailList-20181200 .h1-title { color: #ffea05; }
.promotion8900.facebookAds .banner-pro8900-01 .TK-Box .e01 { margin-top: 10px; }

.promotion8900.facebookAds .DetailList-20181200 .line-button-div { margin-top: 23px; }
.promotion8900.facebookAds .DetailList-20181200 .h2-title { line-height: 1.5; }
.promotion8900.facebookAds .DetailList-20181200 .h4-title { font-family: Prompt-Bold; }

.promotion8900.facebookAds .bg-salepage-get-discount-02 { background-color: #2e4b87; }
.promotion8900.facebookAds .bg-salepage-get-discount-03 { background: #4071d6; }
    .promotion8900.facebookAds .bg-salepage-get-discount-03 .text-col { color: #ffea05; }

.promotion8900.facebookAds .OurCustomer-20181200 .h2-title { color: #0f66d2; }
.promotion8900.facebookAds .OurCustomer-20181200 .row { margin-bottom: 0; }

.promotion8900.facebookAds .TK-Line-Bottom { border-color: #0f66d2; }

.promotion8900.facebookAds .FAQ-20181200 .box1 .clear-line { min-height: 260px; }

.promotion8900.facebookAds .Promotion8900_Footer { background: linear-gradient(to top, #fc1a01 0%, #623e87 50%, #0f65d2 100%); padding: 70px 0; }
    .promotion8900.facebookAds .Promotion8900_Footer .TK-2col { color: #fff; }
    .promotion8900.facebookAds .Promotion8900_Footer .h3-title { font-family: Prompt-Regular; margin-top: 10px; }
        .promotion8900.facebookAds .Promotion8900_Footer .h3-title li { line-height: 1.2; background-position: 0 6px; }
/* End Promotion 8900 Facebook Ads */

/* Banner Pro8900 at Default Page*/
.bg-banner-pro8900--default { float: left; clear: both; width: 100%; }
    .bg-banner-pro8900--default .row { position: relative; }
    .bg-banner-pro8900--default .bg-pro8900 .img-pro8900-desktop { display: block; }
    .bg-banner-pro8900--default .bg-pro8900 .img-pro8900-mobile { display: none; }
    .bg-banner-pro8900--default .btn-into { position: absolute; bottom: 17%; left: 6%; }
        .bg-banner-pro8900--default .btn-into a { width: 100%; padding: 15px 30px !important; font-size: 28px; font-family: ThaiSansNeueBold; }
/* End Banner Pro8900 at Default Page*/

/* Bullet TK-List Style */
.TK-List.bullet-check-mark--blue li { background: url(Images/web2019/bullet/check-mark-blue.svg) no-repeat; background-size: 27px; background-position: 0 6px; }
.TK-List.bullet-check-mark--white li { background: url(Images/web2019/bullet/check-mark-white.svg) no-repeat; background-size: 27px; background-position: 0 6px; }
.TK-List.bullet-check-mark--mintgreen li { background: url(Images/web2019/bullet/check-mark-mintgreen.svg) no-repeat; background-size: 27px; background-position: 0 6px; }
.TK-List.bullet-check-mark--yellow li { background: url(Images/web2019/bullet/check-mark-yellow.svg) no-repeat; background-size: 27px; background-position: 0 6px; }
.TK-List.bullet-check-mark--brightred li { background: url(Images/web2019/bullet/check-mark-brightred.svg) no-repeat; background-size: 27px; background-position: 0 6px; }
.TK-List.bullet-arrow--darkblue li { background: url(Images/web2019/bullet/arrow-darkblue.svg) no-repeat; background-size: 20px; background-position: 0 8px; padding-left: 30px; }
.TK-List.bullet-arrow--white li { background: url(Images/web2019/bullet/arrow-white.svg) no-repeat; background-size: 20px; background-position: 0 8px; padding-left: 30px; }
.TK-List.bullet-arrow--green li { background: url(Images/web2019/bullet/arrow-green.svg) no-repeat; background-size: 20px; background-position: 0 8px; padding-left: 30px; }
/*.TK-List.basic-list-outside--dash li{ list-style-position: outside; list-style-type: "-"; margin-left: 7px; padding-left: 10px; }*/
.TK-List.basic-list-outside--dash ul { list-style: none; margin: 0px; padding: 0px; }
    .TK-List.basic-list-outside--dash ul li { margin-left: 0em; position: relative; padding-left: 12px; }
        .TK-List.basic-list-outside--dash ul li:before { content: "-"; position: absolute; top: 0; left: 0; }

/* Facebook Ads 2019 */
.facebook-ads-2019 .Promotion8900_Footer { background: #0f66d2; }
.facebook-ads-2019 .DetailList-20181200.Datalist-2019-01 { background: #2e4b87; }
.facebook-ads-2019 .DetailList-20181200.Datalist-2019-02 { background: #226bff; }

.facebook-ads-2019 .h5-title { font-size: 18px; }

.facebook-ads-2019 .color--white { color: #fff; }
.facebook-ads-2019 .color--yellow { color: #faed1c; }

.facebook-ads-2019 .TK-List ul { margin: 0; }
.facebook-ads-2019 .bg-facebook-ads-1 .h3-title { color: #1d1d1d; }
.facebook-ads-2019 .bg-facebook-ads-1 .text-col { padding: 90px 0 50px 15px; }
.facebook-ads-2019 .bg-facebook-ads-1 .TK-List { margin-top: 15px; }
.facebook-ads-2019 .bg-facebook-ads-1 .h3-title li { line-height: 1.2; }

.facebook-ads-2019 .bg-salepage-get-discount-form { background: url(Images/web2019/Background/graphy.jpg) repeat center; }
.facebook-ads-2019 .get-discount-title .h1-title { color: #1d3c7f; margin-bottom: 30px; }
.facebook-ads-2019 .get-discount-title .h2-title { color: #1d3c7f; }
.facebook-ads-2019 .get-discount-title .h3-title { color: #000; margin: 0; }
    .facebook-ads-2019 .get-discount-title .h3-title li { line-height: 1.2; background-position: 0px 10px; }
.facebook-ads-2019 .get-discount-title .TK-table { margin-top: 35px; }
.facebook-ads-2019 .get-discount-title .Box1 { margin: 25px 0 40px 0; }
    .facebook-ads-2019 .get-discount-title .Box1 .h1-title { line-height: 0.8; }

.facebook-ads-2019 .get-discount-form .h2-title { color: #011938; }
.facebook-ads-2019 .get-discount-form .SeminarFormFormPanel { margin-top: 22px; }
.facebook-ads-2019 .bg-salepage-get-discount-form .SeminarFormButton a { background-color: #1f3c78; font-size: 30px; }

.facebook-ads-2019 .DetailList-20181200 .h1-title { color: #ffea05; }
.facebook-ads-2019 .DetailList-20181200.Datalist-2019-01 .h3-title { color: #fff; }

.facebook-ads-2019 .DetailList-20181200.Datalist-2019-02 .TK-Text-Col { margin: 0 auto; }
.facebook-ads-2019 .DetailList-20181200.Datalist-2019-02 .header-col { margin-bottom: 0; }
    .facebook-ads-2019 .DetailList-20181200.Datalist-2019-02 .header-col .h1-title { color: #fff; line-height: 1.15; }
.facebook-ads-2019 .DetailList-20181200.Datalist-2019-02 .h3-title { color: #fff; margin-top: 30px; }

.facebook-ads-2019 .facebook-button-div { margin-top: 23px; }

.facebook-ads-2019 .OurCustomer-20181200::after { border: none; }
.facebook-ads-2019 .OurCustomer-20181200 .header-col, .facebook-ads-2019 .FAQ-20181200 .header-col { color: #2e4b87; }
.facebook-ads-2019 .OurCustomer-20181200 .body-col { padding-bottom: 0; }
.facebook-ads-2019 .OurCustomer-20181200 .grid-item .h1-title { margin-bottom: 21px; }

.facebook-ads-2019 .FAQ-20181200 .h2-title { font-family: ThaiSansNeueBold; }
.facebook-ads-2019 .FAQ-20181200 .clear-line { padding: 35px 30px; }

.facebook-ads-2019 .Promotion8900_Footer { padding: 60px 0; }
    .facebook-ads-2019 .Promotion8900_Footer .TK-List { margin-top: 18px; }
    .facebook-ads-2019 .Promotion8900_Footer .button-row { margin-bottom: 30px; }
    .facebook-ads-2019 .Promotion8900_Footer .TK-List li { line-height: 1.1; }
    .facebook-ads-2019 .Promotion8900_Footer .box2 .h1-title { margin: 0 0 20px 0; }
    .facebook-ads-2019 .Promotion8900_Footer .box2 .h3-title { margin: 0; line-height: 1.5; }
    .facebook-ads-2019 .Promotion8900_Footer .box2 .h5-title { margin-top: 10px; }
/* End Facebook Ads 2019*/

/* Line Ads 2019 */
.line-ads-2019 .color--white { color: #fff; }
.line-ads-2019 .color--black { color: #000; }
.line-ads-2019 .color--green { color: #0fb716; }
.line-ads-2019 .color--orange { color: #ff5a00; }
.line-ads-2019 .color--yellow { color: #eaff00; }
.line-ads-2019 .color--grey { color: #383838; }
.line-ads-2019 .text-shadow--black { text-shadow: 2px 1px 2px #000; }
.line-ads-2019 .text-shadow--white { text-shadow: 2px 1px 1px #fff; }

.line-ads-2019 .h0-title { font-family: ThaiSansNeueBold; }
.line-ads-2019 .h5-title { font-size: 18px; }

.line-ads-2019 ul { margin: 0; }

.line-ads-2019 .banner-line-01 { background: url(Images/web2019/Background/bg-line-ads-2019-01.jpg) no-repeat center; background-size: auto 100%; height: 727px; }
.line-ads-2019 .bg-salepage-get-discount-form { background: url(Images/web2019/Background/bg-line-ads-2019-02.jpg) no-repeat center; background-size: auto 100%; height: 729px; }
.line-ads-2019 .banner-line-03 { background: url(Images/web2019/Background/bg-line-ads-2019-03.jpg) no-repeat center; background-size: auto 100%; height: 850px; }
.line-ads-2019 .OurCustomer-20181200 { background: url(Images/web2019/Background/bg-line-ads-2019-04.jpg) no-repeat center; background-size: auto 100%; height: 700px; }
.line-ads-2019 .FAQ-20181200 { background: url(Images/web2019/Background/bg-line-ads-2019-05.jpg) no-repeat center; background-size: auto 100%; height: 900px; }
.line-ads-2019 .Promotion8900_Footer { background: #293039; min-height: 460px; }


.line-ads-2019 .TK-Ignore-Width { width: 1900px; }


.banner-line-01 { position: relative; float: left; clear: both; width: 100%; height: 100%; overflow: hidden; }
    .banner-line-01 .image-content { background: url(Images/web2019/Background/img-line-ads-2019-01.webp) no-repeat right bottom; background-size: auto 617px; width: 100%; height: 100%; }
    .banner-line-01 .TK-Spacing-Y { height: 55px; }
    .banner-line-01 ul { margin-top: 12px; }
    .banner-line-01 li { line-height: 1.2; }
    .banner-line-01 .h0-title { line-height: 1.2; }
    .banner-line-01 .TK-1col { margin-top: 40px; }
    .banner-line-01 .TK-2col:nth-child(1) { width: 60%; }
    .banner-line-01 .TK-2col:nth-child(2) { width: 40%; }

.banner-line-03 { position: relative; float: left; clear: both; width: 100%; height: 100%; overflow: hidden; }
    .banner-line-03 .TK-Ignore-Width { width: 1600px; }
    .banner-line-03 .image-content { background: url(Images/web2019/Background/img-line-ads-2019-03.webp) no-repeat left center; background-size: auto 734px; width: 100%; height: 100%; }
    .banner-line-03 .TK-table { height: 850px; position: relative; }
    .banner-line-03 a.btnStyle-tk1 { border: none; background-color: #ff5a00; }
        .banner-line-03 a.btnStyle-tk1:hover { background-color: #d94d00; }
    .banner-line-03 .button-row { margin-top: 32px; }
    .banner-line-03 .line-02 { max-width: 490px; display: table; margin: 40px auto; }

.line-ads-2019 .SeminarFormButton a { padding: 15px 10px; height: 60px; }
    .line-ads-2019 .SeminarFormButton a:hover {  }
.line-ads-2019 .orange { background-color: #ff5a00; }
    .line-ads-2019 .orange:hover { background-color: #d84c00; }
.line-ads-2019 .green { background-color: #0fb716; }
    .line-ads-2019 .green:hover { background-color: #04860a; }

.line-ads-2019 .bg-salepage-get-discount { float: left; clear: both; width: 100%; }
    .line-ads-2019 .bg-salepage-get-discount .text-col { color: #000; }
    .line-ads-2019 .bg-salepage-get-discount .line-01 { width: 30%; }
    .line-ads-2019 .bg-salepage-get-discount .line-02 { width: 70%; padding-left: 10px; }
    .line-ads-2019 .bg-salepage-get-discount ul.list-minify { list-style: none; }
.line-ads-2019 .bg-salepage-get-discount-form .h3-title { margin: 0; }
.line-ads-2019 .bg-salepage-get-discount .line-03 { margin-bottom: 15px; }
.line-ads-2019 .bg-salepage-get-discount .line-04 { margin-top: 35px; line-height: 0.5; }
.line-ads-2019 .bg-salepage-get-discount .TK-1col { margin-top: 25px }

.line-ads-2019 .bg-salepage-get-discount .get-discount-form { vertical-align: top; }
    .line-ads-2019 .bg-salepage-get-discount .get-discount-form .h2-title { margin: 35px 0 25px; }

.line-ads-2019 .OurCustomer-20181200::after, .line-ads-2019 .BusinessClass .bg-salepage-get-discount-10::after { all: unset; }
.line-ads-2019 .OurCustomer-20181200 .header-col { margin-bottom: 45px; }
.line-ads-2019 .OurCustomer-20181200 img { max-width: 80%; }
.line-ads-2019 .OurCustomer-20181200 .h3-title { margin: 42px 0 60px 0; color: #383838; line-height: 1.1; }

.line-ads-2019 .FAQ-20181200 .body-col { margin: 70px 0; }
.line-ads-2019 .FAQ-20181200 .clear-line { background-color: #fff; border: solid 2px #0a7469; }
.line-ads-2019 .FAQ-20181200 .box1 .clear-line { height: 320px; }
.line-ads-2019 .FAQ-20181200 .box2 .clear-line { height: 280px; }
.line-ads-2019 .FAQ-20181200 .h2-title { font-family: ThaiSansNeueBold; }

.line-ads-2019 .Promotion8900_Footer .TK-List { margin-top: 32px; }
    .line-ads-2019 .Promotion8900_Footer .TK-List li { line-height: 1.2; }
.line-ads-2019 .Promotion8900_Footer a.btnStyle-tk1 { border: none; background-color: #00b900; }
    .line-ads-2019 .Promotion8900_Footer a.btnStyle-tk1:hover { background-color: #008d00; }
.line-ads-2019 .Promotion8900_Footer .TK-2col:nth-child(1) { border-right: solid 3px #9e9f9f; }
.line-ads-2019 .Promotion8900_Footer .box2 .h1-title { margin: 0; }
.line-ads-2019 .Promotion8900_Footer .box2 .line-01 { margin: 20px 0 15px; }

.line-ads-2019 .TK-Line-Bottom { border-bottom: solid 3px; width: 80%; height: 3px; border-color: #9e9f9f; }
/* End Line Ads 2019*/

/* Line LAP Detail 2019 */
.line-timeline-2019 .TK-Ignore-Width { width: 1900px; background-color: transparent; }
.line-timeline-2019 .color--white { color: #fff; }
.line-timeline-2019 .color--black { color: #141619; }
.line-timeline-2019 .color--yellow { color: #fdef1e; }
.line-timeline-2019 .color--blue { color: #366298; }
.line-timeline-2019 .color--green { color: #53bf0a; }
.line-timeline-2019 .color--navy { color: #263147; }

.line-timeline-2019 .text-shadow--green { text-shadow: 3px 3px 1px #2e7e10; }
.line-timeline-2019 ul { margin: 0; }
.line-timeline-2019 .DetailList-20181200 { min-height: 726px; }
.banner-linetimeline-01 { background-color: #7bcf22; background: -moz-linear-gradient(-45deg, #43d313 0%, #00A651 85%); background: -webkit-linear-gradient(-45deg, #43d313 0%,#00A651 85%); background: linear-gradient(135deg, #43d313 0%,#00A651 85%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00A651', endColorstr='#43d313',GradientType=1 ); text-transform: uppercase; min-height: 656px; position: relative; }

    .banner-linetimeline-01 .image-content { background: url(Images/web2019/Background/img-line-platform-banner-mobile.png) no-repeat left bottom; background-size: auto 100%; min-height: 656px; }
    .banner-linetimeline-01 .TK-Spacing-Y { height: 65px; }
    .banner-linetimeline-01 ul { margin-top: 20px; }
    .banner-linetimeline-01 .bullet-check-mark--yellow li { line-height: 1.1; text-shadow: 1px 2px 1px #2e7e10; font-family: ThaiSansNeueBold; margin-bottom: 5px; }

.lap-logo { background: url(Images/web2019/Background/LineLAPLogo.png) no-repeat right center; padding-right: 220px; float: left; }

.Line-LAP-01 { background-color: #fff; font-family: ThaiSansNeueBold; color: #141619; }
    .Line-LAP-01 .image-content { background: url(Images/web2019/Background/img-line-platform-01.png) no-repeat right bottom; background-size: auto 100%; min-height: 725px; }
    .Line-LAP-01 .TK-Axis-X { width: 80%; }
    .Line-LAP-01 .header-col { margin-top: 120px; margin-bottom: 60px; position: relative; }
        .Line-LAP-01 .header-col:after { content: ''; position: absolute; left: 0; width: 85%; bottom: -30px; border-bottom: solid 3.5px #3c9c21; }
    .Line-LAP-01 .h3-title { line-height: 1.1; }

.Line-LAP-02 { background: #00bc53 url(Images/web2019/Background/bg-line-platform-02.jpg) no-repeat center; font-family: ThaiSansNeueBold; text-transform: uppercase; }
    .Line-LAP-02 .header-col { margin-top: 40px; margin-bottom: 40px; }
        .Line-LAP-02 .header-col br { display: none; }
    .Line-LAP-02 .body-col { padding: 0 30px; margin-bottom: 0; }

.Line-LAP-03 { background: url(Images/web2019/Background/bg-line-platform-03.jpg) no-repeat center; background-size: cover; font-family: ThaiSansNeueBold; }
    .Line-LAP-03 .image-content { background: url(Images/web2019/Background/img-line-platform-03.png) no-repeat right bottom; min-height: 725px; background-size: auto 100%; }
    .Line-LAP-03 .TK-Axis-X { width: 62%; margin-left: 20px }
    .Line-LAP-03 .header-col { margin-top: 140px; margin-bottom: 20px; }

        .Line-LAP-03 .header-col br { display: none; }
    .Line-LAP-03 .bullet-arrow--darkblue li { line-height: 1.3; font-family: ThaiSansNeueBold; background-position-y: 12px; background-size: 28px; padding-left: 34px; }

.Line-LAP-04 { /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#43d313+0,25a517+85 */ background: #43d313; /* Old browsers */ background: -moz-linear-gradient(-45deg, #43d313 0%, #25a517 85%); /* FF3.6-15 */ background: -webkit-linear-gradient(-45deg, #43d313 0%,#25a517 85%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(135deg, #43d313 0%,#25a517 85%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#43d313', endColorstr='#25a517',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */ }
    .Line-LAP-04 .row { background: url(Images/web2019/Background/LineTodayLogo.png) no-repeat center top; padding-top: 120px; margin-top: 50px; }
    .Line-LAP-04 .header-col { margin-top: 0; }
    .Line-LAP-04 .body-col { margin-bottom: 0; }

    .Line-LAP-04 .h1-title br { display: none; }
    .Line-LAP-04 .h2-title { margin-bottom: 70px; position: relative; }
        .Line-LAP-04 .h2-title:after { content: ''; position: absolute; left: 33%; width: 34%; bottom: -45px; border-bottom: solid 5px #fff; }

/* End Line Ads 2019*/
/* Google Ads 2019 */
.google-ads-2019 .Promotion8900_Footer { background: url(Images/web2019/background/bg-ggadw-footer-left.png)no-repeat left top, url(Images/web2019/background/bg-ggadw-footer-right.png)no-repeat right bottom; background-color: #f23d47; }
.google-ads-2019 .DetailList-20181200.Datalist-2019-01 { background: #f23d47; }
.google-ads-2019 .DetailList-20181200.Datalist-2019-02 { background: #226bff; }

.google-ads-2019 .color--white { color: #fff; text-shadow: 2px 2px 2px #CF0F0F; }
.google-ads-2019 .color--yellow { color: #faed1c; text-shadow: 2px 2px 2px #CF0F0F; }

.google-ads-2019 .bg-salepage-get-discount-form .text-col { color: #000; }
.google-ads-2019 .TK-List ul { margin: 0; }
.google-ads-2019 .bg-google-ads-1 .h0-title { color: #fff; text-shadow: 2px 2px 2px #CF0F0F; }
    .google-ads-2019 .bg-google-ads-1 .h0-title span { font-size: 86px; }
.google-ads-2019 .bg-google-ads-1 .h1-title { color: #fff; text-shadow: 2px 2px 2px #CF0F0F; line-height: 1.3; }
.google-ads-2019 .bg-google-ads-1 .text-col { padding: 180px 0 178px 45px; }

.bg-google-ads-1 { background: #ef414c url(Images/web2019/Background/bg-ggads-1.jpg) no-repeat center top; clear: left; float: left; width: 100%; }
    .bg-google-ads-1 .text-col { float: right; }
    .bg-google-ads-1 .TK-Line-Bottom { height: 6px; margin: 40px 0; width: 40%; border-bottom: solid 6px; border-color: #fff; }

.bg-google-ads-2 { position: relative; }
    .bg-google-ads-2 .row { position: relative; }
    .bg-google-ads-2 .google-ads-2-text { float: right; padding: 100px 0; }
        .bg-google-ads-2 .google-ads-2-text .TK-Line-Bottom { height: 3px; margin: 40px 0; border-color: #fc3a3a; width: 85%; }
        .bg-google-ads-2 .google-ads-2-text .TK-table { margin-top: 25px; }
    .bg-google-ads-2 .google-ads-2-bg { background: url(Images/web2019/Background/bg-google-ads-2.jpg) no-repeat right bottom; width: 880px; height: 694px; float: left; position: absolute; z-index: -1; right: -315px; bottom: 0; }
    .bg-google-ads-2 .google-ads-2-bg-overlap2-3 { background: url(Images/web2019/Background/bg-overlap2-3.png) no-repeat right bottom; float: left; width: 214px; height: 620px; position: absolute; bottom: -250px; }

.google-ads-2019 .bg-salepage-get-discount-form { background: #f6f3f3; }
.google-ads-2019 .get-discount-title .h1-title { color: #010101; margin-bottom: 30px; }
.google-ads-2019 .get-discount-title .h2-title { color: #f23d47; }
.google-ads-2019 .get-discount-title .h3-title { color: #000; margin: 0; }
    .google-ads-2019 .get-discount-title .h3-title li { line-height: 1.2; background-position: 0px 10px; }
.google-ads-2019 .get-discount-title .TK-table { margin-top: 35px; }

.google-ads-2019 .get-discount-form .h2-title { color: #f13035; }
.google-ads-2019 .get-discount-form .SeminarFormFormPanel { margin-top: 22px; }
.google-ads-2019 .bg-salepage-get-discount-form .SeminarFormButton a { background-color: #d32e21; font-size: 30px; }
.google-ads-2019 .bg-salepage-get-discount-form .get-discount-title .h4-title { font-size: 18px; }
.google-ads-2019 .bg-salepage-get-discount-form .get-discount-title { float: right; }
.google-ads-2019 .bg-salepage-get-discount-form .get-discount-form { float: right; margin: 60px 0; }

.google-ads-2019 .DetailList-20181200 .h1-title { color: #fdfdfd; }
.google-ads-2019 .DetailList-20181200.Datalist-2019-01 .h3-title { color: #fff; }

.google-ads-2019 .DetailList-20181200.Datalist-2019-02 .TK-Text-Col { margin: 0 auto; }
.google-ads-2019 .DetailList-20181200.Datalist-2019-02 .header-col { margin-bottom: 0; }
    .google-ads-2019 .DetailList-20181200.Datalist-2019-02 .header-col .h1-title { color: #fff; line-height: 1.15; }
.google-ads-2019 .DetailList-20181200.Datalist-2019-02 .h3-title { color: #fff; margin-top: 30px; }

.google-ads-2019 .facebook-button-div { margin-top: 23px; }

.google-ads-2019 .OurCustomer-20181200 { background: url(Images/web2019/background/bg-ggadw-customer.png)no-repeat right bottom; background-size: 10% auto; }
    .google-ads-2019 .OurCustomer-20181200 .bg-salepage-get-discount .grid-item { background-color: #fff; }
    .google-ads-2019 .OurCustomer-20181200 .TK-Line-Bottom { width: 70%; border-color: #f23d47; }
    .google-ads-2019 .OurCustomer-20181200::after { border: none; }
    .google-ads-2019 .OurCustomer-20181200 .header-col, .facebook-ads-2019 .FAQ-20181200 .header-col { color: #000000; }
    .google-ads-2019 .OurCustomer-20181200 .body-col { padding-bottom: 0; }
    .google-ads-2019 .OurCustomer-20181200 .grid-item .h1-title { margin-bottom: 21px; }

.google-ads-2019 .FAQ-20181200 .h3-title { color: #fc3a3a; }
.google-ads-2019 .FAQ-20181200 .clear-line { padding: 35px 30px; background-color: #fff; }
.google-ads-2019 .FAQ-20181200 { background: url(Images/web2019/background/bg-ggadw-faq.png)no-repeat left bottom; }

.google-ads-2019 .Promotion8900_Footer { padding: 60px 0 80px; }
    .google-ads-2019 .Promotion8900_Footer .box1 { }
        .google-ads-2019 .Promotion8900_Footer .box1 .FooterBoxBorderRight { border-right: 2px solid #fff; }
        .google-ads-2019 .Promotion8900_Footer .box1 .TK-Axis-X .TK-Line-Bottom { height: 5px; margin: 10px 0 0; width: 100%; border-color: #fff; }
    .google-ads-2019 .Promotion8900_Footer .TK-List { margin-top: 18px; }
        .google-ads-2019 .Promotion8900_Footer .TK-List li { line-height: 1.1; }
    .google-ads-2019 .Promotion8900_Footer .box2 { padding-top: 35px; }
        .google-ads-2019 .Promotion8900_Footer .box2 .h3-title { margin-top: 0; }
        .google-ads-2019 .Promotion8900_Footer .box2 .h5-title { font-size: 18px; }
/* End Google Ads 2019*/

/* Register Discount 2019 in Business Class */
.RegisterDiscount2019 { float: left; clear: both; width: 100%; height: auto; position: relative; }
    .RegisterDiscount2019 .BackgroundBanner { position: absolute; width: 1900px; height: 100%; left: 50%; transform: translateX(-50%); z-index: 0; }
        .RegisterDiscount2019 .BackgroundBanner img { width: 100%; height: 100%; }
    .RegisterDiscount2019 .bg-salepage-get-discount-form { position: relative; z-index: 1; }
        .RegisterDiscount2019 .bg-salepage-get-discount-form .h0-title { line-height: 0.8; }
        .RegisterDiscount2019 .bg-salepage-get-discount-form .h1-title { margin: 40px 0 0; }
        .RegisterDiscount2019 .bg-salepage-get-discount-form .h3-title { margin: 3px 0; }

        .RegisterDiscount2019 .bg-salepage-get-discount-form .line-01 { margin-top: 15px; }
        .RegisterDiscount2019 .bg-salepage-get-discount-form .contact-box { margin: 45px 0 10px; }
        .RegisterDiscount2019 .bg-salepage-get-discount-form .footer-contact .clear-line { text-align: left; }
        .RegisterDiscount2019 .bg-salepage-get-discount-form .contact-line-icon { position: relative; top: 2px; }
        .RegisterDiscount2019 .bg-salepage-get-discount-form .get-discount-title { margin-bottom: 30px; }
/* End Register Discount 2019 in Business Class */

.ProductListTakraPackage.LandingPage { float: left; clear: both; width: 100%; height: auto; position: relative; }
.BusinessClass.LandingPage { float: left; clear: both; width: 100%; height: auto; }
.BusinessBannerNewDesign_20181200.ads2019 .bg-salepage-get-discount-01.bg-business .h3-title { font-size: 36px; }
.BusinessBannerNewDesign_20181200.ads2019 ul { margin: 0; }
.AdwordsMaster .adword-header.ads2019 { background: #216be4; }
.sticky-wrapper.header-sticky .adword-header.ads2019 { background: rgba(33,107,228,0.8); }

.LayoutFooterLicense { background-color: #e1e1e1; border: none; height: 58px; position: relative; }
    .LayoutFooterLicense .btn-group { position: absolute; width: 100%; z-index: 2; }
    .LayoutFooterLicense a.BtnGoTopLink { float: left; width: 70px; height: 70px; position: relative; top: -30px; left: 50%; transform: translateX(-50%); background: #e1e1e1 url(Images/web2015/Button/footer-go-top.png) no-repeat center top; background-position-y: 16px; border-radius: 100%; }
        .LayoutFooterLicense a.BtnGoTopLink p { width: 200px; position: absolute; float: left; left: 50%; transform: translateX(-50%); bottom: -10px; font-family: ThaiSansNeue; font-size: 18px; text-align: center; }
        .LayoutFooterLicense a.BtnGoTopLink:hover { color: #3d5afe; }

/* SalePage Business Class 2 */
.RegisterDiscount2019 .bg-salepage-get-discount-form .h0-title { font-weight: bold; line-height: 0.7; }
.RegisterDiscount2019 .bg-salepage-get-discount-form .h3-title { line-height: 1; }
.RegisterDiscount2019 .bg-salepage-get-discount-form .h1-title.custom-01 { margin-top: 20px; }
.RegisterDiscount2019 .bg-salepage-get-discount-form .Block { margin: 30px auto 20px; }
.feedback-group.new-design { margin: 50px auto; }
    .feedback-group.new-design .feedback-item { float: left; display: inline-block; padding: 0 30px; position: relative; }
        .feedback-group.new-design .feedback-item .asset-text-1 { font-size: 70px; font-family: Prompt-Bold; color: #246ee6; position: absolute; top: 0; left: 0; }
        .feedback-group.new-design .feedback-item .asset-text-2 { font-size: 70px; font-family: Prompt-Bold; color: #246ee6; position: absolute; bottom: 20px; right: 10px; }
    .feedback-group.new-design .feedback-body { width: 100%; margin: 20px auto; height: 320px; min-height: 310px; padding: 10px; background: url(Images/web2019/background/bg-circle-2019.png) repeat; display: table; }
        .feedback-group.new-design .feedback-body .h3-title { display: table-cell; height: 100%; width: 100%; vertical-align: middle; }

.bg-salepage-get-discount-09.newdesign { background: url(Images/web2019/Background/bg-salepage-businessclass-2019-06.jpg) no-repeat center top; background-size: auto 100%; min-height: 590px; background-position-y: -50px; }
    .bg-salepage-get-discount-09.newdesign .text-col { color: #fff; }
    .bg-salepage-get-discount-09.newdesign .h1-title { line-height: 1.3; }

.BusinessClass .bg-salepage-get-discount-10.newdesign::after { width: 30%; left: 50%; transform: translateX(-50%); border-bottom: solid 3px #216be4; }

.BusinessBannerNewDesign_20181200.ads2019.newdesign .bg-salepage-get-discount-01.bg-business .content-image { background: url(Images/web2019/Background/bg-salepage-businessclass-2019-02.png) no-repeat bottom right; background-size: auto 100%; }
/* END SalePage Business Class 2 */

/* Pro 9900 x-15february*/
.promotion8900.x-15february .TK .h3-title { line-height: 1.2; }
.promotion8900.x-15february .bg-salepage-get-discount-form .h1-title span { color: #ff6374; }
.promotion8900.x-15february .button-row a { border: solid 2px #fff; }
.promotion8900.x-15february .OurCustomer-20181200 .h2-title { color: #ff6374; }
.x-15february .banner-pro8900-01 .TK-Box { margin-bottom: 20px; }
.x-15february .banner-pro8900-01 .TK .h1-title { color: #fff; }
.promotion8900.x-15february .banner-pro8900-01 .TK .h4-title { font-family: Prompt-Regular; color: #fff; }
.promotion8900.x-15february .SeminarFormButton a { background-color: #ff6374; }
    .promotion8900.x-15february .SeminarFormButton a:hover { background-color: #f13036; }
.promotion8900.x-15february .bg-salepage-get-discount-form { background: #f3f3f9 url(Images/web2019/Background/bg-form-pro9900.jpg) no-repeat center top; }
    .promotion8900.x-15february .bg-salepage-get-discount-form .register-div .bg-title { background-color: #292929; }
    .promotion8900.x-15february .bg-salepage-get-discount-form .contact-phone-icon { background: url(Images/web2019/bullet/icon-phone-pink.png) no-repeat center; background-size: contain; }
    .promotion8900.x-15february .bg-salepage-get-discount-form .contact-line-icon { background: url(Images/web2019/bullet/icon-line-pink.png) no-repeat center; background-size: contain; }
    .promotion8900.x-15february .bg-salepage-get-discount-form .contact-facebook-icon { background: url(Images/web2019/bullet/icon-fb-pink.png) no-repeat center; background-size: contain; }
.promotion8900.x-15february .bg-salepage-get-discount-02 { background-color: #fe4c5f; }
.promotion8900.x-15february .bg-salepage-get-discount-03 .text-col { color: #fff; }
.promotion8900.x-15february .bg-salepage-get-discount-03 .content-image { background: url(Images/web2019/Background/img-pro-dagger-2019.png) no-repeat bottom right; background-size: auto 727px; position: unset; }
.promotion8900.x-15february .bg-salepage-get-discount-03 .TK-List li { background: url(Images/web2019/bullet/check-mark-yellow.svg) no-repeat; }
.promotion8900.x-15february .banner-pro8900-01 { background: url(Images/web2019/Background/bg-banner-pro9900.jpg) no-repeat center; min-height: 727px; background-size: auto 100%; }
.promotion8900.x-15february .bg-salepage-get-discount-03 { background: #ff6374; }
.promotion8900.x-15february .Promotion8900_Footer { background: linear-gradient(to top, #fe6374 0%, #fc7987 66%, #ff6374 100%); color: #fff; }
/* END Pro 9900 x-15february*/

.CheckoutCompletePaymentConfirmationInfo { display: flex; border: solid 1px #ccc; justify-content: center; align-items: center; flex-flow: wrap; padding: 20px 0; font-family: Tahoma; }
.CheckoutCompletePaymentConfirmationBox { width: 40%; display: flex; flex-flow: column; align-self: baseline; margin-bottom: 10px; }
.CheckoutCompletePaymentConfirmationBankDrop { width: 80%; min-height: 32px; }
.CheckoutCompletePaymentConfirmationTextBox { width: 80% !important; min-height: 32px; }
.CheckoutCompletePaymentConfirmationBotton { width: 100%; display: flex; justify-content: center; padding-top: 25px; }
.CheckoutCompletePaymentMessagePanel { width: 100%; text-align: center; padding: 10px 0; }
.CheckoutCompletePaymentConfirmationLabel { font-weight: bold; padding-bottom: 5px; }
.PaymentMessageError { color: red; }
.PaymentMessageSuccess { color: forestgreen; }
.CheckoutCompletePaymentConfirmationBox.AttachFileDiv { width: 80%; }

.SocialOrderPaymentConfirmationHeader { font-size: 16px; color: #000000; width: 100%; padding: 15px 0; border-bottom: 1px solid #c6c5c5; font-family: Prompt-Bold; }
.SocialOrderPaymentConfirmationInfo { border: solid 1px #ccc; padding: 0 28px; font-family: Tahoma; float: left; width: 100%; }
.SocialOrderPaymentConfirmationItemRow { padding: 18px 0 0; width: 100%; float: left; }
.SocialOrderPaymentConfirmationBox { width: 33.33%; margin-bottom: 20px; }
.SocialOrderPaymentConfirmationItem { display: flex; flex-flow: wrap; justify-content: left; }
.SocialOrderPaymentConfirmationLabel { font-weight: bold; padding-bottom: 5px; }
.SocialOrderPaymentConfirmationBotton { width: 100%; display: flex; justify-content: center; padding-bottom: 25px; }

.LineNotificationBtn { background-color: #00c300; color: #fff; text-align: center; }
.SocialSummaryLeft { width: 67%; float: left; }
    .SocialSummaryLeft .OrderSummeryItem { width: 100% !important; }
    .SocialSummaryLeft .ShippingDetail { width: 100% !important; }
.SocialSummaryRight { }
.LoginLine { width: 54%; margin: auto; padding: 3px 0; background-image: url(Images/Icon/btn_login_base.png); background-repeat: no-repeat; }

    .LoginLine:hover { background-image: url(Images/Icon/btn_login_hover.png); }

    .LoginLine a { color: #fff; }
.OrderSummaryFormInfo.TaxInvoiceMethod { width: 33%; }

.OrderSummaryFormInfo.TaxInvoicePaymentMethod { float: none; display: table; margin: auto; }

/*SocialOrder TaxInvoiceAddress*/
.TaxInvoiceDetailPanel { float: left; width: 100%; }
.TaxInvoiceSORow { width: calc(100% - 120px); text-align: center; }
.EnterTaxInvoice { color: #000000; font-size: 18px; float: left; width: calc(100% - 120px); margin-top: 35px; }
    .EnterTaxInvoice span { display: table; margin: auto; }
.TaxInvoiceDetailRadio { line-height: 34px; font-family: Tahoma; font-size: 14px; }

.TaxInvoiceDiv { float: left; width: 100%; }
    .TaxInvoiceDiv .ShippingDetail { display: table; margin: 10px auto; float: none; }

.CouponCollectHeaderTextDev { float: left; width: 100%; background-color: #bf2b2b; padding: 25px 0; position: relative; }
.CouponCollectHeaderText { font-size: 45px; color: #fff; text-align: center; font-weight: bold; }
.DiscountCouponListDiv { display: flex; flex-flow: wrap; margin-bottom: 80px; }
.CouponDiv { width: 40%; display: flex; flex-wrap: wrap; margin: 20px 4% 20px 6%; min-height: 200px; background-color: #fff; box-shadow: 5px 5px 10px 0px rgba(181,179,181,1); }
    .CouponDiv.Empty .CouponDetailsDiscountType { color: #dddddf; }
    .CouponDiv.Empty .CouponDetailsDiscountValue { color: #d0d1d3; }
    .CouponDiv.Empty .CouponDetailsDescription { color: #d0d1d3; }
    .CouponDiv.Empty .CouponDetailsRight { background-image: linear-gradient(#e9e9ea, #adafb2); }
    .CouponDiv.Empty .AddCouponButton a { color: #d1d1d1; }
    .CouponDiv.Empty .CouponDetailsRightBorder { border-top: 1px solid #dbdcdc; border-right: 1px solid #dbdcdc; border-bottom: 1px solid #dbdcdc; }
.CouponDetailsLeft { width: 60%; padding: 20px 0 20px 20px; position: relative; }
.CouponDetailsRight { width: 40%; background-image: linear-gradient(#ff4a4c, #c1272d); position: relative; padding-left: 10px; }
    .CouponDetailsRight:before { content: ""; position: absolute; top: 0; bottom: 0; left: 0; background-repeat: repeat; width: 10px; background-size: 20px 20px; background-image: radial-gradient(circle at 20px 10px, transparent 12px, #fff 13px); }
.CouponDetailsRightBorder { padding: 8px; margin: 10px 10px 10px 0; height: calc(100% - 20px); border-top: 1px solid #cb555a; border-right: 1px solid #cb555a; border-bottom: 1px solid #cb555a; }
.CouponDetailsCodeNumber { font-size: 18px; color: #fff; font-weight: 100; margin-top: 8px; line-height: 1.2; }
.CouponDetailsDateValid { font-size: 12px; color: #fff; position: absolute; bottom: 105px; }
.AddCouponButton { position: absolute; bottom: 30px; margin-left: auto; margin-right: auto; left: 0; right: 0; text-align: center; }
    .AddCouponButton a { padding: 5px 20px; background-color: #fff; font-size: 16px; color: #000; border-radius: 5px; font-weight: 400; }
        .AddCouponButton a:hover { color: #000; }
.CouponDetailsRemain { font-size: 12px; color: #fff; position: absolute; bottom: 88px; }
.CouponDetailsDiscountType { font-size: 20px; color: #000; margin-top: 6px; }
.CouponDetailsDiscountValue { font-size: 40px; color: #f72323; margin-top: 10px; font-weight: bold; }
.CouponDetailsDescription { font-size: 14px; color: #777; position: absolute; top: 138px; line-height: 1.2; }

.MyCouponDiv { width: 100%; }
    .MyCouponDiv .CouponDiv { width: 44%; margin: 20px 3%; }

.CouponCollectBannerDiv { background-image: url(../../Images/Banner/CouponBanner.jpg); min-height: 400px; background-size: contain; width: 100%; position: relative; }
    .CouponCollectBannerDiv .row { position: relative; }
.CouponBannerImage { background-image: url(../../Images/Banner/DiscountBag.png); position: absolute; width: 625px; height: 400px; background-size: cover; left: -14%; }
.CouponBannerText { position: absolute; right: 7%; line-height: 1.5; top: 100px; }
.CouponWelcomeText { color: #222222; font-size: 48px; }
.CouponShopNameText { color: #222222; font-size: 48px; font-weight: 400; }
.CouponCollectHereText { color: #222222; font-size: 60px; }
    .CouponCollectHereText br { display: none; }
    .CouponCollectHereText span { color: #f70f31; font-weight: 400; }
.CouponCollectHereText { font-size: 30px; }
.GBPrimePayInstallment .aspNetDisabled { background-color: #dadada; }