/* Responsive adjustments for the 5.7 marketing pages. Desktop rules stay in style.css. */
@keyframes marketing-page-fade-out { to { opacity: 0; } }
@keyframes marketing-page-fade-in { from { opacity: 0; } }
::view-transition-old(root) { animation: 150ms ease-in both marketing-page-fade-out; }
::view-transition-new(root) { animation: 190ms ease-out both marketing-page-fade-in; }
@media (prefers-reduced-motion: reduce) {
    ::view-transition-old(root), ::view-transition-new(root) { animation-duration: 0.01ms; }
}
#mobileMenuToggle, .mobile-submenu-toggle { display: none; }
@media (min-width: 901px) {
    #mainHeader nav.main a { font-size: clamp(14px, 1.24vw, 20px); }
}
.mobile-pricing { display: none; }
.mobile-plan-comparison { display: none; }
.legacy-product-copy { display: none; }
.pricing-company-logos-mobile { display: none; }
.footer-mobile-break { display: none; }
.footer-content { text-align: center; }
.mobile-customer-banner { display: none; }
.mobile-news-banner { display: none; }
#t1.title_home .home-brand-mark img { opacity: 0; transition: opacity 250ms ease; }
#t1.title_home .home-brand-mark img.home-brand-loaded { opacity: 1; }
@media (prefers-reduced-motion: reduce) {
    #t1.title_home .home-brand-mark img { transition: none; }
}
.technology-banner-title { display: none; }
.leadership-page img.art-article { height: auto; max-width: calc(100% - 1em - 4px); }
.download-store-link { display: inline-block; width: 160px; vertical-align: middle; }
.art-PostContent .download-store-badge { display: block; height: auto; max-width: none; }
.download-store-badge-apple { width: 160px; }
/* Google's source badge includes transparent margins; match its visible size to Apple's. */
.download-store-badge-google { width: 183px; margin-left: -12px; }

@media (min-width: 640px) and (max-width: 1024px) {
    .construction-case-grid, .case-study-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}

@media (max-width: 1024px) {
    html, body { max-width: 100%; overflow-x: clip; }
    #container { min-width: 0 !important; max-width: 100%; }
    #container.home-container { height: auto !important; min-height: 100%; overflow: visible !important; }
    .art-Sheet, .art-PostContent, .art-Footer { box-sizing: border-box; max-width: 100%; width: 100%; }
    .art-PostContent { padding: 0 14px; }
    .art-PostContent img, .art-PostContent video, .art-PostContent iframe { max-width: 100%; }
    .construction-case-grid, .case-study-grid { grid-template-columns: 1fr; }
    .construction-customers { padding: 8px 4px 24px; }
    .pricing-company-logos { display: block; width: 100%; max-width: 920px; height: auto !important; margin: 8px 0 16px; }
    .art-Footer { padding: 8px 14px; }
    .art-Footer .art-Footer-background { width: 100%; background-size: cover; }
    .art-Footer .art-Footer-inner { line-height: 1.5; }
    .title_1, .title_1_clear, .title_2, .title_3, .title_4 { min-width: 0; max-width: 100%; overflow: hidden; }
    .info-wrapper, .info-wrapper-content { max-width: 100%; }
    .marketing-contact-form { max-width: 100%; }
    .marketing-contact-form table { width: 100%; }
    .marketing-contact-form input[type='text'], .marketing-contact-form select,
    .marketing-contact-form textarea { max-width: 100%; }
    #consentprompt, #consentmoreinfo { box-sizing: border-box; position: fixed; left: 50% !important; top: 50% !important; transform: translate(-50%, -50%); width: min(92vw, 520px) !important; height: auto !important; max-height: calc(100vh - 24px); max-height: calc(100dvh - 24px); margin: 0 !important; overflow-x: hidden; overflow-y: auto; }
    #consentprompt > center, #consentmoreinfo > center { display: block; text-align: left; }
    #consentprompt > center > table, #consentmoreinfo > center > table { width: 100%; }
    #consentprompt > center > table td, #consentmoreinfo > center > table td { padding: 9px 12px; }
    #consentprompt > center > img, #consentmoreinfo > center > img { display: block; float: none !important; width: 58px; height: 58px; margin: 14px 16px 0; padding: 0 !important; object-fit: contain; }
    #consentprompt > center > div, #consentmoreinfo > center > div { box-sizing: border-box; width: 100% !important; padding: 12px 16px 16px; font-size: 14px; line-height: 1.45; overflow-wrap: anywhere; }
    #consentprompt > center > div br + br { display: none; }
    #consentprompt > center > div > span, #consentmoreinfo > center > div > span { position: static !important; display: flex !important; justify-content: center; flex-wrap: wrap; gap: 8px; margin: 18px 0 0; }
    #consentprompt .art-button-wrapper, #consentmoreinfo .art-button-wrapper { height: 40px; vertical-align: middle; }
    #consentprompt #button_yes, #consentmoreinfo #button_yes { box-sizing: border-box; display: block; height: 40px; min-height: 40px; line-height: 40px !important; padding: 0 18px !important; text-align: center; }
    #consentmoreinfo form table { float: none !important; width: 100%; }
    #consentmoreinfo form table tbody, #consentmoreinfo form tr, #consentmoreinfo form td { display: block; box-sizing: border-box; width: 100%; }
    #consentmoreinfo form tr { margin-bottom: 10px; }
    #consentmoreinfo form td { padding: 3px 2px; vertical-align: top; }
    #consentmoreinfo form td:empty { display: none; }
    #consentmoreinfo #exp_required, #consentmoreinfo #exp_functional { float: none !important; max-width: 100%; margin-top: 10px; }
}

