[class$=d13] h1, [class$=d13] h2, [class$=d13] h3, [class$=d13] h4, [class$=d13] p, [class$=d13] ul { margin: 0; } [class$=d13] h1 { color: var(--Text-Default, #000); font-family: 'Noto Sans Thai', sans-serif; font-size: 40px; font-style: normal; font-weight: 700; line-height: 150%; } [class$=d13] h2 { color: var(--Text-Default, #000); font-family: 'Noto Sans Thai', sans-serif; font-size: 32px; font-style: normal; font-weight: 700; line-height: 150%; } [class$=d13] h3 { color: var(--Text-Default, #000); font-family: 'Prompt', sans-serif; font-size: 28px; font-style: normal; font-weight: 700; line-height: 150%; } [class$=d13] h4 { color: var(--Text-Default, #000); font-family: 'Noto Sans Thai', sans-serif; font-size: 24px; font-style: normal; font-weight: 400; line-height: 150%; } [class$=d13] p { color: var(--Text-Default, #000); font-family: 'Noto Sans Thai', sans-serif; font-size: 18px; font-style: normal; font-weight: 400; line-height: 150%; } a.primary { width: 168px; height: 42px; padding: 9px 32px; color: #fff; background-color: #4DB848; font-size: 16px; font-style: normal; font-weight: 400; } a.primary:hover { background-color: #2C6A29; color: #EAE9E9; } .container-fluid { padding-left: 0px; padding-right: 0px; } .footer-main .footer-logo img { max-height: 146px !important; } @media (max-width: 767.98px) { .footer-main .footer-logo img { max-height: 90px !important; width: 216px; } } .home__intro__d13 { padding: 60px 0px; } .home__intro__d13 .container { padding-left: 0px; padding-right: 0px; } .home__intro__d13 .Intro-title { margin-bottom: 16px; } @media (max-width: 767.98px) { .home__intro__d13 { padding: 40px 16px; } } .moce-home-our-services { position: relative; } .moce-home-our-services-bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; object-position: center center; z-index: 0; } .moce-home-our-services .container { max-width: 1320px; position: relative; z-index: 1; } .moce-home-our-services-content { display: flex; align-items: center; padding-top: 80px; padding-bottom: 80px; position: relative; z-index: 1; } .moce-home-our-services-left { flex: 0 0 33%; max-width: 33%; padding-right: 40px; } .moce-home-our-services-right { flex: 0 0 67%; max-width: 67%; } .moce-home-our-services-lead { font-weight: 400; font-style: Regular; font-size: 18px; line-height: 150%; letter-spacing: 0%; color: #ffffff; display: flex; align-items: center; margin-bottom: 40px; } .moce-home-our-services-lead::after { content: ""; display: inline-block; height: 2px; width: 120px; background-color: #ffffff; margin-left: 40px; } .moce-home-our-services-heading { font-weight: 400; font-style: Regular; font-size: 32px; line-height: 150%; letter-spacing: 0%; text-transform: capitalize; color: #ffffff; margin: 0; } .moce-home-our-services-item { position: relative; display: block; text-decoration: none; } .moce-home-our-services-item-img { width: 100%; height: auto; } .moce-home-our-services-item-content { position: absolute; width: 100%; height: 100%; top: 0; left: 0; background-color: rgba(0, 0, 0, 0.2); color: #ffffff; display: flex; flex-direction: column; justify-content: flex-end; padding: 24px 40px; } .moce-home-our-services-item-lead { font-weight: 400; font-style: Regular; font-size: 16px; line-height: 150%; letter-spacing: 0%; margin-bottom: 0; } .moce-home-our-services-item-title { font-weight: 400; font-style: Regular; font-size: 32px; line-height: 150%; letter-spacing: 0%; text-transform: capitalize; margin: 0; } .moce-home-our-services-slider .slide-item { padding: 0 3px; } @media screen and (max-width: 768px) { .moce-home-our-services .container { padding: 0 0px; } .moce-home-our-services-content { display: block; padding-top: 60px; padding-bottom: 60px; background: url(/files/media/Mediaf663214b1abf52abb60590e61df8cf08.jpg); background-repeat: no-repeat; background-size: cover; background-position: center; } .moce-home-our-services-left { padding-right: 0px; margin-bottom: 40px; padding: 0 16px; max-width: unset; } .moce-home-our-services-right { max-width: unset; } } .home__about-us-intro__d13 { padding: 80px 0px; background: url(/files/media/Media6dbfe192069923f987d65118e6a0e41c.jpg); background-repeat: no-repeat; background-size: cover; background-position: center; } .home__about-us-intro__d13 .container { max-width: 1320px; } .home__about-us-intro__d13 .content__card { display: flex; flex-direction: row; gap: 0px; justify-items: center; align-items: center; } .home__about-us-intro__d13 .header-text-lead { color: #4DB848; font-size: 18px; line-height: 150%; display: flex; align-items: center; margin-bottom: 24px; } .home__about-us-intro__d13 h2 { font-weight: 400; } .home__about-us-intro__d13 .image_mobile { display: none; } .home__about-us-intro__d13 .content__box { padding-left: 100px; display: flex; flex-direction: column; gap: 24px; } .home__about-us-intro__d13 .btn__box { width: 138px; height: 48px; align-content: center; } .home__about-us-intro__d13 .header-text-lead::before { content: ""; display: inline-block; height: 2px; width: 120px; background-color: #4DB848; margin-right: 40px; } @media (max-width: 767.98px) { .home__about-us-intro__d13 { padding: 40px 16px; background: url(/files/media/Mediaea49ac82c1fc68046b434162724bf36a.jpg); } .home__about-us-intro__d13 .header-text-lead { margin-top: 40px; } .home__about-us-intro__d13 .content__box { padding-left: 0px; } .home__about-us-intro__d13 .content__card { display: flex; flex-direction: column; } } .home_numbering__d13 { padding-bottom: 80px; } .home_numbering__d13 .container { padding: 0px; } .moce-home-numbering-odometer-heading { font-weight: 400; font-style: Regular; font-size: 18px; line-height: 150%; letter-spacing: 0%; margin-bottom: 0px; } .home_numbering__d13 .col-md-2 { padding: 0px; display: flex; flex-direction: column; gap: 10px; } .moce-home-numbering-odometer { margin-right: 0px; margin-left: 0px; justify-content: space-between; } #moce-home-numbering-odometer-project, #moce-home-numbering-odometer-client, #moce-home-numbering-odometer-satisfaction, #moce-home-numbering-odometer-year { font-weight: 400; font-style: Regular; font-size: 60px; line-height: 150%; letter-spacing: 0%; color: #4db848; } #moce-home-numbering-odometer-project::after { content: "+"; display: inline-block; } #moce-home-numbering-odometer-client::after { content: "+"; display: inline-block; } #moce-home-numbering-odometer-satisfaction::after { content: "%"; display: inline-block; } #moce-home-numbering-odometer-year {} @media screen and (max-width: 768px) { .home_numbering__d13 { padding-bottom: 0px; } .moce-home-numbering-lead { margin-top: 40px; } .home_numbering__d13 .container { padding: 0px 16px 40px 16px; } .home_numbering__d13 .col-6 { padding: 12px 8px; display: flex; flex-direction: column; gap: 10px; } .moce-home-numbering-odometer { margin: -12px -8px; } } .moce-home-numbering { background-image: url(https: background-size: cover; background-repeat: no-repeat; background-position: center center; } .moce-home-numbering .container { max-width: 1320px; padding-top: 80px; padding-bottom: 80px; } .moce-home-numbering-image { width: 100%; } .moce-home-numbering-lead { font-family: Noto Sans Thai; font-weight: 400; font-style: Regular; font-size: 18px; line-height: 150%; letter-spacing: 0%; margin-bottom: 24px; display: flex; align-items: center; color: #4db848; } .moce-home-numbering-lead::before { content: ""; display: inline-block; height: 2px; width: 120px; background-color: #4db848; margin-right: 40px; } .moce-home-numbering-heading { font-family: Noto Sans Thai; font-weight: 400; font-style: Regular; font-size: 32px; line-height: 150%; letter-spacing: 0%; text-transform: capitalize; margin-bottom: 24px; } .moce-home-numbering-content { font-family: Noto Sans Thai; font-weight: 400; font-style: Regular; font-size: 18px; line-height: 150%; letter-spacing: 0%; margin-bottom: 24px; } .moce-home-numbering-odometer { margin-top: 40px; } .moce-home-numbering-odometer-description { font-weight: 400; font-style: Regular; font-size: 14px; line-height: 150%; letter-spacing: 0%; } .odometer-inside { display: inline-block; } .home__portfolio__d13 { padding: 80px 0px ; background: url(/files/media/Mediab883aa887862d34c0fcf910183b6fc3d.png); background-repeat: no-repeat; background-size: cover; background-position: center; } .home__portfolio__d13 .content__card { display: flex; flex-direction: row; gap: 0px; justify-items: center; align-items: center; } .home__portfolio__d13 .header-text-lead { color: #4DB848; font-size: 18px; line-height: 150%; display: flex; align-items: center; margin-bottom: 24px; } .home__portfolio__d13 h2 { font-weight: 400; } .home__portfolio__d13 .image_mobile { display: none; } .home__portfolio__d13 .content__box_left { padding-right: 100px; display: flex; flex-direction: column; gap: 24px; } .home__portfolio__d13 .content__box_right { padding-left: 100px; display: flex; flex-direction: column; gap: 24px; } .home__portfolio__d13 .btn__box { width: 168px; height: 42px; align-content: center; } .home__portfolio__d13 .content__box_right .header-text-lead::before { content: ""; display: inline-block; height: 2px; width: 120px; background-color: #4DB848; margin-right: 40px; } .home__portfolio__d13 .content__box_left .header-text-lead::after { content: ""; display: inline-block; height: 2px; width: 120px; background-color: #4DB848; margin-left: 40px; } .home__portfolio__d13 .row { gap: 60px; } .home__portfolio__d13 .reverse { flex-direction: row-reverse; } @media (max-width: 767.98px) { .home__portfolio__d13 { background: url(/files/media/Media04913848447198f8819fef0e3d5e95af.jpg) !important; padding: 60px 16px !important; background-repeat: no-repeat !important; background-size: cover !important; background-position: center !important; } .home__portfolio__d13 .header-text-lead { margin-top: 40px; } .home__portfolio__d13 .content__box_left, .home__portfolio__d13 .content__box_right { padding-left: 0px; padding-right: 0px; } .home__portfolio__d13 .content__card { display: flex; flex-direction: column-reverse; } .home__portfolio__d13 .row { gap: 40px; } } .sep-platform-brand-customer-section { background: url(/files/media/Media63026b095df6ef15e610da4ab4dd6693.jpg); background-repeat: no-repeat; background-size: cover; padding: 60px 0px; width: 100%; } .sep-platform-brand-customer-container { max-width: 1320px; margin: 0 auto; padding: 0 16px; } .sep-platform-brand-customer-title { color: #000; text-align: center; font-family: 'Noto Sans Thai', sans-serif; font-size: 32px; font-style: normal; font-weight: 400; line-height: 150%; margin-bottom: 40px; } .brand-slideshow { width: 100%; margin: 0 auto; } .brand-slideshow .slick-slide { padding: 0 10px; box-sizing: border-box; } .brand-slideshow__slide-container { width: 100%; max-width: 200px; height: 80px; overflow: hidden; margin: 0 auto 20px; display: flex; align-items: center; justify-content: center; } @media (max-width: 768px) { .sep-platform-brand-customer-section { padding: 40px 16px; } .brand-slideshow .slick-slide { padding: 0 8px; } .brand-slideshow__slide-container { margin: 0 auto 15px; } .sep-platform-brand-customer-section { background-repeat: no-repeat !important; background-size: cover !important; background-position: center; background: url(/files/media/Mediab63ddcc879547a417a6222214fa6f65c.jpg); } } @media (max-width: 480px) { .brand-slideshow .slick-slide { padding: 0 5px; } } .brand-slideshow__slide-container img { width: 100%; height: 100%; object-fit: contain; } .brand-slideshow .slick-dots { position: relative; display: block !important; width: 100%; padding: 0; margin: 10px 0 0 0; list-style: none; text-align: center; } .brand-slideshow .slick-dots li { position: relative; display: inline-block; width: 8px; height: 8px; margin: 0 4.5px; padding: 0; cursor: pointer; } .brand-slideshow .slick-dots li button { font-size: 0; line-height: 0; display: block; width: 8px; height: 8px; padding: 0; cursor: pointer; color: transparent; border: 0; outline: none; background: transparent; border-radius: 50%; transition: all 0.3s ease; } .brand-slideshow .slick-dots li button:before { content: ''; position: absolute; top: 0; left: 0; width: 8px; height: 8px; background-color: #E6E7E8; border-radius: 50%; transition: all 0.3s ease; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .brand-slideshow .slick-dots li.slick-active button:before { background-color: #4DB848; transform: scale(1.2); } .brand-slideshow .slick-dots li:hover button:before { background-color: #4DB848; opacity: 0.7; transform: scale(1.1); } .moce-about-us-mission {} .moce-about-us-mission .container-fullwidth { display: flex; } .moce-about-us-mission-col-left { flex: 1; max-width: 50%; } .moce-about-us-mission-col-right { flex: 1; max-width: 50%; background-image: url(/files/media/Mediaa4ce17022121454db33594c05ff15d30.jpg); background-size: cover; background-repeat: no-repeat; background-position: center center; padding: 80px; display: flex; flex-direction: column; justify-content: center; } .moce-about-us-mission-image { width: 100%; min-height: 768px; height: 100%; object-fit: cover; } .moce-about-us-mission-lead { font-family: 'Noto Sans Thai', sans-serif; font-weight: 400; font-style: Regular; font-size: 18px; line-height: 150%; letter-spacing: 0%; margin-bottom: 24px; display: flex; align-items: center; color: #ffffff; } .moce-about-us-mission-lead::after { content: ""; display: inline-block; height: 2px; width: 120px; background-color: #ffffff; margin-left: 40px; } .moce-about-us-mission-heading { font-family: 'Noto Sans Thai', sans-serif; font-weight: 400; font-style: Regular; font-size: 32px; line-height: 150%; letter-spacing: 0%; text-transform: capitalize; margin-bottom: 40px; color: #ffffff; } .moce-about-us-mission-item {} .moce-about-us-mission-item i { font-size: 40px; margin-bottom: 25px; color: #ffffff; } .moce-about-us-mission-item-heading { font-family: 'Noto Sans Thai', sans-serif; font-weight: 700; font-style: Bold; font-size: 18px; line-height: 150%; letter-spacing: 0%; margin-bottom: 15px; color: #ffffff; } .moce-about-us-mission-item-text { font-family: 'Noto Sans Thai', sans-serif; font-weight: 400; font-style: Regular; font-size: 16px; line-height: 150%; letter-spacing: 0%; color: #ffffff; } @media screen and (max-width: 992px) { .moce-about-us-mission-col-right { max-width: unset; padding: 40px 16px; } } @media screen and (max-width: 768px) { .moce-about-us-mission-col-right { background-image: url(/files/media/Mediadce6d3a2526588a113c364d26e873e0f.jpg); } .moce-about-us-mission .container-fullwidth { display: block; } .moce-about-us-mission-col-left { max-width: unset; } .moce-about-us-mission-col-right { max-width: unset; padding: 40px 16px; } .moce-about-us-mission-image { min-height: 337px; } } .moce-about-us-vision { background-image: url(/files/media/Media6f5070e25e00a3cf144be4b6d797c265.jpg); background-size: cover; background-repeat: no-repeat; background-position: center center; } .moce-about-us-vision .container { max-width: 1320px; padding-top: 80px; padding-bottom: 80px; } .moce-about-us-vision-lead { font-family: 'Noto Sans Thai', sans-serif; font-weight: 400; font-style: Regular; font-size: 18px; line-height: 150%; letter-spacing: 0%; margin-bottom: 24px; display: flex; align-items: center; color: #4db848; } .moce-about-us-vision-lead::after { content: ""; display: inline-block; height: 2px; width: 120px; background-color: #4db848; margin-left: 40px; } .moce-about-us-vision-heading { font-family: 'Noto Sans Thai', sans-serif; font-weight: 400; font-style: Regular; font-size: 32px; line-height: 150%; letter-spacing: 0%; text-transform: capitalize; margin-bottom: 24px; } .moce-about-us-vision-box { position: relative; } .moce-about-us-vision-box-image { width: 100%; height: 560px; object-fit: cover; } .moce-about-us-vision-box-content { position: absolute; width: 495px; left: 0; bottom: 0; padding: 40px; font-family: 'Noto Sans Thai', sans-serif; font-weight: 400; font-style: Regular; font-size: 18px; line-height: 150%; letter-spacing: 0%; color: #ffffff; } @media screen and (max-width: 768px) { .moce-about-us-vision { background-image: url(/files/media/Media30e9702d07590b31c60a6fddcce5e6bd.jpg); } .moce-about-us-vision .container { padding-top: 40px; padding-bottom: 40px; } .moce-about-us-vision-box-image { height: 358px; } .moce-about-us-vision-box-content { width: auto; } } .about__contact__d13 { padding: 80px 0px; background: url(/files/media/Mediadec4a8c8789ac78c88fca6f32f112e6f.jpg); background-repeat: no-repeat; background-size: cover; background-position: center; } .about__contact__d13 h2 { font-weight: 400; margin-bottom: 10px; } .about__contact__d13 .row { justify-self: center; } .about__contact__d13 .content__box { display: flex; flex-direction: column; gap: 30px; align-items: center; } .about__contact__d13 .text__box { text-align: center; } .about__contact__d13 .btn__box { width: 160px; height: 42px; align-content: center; } @media screen and (max-width: 768px) { .about__contact__d13 { padding: 40px 16px; } } .services_banner__d13 { background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url(/files/media/Media671e8d3fca82bcd0d8aca470e65a1275.jpg); background-repeat: no-repeat; background-size: cover; background-position: center; height: 520px; align-content: center; } .services_banner__d13 .container { justify-self: center; } .services_banner__d13 h1 { color: #fff; font-weight: 400; text-align: center; } .services_design__d13 { padding: 80px 0px; background: url(/files/media/Media7ab1469f41a29c4a26d83e06709a14d9.jpg); background-repeat: no-repeat; background-size: cover; background-position: center; } .services_design__d13 .content__card { display: flex; flex-direction: row; gap: 0px; justify-items: center; align-items: center; } .services_design__d13 .header-text-lead { color: #4DB848; font-size: 18px; line-height: 150%; display: flex; align-items: center; margin-bottom: 24px; } .services_design__d13 h2 { font-weight: 400; } .services_design__d13 .image_mobile { display: none; } .services_design__d13 .content__box { padding-right: 100px; display: flex; flex-direction: column; gap: 24px; } .services_design__d13 .btn__box { width: 168px; height: 42px; align-content: center; } .services_design__d13 .header-text-lead::after { content: ""; display: inline-block; height: 2px; width: 120px; background-color: #4DB848; margin-left: 40px; } .services_design__d13 .row { gap: 60px; } @media (max-width: 767.98px) { .services_design__d13 { padding: 40px 16px; background: url(/files/media/Mediad2dbfb636d5dd4b83295c4404e710b2a.jpg); background-repeat: no-repeat; background-size: cover; background-position: center; } .services_design__d13 .content__box { padding-left: 0px; padding-right: 0px; } .services_design__d13 .content__card { display: flex; flex-direction: column; gap: 40px; } } .services-design-intro { background-image: url(/files/media/Media326734c4324e24ff7bf7c7d4c24f0df9.jpg); background-size: cover; background-repeat: no-repeat; background-position: center center; padding: 80px 0px; } .services-design-intro .container { padding: 0px; } .services-design-intro-heading { font-family: 'Noto Sans Thai', sans-serif; font-weight: 400; font-style: Regular; font-size: 32px; line-height: 150%; letter-spacing: 0%; text-transform: capitalize; margin-bottom: 24px; color: #ffffff; } .services-design-intro-box { position: relative; } .services-design-intro-box-image { width: 100%; height: 560px; object-fit: cover; } .services-design-intro-box-content { position: absolute; width: 495px; left: 0; bottom: 0; padding: 40px; font-family: 'Noto Sans Thai', sans-serif; font-weight: 400; font-style: Regular; font-size: 18px; line-height: 150%; letter-spacing: 0%; color: #ffffff; } @media screen and (max-width: 768px) { .services-design-intro { background-image: url(/files/media/Media97fcc8c5b250f76928892aa3701a6b00.jpg); padding: 40px 16px; } .services-design-intro-box-image { height: 358px; } .services-design-intro-box-content { width: auto; } } .moce-services-projects-img-slider { background-image: url(/files/media/Media32a62f0534ffbfd251288cbf8bd61bc5.jpg); background-size: cover; background-repeat: no-repeat; background-position: center center; padding-top: 80px; padding-bottom: 80px; } .moce-services-projects-img-slider .container { max-width: 1320px; } .moce-services-projects-img-slider-lead { font-family: 'Noto Sans Thai', sans-serif; font-weight: 400; font-style: Regular; font-size: 18px; line-height: 150%; letter-spacing: 0%; margin-bottom: 24px; display: flex; align-items: center; color: #4db848; } .moce-services-projects-img-slider-lead::after { content: ""; display: inline-block; height: 2px; width: 120px; background-color: #4db848; margin-left: 40px; } .moce-services-projects-img-slider-heading { font-family: 'Noto Sans Thai', sans-serif; font-weight: 400; font-style: Regular; font-size: 32px; line-height: 150%; letter-spacing: 0%; text-transform: capitalize; margin-bottom: 24px; } .moce-services-projects-img-slider-item { } .moce-services-projects-img-slider-item-img { width: 100%; height: 520px; display: block; object-fit: cover; } .moce-services-projects-img-slider-slick .slide-item { padding: 0 8px; } @media screen and (max-width: 768px) { .moce-services-projects-img-slider { background-image: url(https: padding: 40px 16px; } .moce-services-projects-img-slider-item-img { height: 193px; } } .contact__contact__d13 { padding: 80px 0px; gap: 40px; background: url(/files/media/Mediae3bad7241377ca16d77699e5a5924f81.jpg); background-repeat: no-repeat; background-size: cover; background-position: center; } .contact__contact__d13 .container { display: flex; flex-direction: row; } .contact__contact__d13 h1 { color: #000; } .contact__contact__d13 .text__contact_content { color: #000; } .contact__contact__d13 .text___center { justify-items: center; } .contact__contact__d13 p { font-size: 16px; } .contact__contact__d13 .b { font-weight: 700; font-size: 16px; } .contact__contact__d13 .col-md-7 { display: flex; flex-direction: column; gap: 40px; padding-right: 100px; } .contact__contact__d13 .col-md-5 { padding: 0px; } .contact__contact__d13 .text___box { text-align: left; } .contact__contact__d13 img { width: 536px; height: 691px; object-fit: cover; } .button_content__follow a{ display: flex; flex-direction: row; align-items: center; gap: 16px; } .contact__contact__d13 .button_content__follow a{ color: #000; } .button_content__follow a p{ color: #000; } .contact__contact__d13 .button_content__follow i { font-size: 24px; } @media (max-width: 767.98px) { .contact__contact__d13 { padding: 40px 16px; background: url(/files/media/Media99f906ef1b583ba69bfc00c85781a1cc.jpg); background-repeat: no-repeat; background-size: cover; background-position: center; } .contact__contact__d13 .container { display: flex; flex-direction: column; gap: 40px; padding: 0px; } .contact__contact__d13 .col-md-7, .contact__contact__d13 .col-md-5 { padding: 0px; } .contact__contact__d13 img { height: 462px; } } .contact__contact__d13 .mb-10 { margin-bottom: 10px; } .contact__contact__d13 .mb-20 { margin-bottom: 20px; } .contact__contact__d13 .mb-40 { margin-bottom: 40px; } .contact__contact__d13 .text__contact_content { text-align: left; } .contact__contact__d13 .line__btn { display: flex; width: 236px; height: 42px; padding: 9px 55px 9px 51px; align-items: center; gap: 10px; color: #fff !important; background: #4DB848; text-decoration: none; font-size: 16px; font-weight: 400; } .contact__contact__d13 .line__btn:hover { background-color: #2C6A29; } .contact__contact__d13 .button_content__follow img { width: 21px; height: auto; } .contact__contact__d13 a img { width: 24px; height: auto; } .contact__contact__d13 a p { color: #fff; margin-bottom: 0px !important; } .home_numbering__d13 p.moce-home-numbering-odometer-description{ font-size: 14px !important; }