:root { --asap-navy: #072f57; --asap-blue: #0a5f8d; --asap-cyan: #20a6c9; --asap-lime: #b6cc28; --asap-ink: #13263a; --asap-muted: #5e6d7c; --asap-border: #dce5ec; --asap-surface: #ffffff; --asap-soft: #f3f7fa; } body { color: var(--asap-ink); background: var(--asap-soft); font-family: "Inter", "Open Sans", Arial, sans-serif; } /* * Twenty-One places primary-bg-color on . Keep the client area light; * using the brand navy here would paint every transparent content section. */ body.primary-bg-color { color: var(--asap-ink); background: var(--asap-soft) !important; } a { color: var(--asap-blue); } a:hover, a:focus { color: var(--asap-navy); } .header, .main-navbar-wrapper, .navbar-main { background-color: var(--asap-navy) !important; } .header .logo-img, .header .logo { max-height: 52px; } .main-navbar-wrapper .navbar-nav > li > a, .navbar-main .navbar-nav > li > a, .navbar-main .nav-link { color: rgba(255, 255, 255, 0.9) !important; font-weight: 600; } .main-navbar-wrapper .navbar-nav > li > a:hover, .main-navbar-wrapper .navbar-nav > li > a:focus, .main-navbar-wrapper .navbar-nav > li.show > a, .main-navbar-wrapper .navbar-nav > li.active > a, .navbar-main .navbar-nav > li > a:hover, .navbar-main .navbar-nav > li > a:focus, .navbar-main .nav-link:hover, .navbar-main .nav-link:focus { color: #fff !important; background: rgba(255, 255, 255, 0.06); } .main-navbar-wrapper .dropdown-menu a, .main-navbar-wrapper .dropdown-menu a:hover, .main-navbar-wrapper .dropdown-menu a:focus { color: var(--asap-ink) !important; } .main-navbar-wrapper .dropdown-menu a:hover, .main-navbar-wrapper .dropdown-menu a:focus { background: #edf4f8; } .breadcrumb { color: var(--asap-muted); background: #eef3f7; } #main-body { color: var(--asap-ink); background: var(--asap-soft); } #main-body .primary-content > h1, #main-body .primary-content > h2, #main-body .primary-content > h3 { color: var(--asap-navy); } .btn-primary, .btn-success, .btn-info { color: #fff; background-color: var(--asap-blue); border-color: var(--asap-blue); border-radius: 8px; font-weight: 700; } .btn-primary:hover, .btn-primary:focus, .btn-success:hover, .btn-success:focus, .btn-info:hover, .btn-info:focus { color: #fff; background-color: var(--asap-navy); border-color: var(--asap-navy); } .btn-outline-primary { color: var(--asap-blue); border-color: var(--asap-blue); } .btn-outline-primary:hover, .btn-outline-primary:focus { color: #fff; background: var(--asap-blue); } .card, .panel, .domain-pricing .tld-pricing-header, .client-home-panels .panel { background: var(--asap-surface); border: 1px solid var(--asap-border); border-radius: 14px; box-shadow: 0 10px 30px rgba(7, 47, 87, 0.07); } .card-header, .panel-heading, .client-home-panels .panel > .panel-heading { color: var(--asap-navy); background: #edf4f8; border-bottom-color: var(--asap-border); font-weight: 700; } .home-domain-search, .domain-checker-container, .domain-search-container { color: #fff; background: linear-gradient(135deg, var(--asap-navy), var(--asap-blue)) !important; } .home-domain-search h2, .domain-checker-container h1, .domain-checker-container h2, .domain-search-container h1, .domain-search-container h2 { color: #fff; } .home-domain-search a, .domain-checker-container a, .domain-search-container a { color: rgba(255, 255, 255, 0.9); } .home-domain-search a:hover, .home-domain-search a:focus, .domain-checker-container a:hover, .domain-checker-container a:focus, .domain-search-container a:hover, .domain-search-container a:focus { color: #fff; } .form-control:focus { border-color: var(--asap-cyan); box-shadow: 0 0 0 0.2rem rgba(32, 166, 201, 0.18); } .badge-primary, .label-primary { background: var(--asap-blue); } .footer, footer.footer { color: rgba(255, 255, 255, 0.82); background: var(--asap-navy); } .footer a, footer.footer a { color: #fff; } .footer a:hover, footer.footer a:hover { color: var(--asap-lime); } @media (max-width: 767px) { .header .logo-img, .header .logo { max-height: 42px; } } @media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; transition-duration: 0.01ms !important; animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; } }