/* Keep the video and separate logo together across phone and tablet rotation. */
@media (max-width: 1024px) {
    #t1.title_home { min-height: 720px; }
    #t1.title_home #abukaititleimage { display: block; height: 720px !important; object-fit: cover; object-position: left center; }
    #t1.title_home.home-video-waiting #abukaititleimage,
    #t1.title_home.home-media-ready #abukaititleimage { visibility: hidden; }
    #t1.title_home.home-video-waiting #abukaisignupbox { opacity: 0; pointer-events: none; }
    #t1.title_home.home-media-ready #abukaisignupbox { opacity: 1; transition: opacity 200ms ease 250ms; }
    #t1.title_home.home-media-fallback .home-brand-mark { display: block; }
    #t1.title_home #main_screen { top: 0 !important; height: 720px; overflow: hidden; }
    #t1.title_home #startVideo { height: 720px !important; object-fit: cover; }
    /* The PNG keeps the original ui2.jpg lettering and tagline with its gray matte removed. */
    #t1.title_home .home-brand-mark { display: block; position: absolute; z-index: 4; top: 0; left: -6px; width: 288px; max-width: calc(100vw - 16px); height: auto; padding-bottom: 8px; overflow: visible; text-decoration: none; }
    #t1.title_home .home-brand-mark img { display: block; width: 100%; height: auto; }
    #t1.title_home #abukaisignupbox { box-sizing: border-box; left: 0 !important; top: 105px !important; width: 100% !important; padding: 0 12px; }
    #t1.title_home #log-on { box-sizing: border-box; left: auto; top: auto; width: min(100%, 650px); height: auto; min-height: 450px; margin: 0 auto; padding: 12px 12px 24px; visibility: visible; }
    #t1.title_home #log-on .info-wrapper-content { position: relative; top: auto; left: auto; }
    #t1.title_home #log-on .info-wrapper-content img { max-width: 100%; height: auto; }
    #t1.title_home #log-on #email { box-sizing: border-box; max-width: 100%; }
    #t1.title_home #log-on .home-submit-row .art-button-wrapper { height: 48px; overflow: visible; }
    #t1.title_home #log-on .home-submit-row .art-button-wrapper > .l,
    #t1.title_home #log-on .home-submit-row .art-button-wrapper > .r { display: none; }
    #t1.title_home #log-on .home-submit-row input[type='submit'] { box-sizing: border-box; display: inline-block; height: 48px; min-height: 48px; padding: 8px 20px !important; border: 1px solid #a96716; border-radius: 4px; background: #fbaf5d !important; color: #111 !important; font: bold 16px/30px Arial, sans-serif; text-align: center; cursor: pointer; }
    /* Legacy initImage() can pin the footer to the viewport; keep it after the hero. */
    #container.home-container #copyright_abukai { position: relative !important; top: 0 !important; bottom: auto !important; }
}

/* Large iPads can exceed 1024 CSS pixels in landscape. */
@media (min-width: 1025px) {
    html.tablet-navigation #container.home-container { height: auto !important; min-height: 100%; overflow: visible !important; }
    html.tablet-navigation #t1.title_home { min-height: 720px; }
    html.tablet-navigation #t1.title_home #abukaititleimage { display: block; height: 720px !important; object-fit: cover; object-position: left center; }
    html.tablet-navigation #t1.title_home.home-video-waiting #abukaititleimage,
    html.tablet-navigation #t1.title_home.home-media-ready #abukaititleimage { visibility: hidden; }
    html.tablet-navigation #t1.title_home.home-video-waiting #abukaisignupbox { opacity: 0; pointer-events: none; }
    html.tablet-navigation #t1.title_home.home-media-ready #abukaisignupbox { opacity: 1; transition: opacity 200ms ease 250ms; }
    html.tablet-navigation #t1.title_home.home-media-fallback .home-brand-mark { display: block; }
    html.tablet-navigation #t1.title_home #main_screen { top: 0 !important; height: 720px; overflow: hidden; }
    html.tablet-navigation #t1.title_home #startVideo { height: 720px !important; object-fit: cover; }
    html.tablet-navigation #t1.title_home .home-brand-mark { display: block; position: absolute; z-index: 4; top: 0; left: -6px; width: 288px; max-width: calc(100vw - 16px); height: auto; padding-bottom: 8px; overflow: visible; text-decoration: none; }
    html.tablet-navigation #t1.title_home .home-brand-mark img { display: block; width: 100%; height: auto; }
    html.tablet-navigation #t1.title_home #abukaisignupbox { box-sizing: border-box; left: 0 !important; top: 105px !important; width: 100% !important; padding: 0 12px; }
    html.tablet-navigation #t1.title_home #log-on { box-sizing: border-box; left: auto; top: auto; width: min(100%, 650px); height: auto; min-height: 450px; margin: 0 auto; padding: 12px 12px 24px; visibility: visible; }
    html.tablet-navigation #t1.title_home #log-on .info-wrapper-content { position: relative; top: auto; left: auto; }
    html.tablet-navigation #t1.title_home #log-on .info-wrapper-content img { max-width: 100%; height: auto; }
    html.tablet-navigation #t1.title_home #log-on #email { box-sizing: border-box; max-width: 100%; }
    html.tablet-navigation #t1.title_home #log-on .home-submit-row .art-button-wrapper { height: 48px; overflow: visible; }
    html.tablet-navigation #t1.title_home #log-on .home-submit-row .art-button-wrapper > .l,
    html.tablet-navigation #t1.title_home #log-on .home-submit-row .art-button-wrapper > .r { display: none; }
    html.tablet-navigation #t1.title_home #log-on .home-submit-row input[type='submit'] { box-sizing: border-box; display: inline-block; height: 48px; min-height: 48px; padding: 8px 20px !important; border: 1px solid #a96716; border-radius: 4px; background: #fbaf5d !important; color: #111 !important; font: bold 16px/30px Arial, sans-serif; text-align: center; cursor: pointer; }
    html.tablet-navigation #container.home-container #copyright_abukai { position: relative !important; top: 0 !important; bottom: auto !important; }
}

/* With the band, the sign-up panel reaches about 810px; leave room below it. */
@media (min-width: 950px) and (min-height: 850px) and (orientation: landscape) {
    html.tablet-navigation #t1.title_home { min-height: 910px; }
    html.tablet-navigation #t1.title_home::before { content: ''; position: absolute; z-index: 1; inset: 0 0 auto; height: 110px; background: #d1d1d1; }
    html.tablet-navigation #t1.title_home #abukaititleimage { height: 910px !important; }
    html.tablet-navigation #t1.title_home #main_screen { z-index: 2; top: 110px !important; height: 800px !important; overflow: visible; }
    html.tablet-navigation #t1.title_home #startVideo { height: 800px !important; }
    html.tablet-navigation #t1.title_home .home-brand-mark { top: -110px; }
    html.tablet-navigation #t1.title_home #abukaisignupbox { top: 215px !important; }
    html.tablet-navigation #t1.title_home.home-media-fallback #abukaisignupbox { opacity: 1; pointer-events: auto; }
    html.tablet-navigation #t1.title_home.home-media-fallback #main_screen { background: #292929 url('../abukai/ui2_video.jpg') center / cover no-repeat; }
    html.tablet-navigation #t1.title_home.home-media-fallback .home-brand-mark { display: block; }
}

