/*-------------------------------------------------------------- # CSS Variables (Global) --------------------------------------------------------------*/ :root { /* Font Variables */ --body-font: 'Arial Custom', Arial, sans-serif; --heading-font: 'GT Super Display', Georgia, serif; --button-font: var(--body-font); --base-font-size: 14px; --scale-factor: 0.875; /* Colors */ --light-text-color: #fff; --black: #000; --white: #fff; --primary-color: #E54B33; --secondary-color: #041E42; --button-hover: #768771; --background-muted: #F7F5F3; --background-primary: #E54B33; --background-secondary: #041E42; --text-primary: rgba(226, 31, 38, 1); --link-color: #000; --link-hover: var(--primary-color); --border-color: #E54B33; /* Buttons */ --btn-border: #E54B33; --btn-padding-x: 24px; --btn-padding-x-lg: 24px; --btn-padding-y: 10px; --btn-height: calc(53px * var(--scale-factor)); --btn-font-size: 1rem; --btn-letter-spacing:0; /* Shadows */ --box-shadow-xl: 0 28px 50px rgba(0, 0, 0, 0.3); /* Spacing */ --section-padding: 72px; --section-padding-lg: 140px; --container-width: calc(1460px * var(--scale-factor)); --container-padding: 15px; --min-padding: 102px; --vh: 1vh; /* Fallback value to reduce content shift */ --letter-spacing: 0; /* Navbar */ --navbar-min-height: calc(96px * var(--scale-factor)); --navbar-background: rgba(255, 255, 255, 0.85); --navbar-background-transparent: rgba(255, 255, 255, 0.70); --navbar-backdrop-filter: 25px; /* Intl-tel-input */ --iti-flag-height: 12px; --iti-flag-width: 16px; --iti-hover-color: rgba(0, 0, 0, 0.05); --iti-border-color: #ccc; --iti-dialcode-color: #999; --iti-dropdown-bg: #F5F5F5; --iti-border-width: 1px; --iti-arrow-height: 6px; --iti-arrow-width: 12px; --iti-triangle-border: calc(var(--iti-arrow-width) / 2); --iti-arrow-padding: 6px; --iti-arrow-color: rgba(4, 30, 66, 0.5); --iti-hover-color: rgba(0, 0, 0, 0); } /*-------------------------------------------------------------- # UIkit Overrides --------------------------------------------------------------*/ .uk-card-primary.uk-card-body .uk-h1, .uk-card-primary.uk-card-body .uk-h2, .uk-card-primary.uk-card-body .uk-h3, .uk-card-primary.uk-card-body .uk-h4, .uk-card-primary.uk-card-body .uk-h5, .uk-card-primary.uk-card-body .uk-h6, .uk-card-primary.uk-card-body .uk-heading-2xlarge, .uk-card-primary.uk-card-body .uk-heading-3xlarge, .uk-card-primary.uk-card-body .uk-heading-large, .uk-card-primary.uk-card-body .uk-heading-medium, .uk-card-primary.uk-card-body .uk-heading-small, .uk-card-primary.uk-card-body .uk-heading-xlarge, .uk-card-primary.uk-card-body h1, .uk-card-primary.uk-card-body h2, .uk-card-primary.uk-card-body h3, .uk-card-primary.uk-card-body h4, .uk-card-primary.uk-card-body h5, .uk-card-primary.uk-card-body h6, .uk-card-primary>:not([class*=uk-card-media]) .uk-h1, .uk-card-primary>:not([class*=uk-card-media]) .uk-h2, .uk-card-primary>:not([class*=uk-card-media]) .uk-h3, .uk-card-primary>:not([class*=uk-card-media]) .uk-h4, .uk-card-primary>:not([class*=uk-card-media]) .uk-h5, .uk-card-primary>:not([class*=uk-card-media]) .uk-h6, .uk-card-primary>:not([class*=uk-card-media]) .uk-heading-2xlarge, .uk-card-primary>:not([class*=uk-card-media]) .uk-heading-3xlarge, .uk-card-primary>:not([class*=uk-card-media]) .uk-heading-large, .uk-card-primary>:not([class*=uk-card-media]) .uk-heading-medium, .uk-card-primary>:not([class*=uk-card-media]) .uk-heading-small, .uk-card-primary>:not([class*=uk-card-media]) .uk-heading-xlarge, .uk-card-primary>:not([class*=uk-card-media]) h1, .uk-card-primary>:not([class*=uk-card-media]) h2, .uk-card-primary>:not([class*=uk-card-media]) h3, .uk-card-primary>:not([class*=uk-card-media]) h4, .uk-card-primary>:not([class*=uk-card-media]) h5, .uk-card-primary>:not([class*=uk-card-media]) h6, .uk-card-secondary.uk-card-body .uk-h1, .uk-card-secondary.uk-card-body .uk-h2, .uk-card-secondary.uk-card-body .uk-h3, .uk-card-secondary.uk-card-body .uk-h4, .uk-card-secondary.uk-card-body .uk-h5, .uk-card-secondary.uk-card-body .uk-h6, .uk-card-secondary.uk-card-body .uk-heading-2xlarge, .uk-card-secondary.uk-card-body .uk-heading-3xlarge, .uk-card-secondary.uk-card-body .uk-heading-large, .uk-card-secondary.uk-card-body .uk-heading-medium, .uk-card-secondary.uk-card-body .uk-heading-small, .uk-card-secondary.uk-card-body .uk-heading-xlarge, .uk-card-secondary.uk-card-body h1, .uk-card-secondary.uk-card-body h2, .uk-card-secondary.uk-card-body h3, .uk-card-secondary.uk-card-body h4, .uk-card-secondary.uk-card-body h5, .uk-card-secondary.uk-card-body h6, .uk-card-secondary>:not([class*=uk-card-media]) .uk-h1, .uk-card-secondary>:not([class*=uk-card-media]) .uk-h2, .uk-card-secondary>:not([class*=uk-card-media]) .uk-h3, .uk-card-secondary>:not([class*=uk-card-media]) .uk-h4, .uk-card-secondary>:not([class*=uk-card-media]) .uk-h5, .uk-card-secondary>:not([class*=uk-card-media]) .uk-h6, .uk-card-secondary>:not([class*=uk-card-media]) .uk-heading-2xlarge, .uk-card-secondary>:not([class*=uk-card-media]) .uk-heading-3xlarge, .uk-card-secondary>:not([class*=uk-card-media]) .uk-heading-large, .uk-card-secondary>:not([class*=uk-card-media]) .uk-heading-medium, .uk-card-secondary>:not([class*=uk-card-media]) .uk-heading-small, .uk-card-secondary>:not([class*=uk-card-media]) .uk-heading-xlarge, .uk-card-secondary>:not([class*=uk-card-media]) h1, .uk-card-secondary>:not([class*=uk-card-media]) h2, .uk-card-secondary>:not([class*=uk-card-media]) h3, .uk-card-secondary>:not([class*=uk-card-media]) h4, .uk-card-secondary>:not([class*=uk-card-media]) h5, .uk-card-secondary>:not([class*=uk-card-media]) h6, .uk-light .uk-h1, .uk-light .uk-h2, .uk-light .uk-h3, .uk-light .uk-h4, .uk-light .uk-h5, .uk-light .uk-h6, .uk-light .uk-heading-2xlarge, .uk-light .uk-heading-3xlarge, .uk-light .uk-heading-large, .uk-light .uk-heading-medium, .uk-light .uk-heading-small, .uk-light .uk-heading-xlarge, .uk-light h1, .uk-light h2, .uk-light h3, .uk-light h4, .uk-light h5, .uk-light h6, .uk-offcanvas-bar .uk-h1, .uk-offcanvas-bar .uk-h2, .uk-offcanvas-bar .uk-h3, .uk-offcanvas-bar .uk-h4, .uk-offcanvas-bar .uk-h5, .uk-offcanvas-bar .uk-h6, .uk-offcanvas-bar .uk-heading-2xlarge, .uk-offcanvas-bar .uk-heading-3xlarge, .uk-offcanvas-bar .uk-heading-large, .uk-offcanvas-bar .uk-heading-medium, .uk-offcanvas-bar .uk-heading-small, .uk-offcanvas-bar .uk-heading-xlarge, .uk-offcanvas-bar h1, .uk-offcanvas-bar h2, .uk-offcanvas-bar h3, .uk-offcanvas-bar h4, .uk-offcanvas-bar h5, .uk-offcanvas-bar h6, .uk-overlay-primary .uk-h1, .uk-overlay-primary .uk-h2, .uk-overlay-primary .uk-h3, .uk-overlay-primary .uk-h4, .uk-overlay-primary .uk-h5, .uk-overlay-primary .uk-h6, .uk-overlay-primary .uk-heading-2xlarge, .uk-overlay-primary .uk-heading-3xlarge, .uk-overlay-primary .uk-heading-large, .uk-overlay-primary .uk-heading-medium, .uk-overlay-primary .uk-heading-small, .uk-overlay-primary .uk-heading-xlarge, .uk-overlay-primary h1, .uk-overlay-primary h2, .uk-overlay-primary h3, .uk-overlay-primary h4, .uk-overlay-primary h5, .uk-overlay-primary h6, .uk-section-primary:not(.uk-preserve-color) .uk-h1, .uk-section-primary:not(.uk-preserve-color) .uk-h2, .uk-section-primary:not(.uk-preserve-color) .uk-h3, .uk-section-primary:not(.uk-preserve-color) .uk-h4, .uk-section-primary:not(.uk-preserve-color) .uk-h5, .uk-section-primary:not(.uk-preserve-color) .uk-h6, .uk-section-primary:not(.uk-preserve-color) .uk-heading-2xlarge, .uk-section-primary:not(.uk-preserve-color) .uk-heading-3xlarge, .uk-section-primary:not(.uk-preserve-color) .uk-heading-large, .uk-section-primary:not(.uk-preserve-color) .uk-heading-medium, .uk-section-primary:not(.uk-preserve-color) .uk-heading-small, .uk-section-primary:not(.uk-preserve-color) .uk-heading-xlarge, .uk-section-primary:not(.uk-preserve-color) h1, .uk-section-primary:not(.uk-preserve-color) h2, .uk-section-primary:not(.uk-preserve-color) h3, .uk-section-primary:not(.uk-preserve-color) h4, .uk-section-primary:not(.uk-preserve-color) h5, .uk-section-primary:not(.uk-preserve-color) h6, .uk-section-secondary:not(.uk-preserve-color) .uk-h1, .uk-section-secondary:not(.uk-preserve-color) .uk-h2, .uk-section-secondary:not(.uk-preserve-color) .uk-h3, .uk-section-secondary:not(.uk-preserve-color) .uk-h4, .uk-section-secondary:not(.uk-preserve-color) .uk-h5, .uk-section-secondary:not(.uk-preserve-color) .uk-h6, .uk-section-secondary:not(.uk-preserve-color) .uk-heading-2xlarge, .uk-section-secondary:not(.uk-preserve-color) .uk-heading-3xlarge, .uk-section-secondary:not(.uk-preserve-color) .uk-heading-large, .uk-section-secondary:not(.uk-preserve-color) .uk-heading-medium, .uk-section-secondary:not(.uk-preserve-color) .uk-heading-small, .uk-section-secondary:not(.uk-preserve-color) .uk-heading-xlarge, .uk-section-secondary:not(.uk-preserve-color) h1, .uk-section-secondary:not(.uk-preserve-color) h2, .uk-section-secondary:not(.uk-preserve-color) h3, .uk-section-secondary:not(.uk-preserve-color) h4, .uk-section-secondary:not(.uk-preserve-color) h5, .uk-section-secondary:not(.uk-preserve-color) h6, .uk-tile-primary:not(.uk-preserve-color) .uk-h1, .uk-tile-primary:not(.uk-preserve-color) .uk-h2, .uk-tile-primary:not(.uk-preserve-color) .uk-h3, .uk-tile-primary:not(.uk-preserve-color) .uk-h4, .uk-tile-primary:not(.uk-preserve-color) .uk-h5, .uk-tile-primary:not(.uk-preserve-color) .uk-h6, .uk-tile-primary:not(.uk-preserve-color) .uk-heading-2xlarge, .uk-tile-primary:not(.uk-preserve-color) .uk-heading-3xlarge, .uk-tile-primary:not(.uk-preserve-color) .uk-heading-large, .uk-tile-primary:not(.uk-preserve-color) .uk-heading-medium, .uk-tile-primary:not(.uk-preserve-color) .uk-heading-small, .uk-tile-primary:not(.uk-preserve-color) .uk-heading-xlarge, .uk-tile-primary:not(.uk-preserve-color) h1, .uk-tile-primary:not(.uk-preserve-color) h2, .uk-tile-primary:not(.uk-preserve-color) h3, .uk-tile-primary:not(.uk-preserve-color) h4, .uk-tile-primary:not(.uk-preserve-color) h5, .uk-tile-primary:not(.uk-preserve-color) h6, .uk-tile-secondary:not(.uk-preserve-color) .uk-h1, .uk-tile-secondary:not(.uk-preserve-color) .uk-h2, .uk-tile-secondary:not(.uk-preserve-color) .uk-h3, .uk-tile-secondary:not(.uk-preserve-color) .uk-h4, .uk-tile-secondary:not(.uk-preserve-color) .uk-h5, .uk-tile-secondary:not(.uk-preserve-color) .uk-h6, .uk-tile-secondary:not(.uk-preserve-color) .uk-heading-2xlarge, .uk-tile-secondary:not(.uk-preserve-color) .uk-heading-3xlarge, .uk-tile-secondary:not(.uk-preserve-color) .uk-heading-large, .uk-tile-secondary:not(.uk-preserve-color) .uk-heading-medium, .uk-tile-secondary:not(.uk-preserve-color) .uk-heading-small, .uk-tile-secondary:not(.uk-preserve-color) .uk-heading-xlarge, .uk-tile-secondary:not(.uk-preserve-color) h1, .uk-tile-secondary:not(.uk-preserve-color) h2, .uk-tile-secondary:not(.uk-preserve-color) h3, .uk-tile-secondary:not(.uk-preserve-color) h4, .uk-tile-secondary:not(.uk-preserve-color) h5, .uk-tile-secondary:not(.uk-preserve-color) h6 { color: var(--light-text-color); } .uk-container { max-width: var(--container-width); } .uk-container-xlarge { max-width: 1920px; } .uk-navbar-container .uk-logo-sticky { visibility: hidden; opacity: 0; transition: all .2s ease-out; } .uk-sticky-fixed .uk-navbar-container .uk-logo-sticky { visibility: visible; opacity: 1; } .uk-light { color: var(--light-text-color); } a, .uk-link { color: var(--link-color); transition: all .2s ease-out; } a:hover, .uk-link:hover { color: var(--link-hover); } .uk-dotnav { margin-left: -9px; } .uk-dotnav>* { padding-left: 9px; } .uk-dotnav>*>* { width: 6px; height: 6px; } .uk-dotnav>*>* { background-color: rgba(255, 255, 255, 1); border-color: transparent; } .uk-dotnav>.uk-active>* { border-color: var(--white); background-color: transparent; border-width: 3px; width: 12px; height: 12px; } /*-------------------------------------------------------------- # Typography --------------------------------------------------------------*/ html { font-weight: 400; color: var(--secondary-color); line-height: 1.4; font-size: var(--base-font-size); font-family: var(--body-font); } h1, h2, h3, h4, h5, h6, .uk-h1, .uk-h2, .uk-h3, .uk-h4, .uk-h5, .uk-h6, .uk-heading-small, .uk-heading-medium, .uk-heading-large, .uk-heading-xlarge, .uk-heading-2xlarge { font-family: var(--heading-font); font-weight: 300; color: var(--primary-color); } .uk-h1, h1 { line-height: 1.1; } .uk-h2, h2 { font-size: 2.5rem; line-height: 1.2; } .page { overflow: hidden; } @media (min-width: 640px) { .uk-h1, h1 { font-size: 4.375rem; } .uk-h2, h2 { font-size: 3.125rem; line-height: 1.16; } } /*-------------------------------------------------------------- # Buttons --------------------------------------------------------------*/ .uk-button { font-family: var(--button-font); font-weight : 400; transition: all .3s ease-out; letter-spacing: var(--btn-letter-spacing); font-size: var(--btn-font-size); padding: var(--btn-padding-y) var(--btn-padding-x); height: var(--btn-height); color: var(--white); text-transform: none; display: inline-flex; justify-content: center; align-items: center; line-height: 1.5; min-height: var(--btn-height); text-transform: none; height: auto; border-radius: 0; } .uk-light .uk-button-primary, .uk-button-primary { background-color: var(--background-primary); border-color: var(--background-primary); color: var(--white); } .uk-light .uk-button-primary:hover, .uk-button-primary:hover { background-color: var(--background-secondary); border-color: var(--background-secondary); color: var(--white); } .uk-light .uk-button-secondary { color: #4C7EAC; } .uk-button-secondary:hover { background-color: var(--background-primary); border-color: var(--black); color: #000; } .uk-light .uk-button-secondary:hover { background-color: var(--background-primary); border-color: var(--background-primary); color: var(--white); } .uk-button-default { color: var(--black); border-color: var(--secondary-color); } .uk-button-default:hover { color: var(--black); border-color: var(--secondary-color); background-color: var(--white); } .uk-button-default.uk-active, .uk-button-default:active, .uk-button-default:focus { color: var(--black); border-color: var(--secondary-color); background-color: var(--white); } @media (max-width: 1200px) { .dual-btn .uk-button { width: 100%; } } @media (max-width: 960px) { .btn { margin: 0 auto; display: inline-flex; } } @media (max-width: 640px) { .uk-button { width: 100%; } .uk-button-text.uk-button { width: auto; } .two-btns.uk-grid-medium>.uk-grid-margin { margin-top: 10px; } } /*-------------------------------------------------------------- # Forms & Inputs --------------------------------------------------------------*/ .uk-select:not([multiple]):not([size]) { background-image: url(../img/select-arrow.svg) !important; background-repeat: no-repeat; background-position: calc(100% - 0) center !important; background-size: 12px !important; } .uk-input, .uk-select:not([multiple]):not([size]) { height: 45px; padding-left: 16px; padding-right: 16px; outline: 0; } .uk-form-icon { width: 20px; } .uk-form-icon:not(.uk-form-icon-flip) ~ .uk-input { padding-left: 44px !important; } .uk-input, .uk-select, .uk-textarea { font-size: 1rem; } .uk-input, .uk-select, .uk-textarea { background: #fff; color: var(--background-secondary); border: 1px solid var(--black); border-radius: 0; } .uk-input:focus, .uk-select:focus, .uk-textarea:focus { border: 1px solid #A5A5A5; } .uk-light .uk-input, .uk-light .uk-select, .uk-light .uk-textarea, .uk-light .uk-checkbox { background-color: rgb(255,255,255); color: #000; border-color: rgba(0, 0, 0, 0.30); } .uk-light .uk-input:focus, .uk-light .uk-select:focus, .uk-light .uk-textarea:focus { background-color: rgb(255,255,255); color: #000; border-color: var(--primary-color); } label, .uk-form-label { font-size: 0.9375rem; margin-bottom: 6px; display: block; color: var(--secondary-color); } /*-------------------------------------------------------------- # Layout Adjustments --------------------------------------------------------------*/ .uk-card-body { line-height: 1.8; } .uk-background-primary { background-color: var(--background-primary); } .uk-background-muted { background-color: var(--background-muted); } .uk-background-secondary { background-color: var(--background-secondary); } @media (min-width: 960px) { .inner-left { padding-left: 40px; padding-right: 20px; } .inner-right { padding-right: 40px; } } @media (min-width: 1200px) { .inner-left { padding-left: max(var(--min-padding), calc((100vw - (var(--container-width) + (var(--container-padding) * 2))) / 2)); } .inner-right { padding-right: max(var(--min-padding), calc((100vw - (var(--container-width) + (var(--container-padding) * 2))) / 2)); } } @media (max-width: 960px) { .inner-left, .inner-right { padding: 50px 40px; } } @media (max-width: 640px) { .inner-left, .inner-right { padding: 0 15px; } } /* ========================== Nav Styles ========================== */ .tm-header { position: absolute; z-index: 900; left: 0; right: 0; width: 100% } .uk-navbar-container { background-color: var(--color-bg); } .uk-navbar-nav > li > a { color: var(--color-dark); text-transform: none; font-size: 1rem; font-family: var(--body-font); } .uk-navbar-nav>li.uk-active>a, .uk-navbar-nav>li:hover>a, .uk-navbar-nav>li>a[aria-expanded=true] { color: #000; } .uk-navbar-item, .uk-navbar-nav>li>a, .uk-navbar-toggle { min-height: var(--navbar-min-height); color: var(--color-dark); } .uk-navbar-container:not(.uk-navbar-transparent) { background: var(--navbar-background); backdrop-filter: blur(var(--navbar-backdrop-filter)); } .tm-header .uk-navbar-transparent { background: var(--navbar-background-transparent); backdrop-filter: blur(var(--navbar-backdrop-filter)); box-shadow: 0 5px 15px rgba(0,0,0,.08); } .tm-header .uk-sticky-fixed { left: 0 !important; right: 0 !important; width: auto !important; } .topmenu > li > a { position: relative; } .topmenu > li > a::after { content: ""; position: absolute; left: 0; bottom: 0; width: 100%; height: 0; background-color: var(--background-primary); transition: height 0.2s ease; } .topmenu > li.uk-active > a::after { height: calc(4px * var(--scale-factor)); } @media (min-width: 1200px) { .uk-navbar-container .uk-button { min-width: calc(227px * var(--scale-factor)); } .uk-navbar-nav { gap: 44px; } .uk-navbar-left, .uk-navbar-right, [class*=uk-navbar-center] { gap: 48px; } } @media (max-width: 640px) { .uk-navbar-container:not(.uk-navbar-transparent) { background: none; backdrop-filter: none; } } /*-------------------------------------------------------------- # Hero Section --------------------------------------------------------------*/ .hero-section { height: calc(790px * var(--scale-factor)); background-image: url('../img/herobg-LG.jpg'); background-repeat: no-repeat; background-position: 50% 64%; } .hero-section .uk-margin-top { margin-top: 20px !important; } .hero-section p { margin-top: 20px; color: var(--secondary-color); } .hero-section .banner-caption { padding-top: calc(98px * var(--scale-factor)); } .hero-section .main-title { font-size: 3.125rem; line-height: 1.1; } @media (min-width: 960px) { .hero-section { padding-bottom: 185px; } .hero-section .main-title { font-size: 4.375rem; } .hero-section .banner-caption { max-width: 456px; padding-top: 117px; } } @media (min-width: 1200px) { .hero-section { height: calc(957px * var(--scale-factor)); background-image: url('../img/herobg-XL.jpg'); background-position: center center; } } @media (min-width: 1600px) { .hero-section .banner-caption { padding-top: 60px; } } @media (max-width: 640px) { .hero-cta .uk-button { min-width: 260px; } .hero-section { background-image: url('../img/herobg-SM.jpg'); background-position: center bottom; } } /*-------------------------------------------------------------- # General Styles --------------------------------------------------------------*/ .uk-hr, hr { border-top-color: var(--border-color); } .uk-list-bullet>::before { background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%226%22%20height%3D%226%22%20viewBox%3D%220%200%206%206%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%20%20%3Ccircle%20fill%3D%22%23DBC29B%22%20cx%3D%223%22%20cy%3D%223%22%20r%3D%223%22%20%2F%3E%0A%3C%2Fsvg%3E"); background-size: 5.4px; } .animateInitState { visibility: hidden !important; opacity: 0; } .animateInitState.uk-scrollspy-inview { visibility: visible !important; opacity: 1; } .section-title { margin-top: 0; color: var(--primary-color); } .subtitle { font-style: normal; font-size: 0.75rem; font-weight: 500; letter-spacing: var(--letter-spacing); text-transform: uppercase; } .uk-light .subtitle, .uk-light.subtitle { color: #FFF; } .padding-52 { padding-top: 52px; padding-bottom: 52px; } @media (min-width: 960px) { .title-desc { line-height: 1.5; } .fs18 { font-size: 1.125rem; } .padding-52 { padding-top: 88px; padding-bottom: 42px; } } /*-------------------------------------------------------------- # Sections --------------------------------------------------------------*/ .uk-grid-medium { margin-left: -20px; } .uk-grid-medium>* { padding-left: 20px; } .info-section .section-title { margin-top: 0; } .info-section .infolist p { color: var(--primary-color); font-size: 1.375rem; } .infoslider .uk-dotnav { display: flex; justify-content: space-between; margin-left: 0; margin-top: 32px !important; margin-bottom: 0; } .infoslider .uk-dotnav > * { flex: 1 1 0; display: flex; justify-content: center; padding-left: 0; } .infoslider .uk-dotnav > * > * { display: block; width: 100%; height: 4px; background: transparent; background: #D9D9D9; border-color: #D9D9D9; border-radius: 0; } .infoslider .uk-dotnav>.uk-active>* { background-color: var(--background-primary); border-color: var(--background-primary); } @media (min-width: 640px) { } @media (min-width: 960px) { .info-section .section-title { margin-bottom: 18px; } .info-section p { margin-bottom: 58px; } } @media (min-width: 1200px) { .info-section p { max-width: 532px; } .info-section .uk-button { min-width: calc(226px * var(--scale-factor)); } } @media (max-width: 1200px) { .info-section .uk-cover-container:not(.videobg) { max-width: 540px; margin: 0 auto; } .info-section .uk-grid-collapse>.uk-margin-xlarge-top { margin-top: 0 !important; } } @media (max-width: 640px) { .info-section .uk-grid-collapse>.uk-margin-xlarge-top { margin-top: 20px !important; } .intro-section .info-cover-img { padding-right: 15px; padding-left: 15px; } } @media (max-width: 480px) { } /* -------------------------------------------------------------- # Forms --------------------------------------------------------------*/ .cform { color: #000; margin: 0 auto; } .cform .inner-wrapper { border-radius: 17px; } .cform .uk-grid-small { margin-left: -18px; } .cform .uk-grid-small>* { padding-left: 18px; } .cform textarea { max-height: 180px; padding: 10px 12px; } .cform .uk-grid-small>.uk-grid-margin { margin-top: 23px; } .cform .form-title { margin-bottom: 30px; } .cform a { color: rgba(4, 30, 66, 0.5) !important; text-decoration: underline; } .cform .uk-form-controls { position: relative; } .cform .uk-checkbox { margin: 0; border-color: var(--secondary-color); width: 16px; height: 16px; position: relative; margin-top: 0; flex-shrink: 0; border-radius: 0; } .cform .uk-checkbox:focus, .uk-radio:focus { border-color: var(--secondary-color); } .cform .uk-checkbox:checked, .cform .uk-checkbox:indeterminate, .cform .uk-radio:checked { background-color: var(--primary-color); border-color: var(--primary-color); } .cform .uk-button { margin-top: 6px; min-width: calc(227px * var(--scale-factor)); } .cform .section-title { margin-top: 24px; } .cform .gray { font-size: 0.875rem; line-height: 1.3; } .cform .uk-h4 { margin-bottom: 5px; margin-top: 14px; } @media (min-width: 960px) { .form-section { padding-top: 28px; padding-bottom: 150px; } .cform .form-title { margin-bottom: 44px; } .cform .section-title { font-size: 3rem; } } /*-------------------------------------------------------------- # Telephone International Code --------------------------------------------------------------*/ .form .iti--allow-dropdown input, .form .iti--allow-dropdown input[type=text], .form .iti--allow-dropdown input[type=tel], .form .iti--separate-dial-code input, .form .iti--separate-dial-code input[type=text], .form .iti--separate-dial-code input[type=tel] { padding-right: 6px; margin-left: 0; } .iti { width: 100%; } .hide { display: none; } #valid-msg { color: #FFFFFF; background: #00C900; } #error-msg { color: red; } input.error { border: 1px solid #FF7C7C; } .form-dark .iti__country-list { background-color: #151f28; } .iti--separate-dial-code .iti__selected-flag, .iti--allow-dropdown .iti__flag-container:hover .iti__selected-flag { background-color: rgba(0, 0, 0, 0); font-size: 0.99609375rem; } .iti-msg { position: absolute; left: 0; bottom: -19px; background: red; color: #fff !important; padding: 1px 10px; font-size: 12px; right: 0; border-radius: 4px; } .iti__selected-flag { padding-left: 10px; } .iti__search-input { height: 34px; padding: 0 10px; outline: 0; } /*-------------------------------------------------------------- # Custom Form --------------------------------------------------------------*/ .form .uk-input::placeholder, .form .uk-select::placeholder, .form .uk-textarea::placeholder { color: rgba(4, 30, 66, 0.5) !important; } .form .uk-input, .form .uk-select:not([multiple]):not([size]) { padding-left: 0; padding-right: 0; } .form .uk-input, .form .uk-select, .form .uk-textarea { background-color: transparent; border-bottom-color: rgba(0, 0, 0, 0.50); border-width: 0 0 1px 0px; border-style: solid; border-radius: 0; padding-left: 0; padding-right: 0; } .form .uk-input:focus, .form .uk-select:focus, .form .uk-textarea:focus { background-color: transparent; color: rgba(4, 30, 66, 0.5); border-bottom-color: var(--primary-color); } .form .iti__selected-country-primary { padding-left: 0; } .form .iti .iti__selected-dial-code { color: rgba(4, 30, 66, 0.5) !important; } .form .iti--inline-dropdown .iti__dropdown-content { margin-top: 0px; } .form .iti__search-input { font-family: var(--body-font); } .form .select2-container--default .select2-selection--single { background-color: transparent; border-bottom-color: rgba(0, 0, 0, 0.50); border-radius: 0; border-width: 0 0 1px 0; } .form .cform .gray { font-size: 1rem; } .form .select2-container--default .select2-selection--single .select2-selection__rendered { color: rgba(4, 30, 66, 0.5); padding-left: 0; } .form .select2-container .select2-selection--single { height: 45px; } .select2-container--default .select2-search--dropdown .select2-search__field { outline: 0; } .form .select2-dropdown { background-color: #F5F5F5; } .select2-container--default .select2-selection--single .select2-selection__arrow b { border: none; background: url('../img/select-arrow.svg') no-repeat center center; background-size: contain; width: 10px; height: 6px; left: 50%; top: 50%; transform: translate(100%, -50%); transition: transform 0.3s ease-in-out; } .select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b { transform: translate(100%, -50%) rotate(180deg); } .iti__flag { border-radius: 0; } .iti__arrow { width: 10px; height: 6px; background: url('../img/select-arrow.svg') no-repeat center center; background-size: contain; border: none; transition: transform 0.3s ease-in-out; } .iti__arrow--up { transform: rotate(180deg); } .form .section-title { font-size: 3.125rem; } @media (min-width:960px) { .form .section-title { font-size: 5rem; } } @media (max-width:640px) { .form .content-wrapper { padding-left: 0; padding-right: 0; } } /*-------------------------------------------------------------- # Loading - Sweetalert --------------------------------------------------------------*/ .main-loading { position: fixed; top: 50%; left: 50%; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); -o-transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); background-color: #fff; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; -o-border-radius: 5px; -ms-border-radius: 5px; background-image: url('../img/spinner.svg'); background-size: 100%; width: 80px; height: 80px; box-shadow: 0 0 40px rgba(0,0,0,0.05); -webkit-box-shadow: 0 0 40px rgba(0,0,0,0.05); -moz-box-shadow: 0 0 40px rgba(0,0,0,0.05); -ms-box-shadow: 0 0 40px rgba(0,0,0,0.05); -o-box-shadow: 0 0 40px rgba(0,0,0,0.05); z-index: 999999; } .swal2-modal { font-family: var(--body-font); font-style: normal; } .swal2-styled.swal2-confirm { background-color: var(--primary-color) !important; font-size: 14px; font-weight: 400; -webkit-border-radius: 0; border-radius: 0; font-family: var(--body-font); font-style: normal; font-weight: 400; margin-bottom: 20px; } .swal2-styled.swal2-confirm:hover, .swal2-styled.swal2-confirm:focus, .swal2-actions:not(.swal2-loading) .swal2-styled:hover { background-color: var(--secondary-color) !important; box-shadow: none; } .swal2-html-container { display: block; line-height: 1.6; font-family: var(--body-font) !important; } .swal2-html-container a { color: #9e7f4a; text-decoration: underline; } /* ========================== Footer ========================== */ .footer-section { padding-bottom: 60px; } .footer-section .wrapper { max-width: 940px; } .footer-section .section-title { font-size: 3.125rem; } .footer-section p { margin-bottom: 28px; } .footer-section .copyright { font-size: 0.875rem; } .footer-section .footer-bottom { padding-top: 110px; } .footer-section .footer-logo { padding-bottom: 40px; } @media (min-width:640px) { .footer-section .section-title { padding-right: 30px; } } @media (min-width:960px) { .footer-section .section-title { font-size: 4.125rem; padding-right: 30px; } .footer-section .footer-bottom { padding-top: 142px; } } @media (max-width:960px) { } /**********Mobile Menu*************/ #mobilenav { position: fixed; top: 0; left: 0; width: 100%; height: auto; transform: translateY(-100%); transition: transform 0.4s ease-in-out; z-index: 9999; } #mobilenav.active { transform: translateY(0); } .mobilenav { padding-top: 0; padding-bottom: 0; } .mobilenav .wrapper { padding-bottom: 30px; } .mobilenav .uk-nav-default { margin-top: 5px; margin-bottom: 30px; } .mobilenav .uk-nav-default>li>a { color: var(--secondary-color); font-size: 1.125rem; font-weight: 400; line-height: calc(39px * var(--scale-factor)); display: inline-flex; } /**********Intro Section*************/ .intro-section .infolist { padding-top: 48px; } .intro-section p { line-height: 1.5; } @media (min-width:960px) { .intro-section .uk-width-1-2\@m { width: 50.61%; } .intro-section .infolist { padding-top: 105px; } } @media (min-width:1200px) { .intro-section .content-wrapper { padding-left: 0; } #intro.intro-section p { max-width: 90%; } } /**********Features Section*************/ .info01-section .videobg { height: calc(436px * var(--scale-factor)); } @media (min-width:960px) { .info01-section { padding-bottom: 114px; } } @media (min-width:1200px) { .info01-section { min-height: calc(746px * var(--scale-factor)); } .info01-section .content-wrapper p { max-width: calc(457px * var(--scale-factor)); margin-bottom: 0; } .info01-section .uk-width-3-5\@l { width: 55%; } } @media (max-width:1200px) { .videocontainer .uk-container { padding-left: 0; padding-right: 0; } .videocontainer .content-wrapper { padding-top: 8px; padding-left: 15px; padding-right: 15px; } .videocontainer .content-wrapper p { margin-bottom: 0; } } /**********Features Section 02*************/ .info02-section .infolist p { color: var(--secondary-color); } .info02-section .infolist h4 { color: var(--secondary-color); font-family: var(--body-font); font-size: 1.125rem; line-height: 1.28; } .info02-section .btn-container { padding-top: 40px; } @media (min-width:960px) { .info02-section { padding-top: 92px; padding-bottom: 100px; } .info02-section .btn-container { padding-top: 93px; } } /**********Custom List*************/ .custom-list { list-style: none; padding: 0; margin: 0; } .custom-list li { position: relative; margin-bottom: 12px; color: var(--secondary-color); padding-left: 20px; } .custom-list li::before { content: "—"; position: absolute; left: 0; color: var(--secondary-color); } /**********Info03/05*************/ .info03-section p, .info05-section p { margin-bottom: 30px; } .info03-section ul, .info05-section ul { margin-bottom: 38px; } @media (min-width:960px) { .info03-section { padding-top: 128px; } .info03-section ul, .info05-section ul { margin-bottom: 60px; } } @media (min-width:1200px) { .info03-section .desc { max-width: 367px; } .info03-section .inner-left { padding-left: 94px; } } @media (max-width:960px) { .info03-section .sec-grid, .info05-section .sec-grid { align-items: center; } } /**********Info04*************/ .info04-section { padding-top: 0; } .info04-section .overlay { background: linear-gradient(to right, rgba(255, 255, 255, 0.80) 0%, rgba(255, 255, 255, 0.00) 100%); width: 63.94% } .info04-section .videobg { min-height: calc(372px * var(--scale-factor)); } .info04-section .btn-container { padding-top: 36px; } .video-tablet, .video-mobile { display: none; } @media (min-width:1200px) { .info04-section { min-height: calc(540px * var(--scale-factor)); padding-top: 70px; padding-bottom: 70px; } } @media (min-width: 640px) and (max-width: 1200px) { .video-tablet { display: block; } } @media (max-width: 640px) { .video-mobile { display: block; } } /**********Fleet*************/ .fleet-section { padding-bottom: 60px; } .fleet-section .uk-overflow-auto { overflow-x: auto; overflow-y: hidden; } .fleet-section .uk-tab::before { border: 0; } .fleet-section .uk-tab.uk-tab-scrollable { display: inline-flex; min-width: 100%; position: relative; } .fleet-section .uk-tab.uk-tab-scrollable::before { content: ""; position: absolute; left: 0; right: 0; bottom: 0; border-bottom: 2px solid rgba(4, 30, 66, 0.30); } .fleet-section .features { margin-left: -30px; margin-bottom: 0; } .fleet-section .features li { margin: 0; padding-left: 30px; display: flex; align-items: center; } .fleet-section .features li svg { margin-right: 5px; } .fleet-section p { margin-top: 0; margin-bottom: 24px; } .fleet-section .btn-container { padding-top: 45px; } .fleet-section .uk-switcher { padding-top: 48px; } .fleet-section .switcher-nav { display: flex; width: calc(60px * var(--scale-factor)); height: calc(60px * var(--scale-factor)); background: rgba(255, 255, 255, 0.30); backdrop-filter: blur(20px); align-items: center; justify-content: center; transition: background 0.3s ease; } .fleet-section .switcher-nav:hover { background: rgba(255, 255, 255, 1); } .fleet-section .uk-tab>*>a { color: rgba(4, 30, 66, 0.30); font-size: 1rem; font-weight: 400; text-transform: none; padding-bottom: 17px; outline: 0; } .fleet-section .uk-tab>.uk-active>a { color: var(--secondary-color); border-color: var(--primary-color); border-bottom-width: calc(4px * var(--scale-factor)); } .fleet-section .uk-disabled a { color: var(--primary-color); padding-left: 0 !important; } .fleet-section .uk-cover-container { max-width: none !important; } .fleet-section .uk-tab.uk-flex-nowrap { flex-wrap: nowrap; -webkit-overflow-scrolling: touch; white-space: nowrap; } .fleet-section .uk-tab.uk-flex-nowrap li { flex: 0 0 auto; } @media (min-width: 640px) { .fleet-section .uk-tab>*>a { padding-left: 20px; padding-right: 20px; } .fleet-section .switcher-nav { width: calc(80px * var(--scale-factor)); height: calc(80px * var(--scale-factor)); } } @media (min-width: 960px) { .fleet-section { padding-top: 88px; padding-bottom: 100px; } } @media (min-width: 1200px) { .fleet-section p { max-width: 400px; } .fleet-section .info-cover-img { width: 59.09%; } .fleet-section .uk-switcher { padding-top: 72px; } } @media (min-width: 1600px) { .fleet-section .uk-cover-container { max-height: 625px; } } @media (max-width: 1200px) { .fleet-section .uk-cover-container { max-height: 450px; } } @media (max-width: 960px) { .fleet-section .inner-left, .fleet-section .inner-right { padding: 0 30px; } } @media (max-width: 640px) { .fleet-section .inner-left, .fleet-section .inner-right { padding: 0 15px; } } /**********FAQs*************/ .faq-section .faqs-wrapper { max-width: 690px; margin: 0 auto } .faq-section .uk-accordion-title { font-size: 1.125rem; line-height: 1.5rem; color: var(--secondary-color); border-top: 2px solid rgba(0, 0, 0, 0.20); padding: 16px 0; position: relative; } .faq-section .uk-accordion-content { padding: 0 0 16px 0; color: var(--secondary-color); line-height: 1.43; font-size: 1rem; margin-top: 4px; } .faq-section h2 { margin-bottom: 50px; } @media (min-width: 960px) { .faq-section { padding-top: ; padding-bottom: ; } .faq-section h2 { margin-bottom: 64px; } } /**********ContactFormModal*************/ .uk-modal-container .uk-modal-dialog { width: var(--container-width); } .contact-section.uk-modal { background: #FFF; } .uk-modal .select2-container { width: 100% !important; } .uk-modal .uk-close svg:not(.customclose) { display: none; } .contact-section.uk-modal .wrapper { padding: 60px 0; } @media (min-width: 960px) { .contact-section.uk-modal .wrapper { padding: 78px 0; } .uk-modal .contacttitle { padding-left: 88px; } .uk-modal .cform { padding-right: 88px; } } @media (max-width: 640px) { [class*=uk-modal-close-] { top: 0; right: 0; } } /**********Quote Form*************/ .quote-form .uk-grid-small { margin-left: -7px; } .quote-form .uk-grid-small>* { padding-left: 7px; } .quote-form .uk-form-icon { left: 16px; } .quote-form .uk-input, .quote-form .uk-select:not([multiple]):not([size]) { height: calc(55px * var(--scale-factor)); } .quote-form .uk-button { min-height: calc(55px * var(--scale-factor)); } .quote-form .uk-tab { margin-bottom: 15px; } .quote-form .uk-tab::before { display: none; } .quote-form .uk-tab>*>a { display: flex; column-gap: .25em; padding: 5px 10px 10px; color: var(--secondary-color); border-bottom: 1px solid transparent; font-size: 1rem; text-transform: none; font-weight: 700; position: relative; } .quote-form .uk-tab>*>a::after { content: ""; position: absolute; bottom: 0; left: 0; height: calc(4px * var(--scale-factor)); background-color: var(--primary-color); width: 0; transition: width 0.3s ease-in-out; } .quote-form .uk-tab>.uk-active>a::after { width: 100%; } .btnlinks { margin-left: -5px; margin-top: 14px; } .btnlinks .btnlink { border: 0; background: none; font-size: 0.875rem; padding: 0; outline: 0; padding-left: 5px; cursor: pointer; text-decoration: underline; } .quote-form .form-group.uk-grid+.uk-grid-small { margin-top: 50px; } .quote-form .datewrapper { position: relative; } .quote-form .datewrapper::after { content: ""; position: absolute; left: 0; bottom: 0; width: 100%; height: calc(4px * var(--scale-factor)); background-color: var(--background-primary); } .yslide .uk-overflow-auto { overflow-x: auto; overflow-y: auto; -webkit-overflow-scrolling: touch; /* Hide scrollbar for IE/Edge/Firefox */ -ms-overflow-style: none; scrollbar-width: none; } /* Hide only the horizontal scrollbar in WebKit browsers */ .yslide .uk-overflow-auto::-webkit-scrollbar:horizontal { display: none; } .quote-form .uk-tab::before { border: 0; } .quote-form .uk-tab.uk-tab-scrollable { display: inline-flex; min-width: 100%; position: relative; } .quote-form .uk-tab.uk-flex-nowrap { flex-wrap: nowrap; -webkit-overflow-scrolling: touch; white-space: nowrap; } .quote-form .uk-tab.uk-flex-nowrap li { flex: 0 0 auto; } @media (min-width: 1200px) { .quote-form { padding-top: 0; padding-bottom: 0; background-color: var(--background-muted); } #intro.intro-section { padding-top: 0; } .quote-inner-wrapper { transform: translateY(-50%); padding: 32px 52px 52px; } .quote-form .uk-tab { margin-bottom: 25px; } #quote-anchor { margin-bottom: 130px; } } .flatpickr-day.selected, .flatpickr-day.startRange, .flatpickr-day.endRange, .flatpickr-day.selected.inRange, .flatpickr-day.startRange.inRange, .flatpickr-day.endRange.inRange, .flatpickr-day.selected:focus, .flatpickr-day.startRange:focus, .flatpickr-day.endRange:focus, .flatpickr-day.selected:hover, .flatpickr-day.startRange:hover, .flatpickr-day.endRange:hover, .flatpickr-day.selected.prevMonthDay, .flatpickr-day.startRange.prevMonthDay, .flatpickr-day.endRange.prevMonthDay, .flatpickr-day.selected.nextMonthDay, .flatpickr-day.startRange.nextMonthDay, .flatpickr-day.endRange.nextMonthDay { background: var(--background-primary); border-color: var(--background-primary); } .flatpickr-day { color: var(--secondary-color); max-width: 39px; height: 39px; line-height: 39px; border-radius: 0; } .flatpickr-calendar { font-size: 1rem; font-family: var(--body-font); } .flatpickr-current-month { font-size: 16px; } .flatpickr-current-month .flatpickr-monthDropdown-months, .flatpickr-current-month input.cur-year { font-weight: 700; font-family: var(--body-font); } .flatpickr-current-month { line-height: 30px; } .swal2-title { color : #041e42 !important; font-family : 'Arial Custom', Arial, sans-serif !important; } .swal2-html-container{ color : #041e42 !important; font-family : 'Arial Custom', Arial, sans-serif !important; }