a.featureBox { display: block; } p.orangeLink { color: #FE8E14; } .tooltip-inner { font-size: 14px; } #overall-header a, #overall-header a:visited, #mdMenu li a, #cp-header .header-visitor a:link, .header-visitor a:visited, .header-visitor a:hover { color: #ffffff; } #cp-header .userbox .user-profile { background: #000000; } #overall-header .ds-logo { display: block; background: url(../images/dynamsoft-logos/logo-dynamsoft-white.svg) no-repeat 0; } #homePage { background: #ffffff; } #homePage .d-btn { display: inline-block; font-family: Oswald-Regular; height: 56px; padding: 0px 2.2rem; outline: none; font-size: 22px; border: 0; outline: none; line-height: 56px; } #dynamsoft-header #mdHeader { background: #323234; } #homePage .indexBanner { position: relative; height: 620px; min-height: 450px; background: #323232; box-sizing: content-box; padding-bottom: 0px; } #homePage .indexBanner .banner-container { padding-top: 175px; } #homePage .indexBanner .banner-container h1 { font-size: 50px; line-height: 70px; margin-bottom: 0; color: #ffffff; text-transform: uppercase; letter-spacing: 1px; } #homePage .indexBanner .banner-container .indexBannerDesc { font-size: 30px; line-height: 48px; color: #ffffff; width: 660px; margin-top: 20px; margin-bottom: 0; } #homePage .indexBanner .banner-container .indexBannerDesc a { font-size: inherit; } #homePage .indexBanner .banner-container .downloadBtn { margin-top: 75px; font-size: 24px; padding: 0 63px; height: 70px; line-height: 70px; font-family: Oswald-Regular, 'Myriad Pro','Gloucester MT', myriad-pro, 'Agency FB'; letter-spacing: 0.72px } #homePage .indexBanner .banner-container .downloadBtn:hover { box-shadow: -1rem 1rem 0 0px #000; transform: translate(1rem, -1rem); } #homePage .basicCustomers .desc { width: 1190px; font-size: 30px; line-height: 48px; text-align: center; margin: 0 auto; margin-bottom: 50px; } #homePage .basicCustomers i.company-logo { height: 62px; background: url(../images/banner/index/company-logo-grey.png) } #homePage .basicCustomers i.company-logo:hover { background: url(../images/banner/index/company-logo-colorful.png); } #homePage .basicCustomers i.ibm-logo { width: 107px; background-position: 0 0px !important; background-repeat: no-repeat !important; } #homePage .basicCustomers i.ge-logo { width: 62px; background-position: -178px 0px !important; background-repeat: no-repeat !important; } #homePage .basicCustomers i.nasa-logo { width: 72px; background-position: -306px 0px !important; background-repeat: no-repeat !important; } #homePage .basicCustomers i.lm-logo { width: 262px; background-position: -444px 0px !important; background-repeat: no-repeat !important; } #homePage .basicCustomers i.epson-logo { width: 118px; background-position: -778px 0px !important; background-repeat: no-repeat !important; } #homePage .basicCustomers i.fujifilm-logo { width: 140px; background-position: -966px 0px !important; background-repeat: no-repeat !important; } #homePage .basicCustomers i.hp-logo { width: 60px; background-position: -1176px 0px !important; background-repeat: no-repeat !important; } #homePage .basicCustomers i.disney-logo { width: 128px; background-position: -1305px 0px !important; background-repeat: no-repeat !important; } #homePage .basicCustomers i.simens-logo { width: 131px; background-position: -1508px 0px !important; background-repeat: no-repeat !important; } #homePage .basicCustomers .customer-logos { display: flex; justify-content: space-between; align-items: center; } #homePage .basicCustomers .customer-logos li { margin-right: 69px; opacity: 1; } #homePage .basicCustomers a[data-toggle=tooltip] { width: 100%; height: 100%; display: block; } #homePage .basicCustomers .customer-logos li:last-child { margin-right: 0; } #homePage .basicCustomers .customer-swiper-container { overflow: hidden; } #homePage .basicCustomers .swiper-slide { width: auto; display: inline-block !important; text-align: center; } #homePage .home-title { font-size: 45px; line-height: 60px; display: flex; align-items: center; justify-content: space-between; } #homePage .home-title a { border: 2px solid var(--theme-orange-main); font-size: 18px; height: 42px; line-height: 38px; padding: 0 38px; } #homePage .home-title a:hover { box-shadow: -1rem 1rem 0 0px #000; transform: translate(1rem, -1rem); } #homePage .indexProduct { margin-top: 200px; } #homePage .indexProduct .products { display: grid; grid-template-columns: repeat(3, auto); grid-gap: 50px 15px; justify-items: center; } #homePage .indexProduct .products .product-item { position: relative; width: 510px; height: 270px; padding: 82px 58px 52px 68px; background: #59626A; color: #FFFFFF; transition: all ease-in-out .3s; } #homePage .indexProduct .products .product-item:hover { box-shadow: -1.5rem 1.5rem 0 0px #000; transform: translate(1.5rem, -1.5rem); } #homePage .indexProduct .products .product-item i.icon { display: inline-block; width: 103px; height: 103px; background-size: contain !important; position: absolute; top: -51px; left: 68px; } #homePage .indexProduct .products .product-item i.icon-barcode-scan { background: url('../images/icons/productbox-dbr-large.png') no-repeat center center; } #homePage .indexProduct .products .product-item i.icon-mobile-capture { background: url('../images/icons/productbox-dwt-large.png') no-repeat center center; } #homePage .indexProduct .products .product-item i.icon-ocr { background: url('../images/icons/productbox-text-large.png') no-repeat center center; } #homePage .indexProduct .products .product-item p.title { font-size: 24px; line-height: 40px; margin-bottom: 10px; } #homePage .indexProduct .products .product-item p.desc { margin-bottom: 0; } #homePage .indexProduct a.productBtn { display: block; max-width: 330px; height: 70px; line-height: 70px; padding: 0; margin: 80px auto 0; text-align: center; font-size: 24px; font-family: Oswald-Regular, 'Myriad Pro','Gloucester MT', myriad-pro, 'Agency FB'; letter-spacing: 0.72px; transition: all ease-in-out .3s; } #homePage .indexProduct a.productBtn:hover { box-shadow: -1rem 1rem 0 0px #000; transform: translate(1rem, -1rem); } #homePage .indexCustomerStory { margin-top: 140px; } #homePage .indexCustomerStory h2 { font-size: 36px; line-height: 50px; letter-spacing: 0.72px; margin-bottom: 50px; } #homePage .indexCustomerStory h2 .titleBtn { padding: 0 36px; transition: all ease-in-out .3s; margin-left: 25px; } #homePage .indexCustomerStory h2 .titleBtn:hover { box-shadow: -1rem 1rem 0 0px #000; transform: translate(1rem, -1rem); } #homePage .indexCustomerStory .storyList { background: #F5F5F5; display: flex; display: -webkit-flex; display: -ms-flexbox; justify-content: space-between; -webkit-justify-content: space-between; } #homePage .indexCustomerStory .storyList .story-swiper-con { position: relative; width: calc(100% - 589px); padding: 70px 150px; padding-right: 0; padding-bottom: 0; } #homePage .indexCustomerStory .storyList .story-swiper-con .tag { position: absolute; left: 0; top: 0; height: 40px; line-height: 40px; padding: 0 48px; background: #BEBEBE; color: #FFFFFF; font-size: 18px; } #homePage .indexCustomerStory .storyList .story-swiper { width: 100%; height: 280px; overflow: hidden; } #homePage .indexCustomerStory .storyList .story-swiper .swiper-slide { padding: 28px 152px 0 83px; font-size: 18px; background: #fff; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; flex-direction: column; } #homePage .indexCustomerStory .storyList .story-swiper .swiper-slide i { margin-bottom: 20px; } #homePage .indexCustomerStory .storyList .story-swiper .swiper-slide i.lm-logo { width: 252px; height: 60px; background: url(../images/banner/index/logo-lockheed-martin.png); background-size: cover; } #homePage .indexCustomerStory .storyList .story-swiper .swiper-slide i.ibm-logo { width: 123px; height: 49px; background: url(../images/banner/index/IBM_logo.png); background-size: cover; margin-top: 15px; } #homePage .indexCustomerStory .storyList .story-swiper .swiper-slide i.siemens-logo { width: 262px; height: 41px; background: url(../images/company/caseStudyImage/siemens-logo.png); background-size: cover; margin-top: 30px; } #homePage .indexCustomerStory .storyList .story-swiper .swiper-slide i.grc-logo { width: 174px; height: 63px; background: url(../images/banner/index/case-study-redcross-logo.png); background-size: cover; margin-top: 18px; } #homePage .indexCustomerStory .storyList .story-swiper .swiper-slide i.avanza-logo { width: 199px; height: 60px; background: url(../images/banner/index/avanza-logo.png); background-size: cover; margin-top: 18px; } #homePage .indexCustomerStory .storyList .story-swiper .swiper-slide i.operation-smile-logo { width: 308px; height: 58px; background: url(../images/banner/index/Operation-Smile-USA_z_OS_Logo-no-tag.jpg); background-size: cover; margin-top: 20px; } #homePage .indexCustomerStory .storyList .story-swiper .swiper-slide div.desc { font-size: 18px; line-height: 28px; margin-bottom: 20px; } #homePage .indexCustomerStory .storyList .story-swiper .swiper-slide a { font-size: 20px; } #homePage .indexCustomerStory .storyList .swiper-operation { position: relative; margin-top: 25px; height: 24px; line-height: 24px; text-align: center; } #homePage .indexCustomerStory .storyList .swiper-operation .swiper-pagination .swiper-pagination-bullet { width: 12px; height: 12px; margin-top: 5px; } #homePage .indexCustomerStory .storyList .swiper-operation .icon-arrow-left, #homePage .indexCustomerStory .storyList .swiper-operation .icon-arrow-right { position: absolute; cursor: pointer; fill: none; width: 24px; height: 24px; stroke: #323234; stroke-width: 2px; stroke-linecap: round; stroke-linejoin: round; } #homePage .indexCustomerStory .storyList .swiper-operation .icon-arrow-left { left: 0; top: 0; } #homePage .indexCustomerStory .storyList .swiper-operation .icon-arrow-right { right: 32px; top: 0; } #homePage .indexCustomerStory .storyList .swiper-operation .swiper-button-disabled .icon-arrow-left, #homePage .indexCustomerStory .storyList .swiper-operation .swiper-button-disabled .icon-arrow-right { stroke: #ddd; cursor: not-allowed; } #homePage .indexCustomerStory .storyList .storyImg { width: 589px; height: 420px; display: flex; justify-content: center; align-items: center; } #homePage .indexCustomerStory .storyList .storyImg img { width: 100%; height: 100%; object-fit: cover; object-position: center center; transition: all ease-in-out .3s; } #homePage .indexCustomerStory .storyList .storyImgShowMobile { display: none !important; } #homePage .indexUseCase h2 { font-size: 36px; line-height: 50px; letter-spacing: 0.72px; margin-bottom: 50px; } #homePage .indexUseCase h2 .titleBtn { padding: 0 36px; transition: all ease-in-out .3s; margin-left: 25px; } #homePage .indexUseCase h2 .titleBtn:hover { box-shadow: -1rem 1rem 0 0px #000; transform: translate(1rem, -1rem); } #homePage .indexUseCase .caseList { display: flex; display: -webkit-flex; display: -ms-flexbox; justify-content: space-between; -webkit-justify-content: space-between; } #homePage .indexUseCase .caseList .caseItem { width: 500px; position: relative } #homePage .indexUseCase .caseList .caseItem > a { display: block; position: relative; z-index: 1; transition: all ease-in-out .3s; } #homePage .indexUseCase .caseList .caseItem > a:hover { transform: translate(1.5rem, -1.5rem); } #homePage .indexUseCase .caseList .caseItem i.card-overlay { transition: all ease-in-out .3s; } #homePage .indexUseCase .caseList .caseItem > a:hover + i.card-overlay { z-index: 0 } #homePage .indexUseCase .caseList .caseItem .imgCon { height: 320px; } #homePage .indexUseCase .caseList .caseItem .imgCon img { width: 100%; object-fit: contain; } #homePage .indexUseCase .caseList .caseItem .desc { height: 166px; background: #F5F5F5; padding-top: 31px; padding-left: 44px; } #homePage .indexUseCase .caseList .caseItem .desc h3 { margin-bottom: 20px; } #homePage .indexUseCase .caseList .caseItem .desc p { color: #FE8E14 !important; font-size: 20px; line-height: 36px; } #homePage .indexBottom { background: var(--theme-orange-main); } #homePage .indexBottom .bottom-wrap { display: flex; display: -webkit-flex; display: -ms-flexbox; align-items: center; } #homePage .indexBottom .bottom-wrap .desc { padding-top: 68px; padding-bottom: 68px; padding-left: 170px; width: 620px; } #homePage .indexBottom .bottom-wrap .desc h2 { letter-spacing: 0.8px; margin-bottom: 20px; } #homePage .indexBottom .bottom-wrap .desc p { font-size: 24px; line-height: 34px; margin-bottom: 0; } #homePage .indexBottom .bottom-wrap .btns { position: relative; padding-left: 285px; } #homePage .indexBottom .bottom-wrap .btns a { font-size: 24px; margin-right: 80px; } #homePage .indexBottom .bottom-wrap .btns a:hover { transform: translate(1rem, -1rem); box-shadow: -8px 8px 0 0 #323234; } /* 2023/05/16 Frank */ #homePage .indexPromote { width: 100%; height: auto; background-color: #F5F5F5; } #homePage .indexPromote .promote { display: flex; align-items: center; height: 180px; justify-content: space-between; } #homePage .indexPromote .promote .desc { width: 1040px; font-size: 30px; line-height: 48px; margin: 0; } #homePage .indexPromote .promote .icon { display: inline-block; width: 137px; height: 137px; background-size: contain; background-position: center; background-repeat: no-repeat; } #homePage .indexPromote .promote .icon.icon-iso { background-image: url(../images/icons/ISO.webp); } #homePage .indexPromote .promote .icon.icon-open { margin-left: 40px; background-image: url(../images/company/about/open-certified.png); } /* 2025/05/29 Jenny new home page design */ #homePage .index-industry { position: relative; } #homePage .index-industry .industry-content { position: relative; display: none !important; padding-top: 103px; padding-left: 50px; padding-bottom: 50px; height: 668px; transition: ease-in-out all .5s; } #homePage .index-industry .industry-content.on { display: block !important; } #homePage .index-industry .industry-content .container, #homePage .index-industry .industry-content .row, #homePage .index-industry .industry-content .col-12 { height: 100%; } #homePage .index-industry .industry-content .industry-heading { color: #FFFFFF; margin-bottom: 50px; } #homePage .index-industry .industry-content .story-list { position: absolute; top: 100px; display: flex; gap: 40px; flex-wrap: wrap; } #homePage .index-industry .industry-content .story-list > a { display: block; width: 350px; height: 70px; margin-bottom: 0; transition: ease-in-out all .2s; } #homePage .index-industry .industry-content .story-list > a.w300 { width: 300px; } #homePage .index-industry .industry-content .story-list > a.autoWidth { width: auto; } #homePage .index-industry .industry-content .story-list > a.autoWidth .story { padding: 0 40px; } #homePage .index-industry .industry-content .story-list > a .story { display: flex; width: 100%; height: 100%; padding: 0 18px; align-items: center; justify-content: space-between; background: rgba(0,0,0,.5); color: #FFFFFF; } #homePage .index-industry .industry-content .story-list > a .story span { font-size: 16px; } #homePage .index-industry .industry-content .story-list > a:hover { background: rgba(0,0, 0, 0.7) } #homePage .index-industry .industry-content .story-list > a:hover .story { color: #FE8E14; } #homePage .index-industry .industry-content .story-list > a:hover .story span > img { margin-left: 10px; margin-right: -10px; } #homePage .index-industry .industry-nav-wrap { position: absolute; width: 100%; bottom: 100px; padding-left: 50px; z-index: 10; } #homePage .index-industry .industry-nav { display: flex; width: 100%; gap: 20px; justify-content: flex-end; } #homePage .index-industry .industry-nav > p, #homePage .index-industry .industry-nav > a { display: flex; align-items: center; justify-content: center; gap: 5px; margin: 0; width: 160px; height: 50px; line-height: 56px; position: relative; cursor: pointer; color: #FFFFFF; background-color: rgba(0,0,0,.6); border: 2px solid #606060; text-align: center; font-size: 18px; cursor: pointer; transition: ease-in-out all .2s; } #homePage .index-industry .industry-nav > a { color: #fe8e14; } #homePage .index-industry .industry-nav > p.on, #homePage .index-industry .industry-nav > p:hover { background-color: #fe8e14; border-color: #FE8E14; } #homePage .index-industry .industry-nav > a:hover { background: rgba(0,0,0,.7) } #homePage .index-industry .industry-nav > a:hover img { margin-left: 10px; margin-right: -10px; } #homePage .why-ds { display: grid; grid-gap: 260px; max-width: 1480px; margin-left: auto; margin-right: auto; } #homePage .why-ds > div > p.title { font-size: 24px; } #homePage .why-ds-benefits { grid-template-columns: repeat(3, 1fr); } #homePage .why-ds-benefits span.icon { display: block; width: 66px; height: 66px; border: 2px solid #323234; margin-bottom: 20px; } #homePage .why-ds-benefits span.icon-fast-integration { background: url(../images/homepage/fast-integration.svg) no-repeat center center; } #homePage .why-ds-benefits span.icon-low-cost { background: url(../images/homepage/low-cost.svg) no-repeat center center; background-size: 67%; } #homePage .why-ds-benefits span.icon-license { background: url(../images/homepage/license.svg) no-repeat center center; } #homePage .home-product-list { position: relative; margin-top: 60px; } #homePage .home-product-list .home-product-swiper .swiper-wrapper .swiper-slide { width: 350px; } #homePage .home-product-list .home-product-swiper .swiper-wrapper .swiper-slide a { display: flex; min-height: 237px; height: auto; padding: 35px 30px 25px 25px; border: 1px solid #D9D9D9; align-items: center; background-color: #F5F5F5; color: #323234; transition: all .2s ease-in-out; position: relative; } #homePage .home-product-list .home-product-swiper .swiper-wrapper .swiper-slide a:hover div.bottom { color: var(--theme-orange-main); } #homePage .home-product-list .home-product-swiper .swiper-wrapper .swiper-slide a:hover div.bottom img { margin-right: -10px; margin-left: 10px; } #homePage .home-product-list .home-product-swiper .swiper-wrapper .swiper-slide a > img { width: 150px; height: 100%; object-fit: cover; object-position: left; } #homePage .home-product-list .home-product-swiper .swiper-wrapper .swiper-slide a div > img[alt='arrow'] { right: 30px; bottom: 18px; position: absolute; } #homePage .home-product-list .home-product-swiper .swiper-wrapper .swiper-slide a div p.desc { font-size: 16px; margin-bottom: 0; min-height: 60px; } #homePage .home-product-list .home-product-swiper .swiper-wrapper .swiper-slide a div.bottom { display: flex; margin-top: 30px; font-size: 16px; align-items: center; justify-content: space-between; } #homePage .home-product-list .home-product-swiper .swiper-wrapper .swiper-slide a div.bottom .icon { display: inline-block; } #homePage .home-product-list .home-product-swiper .swiper-wrapper .swiper-slide a div.bottom .icon-dwt { width: 47px; height: 36px; background: url(../images/homepage/product-icon/dwt.svg) no-repeat; background-size: contain; } #homePage .home-product-list .home-product-swiper .swiper-wrapper .swiper-slide a div.bottom .icon-dbr { width: 38px; height: 34px; background: url(../images/homepage/product-icon/dbr.svg) no-repeat; background-size: contain; } #homePage .home-product-list .home-product-swiper .swiper-wrapper .swiper-slide a div.bottom .icon-mrz { width: 50px; height: 36px; background: url(../images/homepage/product-icon/mrz.svg) no-repeat; background-size: contain; } #homePage .home-product-list .home-product-swiper .swiper-wrapper .swiper-slide a div.bottom .icon-batch-barcode { width: 65px; height: 33px; background: url(../images/homepage/product-icon/batch-barcode.svg) no-repeat; background-size: contain; } #homePage .home-product-list .home-product-swiper .swiper-wrapper .swiper-slide a div.bottom .icon-mwc { width: 36px; height: 34px; background: url(../images/homepage/product-icon/mwc.svg) no-repeat; background-size: contain; } #homePage .home-product-list .home-product-swiper-button-prev { cursor: pointer; position: absolute; top: 0; height: 100%; left: 0; z-index: 10; width: 10px; box-shadow: inset 10px 0 10px -10px #D9D9D9; } #homePage .home-product-list .home-product-swiper-button-next { cursor: pointer; position: absolute; top: 0; height: 100%; right: 0; z-index: 10; width: 10px; box-shadow: inset -10px 0 10px -10px #D9D9D9; } #homePage .home-product-list .home-product-swiper-button-prev img { position: absolute; top: 110px; left: -18px; background: #F5F5F5; border-radius: 50%; } #homePage .home-product-list .home-product-swiper-button-next img { position: absolute; top: 110px; right: -18px; background: #F5F5F5; border-radius: 50%; } #homePage .enterprise-security { display: flex; max-width: 1380px; margin: 0 auto; } #homePage .enterprise-security .left-content { flex: 1; padding-right: 145px; padding-top: 50px; } #homePage .enterprise-security .left-content .desc { margin-top: 30px; } #homePage .enterprise-security .left-content a { margin-top: 36px; border: 2px solid var(--theme-orange-main); font-size: 18px; height: 42px; line-height: 38px; padding: 0 38px; } #homePage .enterprise-security .left-content a:hover { box-shadow: -1rem 1rem 0 0px #000; transform: translate(1rem, -1rem); } #homePage .enterprise-security .left-content .security-icons { display: flex; gap: 64px; margin-top: 53px; } #homePage .enterprise-security .right-content { width: 782px; background-image: radial-gradient(#f5c285 1px, transparent 1px); background-size: 20px 20px; padding: 120px 50px; } #homePage .enterprise-security .right-content .hexagon-list { display: flex; flex-wrap: wrap; gap: 13px; margin-left: 9px; } #homePage .enterprise-security .right-content .hexagon { position: relative; width: 213px; height: 123px; /* 高度约为宽度的√3/3倍 */ background-color: #FFF4E5; border: 1px solid #CB8426; box-sizing: border-box; border-top: 0; border-bottom: 0; } #homePage .enterprise-security .right-content .hexagon:before, #homePage .enterprise-security .right-content .hexagon:after { content: ""; position: absolute; width: 100%; height: 100%; background-color: inherit; border: inherit; box-sizing: inherit; } #homePage .enterprise-security .right-content .hexagon:before { transform: rotate(60deg); } #homePage .enterprise-security .right-content .hexagon:after { transform: rotate(-60deg); } #homePage .enterprise-security .right-content .hexagon.middle { width: 186px; height: 107px; background-color: #FFFFFF; } #homePage .enterprise-security .right-content .hexagon.small { width: 128px; height: 74px; background-color: #FFFFFF; } #homePage .enterprise-security .right-content .hexagon:first-child { margin-left: 112px; } #homePage .enterprise-security .right-content .hexagon:nth-child(2) { margin-top: -16px; } #homePage .enterprise-security .right-content .hexagon:nth-child(3) { margin-top: 32px; } #homePage .enterprise-security .right-content .hexagon:nth-child(4) { margin-top: 47px; } #homePage .enterprise-security .right-content .hexagon:nth-child(5) { margin-top: 60px; } #homePage .enterprise-security .right-content .hexagon:nth-child(6) { margin-top: 60px; } #homePage .enterprise-security .right-content .hexagon-content { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; flex-direction: column; justify-content: center; align-items: center; z-index: 1; } #homePage .enterprise-security .right-content .hexagon-content span.number { font-size: 45px; line-height: 66px; margin-bottom: 12px; } #homePage .enterprise-security .right-content .hexagon-content span.text { font-size: 24px; line-height: 26px; text-align: center; } #homePage .enterprise-security .right-content .hexagon-content i.icon-code-service { display: inline-block; width: 81px; height: 71px; background: url(../images/homepage/code.svg) no-repeat; background-size: contain; } #homePage .enterprise-security .right-content .hexagon-content i.icon-customer { display: inline-block; width: 60px; height: 45px; background: url(../images/homepage/customer.svg) no-repeat; background-size: contain; } #homePage .enterprise-security .right-content .hexagon-content i.icon-security { display: inline-block; width: 78px; height: 83px; background: url(../images/homepage/security.svg) no-repeat; background-size: contain; } #homePage .ds-support { display: flex; } #homePage .ds-support .support-img { position: relative; width: 780px; height: 500px; background: url(../images/banner/index/support.jpg) no-repeat; background-size: contain; } #homePage .ds-support .support-img:before { content: ""; position: absolute; bottom: 0; left: 0; width: 95%; height: 85%; background: transparent; box-shadow: -20px 20px 0 #F1F0EF; z-index: 1; pointer-events: none; } #homePage .ds-support .support-img .support-icons { display: flex; gap: 18px; justify-content: flex-end; margin-top: 25px; padding-right: 25px; } #homePage .ds-support .support-img .support-icons span { display: inline-block; width: 35px; height: 35px; } /*#homePage .ds-support .support-img .support-icons span:hover {opacity: 0.9}*/ #homePage .ds-support .support-img .support-icons span.phone { background: url(../images/homepage/phone.svg) no-repeat; background-size: contain; } #homePage .ds-support .support-img .support-icons span.email { background: url(../images/homepage/email.svg) no-repeat; background-size: contain; } #homePage .ds-support .support-img .support-icons span.chat { background: url(../images/homepage/chat.svg) no-repeat; background-size: contain; } #homePage .ds-support .support-img .support-icons span.meeting { background: url(../images/homepage/meeting.svg) no-repeat; background-size: contain; } #homePage .ds-support .support-desc { flex: 1; padding-left: 190px; padding-top: 40px; } #homePage .ds-support .support-desc .icon-support-time { display: block; width: 121px; height: 114px; background: url(../images/icons/icon-support-blue.svg) no-repeat; background-size: contain; margin-bottom: 20px; } #homePage .ds-support .support-desc > a { margin-top: 60px; padding: 0 70px; } #homePage .ds-support .support-desc > a:hover { box-shadow: -1rem 1rem 0 0px #000; transform: translate(1rem, -1rem); } .customTooltip2 .arrow { display: none; } .customTooltip2 .tooltip-inner { box-shadow: 0px 3px 6px #00000029; background-color: white; font-family: OpenSans-Regular; font-size: 18px; padding: 10px 28px; width: fit-content; max-width: 550px; color: black; opacity: 1; border: 1px solid #EEEEEE; } .customTooltip2 .tooltip-inner p { margin: 0; } /* banner swiper */ #homePage .bannerImg { position: absolute; right: 0; top: 155px; height: 420px; display: flex; align-items: center; gap: 38px; } #homePage .bannerImg .bannerSwiper { width: 670px; } #homePage .bannerImg .bannerSwiper video { max-width: 100%; pointer-events: none; } #homePage .bannerImg .bannerSwiper a { position: relative; display: block; } #homePage .bannerImg .bannerSwiper a:hover .learn-more { display: block; } #homePage .bannerImg .bannerSwiper a .learn-more { display: none; font-size: 14px; color: white; line-height: 36px; text-align: center; width: 110px; height: 36px; background-color: rgba(254, 142, 20, .7); position: absolute; right: 50px; bottom: 30px; } #homePage .bannerImg .bannerSwiper a .learn-more:hover { background-color: #fe8e14; } #homePage .bannerImg [class^='banner-swiper-button-'] { transform: translateY(-55%); cursor: pointer; } #homePage .bannerImg .swiper-pagination { text-align: center; margin-top: 10px; } #homePage .bannerImg .swiper-pagination-bullet { width: 10px; height: 10px; background-color: #606060; cursor: pointer; } #homePage .bannerImg .swiper-pagination-bullet.swiper-pagination-bullet-active { background-color: #AAAAAA; } @media (max-width: 1679px) { /* banner swiper */ #homePage .bannerImg .bannerSwiper { width: 570px; } #homePage .home-product-list { grid-template-columns: repeat(3, 1fr); grid-gap: 30px; } #homePage .home-product-list a { height: 160px; gap: 20px; } #homePage .home-product-list a p.f24 { font-size: 20px; } #homePage .home-product-list a img + div { padding: 20px 20px 20px 0; } /* 2023/05/16 Frank */ #homePage .indexPromote .promote { justify-content: space-between; } #homePage .indexPromote .promote .desc { font-size: 26px; width: 70%; } #homePage .indexPromote .promote .icon { margin: 0; } #homePage .indexBanner { height: 610px; } #homePage .indexBanner .banner-container { padding-top: 180px; } #homePage .indexBanner .banner-container h1 { font-size: 46px; line-height: 60px; } #homePage .indexBanner .banner-container .indexBannerDesc { font-size: 26px; line-height: 46px; width: 555px; margin-top: 20px; } #homePage .indexBanner .banner-container .downloadBtn { margin-top: 40px; font-size: 22px; padding: 0 55px; height: 65px; line-height: 65px; } #homePage .indexBanner .bannerImgBox { width: 620px; height: 366px; top: 140px; } #homePage .indexBanner .bannerImgBox .switchIcons { top: 180px; right: 640px; } #homePage .basicCustomers .desc { width: 1110px; font-size: 28px; } #homePage .basicCustomers i.company-logo { height: 62px; transform: scale(0.88) } #homePage .basicCustomers .customer-logos li { margin-right: 0; } #homePage .indexProduct { margin-top: 180px; } #homePage .indexProduct .products .product-item { width: 410px; height: 255px; padding: 75px 20px 46px 40px; } #homePage .indexProduct .products .product-item i.icon { width: 103px; height: 103px; top: -51px; left: 40px; } #homePage .indexProduct .products .product-item i.icon-barcode-scan { background: url('../images/icons/productbox-dbr-large.png') no-repeat center center; } #homePage .indexProduct .products .product-item i.icon-mobile-capture { background: url('../images/icons/productbox-dwt-large.png') no-repeat center center; } #homePage .indexProduct .products .product-item i.icon-ocr { background: url('../images/icons/productbox-text-large.png') no-repeat center center; } #homePage .indexProduct .products .product-item p.title { font-size: 22px; line-height: 36px; margin-bottom: 10px; } #homePage .indexProduct a.productBtn { max-width: 300px; height: 65px; line-height: 65px; margin: 70px auto 0; font-size: 22px; } #homePage .indexCustomerStory { margin-top: 110px; } #homePage .indexCustomerStory h2 { margin-bottom: 45px; } #homePage .indexCustomerStory h2 .titleBtn { font-size: 20px; } #homePage .indexCustomerStory .storyList .story-swiper-con { width: calc(100% - 550px); padding: 60px 80px; padding-right: 0; padding-bottom: 0; } #homePage .indexCustomerStory .storyList .story-swiper-con .tag { height: 40px; line-height: 40px; padding: 0 48px; font-size: 18px; } #homePage .indexCustomerStory .storyList .story-swiper { height: 260px; } #homePage .indexCustomerStory .storyList .story-swiper .swiper-slide { padding: 28px 50px 0 40px; } #homePage .indexCustomerStory .storyList .story-swiper .swiper-slide i.logo { margin-bottom: 10px; } #homePage .indexCustomerStory .storyList .story-swiper .swiper-slide div.desc { font-size: 16px; line-height: 26px; margin-bottom: 10px; } #homePage .indexCustomerStory .storyList .story-swiper .swiper-slide a { font-size: 20px; } #homePage .indexCustomerStory .storyList .swiper-operation { margin-top: 25px; height: 24px; line-height: 24px; text-align: center; } #homePage .indexCustomerStory .storyList .swiper-operation .swiper-pagination .swiper-pagination-bullet { width: 12px; height: 12px; margin-top: 5px; } #homePage .indexCustomerStory .storyList .swiper-operation .icon-arrow-left { left: 0; top: 0; } #homePage .indexCustomerStory .storyList .swiper-operation .icon-arrow-right { right: 32px; top: 0; } #homePage .indexCustomerStory .storyList .storyImg { width: 550px; height: 394px; } #homePage .indexUseCase h2 { margin-bottom: 45px; } #homePage .indexUseCase h2 .titleBtn { font-size: 20px; } #homePage .indexUseCase .caseList .caseItem { width: 415px; } #homePage .indexUseCase .caseList .caseItem .imgCon { height: 265px; } #homePage .indexUseCase .caseList .caseItem .desc { height: 155px; padding-top: 28px; padding-left: 44px; } #homePage .indexBottom .bottom-wrap .desc { padding-top: 60px; padding-bottom: 60px; padding-left: 140px; width: 590px; } #homePage .indexBottom .bottom-wrap .desc h2 { margin-bottom: 20px; } #homePage .indexBottom .bottom-wrap .desc p { font-size: 22px; line-height: 34px; margin-bottom: 0; } #homePage .indexBottom .bottom-wrap .btns { padding-left: 145px; } #homePage .indexBottom .bottom-wrap .btns a { font-size: 22px; margin-right: 70px; } .indexSwiper .slide-left { width: 550px; padding-left: 60px; } .indexSwiper .slide-right { padding-right: 60px; } /* 2025/05/29 Jenny new home page design */ #homePage .enterprise-security .left-content { padding-right: 80px; } #homePage .enterprise-security .right-content { width: 756px; padding: 100px 30px; } #homePage .enterprise-security .right-content .hexagon-list { margin-left: 44px; gap: 12px; margin-top: 20px; } #homePage .enterprise-security .right-content .hexagon { width: 191.7px; height: 110px; } #homePage .enterprise-security .right-content .hexagon:first-child { margin-left: 100.8px; } #homePage .enterprise-security .right-content .hexagon:nth-child(2) { margin-top: -14.4px; } #homePage .enterprise-security .right-content .hexagon:nth-child(3) { margin-top: 28.8px; } #homePage .enterprise-security .right-content .hexagon:nth-child(4) { margin-top: 42.3px; } #homePage .enterprise-security .right-content .hexagon:nth-child(5) { margin-top: 54px; } #homePage .enterprise-security .right-content .hexagon:nth-child(6) { margin-top: 54px; } #homePage .enterprise-security .right-content .hexagon.middle { width: 165px; height: 95px; } #homePage .enterprise-security .right-content .hexagon.small { width: 113px; height: 66px; } #homePage .enterprise-security .right-content .hexagon-content span.number { font-size: 40px; } #homePage .enterprise-security .right-content .hexagon-content span.text { font-size: 20px; line-height: 22px; } #homePage .enterprise-security .right-content .hexagon-content i { transform: scale(0.9); } #homePage .ds-support .support-img { width: 700px; height: 449px; } #homePage .ds-support .support-desc { padding-left: 140px; } #homePage .index-industry .industry-content .story-list { gap: 25px; } #homePage .index-industry .industry-content .story-list > a.w300 { width: 260px; } #homePage .index-industry .industry-nav { padding-right: 50px; } #homePage .why-ds { grid-gap: 210px; } #homePage .index-industry .industry-content { padding-left: 0px; } #homePage .index-industry .industry-nav-wrap { padding-left: 0; } } @media (max-width: 1399px) { /*banner swiper*/ #homePage .bannerImg { top: 100px; gap: 20px; } #homePage .bannerImg .bannerSwiper { width: 500px; } #homePage .home-product-list a { height: auto; flex-direction: column; gap: 0; } #homePage .home-product-list a > img { width: 100%; height: 150px; } #homePage .home-product-list a img + div { padding: 20px; width: 100%; } #homePage .indexBanner { height: 530px; } #homePage .indexBanner .banner-container { padding-top: 150px; } #homePage .indexBanner .banner-container h1 { font-size: 40px; line-height: 60px; } #homePage .indexBanner .banner-container .indexBannerDesc { font-size: 22px; line-height: 40px; width: 470px; } #homePage .indexBanner .banner-container .downloadBtn { margin-top: 30px; font-size: 22px; padding: 0 50px; height: 60px; line-height: 60px; } #homePage .indexBanner .bannerImgBox { width: 570px; height: 337px; top: 140px; } #homePage .indexBanner .bannerImgBox .switchIcons { top: 120px; right: 590px; } #homePage .basicCustomers .desc { width: 1000px; font-size: 26px; } #homePage .indexProduct { margin-top: 140px; } #homePage .indexProduct .products .product-item { width: 362px; height: 240px; padding: 65px 28px 46px 40px; } #homePage .indexProduct .products .product-item i.icon { width: 80px; height: 80px; top: -40px; left: 40px; } #homePage .indexProduct .products .product-item i.icon-barcode-scan { background: url('../images/icons/productbox-dbr.png') no-repeat center center; } #homePage .indexProduct .products .product-item i.icon-mobile-capture { background: url('../images/icons/productbox-dwt.png') no-repeat center center; } #homePage .indexProduct .products .product-item i.icon-ocr { background: url('../images/icons/productbox-text.png') no-repeat center center; } #homePage .indexProduct .products .product-item p.title { font-size: 20px; line-height: 32px; margin-bottom: 10px; } #homePage .indexProduct a.productBtn { max-width: 280px; height: 60px; line-height: 60px; margin: 60px auto 0; font-size: 20px; } #homePage .indexCustomerStory { margin-top: 110px; } #homePage .indexCustomerStory h2 { font-size: 34px; } #homePage .indexCustomerStory .storyList .story-swiper-con { width: calc(100% - 500px); padding: 50px 40px; padding-right: 0; padding-bottom: 0; } #homePage .indexCustomerStory .storyList .story-swiper-con .tag { height: 36px; line-height: 36px; padding: 0 30px; font-size: 16px; } #homePage .indexCustomerStory .storyList .story-swiper { height: 260px; } #homePage .indexCustomerStory .storyList .story-swiper .swiper-slide { padding: 15px 50px 0 40px; } #homePage .indexCustomerStory .storyList .story-swiper .swiper-slide i.logo { margin-bottom: 10px; } #homePage .indexCustomerStory .storyList .story-swiper .swiper-slide div.desc { font-size: 16px; line-height: 26px; margin-bottom: 10px; } #homePage .indexCustomerStory .storyList .story-swiper .swiper-slide a { font-size: 18px; } #homePage .indexCustomerStory .storyList .swiper-operation { margin-top: 13px; height: 24px; line-height: 24px; text-align: center; } #homePage .indexCustomerStory .storyList .swiper-operation .swiper-pagination .swiper-pagination-bullet { width: 12px; height: 12px; margin-top: 5px; } #homePage .indexCustomerStory .storyList .swiper-operation .icon-arrow-left { left: 0; top: 0; } #homePage .indexCustomerStory .storyList .swiper-operation .icon-arrow-right { right: 32px; top: 0; } #homePage .indexCustomerStory .storyList .storyImg { width: 500px; height: 360px; } #homePage .indexUseCase h2 { font-size: 34px; } #homePage .indexUseCase .caseList .caseItem { width: 358px; } #homePage .indexUseCase .caseList .caseItem .imgCon { height: 229px; } #homePage .indexUseCase .caseList .caseItem .desc { height: 145px; padding-top: 28px; padding-left: 44px; } #homePage .indexUseCase .caseList .caseItem .desc h3 { margin-bottom: 15px; } #homePage .indexUseCase .caseList .caseItem .desc p { font-size: 18px; } #homePage .indexBottom .bottom-wrap .desc { padding-top: 55px; padding-bottom: 55px; padding-left: 85px; width: 510px; } #homePage .indexBottom .bottom-wrap .btns a { font-size: 20px; margin-right: 60px; } #homePage .indexBottom .bottom-wrap .btns a:last-child { margin-right: 0; } #homePage .basicCustomers i.company-logo { height: 62px; transform: scale(0.75); } #homePage .home-title { font-size: 40px; } #homePage .enterprise-security .left-content { padding-right: 60px; padding-top: 25px; } #homePage .enterprise-security .right-content { width: 625.6px; /* 782 * 0.8 */ background-image: radial-gradient(#f5c285 0.8px, transparent 0.8px); background-size: 16px 16px; /* 20 * 0.8 */ padding: 96px 40px; /* 120 * 0.8, 50 * 0.8 */ } #homePage .enterprise-security .right-content .hexagon-list { gap: 10.4px; /* 13 * 0.8 */ margin-left: 7.2px; /* 9 * 0.8 */ margin-top: 11px; } #homePage .enterprise-security .right-content .hexagon { width: 170.4px; /* 213 * 0.8 */ height: 98.4px; /* 123 * 0.8 */ background-color: #FFF4E5; border: 0.8px solid #CB8426; box-sizing: border-box; border-top: 0; border-bottom: 0; position: relative; } #homePage .enterprise-security .right-content .hexagon:before, #homePage .enterprise-security .right-content .hexagon:after { content: ""; position: absolute; width: 100%; height: 100%; background-color: inherit; border: inherit; box-sizing: inherit; } #homePage .enterprise-security .right-content .hexagon:before { transform: rotate(60deg); } #homePage .enterprise-security .right-content .hexagon:after { transform: rotate(-60deg); } #homePage .enterprise-security .right-content .hexagon.middle { width: 148.8px; /* 186 * 0.8 */ height: 85.6px; /* 107 * 0.8 */ background-color: #FFFFFF; } #homePage .enterprise-security .right-content .hexagon.small { width: 102.4px; /* 128 * 0.8 */ height: 59.2px; /* 74 * 0.8 */ background-color: #FFFFFF; } #homePage .enterprise-security .right-content .hexagon:first-child { margin-left: 89.6px; /* 112 * 0.8 */ } #homePage .enterprise-security .right-content .hexagon:nth-child(2) { margin-top: -12.8px; /* -16 * 0.8 */ } #homePage .enterprise-security .right-content .hexagon:nth-child(3) { margin-top: 25.6px; /* 32 * 0.8 */ } #homePage .enterprise-security .right-content .hexagon:nth-child(4) { margin-top: 37.6px; /* 47 * 0.8 */ } #homePage .enterprise-security .right-content .hexagon:nth-child(5) { margin-top: 48px; /* 60 * 0.8 */ } #homePage .enterprise-security .right-content .hexagon:nth-child(6) { margin-top: 48px; /* 60 * 0.8 */ } #homePage .enterprise-security .right-content .hexagon-content { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; flex-direction: column; justify-content: center; align-items: center; z-index: 1; } #homePage .enterprise-security .right-content .hexagon-content span.number { font-size: 36px; /* 45 * 0.8 */ line-height: 52.8px; /* 66 * 0.8 */ margin-bottom: 9.6px; /* 12 * 0.8 */ } #homePage .enterprise-security .right-content .hexagon-content span.text { font-size: 19.2px; /* 24 * 0.8 */ line-height: 20.8px; /* 26 * 0.8 */ text-align: center; } #homePage .enterprise-security .right-content .hexagon-content i.icon-code-service { display: inline-block; width: 64.8px; /* 81 * 0.8 */ height: 56.8px; /* 71 * 0.8 */ background: url(../images/homepage/code.svg) no-repeat; background-size: contain; } #homePage .enterprise-security .right-content .hexagon-content i.icon-customer { display: inline-block; width: 48px; /* 60 * 0.8 */ height: 36px; /* 45 * 0.8 */ background: url(../images/homepage/customer.svg) no-repeat; background-size: contain; } #homePage .enterprise-security .right-content .hexagon-content i.icon-security { display: inline-block; width: 62.4px; /* 78 * 0.8 */ height: 66.4px; /* 83 * 0.8 */ background: url(../images/homepage/security.svg) no-repeat; background-size: contain; } #homePage .ds-support .support-img { width: 600px; height: 385px; } #homePage .ds-support .support-desc { padding-left: 70px; padding-top: 30px; } #homePage .ds-support .support-desc > a { height: 50px; line-height: 50px; font-size: 20px; margin-top: 40px; } #homePage .why-ds > div > p.title { font-size: 20px; } #homePage .why-ds { grid-gap: 130px; } } @media (max-width: 1199px) { /*banner swiper*/ #homePage .bannerImg { top: 90px; gap: 10px; } #homePage .bannerImg [class^='banner-swiper-button-'] { width: 30px; height: 30px; } #homePage .bannerImg [class^='banner-swiper-button-'] img { max-width: 100%; } #homePage .bannerImg .bannerSwiper { width: 460px; } /* 2024/11/08 Frank index why dynamsoft */ #homePage .why-ds-benefits { grid-gap: 30px; } /* 2024/09/30 Frank */ /* #homePage .index-industry .industry-nav { margin-right: 40px; } #homePage .index-industry .industry-nav > p, #homePage .index-industry .industry-nav > a { height: 45px; line-height: 45px; width: 150px; } #homePage .index-industry .industry-nav > p:not(:last-child) { margin-bottom: 10px; } #homePage .index-industry .industry-image { margin-right: 40px; width: 400px; } #homePage .index-industry .industry-image img { object-fit: cover; }*/ /* 2023/05/16 Frank */ #homePage .indexPromote .promote { height: auto; padding: 20px 0; } #homePage .indexPromote .promote .desc { font-size: 20px; line-height: 40px; } #homePage .indexPromote .promote .icon { width: 100px; height: 100px; } .f24 { font-size: 18px; } #homePage .indexBanner { height: 510px; } #homePage .indexBanner .banner-container { padding-top: 155px; } #homePage .indexBanner .banner-container h1 { font-size: 24px; line-height: 50px; } #homePage .indexBanner .banner-container .indexBannerDesc { font-size: 18px; max-width: 100%; line-height: 34px; width: 385px; margin-top: 10px; } #homePage .indexBanner .banner-container .downloadBtn { margin-top: 20px; font-size: 20px; padding: 0 35px; height: 50px; line-height: 50px; } #homePage .indexBanner .bannerImgBox { width: 490px; height: 290px; } #homePage .indexBanner .bannerImgBox .switchIcons { top: 100px; right: 510px; } #homePage .basicCustomers .customer-logos { transform: scale(0.9); margin-left: -57px; } #homePage .basicCustomers i.company-logo { height: 62px; transform: scale(0.75); } #homePage .basicCustomers .desc { width: 100%; font-size: 24px; margin-bottom: 40px; } #homePage .indexProduct { margin-top: 130px; } #homePage .indexProduct .products .product-item { width: 305px; height: 240px; padding: 54px 28px 46px 40px; } #homePage .indexProduct .products .product-item p.title { font-size: 18px; line-height: 32px; margin-bottom: 10px; } #homePage .indexCustomerStory { margin-top: 110px; } #homePage .indexCustomerStory .storyList .story-swiper-con { width: calc(100% - 400px); padding: 50px 40px; padding-right: 0; padding-bottom: 0; } #homePage .indexCustomerStory .storyList .story-swiper-con .tag { height: 30px; line-height: 30px; padding: 0 30px; font-size: 16px; } #homePage .indexCustomerStory .storyList .story-swiper { height: 256px; } #homePage .indexCustomerStory .storyList .story-swiper .swiper-slide { padding: 15px 50px 0 40px; } #homePage .indexCustomerStory .storyList .story-swiper .swiper-slide i.logo { margin-bottom: 10px; } #homePage .indexCustomerStory .storyList .story-swiper .swiper-slide i.ibm-logo { width: 123px; height: 49px; background: url(../images/banner/index/IBM_logo.png); background-size: cover; margin-top: 5px; } #homePage .indexCustomerStory .storyList .story-swiper .swiper-slide i.siemens-logo { width: 200px; height: 30px; background: url(../images/company/caseStudyImage/siemens-logo.png); background-size: cover; margin-top: 30px; } #homePage .indexCustomerStory .storyList .story-swiper .swiper-slide i.grc-logo { width: 174px; height: 63px; background: url(../images/banner/index/case-study-redcross-logo.png); background-size: cover; margin-top: 8px; } #homePage .indexCustomerStory .storyList .story-swiper .swiper-slide i.avanza-logo { width: 199px; height: 60px; background: url(../images/banner/index/avanza-logo.png); background-size: cover; margin-top: 8px; } #homePage .indexCustomerStory .storyList .story-swiper .swiper-slide i.operation-smile-logo { width: 308px; height: 58px; background: url(../images/banner/index/Operation-Smile-USA_z_OS_Logo-no-tag.jpg); background-size: cover; margin-top: 10px; } #homePage .indexCustomerStory .storyList .story-swiper .swiper-slide div.desc { font-size: 14px; line-height: 24px; margin-bottom: 10px } #homePage .indexCustomerStory .storyList .story-swiper .swiper-slide a { font-size: 18px; } #homePage .indexCustomerStory .storyList .swiper-operation { margin-top: 13px; height: 24px; line-height: 24px; text-align: center; margin-right: -392px; } #homePage .indexCustomerStory .storyList .swiper-operation .swiper-pagination .swiper-pagination-bullet { width: 12px; height: 12px; margin-top: 5px; } #homePage .indexCustomerStory .storyList .swiper-operation .icon-arrow-left { left: 0; top: 0; } #homePage .indexCustomerStory .storyList .swiper-operation .icon-arrow-right { right: 32px; top: 0; } #homePage .indexCustomerStory .storyList .storyImg { width: 400px; height: 354px; padding-right: 40px } #homePage .indexUseCase .caseList .caseItem { width: 300px; } #homePage .indexUseCase .caseList .caseItem .imgCon { height: 192px; } #homePage .indexUseCase .caseList .caseItem .desc { height: 135px; padding-top: 24px; padding-left: 44px; } #homePage .indexBottom .bottom-wrap .desc { padding-top: 55px; padding-bottom: 55px; padding-left: 50px; width: 490px; } #homePage .indexBottom .bottom-wrap .btns { padding-left: 20px; } #homePage .indexBottom .bottom-wrap .btns a { margin-right: 40px; } #homePage .indexBottom .bottom-wrap .btns a:last-child { margin-right: 0; } #homePage .enterprise-security { max-width: 650px; flex-direction: column; align-items: center; } #homePage .enterprise-security .left-content { margin-bottom: 50px; padding-left: 30px; padding-right: 30px; } #homePage .ds-support { display: flex; flex-direction: column; justify-content: center; align-items: center; } #homePage .ds-support .support-img { margin-bottom: 50px; } #homePage .ds-support .support-desc { padding-left: 0; } #homePage .ds-support .support-img:before { display: none; } #homePage .index-industry .industry-nav-wrap { bottom: 80px; } #homePage .index-industry .industry-nav { display: grid; grid-template-columns: repeat(4, 1fr); grid-gap: 15px; width: 740px; right: 0; } #homePage .index-industry .industry-content { padding-top: 70px; } } @media (max-width: 991px) { #homePage .bannerImg { display: none; } #homePage .home-product-list { grid-template-columns: 1fr 1fr; } /* 2024/11/08 Frank index why dynamsoft */ /*#homePage .why-ds-benefits { grid-template-columns: repeat(2, 1fr); }*/ /* 2024/09/30 Frank */ /* #homePage .index-industry { flex-direction: column; } #homePage .index-industry > div:last-child { width: 100%; } #homePage .index-industry .industry-nav { display: flex; flex-wrap: wrap; width: 100%; margin: 0 0 20px 0; justify-content: flex-start; } #homePage .index-industry .industry-nav > p { width: 20%; min-width: 100px; } #homePage .index-industry .industry-nav > a { display: none; } #homePage .index-industry .industry-nav > p:not(:last-child) { margin: 0; } #homePage .index-industry .industry-nav > p.on::after { z-index: 1; bottom: 0; top: auto; left: 50%; transform: translate(-50%, 100%); border-color: #fe8e14 transparent transparent transparent; border-width: 5px 10px; } */ /* 2023/05/16 Frank */ #homePage .indexPromote .promote .desc { font-size: 18px; line-height: 36px; width: 60%; } #homePage .indexBanner { min-height: initial; height: auto; padding-bottom: 50px; } #homePage .indexBanner .container .banner-container { /*padding-left: 80px;*/ padding-top: 30px; } #homePage .indexBanner .bannerImgBox { display: none !important; } #homePage .basicCustomers .desc { font-size: 18px; line-height: 30px; } #homePage .basicCustomers .customerSwiper { height: auto; padding: 0; } #homePage .basicCustomers .customer-logos { display: none !important; } #homePage .basicCustomers .customer-swiper-container { margin-top: -10px; } #homePage .basicCustomers .customerSwiper .customerPrevArrow, #homePage .basicCustomers .customerSwiper .customerNextArrow { top: unset; bottom: 17px; } #homePage .indexProduct .products { grid-template-columns: 1fr 1fr; } #homePage .indexProduct .products .product-item { margin-bottom: 80px; width: 330px; height: 215px; } #homePage .indexProduct .products .product-item:last-child { margin-bottom: 0; } #homePage .indexCustomerStory .storyList { flex-direction: column; -webkit-flex-direction: column; } #homePage .indexCustomerStory .storyList .storyImg { display: none; } #homePage .indexCustomerStory .storyList .storyImgShowMobile { display: -webkit-flex !important; display: flex !important; } #homePage .indexCustomerStory .storyList .story-swiper { height: auto; } #homePage .indexCustomerStory .storyList .story-swiper .swiper-slide { padding-bottom: 20px; } #homePage .indexCustomerStory .storyList .story-swiper-con { width: 100%; padding: 50px 40px 15px 40px; } #homePage .indexCustomerStory .storyList .swiper-operation { margin-right: 0 } #homePage .indexCustomerStory .storyList .swiper-operation .icon-arrow-right { right: 0; } #homePage .indexUseCase .caseList { flex-wrap: wrap; -webkit-flex-wrap: wrap; } #homePage .indexUseCase .caseList .caseItem { width: 318px; margin-bottom: 30px; } #homePage .indexUseCase .caseList .caseItem .imgCon { height: 203px; } #homePage .indexBottom .bottom-wrap { flex-wrap: wrap; -webkit-flex-wrap: wrap; } #homePage .indexBottom .bottom-wrap .btns { padding-bottom: 50px; } #homePage .indexBottom .bottom-wrap .desc { padding-top: 50px; padding-bottom: 25px; padding-left: 0px; width: auto; } #homePage .indexBottom .bottom-wrap .desc p { font-size: 18px; line-height: 30px; } #homePage .indexBottom .bottom-wrap .btns { padding-left: 0; } #homePage .home-product-list .home-product-swiper .swiper-wrapper .swiper-slide { width: 255px; } #homePage .home-product-list .home-product-swiper .swiper-wrapper .swiper-slide a div p.desc { font-size: 14px; height: 78px; } #homePage .basicCustomers .customerSwiper > p { font-size: 18px; padding-left: 10px; } #homePage .enterprise-security .left-content .desc { font-size: 16px; } #overall-header a, #overall-header a:visited, #mdMenu li a, #cp-header .header-visitor a:link, .header-visitor a:visited, .header-visitor a:hover { color: #323234; } #homePage .home-title { line-height: 50px; } #homePage .index-industry .industry-nav-wrap { bottom: 80px; } #homePage .index-industry .industry-nav { width: 605px; padding-right: 0; } #homePage .index-industry .industry-nav > p, #homePage .index-industry .industry-nav > a { font-size: 16px; width: 140px; height: 45px; } #homePage .index-industry .industry-content .story-list { gap: 20px; top: 120px; } #homePage .index-industry .industry-content .story-list > a { width: 320px; height: 60px; } #homePage .index-industry .industry-content .story-list > a .story { padding: 0 13px; } #homePage .index-industry .industry-content .story-list > a .story img { display: inline-block; transform: scale(0.8); transform-origin: center left; } #homePage .index-industry .industry-content .story-list > a .story span { font-size: 14px; } } @media (max-width: 767px) { #homePage .indexBanner .container .banner-container { text-align: center; } /* 2024/11/08 Frank index why dynamsoft */ #homePage .why-ds-benefits { grid-template-columns: 1fr; } #homePage .indexBanner .banner-container .indexBannerDesc { margin-left: auto; margin-right: auto; line-height: 30px; } #homePage .indexBanner .banner-container .downloadBtn { margin-top: 30px; } /* 2024/09/30 Frank */ /* #homePage .index-industry .industry-content { flex-direction: column; align-items: flex-start; } #homePage .index-industry .industry-image { margin: 0; width: 100%; margin-bottom: 20px; text-align: center; } */ /* 2023/05/16 Frank */ #homePage .indexPromote .promote .desc { width: 100%; } #homePage .indexPromote .promote .icon { display: none; } html { font-size: 8px !important; } .d-btn { display: inline-block; font-family: Oswald-Regular; height: 56px; padding: 0px 2.2rem; color: #FE8E14; outline: none; font-size: 16px; border: 0; outline: none; line-height: 56px; } #homePage .indexBanner h1 { font-size: 30px; line-height: 40px; } #homePage .basicCustomers .customerSwiper .customerPrevArrow, #homePage .basicCustomers .customerSwiper .customerNextArrow { top: unset; bottom: 25px; width: 20px; height: 19px; } #homePage .indexProduct { margin-top: 100px; } #homePage .indexProduct .products { grid-template-columns: 1fr; } #homePage .indexProduct .products .product-item { margin-bottom: 80px; max-width: 330px; width: 100%; height: auto; } #homePage .indexProduct a.productBtn { max-width: 235px; height: 50px; line-height: 50px; margin: 45px auto 0; font-size: 18px; } #homePage .indexCustomerStory { margin-top: 60px; } #homePage .indexCustomerStory h2 { font-size: 28px; text-align: center; } #homePage .indexCustomerStory h2 .titleBtn { font-size: 18px; display: block; width: 210px; height: 50px; line-height: 50px; margin: 20px auto 0; } #homePage .indexUseCase h2 { font-size: 28px; text-align: center; } #homePage .indexUseCase h2 .titleBtn { font-size: 18px; display: block; width: 210px; height: 50px; line-height: 50px; margin: 20px auto 0; } #homePage .indexUseCase .caseList { justify-content: center; -webkit-justify-content: center; } #homePage .indexUseCase .caseList .caseItem { max-width: 318px; width: 100%; margin-bottom: 30px; } #homePage .indexUseCase .caseList .caseItem .imgCon { height: auto; } #homePage .indexBottom .bottom-wrap .btns a { font-size: 18px; height: 50px; line-height: 50px; margin-bottom: 10px; } #homePage .home-title { font-size: 36px; } #homePage .home-product-list { margin-top: 40px; } #homePage .enterprise-security .left-content .desc { margin-top: 20px; } #homePage .enterprise-security .left-content a { margin-top: 15px; } #homePage .enterprise-security .left-content .security-icons { margin-top: 45px; } #homePage .why-ds-benefits { max-width: 330px; } #homePage .why-ds-benefits p { font-size: 16px; } #homePage .why-ds > div > p.title { font-size: 24px; } #homePage .index-industry .industry-content { padding-top: 40px; padding-bottom: 30px; } #homePage .index-industry .industry-nav-wrap { bottom: 40px; } #homePage .index-industry .industry-nav { grid-template-columns: repeat(3, 1fr); width: auto; } #homePage .index-industry .industry-content .story-list > a.w300 { width: 230px; } } @media (max-width: 575px) { #homePage .home-product-list { grid-template-columns: 1fr; } #homePage .indexBanner .banner-container .downloadBtn { font-size: 18px; } #homePage .indexBanner .container { max-width: none; } #homePage .indexBanner .container .banner-container { padding: 20px 0 40px 0; } #homePage .indexBanner h1 { font-size: 29px; line-height: 30px; } #homePage .indexBanner { min-height: unset; height: auto; padding: 0px; } #homePage .indexBanner .indexBannerDesc { margin-bottom: 0px; font-size: 18px; line-height: 26px; width: 100%; } #homePage .indexBanner a { height: 36px; font-size: 14px; line-height: 36px; } #homePage .indexCustomerStory .storyList .story-swiper .swiper-slide i.logo { transform: scale(0.8) } #homePage .indexCustomerStory .storyList .story-swiper-con { width: 100%; padding: 40px 20px 15px 20px; } #homePage .indexCustomerStory .storyList .story-swiper .swiper-slide { padding: 15px 20px 20px 20px; } #homePage .indexBottom .btns .white-btn { display: block; text-align: center; } #homePage .indexBottom .btns .white-btn:hover { margin: unset; box-shadow: none; } #homePage .indexBottom .bottom-wrap .btns a { font-size: 18px; height: 50px; line-height: 50px; margin-bottom: 10px; } #homePage .enterprise-security .right-content { padding: 50px 20px; } #homePage .enterprise-security .right-content .hexagon-list { margin-left: 20px; } #homePage .enterprise-security .right-content .hexagon-list.scaled-element { --scale-factor: 1; transform: scale(var(--scale-factor)); } #homePage .index-industry .industry-nav { max-width: 405px; padding: 0; width: 100%; } #homePage .index-industry .industry-nav > p, #homePage .index-industry .industry-nav > a { margin: 0 auto; font-size: 16px; width: 148px; } #homePage .home-product-list .home-product-swiper-button-next img { right: -15px; } #homePage .home-product-list .home-product-swiper-button-prev img { left: -15px; } #homePage .index-industry .industry-nav > p, #homePage .index-industry .industry-nav > a { font-size: 14px; width: 125px; } #homePage .index-industry .industry-content .story-list > a { transform: scale(0.9); transform-origin: center left; } #homePage .index-industry .industry-content .story-list { gap: 10px; } } @media (max-width: 500px) { #homePage .index-industry .industry-nav { grid-template-columns: repeat(2, 1fr); max-width: 310px; } #homePage .index-industry .industry-content .story-list > a { max-width: 320px; width: 100%; } #homePage .index-industry .industry-content .industry-heading { margin-bottom: 30px; } #homePage .index-industry .industry-content { padding-top: 30px; } #homePage .index-industry .industry-content .industry-heading { font-size: 30px; line-height: 40px; } #homePage .index-industry .industry-content .story-list > a { transform: scale(0.8); transform-origin: center left; } #homePage .index-industry .industry-content .story-list { gap: 0px; } } @media (min-width: 768px) { html { font-size: 8px !important; } } @media (min-width: 992px) { html { font-size: 8px !important; } #dynamsoft-header { position: fixed; } #dynamsoft-header #mdHeader { border-bottom: 0; } #menuMask { top: 70px; } } @media (min-width: 1200px) { html { font-size: 8px !important; } } @media (min-width: 1680px) { html { font-size: 10px !important; } #homePage .container { max-width: 1660px; } #menuMask { top: 70px; } }