@media (min-width: 950px) and (max-height: 650px) and (orientation: landscape) {
    html.tablet-navigation #t1.title_home #log-on { transform: scale(.88); transform-origin: top center; }
}

@media (max-width: 900px) {
    .info-wrapper:has(.marketing-contact-form) .info-wrapper-content { display: flex; flex-direction: column; min-height: calc(100vh - 112px); min-height: calc(100dvh - 112px); }
    .info-wrapper:has(.marketing-contact-form) .art-contentLayout { flex: 1 0 auto; }
    .abukai-header-image { position: relative; height: 70px; overflow: hidden; }
    .abukai-header-image > img { display: block; width: auto !important; max-width: none !important; height: 70px !important; }
    .abukai-header-image .abukaiclick { top: 0; left: 0; width: 190px; height: 70px; }
    .art-PostContent-Margin { box-sizing: border-box; height: auto; min-height: 42px; }
    #breadcrum_nav { box-sizing: border-box; height: auto; margin: 0; padding: 8px 12px; top: 0; }
    #breadcrum_nav h2 { font-size: 16px; line-height: 1.25; margin: 0; }
    #breadcrum_nav .breadcrumb-current { white-space: nowrap; }
    #copyright_abukai { position: relative !important; top: auto !important; bottom: auto !important; }
    .title_2 .company_menu { box-sizing: border-box; position: relative; left: 0; top: 0; width: min(100%, 230px); height: auto; margin: 0; padding: 12px; font-size: 16px; }
    .title_2.company-landing { height: auto; min-height: 300px; background-size: auto 450px !important; background-position: center top !important; background-repeat: no-repeat !important; background-color: #1b1b1b !important; }
    .company_sales_rep_bio { box-sizing: border-box; left: auto; width: min(100%, 650px); height: auto; min-height: 200px; margin: 0 auto; padding: 14px; overflow-wrap: anywhere; }
    #container:has(.company_sales_rep_bio) .info-wrapper-content { display: flex; flex-direction: column; min-height: calc(100dvh - 112px); }
    #container:has(.company_sales_rep_bio) .title_animation { margin-top: 0; margin-bottom: 0; }
    #container:has(.company_sales_rep_bio) #copyright_abukai { margin-top: auto; }
    .title_animation { height: 270px; }
    .title_animation .title_2 { height: 270px; }
    .technology-banner, .technology-banner .technology-banner-image { height: 320px !important; }
    .technology-banner .technology-banner-image { background-size: auto 270px !important; background-position: 34% top !important; background-repeat: no-repeat !important; background-color: #f2dcb7 !important; }
    .technology-banner .videobox_img_button2 { left: 65%; }
    .technology-banner-title { display: block; position: absolute; right: 18px; bottom: 10px; color: #111; font: 26px Arial, sans-serif; }
    .title_animation .info-wrapper2 { box-sizing: border-box; position: absolute; left: 12px !important; top: 90px !important; width: calc(100% - 24px) !important; height: auto !important; margin: 0; }
    .title_animation .info-wrapper-content { position: relative; left: auto; top: auto; box-sizing: border-box; width: 100%; }
    .title_animation .info-wrapper-content div[style*='width:536px'] { box-sizing: border-box; width: 100% !important; height: auto !important; padding: 6px 10px !important; font-size: 15px !important; line-height: 1.35; }
    .title_animation .info-wrapper-content div[style*='font-size:25px'] { font-size: 19px !important; }
    /* The legacy product artwork already contains this copy. Keep its text available to screen readers. */
    .legacy-product-carousel .legacy-product-copy { display: block !important; position: absolute !important; top: 0 !important; right: auto !important; bottom: auto !important; left: 0 !important; width: 1px !important; height: 1px !important; padding: 0 !important; overflow: hidden !important; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; }
    .title_animation .videobox_img_left { left: 0; }
    .expense-feature-carousel, .expense-feature-carousel .title_2 { height: 350px; }
    .expense-product-hero, .expense-product-hero .title_2 { height: var(--expense-mobile-height, 440px) !important; }
    .expense-product-hero .title_2 { background-image: none !important; background-color: #fff; }
    .expense-product-hero .title_2 > div:first-child,
    .expense-product-hero .title_2 video { height: 260px !important; }
    .expense-product-hero .legacy-product-video-frame video { display: block; width: 100% !important; object-fit: cover; object-position: center; }
    .expense-product-hero .marketing-video-bottom-fade { display: none; }
    .expense-product-hero .title_2 .info-wrapper2 { top: 220px !important; }
    .expense-product-hero .title_2.legacy-product-video-slide > .legacy-product-video-frame { height: min(260px, max(146px, 31.5vw)) !important; }
    .expense-product-hero .title_2.legacy-product-video-slide .info-wrapper2 { top: calc(min(260px, max(146px, 31.5vw)) - 30px) !important; }
    .expense-product-hero .c-next, .expense-product-hero .c-prev { top: 10px; z-index: 9; width: 44px; height: 44px; }
    .expense-feature-carousel .videobox_img_button_left { top: 65px; }
    #tit_animiation_customer.mobile-customer-carousel { --mobile-customer-size: min(calc(100vw - 32px), 620px); }
    #tit_animiation_customer.mobile-customer-carousel,
    #tit_animiation_customer.mobile-customer-carousel .mobile-customer-slide { height: calc(var(--mobile-customer-size) + 16px) !important; }
    #tit_animiation_customer .mobile-customer-slide { background: none !important; }
    .mobile-customer-banner { box-sizing: border-box; position: relative; display: block; width: var(--mobile-customer-size); height: var(--mobile-customer-size); margin: 8px auto; overflow: hidden; background: #555; border-radius: 8px; box-shadow: 0 2px 8px #0003; }
    #tit_animiation_customer.mobile-customer-carousel .transport-video-slide { height: calc(var(--mobile-customer-size) + 16px) !important; background: none !important; }
    .transport-video-slide .transport-video-frame { position: relative; width: var(--mobile-customer-size); height: var(--mobile-customer-size); margin: 8px auto; overflow: hidden; border-radius: 8px; box-shadow: 0 2px 8px #0003; }
    .transport-video-slide::after { display: none; }
    .accounting-today-banner::after { display: none; }
    .transport-video-slide video { width: 100%; height: 100%; object-fit: cover; }
    .transport-video-slide .transport-video-caption { right: 0; bottom: 0; left: 0; max-width: none; padding: 45px 18px 18px; background: linear-gradient(transparent, #000C 32%, #000E); color: #fff; font-size: 17px; }
    .customer-productivity-slide .transport-video-caption { right: 0; left: 0; }
    .customer-productivity-slide > a[onclick*='playVideo'] { inset: 8px auto auto 50%; width: var(--mobile-customer-size); height: var(--mobile-customer-size); transform: translateX(-50%); }
    .customer-productivity-slide .videobox_img_button_left { left: 50%; }
    .transport-video-slide .transport-video-caption strong { color: #fbaf5d; font-size: 21px; }
    #tit_animiation_customer .transport-video-slide .c-prev, #tit_animiation_customer .transport-video-slide .c-next { top: 16px; z-index: 8; }
    .mobile-customer-photo { position: absolute; inset: 0; width: 100%; height: 100%; background-size: auto 100%; background-repeat: no-repeat; }
    .mobile-customer-video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
    .mobile-customer-banner figcaption { box-sizing: border-box; position: absolute; z-index: 2; bottom: 0; left: 0; width: 100%; max-height: 82%; padding: 44px 26px 24px; overflow-y: auto; background: linear-gradient(transparent, #000b 26%, #000d); color: #fff; }
    .mobile-customer-banner blockquote { margin: 0 0 10px; padding: 0; border: 0; background: none; color: #fff; font: 22px/1.3 Arial, sans-serif; }
    .mobile-customer-banner cite { display: block; color: #eee; font: 16px/1.3 Arial, sans-serif; }
    .mobile-customer-banner .mobile-customer-company { display: block; margin-top: 2px; white-space: nowrap; font-size: clamp(12px, 3.6vw, 16px); }
    .mobile-customer-banner .mobile-customer-country { display: block; }
    .customer-quote-video-slide.mobile-customer-slide .transport-video-frame { display: none; }
    .customer-quote-video-slide .mobile-customer-banner figcaption { right: 12px; bottom: 12px; left: 12px; width: auto; max-height: 75%; padding: 16px 18px; border-radius: 4px; background: #fffE; box-shadow: 0 3px 12px #0004; color: #111; }
    .customer-quote-video-slide .mobile-customer-banner blockquote { color: #111; font-size: clamp(14px, 3.8vw, 18px); }
    .customer-quote-video-slide .mobile-customer-banner cite { color: #333; }
    #tit_animiation_customer .mobile-customer-slide .c-prev,
    #tit_animiation_customer .mobile-customer-slide .c-next { top: 16px; z-index: 8; }
    #tit_animiation_customer .mobile-customer-slide > a[onclick*='playVideo'] { position: absolute; z-index: 4; top: 8px; left: 50%; width: var(--mobile-customer-size); height: var(--mobile-customer-size); transform: translateX(-50%); }
    #tit_animiation_customer .mobile-customer-slide > a[onclick*='playVideo'] > div { display: none; }
    #tit_animiation_customer .mobile-customer-slide > a[onclick*='playVideo']::after { content: ''; position: absolute; top: 42%; left: 50%; transform: translate(-50%, -50%); width: 100px; height: 100px; background: url('videoplayer/bigplay.png') 0 0 no-repeat; filter: drop-shadow(0 2px 8px #0008); }
    #tit_animiation_customer .mobile-customer-slide > a[onclick*='playVideo']:hover::after,
    #tit_animiation_customer .mobile-customer-slide > a[onclick*='playVideo']:focus-visible::after { background-position: 0 -100px; }
    #tit_animiation_news.news-main-carousel { --mobile-news-size: min(calc(100vw - 32px), 620px); height: calc(var(--mobile-news-size) + 16px) !important; }
    #tit_animiation_news.news-main-carousel > .title_2,
    #tit_animiation_news.news-main-carousel > .title_3 { height: calc(var(--mobile-news-size) + 16px) !important; }
    #tit_animiation_news.news-main-carousel > .mobile-news-slide { background: none !important; }
    .news-main-carousel .mobile-news-banner { box-sizing: border-box; position: relative; display: block; width: var(--mobile-news-size); height: var(--mobile-news-size); margin: 8px auto; overflow: hidden; border-radius: 8px; background: #252525; box-shadow: 0 2px 8px #0003; }
    .mobile-news-art { position: absolute; inset: -4px; background-size: auto 100%; background-position: center; background-repeat: no-repeat; filter: blur(3px) brightness(.55); }
    /* The desktop Business Travel News image has the team-member quote baked in;
       its centered crop leaves half-words at both edges on a phone. */
    #tit_animiation_news #t6 .mobile-news-art { background-position: left center; }
    .mobile-news-banner figcaption { box-sizing: border-box; position: absolute; right: 0; bottom: 0; left: 0; max-height: 100%; padding: 48px 32px 28px; overflow-y: auto; background: linear-gradient(transparent, #0009 30%, #000e); color: #fff; }
    .mobile-news-publication { display: block; margin-bottom: 12px; color: #fbaf5d; font: bold 24px/1.2 Arial, sans-serif; }
    .mobile-news-banner blockquote { margin: 0 0 12px; padding: 0; border: 0; background: none; color: #fff; font: 20px/1.3 Arial, sans-serif; }
    .mobile-news-banner cite { display: block; color: #eee; font: normal 15px/1.3 Arial, sans-serif; }
    .news-main-carousel .news-video-slide { background: none; }
    .news-main-carousel .news-video-slide video { width: var(--mobile-news-size); height: var(--mobile-news-size); margin: 8px auto; border-radius: 8px; object-fit: cover; box-shadow: 0 2px 8px #0003; }
    .news-main-carousel .news-video-caption { right: auto; bottom: 8px; left: 50%; transform: translateX(-50%); width: var(--mobile-news-size); max-width: none; padding: 44px 20px 18px; border-radius: 0 0 8px 8px; background: linear-gradient(transparent, #000c 35%, #000e); color: #fff; font-size: 18px; }
    .news-main-carousel .news-video-caption strong { color: #fbaf5d; font-size: 22px; }
    .news-main-carousel .c-prev, .news-main-carousel .c-next { top: 16px; z-index: 8; }
    .news-main-carousel .mobile-news-slide > a[onclick*='playVideo'] { position: absolute; z-index: 4; top: 8px; left: 50%; width: var(--mobile-news-size); height: var(--mobile-news-size); transform: translateX(-50%); }
    .news-main-carousel .mobile-news-slide > a[onclick*='playVideo'] > div { display: none; }
    .news-main-carousel .mobile-news-slide > a[onclick*='playVideo']::after { content: ''; position: absolute; top: 42%; left: 50%; transform: translate(-50%, -50%); width: 100px; height: 100px; background: url('videoplayer/bigplay.png') 0 0 no-repeat; filter: drop-shadow(0 2px 8px #0008); }
    #sku_selector { display: none; }
    .mobile-pricing { display: grid; grid-template-columns: 1fr; gap: 8px; margin: 12px 0 20px; }
    .mobile-pricing > a, .mobile-pricing > section { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; column-gap: 10px; background: #fff; border: 1px solid #d6d6d6; border-left: 5px solid #f9a331; border-radius: 6px; box-shadow: 0 2px 6px #0001; padding: 9px 10px; color: #111; text-decoration: none; }
    .mobile-pricing > a { cursor: pointer; }
    .mobile-pricing > a:hover, .mobile-pricing > a:focus-visible { border-color: #bd771d; background: #fff8ee; box-shadow: 0 3px 10px #0002; }
    .mobile-pricing h5 { grid-column: 1; color: #111; font-size: 16px; margin: 0 0 3px; }
    .mobile-pricing p { grid-column: 1; margin: 2px 0; font-size: 12px; line-height: 1.3; }
    .mobile-pricing > a > .art-button, .mobile-pricing section > .art-button { grid-column: 2; grid-row: 1 / span 3; align-self: center; }
    .mobile-pricing .art-button { display: inline-block; min-height: 38px; padding: 7px 10px; text-align: center; }
    .mobile-pricing > a > .art-button { box-sizing: border-box; display: flex; align-items: center; justify-content: center; border: 1px solid #e68d00; border-radius: 2px; background: #ff9d00; color: #fff; font: 14px/1.2 Arial, sans-serif; white-space: nowrap; }
    .mobile-pricing > a:hover > .art-button, .mobile-pricing > a:focus-visible > .art-button { background: #fbaf5d; color: #111; }
    .mobile-plan-comparison { display: block; margin: 20px 0 24px; }
    .mobile-plan-comparison h5 { margin: 0 0 5px; color: #111; font-size: 20px; }
    .mobile-plan-comparison p { margin: 5px 0 10px; }
    .mobile-plan-comparison .comparison-scroll { width: 100%; }
    .mobile-plan-comparison table { width: 100%; border-collapse: collapse; table-layout: fixed; background: #fff; }
    .mobile-plan-comparison th, .mobile-plan-comparison td { box-sizing: border-box; padding: 6px 3px; border: 1px solid #ddd; overflow-wrap: anywhere; }
    .mobile-plan-comparison thead th { background: #777; color: #fff; font-size: 11px; text-align: center; }
    .mobile-plan-comparison thead th:first-child { text-align: left; }
    .mobile-plan-comparison thead th:first-child { background: #777; }
    .mobile-plan-comparison th:first-child { width: 36%; }
    .mobile-plan-comparison .plan-header { position: relative; height: 72px; padding: 15px 2px 3px; vertical-align: top; background: #fff; color: #111; }
    /* The source artwork puts its words immediately inside each orange cap.
       Draw the cap in CSS so no part of those words can leak into narrow cells. */
    .mobile-plan-comparison .plan-header::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 10px; border-radius: 9px 9px 0 0; background: linear-gradient(#ffbb34, #ffa500); box-shadow: inset 0 2px #898989; }
    .mobile-plan-comparison .plan-header span, .mobile-plan-comparison .plan-header small { display: block; position: relative; line-height: 1.15; overflow-wrap: normal; word-break: normal; }
    .mobile-plan-comparison .plan-header span { font-weight: bold; }
    .mobile-plan-comparison .plan-header small { margin-top: 4px; font-size: 9px; }
    .mobile-plan-comparison tbody th { font-weight: normal; text-align: left; }
    .mobile-plan-comparison td { color: #e99a00; font-weight: bold; text-align: center; }
    .mobile-plan-comparison .comparison-group th { background: #eee; color: #111; font-weight: bold; }
    .mobile-plan-comparison .comparison-note { font-size: 13px; line-height: 1.4; }
    .pricing-free-note { display: none; }
    #mainHeader { left: 0; right: 0; width: 100%; z-index: 100; }
    #mobileMenuToggle {
        display: block; position: absolute; right: 12px; top: 8px; z-index: 102;
        display: flex; align-items: center; justify-content: center; width: 42px; height: 42px;
        padding: 8px; border: 1px solid #555; border-radius: 4px; background: #777; color: #fff;
    }
    #mobileMenuToggle .menu-icon { display: flex; flex-direction: column; justify-content: space-between; width: 22px; height: 18px; }
    #mobileMenuToggle .menu-icon span { display: block; height: 3px; border-radius: 2px; background: currentColor; }
    #mainHeader.mobile-menu-open #mobileMenuToggle { background: #fbaf5d; color: #111; }
    #mainHeader nav.main { display: none; position: absolute; right: 8px; top: 55px; width: min(340px, calc(100vw - 16px)); max-height: calc(100vh - 63px); overflow-y: auto; margin: 0; background: #777; box-shadow: 0 5px 16px #0005; text-align: left; }
    #mainHeader.mobile-menu-open nav.main { display: block; }
    #mainHeader nav.main > li { box-sizing: border-box; float: none; top: 0; width: 100%; border-bottom: 1px solid #999; }
    #mainHeader nav.main li a.link-lvl-1 { box-sizing: border-box; width: 100%; padding: 12px 44px 12px 14px; color: #fff; font-size: 16px !important; }
    #mainHeader nav.main li.nav-lvl-1-submenu nav { display: none; position: static; top: auto; min-width: 0 !important; width: 100%; }
    #mainHeader nav.main .nav-lvl-1-submenu nav ul { display: block !important; height: auto; margin: 0; padding: 0; list-style: none; }
    #mainHeader nav.main .nav-lvl-1-submenu nav li { width: 100%; margin: 0; }
    #mainHeader nav.main .nav-lvl-1-submenu nav a { background: #696969; box-sizing: border-box; color: #fff; font-size: 14px !important; padding: 10px 18px; white-space: normal; }
    #mainHeader nav.main .nav-lvl-1-submenu nav a:hover,
    #mainHeader nav.main .nav-lvl-1-submenu nav a:focus { background: #fbaf5d; color: #111; }
    #mainHeader nav.main li.mobile-submenu-open nav { display: block; }
    #mainHeader .mobile-submenu-toggle { display: block; position: absolute; right: 0; top: 0; z-index: 2; width: 44px; height: 42px; border: 0; background: transparent; color: #fff; font: 22px Arial, sans-serif; }
    #promptimg { box-sizing: border-box; top: 0 !important; height: 100vh !important; height: 100dvh !important; overflow-x: hidden; overflow-y: auto; padding: 12px; }
    #promptimg .videocenter { position: relative; width: 100%; height: auto; min-height: 100%; display: flex !important; align-items: center; justify-content: center; }
    #promptimg .videobox { position: relative; left: auto; box-sizing: border-box; width: min(100%, 907px); height: auto; text-align: center; }
    #promptimg .videoborder_large { box-sizing: border-box; width: 100%; height: auto; aspect-ratio: 907 / 511; }
    #promptimg .videoshow { box-sizing: border-box; inset: 5px; width: auto; height: auto; }
    #promptimg .videoshow iframe { display: block; width: 100%; height: 100%; }
    #promptimg .videobox > br { display: none; }
    #promptimg .videobox > center { display: block; margin-top: 12px; }
    #promptimg2 { box-sizing: border-box; top: 0 !important; height: 100vh !important; height: 100dvh !important; overflow-y: auto; overflow-x: hidden; padding: 8px; }
    #promptimg2 .videocenter { position: static; width: 100%; height: auto; }
    #promptimg2 .buyborder { box-sizing: border-box; position: relative; top: auto; left: auto; margin: 0 auto !important; padding: 5px; width: min(100%, 700px); height: auto !important; }
    #promptimg2 .buyshow { box-sizing: border-box; position: relative; top: auto; left: auto; margin: 0; padding: 12px; width: 100%; height: auto !important; overflow: visible !important; }
    #promptimg2 .buyshow form { max-width: 100%; }
    #promptimg2 .buyshow form > table { box-sizing: border-box; max-width: 100%; width: 100% !important; }
    #promptimg2 .buyshow input[type='text'], #promptimg2 .buyshow select { box-sizing: border-box; max-width: 100%; font-size: 16px; }
    #promptimg2 .marketing-template-picker { max-width: 100%; }
    #promptimg2 .marketing-template-menu { max-width: calc(100vw - 56px); }
}

/* A tablet can report more than 900 CSS pixels, especially in landscape. */
@media (min-width: 901px) {
    html.tablet-navigation #mainHeader { left: 0; right: 0; width: 100%; z-index: 100; }
    html.tablet-navigation #mobileMenuToggle { display: flex; position: absolute; right: 12px; top: 8px; z-index: 102; align-items: center; justify-content: center; width: 42px; height: 42px; padding: 8px; border: 1px solid #555; border-radius: 4px; background: #777; color: #fff; }
    html.tablet-navigation #mobileMenuToggle .menu-icon { display: flex; flex-direction: column; justify-content: space-between; width: 22px; height: 18px; }
    html.tablet-navigation #mobileMenuToggle .menu-icon span { display: block; height: 3px; border-radius: 2px; background: currentColor; }
    html.tablet-navigation #mainHeader.mobile-menu-open #mobileMenuToggle { background: #fbaf5d; color: #111; }
    html.tablet-navigation #mainHeader nav.main { display: none; position: absolute; right: 8px; top: 55px; width: min(340px, calc(100vw - 16px)); max-height: calc(100vh - 63px); overflow-y: auto; margin: 0; background: #777; box-shadow: 0 5px 16px #0005; text-align: left; }
    html.tablet-navigation #mainHeader.mobile-menu-open nav.main { display: block; }
    html.tablet-navigation #mainHeader nav.main > li { box-sizing: border-box; float: none; top: 0; width: 100%; border-bottom: 1px solid #999; }
    html.tablet-navigation #mainHeader nav.main li a.link-lvl-1 { box-sizing: border-box; width: 100%; padding: 12px 44px 12px 14px; color: #fff; font-size: 16px !important; }
    html.tablet-navigation #mainHeader nav.main li.nav-lvl-1-submenu nav { display: none; position: static; top: auto; min-width: 0 !important; width: 100%; }
    html.tablet-navigation #mainHeader nav.main .nav-lvl-1-submenu nav ul { display: block !important; height: auto; margin: 0; padding: 0; list-style: none; }
    html.tablet-navigation #mainHeader nav.main .nav-lvl-1-submenu nav li { width: 100%; margin: 0; }
    html.tablet-navigation #mainHeader nav.main .nav-lvl-1-submenu nav a { background: #696969; box-sizing: border-box; color: #fff; font-size: 14px !important; padding: 10px 18px; white-space: normal; }
    html.tablet-navigation #mainHeader nav.main .nav-lvl-1-submenu nav a:hover,
    html.tablet-navigation #mainHeader nav.main .nav-lvl-1-submenu nav a:focus { background: #fbaf5d; color: #111; }
    html.tablet-navigation #mainHeader nav.main li.mobile-submenu-open nav { display: block; }
    html.tablet-navigation #mainHeader .mobile-submenu-toggle { display: block; position: absolute; right: 0; top: 0; z-index: 2; width: 44px; height: 42px; border: 0; background: transparent; color: #fff; font: 22px Arial, sans-serif; }
}

@media (max-width: 700px) {
    .legacy-product-carousel, .legacy-product-carousel .title_2 { height: min(200px, 50vw) !important; }
    .legacy-product-carousel .title_2 { background-size: auto min(200px, 50vw) !important; background-position: calc(50% - 70px) top !important; background-repeat: no-repeat !important; background-color: #f7f7f7 !important; }
    .legacy-product-copy h3 { margin: 0 0 9px; color: #ee9b40; font: bold 21px/1.2 Arial, sans-serif; }
    .legacy-product-copy p { margin: 0; font: 16px/1.4 Arial, sans-serif; }
    .legacy-product-carousel .c-prev, .legacy-product-carousel .c-next { z-index: 8; }
}

@media (max-width: 360px) {
    .legacy-product-carousel .title_2 { background-position: calc(50% - 55px) top !important; }
}

@media (min-width: 701px) and (max-width: 900px) {
    .legacy-product-carousel, .legacy-product-carousel .title_2 { height: 300px !important; }
    .legacy-product-carousel .title_2 { background-size: auto 300px !important; background-position: calc(50% - 115px) top !important; background-repeat: no-repeat !important; }
    .legacy-product-copy h3 { margin: 0 0 8px; color: #ee9b40; font: bold 22px/1.2 Arial, sans-serif; }
    .legacy-product-copy p { margin: 0; font: 17px/1.4 Arial, sans-serif; }
}

@media (max-width: 600px) {
    #copyright_abukai { box-sizing: border-box; height: auto !important; min-height: 0; padding: 12px 16px 14px; overflow: visible; font-size: 12px; line-height: 1.45; }
    #copyright_abukai .footer-links { margin-bottom: 8px; line-height: 1.6; }
    #copyright_abukai .footer-links a { display: inline-block; white-space: nowrap; }
    #copyright_abukai .footer-separator-before-terms { display: none; }
    #copyright_abukai .footer-mobile-break { display: block; }
    #copyright_abukai .footer-address { margin-top: 5px; }
    .pricing-company-logos { display: none; }
    .pricing-company-logos-mobile { display: block; margin: 10px 0 16px; }
    .pricing-company-logos-mobile .logo-half { display: block; width: 100%; aspect-ratio: 11.5; background-image: url('../images/example_companies_with_ABUKAI_users.png'); background-repeat: no-repeat; background-size: 200% auto; }
    .pricing-company-logos-mobile .logo-half-first { background-position: left center; }
    .pricing-company-logos-mobile .logo-half-second { background-position: right center; }
    #t1.title_home { min-height: 700px; }
    #t1.title_home #abukaititleimage,
    #t1.title_home #main_screen,
    #t1.title_home #startVideo { height: 700px !important; }
    #tit_animiation_news:not(.news-main-carousel), #tit_animiation_partners { display: none !important; }
    .partner_slideshow { box-sizing: border-box; float: none; position: relative; width: 100%; height: 155px; margin: 12px 0 18px; text-align: center; }
    .partner_slideshow > div { box-sizing: border-box; left: 0 !important; top: 0 !important; width: 100% !important; }
    #breadcrum_nav { padding-top: 8px; }
    #t1.title_home #log-on { width: 100%; }
    #t1.title_home #log-on .info-wrapper-content:first-of-type { height: 60px; }
    #t1.title_home #log-on .info-wrapper-content img { max-width: 100%; height: auto; }
    #t1.title_home #log-on .info-wrapper-content p { font-size: 19px !important; line-height: 1.25; padding: 0 8px; }
    #t1.title_home #log-on #email { box-sizing: border-box; max-width: 100%; width: 100% !important; height: 45px !important; font-size: 20px !important; }
    #t1.title_home #log-on form { padding: 0 8px; }
    #t1.title_home #log-on .home-agreement { font-size: 13px; }
    .title_1, .title_1_clear, .title_2, .title_3, .title_4 { height: 200px; background-size: cover !important; }
    .title_2 .company_menu { width: 100%; }
    .title_2.company-landing { min-height: 200px; }
    .title_animation, .title_animation .title_2 { height: 260px; }
    .technology-banner, .technology-banner .technology-banner-image { height: 300px !important; }
    .technology-banner .technology-banner-image { background-size: auto 230px !important; background-position: 43% top !important; }
    .technology-banner .videobox_img_button2 { left: 50%; }
    .expense-feature-carousel, .expense-feature-carousel .title_2 { height: 350px; }
    #tit_animiation_customer.mobile-customer-carousel { --mobile-customer-size: calc(100vw - 20px); }
    #tit_animiation_customer.mobile-customer-carousel,
    #tit_animiation_customer.mobile-customer-carousel .mobile-customer-slide { height: calc(var(--mobile-customer-size) + 14px) !important; }
    #tit_animiation_customer.mobile-customer-carousel .transport-video-slide { height: calc(var(--mobile-customer-size) + 14px) !important; }
    .mobile-customer-banner { margin: 7px auto; }
    #tit_animiation_news.news-main-carousel { --mobile-news-size: calc(100vw - 20px); height: calc(var(--mobile-news-size) + 14px) !important; }
    #tit_animiation_news.news-main-carousel > .title_2,
    #tit_animiation_news.news-main-carousel > .title_3 { height: calc(var(--mobile-news-size) + 14px) !important; }
    .news-main-carousel .mobile-news-banner, .news-main-carousel .news-video-slide video { margin: 7px auto; }
    .mobile-news-banner figcaption { padding: 42px 20px 18px; }
    .mobile-news-publication { margin-bottom: 8px; font-size: 20px; }
    .mobile-news-banner blockquote { margin-bottom: 8px; font-size: 15px; }
    .mobile-news-banner cite { font-size: 13px; }
    .news-main-carousel .news-video-caption { bottom: 7px; font-size: 15px; }
    .news-main-carousel .news-video-caption strong { font-size: 19px; }
    .news-main-carousel .mobile-news-slide > a[onclick*='playVideo'] { top: 7px; }
    .transport-video-slide .transport-video-frame { margin: 7px auto; }
    .transport-video-slide .transport-video-caption { font-size: 14px; }
    .transport-video-slide .transport-video-caption strong { font-size: 17px; }
    .mobile-customer-banner figcaption { max-height: 84%; padding: 30px 14px 14px; }
    .mobile-customer-banner blockquote { font-size: 15px; line-height: 1.35; }
    .mobile-customer-banner cite { font-size: 14px; }
    #tit_animiation_customer .mobile-customer-slide > a[onclick*='playVideo'] { top: 7px; }
    .title_animation .info-wrapper2 { top: 88px !important; }
    #promptimg2 .buyshow { padding: 10px; }
    #promptimg2 .buyshow form table, #promptimg2 .buyshow form tbody,
    #promptimg2 .buyshow form tr, #promptimg2 .buyshow form td { box-sizing: border-box; display: block; width: 100% !important; }
    #promptimg2 .buyshow form tr { margin-bottom: 8px; }
    #promptimg2 .buyshow form td { padding: 3px 0 !important; text-align: left !important; }
    #promptimg2 .buyshow form > table:first-of-type input[type='text']:not([readonly]),
    #promptimg2 .buyshow form select, #promptimg2 .marketing-template-picker { width: 100%; }
    #promptimg2 .buyshow form table table { margin: 8px 0; }
    #promptimg2 .buyshow form input[type='submit'] { height: 42px; min-height: 42px; padding-top: 0; padding-bottom: 0; line-height: 42px; }
    #promptimg2 .buyshow input[name='cardnumber'], #promptimg2 .buyshow input[name='cardcode'] { width: 100%; }
    .mobile-plan-comparison th, .mobile-plan-comparison td { padding: 5px 2px; font-size: 11px; }
    .mobile-plan-comparison thead th { font-size: 10px; }
    .mobile-plan-comparison .comparison-group th { font-size: 11px; }
    .mobile-plan-comparison .plan-header small { font-size: 8px; }
    .art-PostContent { padding: 0 12px; }
    .art-PostContent, .art-PostContent p, .art-PostContent li { font-size: 14px; line-height: 1.45; }
    .art-PostContent h1 { font-size: 26px; line-height: 1.2; }
    .art-PostContent h2 { font-size: 21px; line-height: 1.25; }
    .art-PostContent table img[width='64'] { width: 64px; height: 64px; max-width: none; }
    .case-study-table, .case-study-table tbody, .case-study-table tr, .case-study-table td { box-sizing: border-box; display: block; width: 100%; }
    .case-study-table tr > td { padding: 0; }
    .case-study-table tr > td[colspan] { padding-top: 18px; }
    .case-study-table img.art-article { display: block; float: none !important; max-width: min(150px, 100%); height: auto; margin: 8px 0 10px; }
    .art-Footer { font-size: 11px; }
    .art-Footer .art-Footer-text { overflow-wrap: anywhere; }
    .marketing-contact-form table, .marketing-contact-form tbody,
    .marketing-contact-form tr, .marketing-contact-form td { box-sizing: border-box; display: block; width: 100%; }
    .marketing-contact-form td { min-width: 0 !important; padding: 2px 0; }
    .marketing-contact-form td:empty { display: none; }
    .marketing-contact-form input[type='text'], .marketing-contact-form select,
    .marketing-contact-form textarea { box-sizing: border-box; width: 100%; font-size: 16px; }
    .marketing-contact-form input[type='submit'] { min-height: 40px; }
    .marketing-partner-form tr { margin-bottom: 0 !important; }
    .marketing-template-picker { width: 100%; }
    .art-PostContent form[action='scripts/contactus_partnerships.php'] table,
    .art-PostContent form[action='scripts/contactus_partnerships.php'] tbody,
    .art-PostContent form[action='scripts/contactus_partnerships.php'] tr,
    .art-PostContent form[action='scripts/contactus_partnerships.php'] td,
    .art-PostContent form[action='scripts/requestcustomcorporate.php'] table,
    .art-PostContent form[action='scripts/requestcustomcorporate.php'] tbody,
    .art-PostContent form[action='scripts/requestcustomcorporate.php'] tr,
    .art-PostContent form[action='scripts/requestcustomcorporate.php'] td { box-sizing: border-box; display: block; width: 100%; }
    .art-PostContent form[action='scripts/contactus_partnerships.php'] tr,
    .art-PostContent form[action='scripts/requestcustomcorporate.php'] tr { margin-bottom: 9px; }
    .art-PostContent form[action='scripts/contactus_partnerships.php'] input:not([type='radio']):not([type='checkbox']):not([type='submit']),
    .art-PostContent form[action='scripts/contactus_partnerships.php'] select,
    .art-PostContent form[action='scripts/contactus_partnerships.php'] textarea,
    .art-PostContent form[action='scripts/requestcustomcorporate.php'] input:not([type='radio']):not([type='checkbox']):not([type='submit']),
    .art-PostContent form[action='scripts/requestcustomcorporate.php'] select,
    .art-PostContent form[action='scripts/requestcustomcorporate.php'] textarea { box-sizing: border-box; max-width: 100%; width: 100%; font-size: 16px; }
    .art-PostContent table[style*='border-collapse'] { box-sizing: border-box; display: block; max-width: 100%; overflow-x: auto; }
}

@media (max-width: 420px) {
    .expense-product-hero, .expense-product-hero .title_2 { height: var(--expense-mobile-height, 460px) !important; }
}

@media (max-width: 380px) {
    .expense-product-hero .title_2 > div:first-child,
    .expense-product-hero .title_2 video { height: 230px !important; }
    .expense-product-hero .title_2 .info-wrapper2 { top: 190px !important; }
}

@media (max-width: 374px) {
    .mobile-plan-comparison th:first-child { width: 32%; }
    .mobile-plan-comparison .plan-header span { font-size: 8px; }
    .mobile-plan-comparison .plan-header small { font-size: 7px; }
    #copyright_abukai .footer-links { font-size: 11px; }
    #t1.title_home { min-height: 720px; }
    #t1.title_home #abukaititleimage,
    #t1.title_home #main_screen,
    #t1.title_home #startVideo { height: 720px !important; }
    .mobile-customer-banner blockquote { font-size: 14px; }
}

/* On tall touch screens, put spare viewport height above and within the hero. */
html #t1.title_home.home-viewport-filled { min-height: calc(var(--home-base-height) + var(--home-spare-height)); }
html #t1.title_home.home-viewport-filled::before { content: ''; position: absolute; z-index: 1; inset: 0 0 auto; height: var(--home-band-height); background: #d1d1d1; }
html #t1.title_home.home-viewport-filled #abukaititleimage { height: calc(var(--home-base-height) + var(--home-spare-height)) !important; }
html #t1.title_home.home-viewport-filled #main_screen { z-index: 2; top: var(--home-band-height) !important; height: calc(var(--home-base-height) + var(--home-video-extra-height)) !important; overflow: visible; }
html #t1.title_home.home-viewport-filled #startVideo { height: calc(var(--home-base-height) + var(--home-video-extra-height)) !important; }
html #t1.title_home.home-viewport-filled .home-brand-mark { top: calc(-1 * var(--home-band-height)); width: min(288px, calc(var(--home-band-height) * 2.66)); }
html #t1.title_home.home-viewport-filled #abukaisignupbox { top: calc(105px + var(--home-band-height)) !important; }
html #t1.title_home.home-viewport-filled.home-media-fallback #abukaisignupbox { opacity: 1; pointer-events: auto; }
html #t1.title_home.home-viewport-filled.home-media-fallback #main_screen { background: #292929 url('../abukai/ui2_video.jpg') center / cover no-repeat; }
html #t1.title_home.home-viewport-filled.home-media-fallback .home-brand-mark { display: block; }
