@charset "UTF-8"; .g-0, .gy-0, .row { --bs-gutter-y: 0 } .collapsing, .form-control[type=file] { overflow: hidden } .dropdown-menu, .dropdown-menu-dark { --bs-dropdown-border-color: var(--bs-border-color-translucent); --bs-dropdown-divider-bg: var(--bs-border-color-translucent); --bs-dropdown-link-active-color: #fff; --bs-dropdown-link-active-bg: #0d6efd } .dropdown-header, .dropdown-item, .dropdown-toggle, .navbar-brand { white-space: nowrap } .nav, .navbar-nav { --bs-nav-link-padding-y: .5rem; --bs-nav-link-font-weight: ; list-style: none } .dropdown-item, .dropdown-item.active, .dropdown-item:active, .hero-form a:active, .hero-form a:focus, .hero-form a:hover, .manufacturers a:active, .manufacturers a:focus, .manufacturers a:hover, .nav-link, .navbar-brand, .navbar-toggler:focus, .navbar-toggler:hover, .service-spotlight a:active, .service-spotlight a:focus, .service-spotlight a:hover, .topbar-links a { text-decoration: none } :root, [data-bs-theme=light] { --bs-blue: #0d6efd; --bs-indigo: #6610f2; --bs-purple: #6f42c1; --bs-pink: #d63384; --bs-red: #dc3545; --bs-orange: #fd7e14; --bs-yellow: #ffc107; --bs-green: #198754; --bs-teal: #20c997; --bs-cyan: #0dcaf0; --bs-black: #000; --bs-white: #fff; --bs-gray: #6c757d; --bs-gray-dark: #343a40; --bs-gray-100: #f8f9fa; --bs-gray-200: #e9ecef; --bs-gray-300: #dee2e6; --bs-gray-400: #ced4da; --bs-gray-500: #adb5bd; --bs-gray-600: #6c757d; --bs-gray-700: #495057; --bs-gray-800: #343a40; --bs-gray-900: #212529; --bs-primary: #0d6efd; --bs-secondary: #6c757d; --bs-success: #198754; --bs-info: #0dcaf0; --bs-warning: #ffc107; --bs-danger: #dc3545; --bs-light: #f8f9fa; --bs-dark: #212529; --bs-primary-rgb: 0, 50, 91; --bs-secondary-rgb: 108, 117, 125; --bs-success-rgb: 25, 135, 84; --bs-info-rgb: 13, 202, 240; --bs-warning-rgb: 255, 193, 7; --bs-danger-rgb: 220, 53, 69; --bs-light-rgb: 248, 249, 250; --bs-dark-rgb: 33, 37, 41; --bs-primary-text-emphasis: #052c65; --bs-secondary-text-emphasis: #2b2f32; --bs-success-text-emphasis: #0a3622; --bs-info-text-emphasis: #055160; --bs-warning-text-emphasis: #664d03; --bs-danger-text-emphasis: #58151c; --bs-light-text-emphasis: #495057; --bs-dark-text-emphasis: #495057; --bs-primary-bg-subtle: #cfe2ff; --bs-secondary-bg-subtle: #e2e3e5; --bs-success-bg-subtle: #d1e7dd; --bs-info-bg-subtle: #cff4fc; --bs-warning-bg-subtle: #fff3cd; --bs-danger-bg-subtle: #f8d7da; --bs-light-bg-subtle: #fcfcfd; --bs-dark-bg-subtle: #ced4da; --bs-primary-border-subtle: #9ec5fe; --bs-secondary-border-subtle: #c4c8cb; --bs-success-border-subtle: #a3cfbb; --bs-info-border-subtle: #9eeaf9; --bs-warning-border-subtle: #ffe69c; --bs-danger-border-subtle: #f1aeb5; --bs-light-border-subtle: #e9ecef; --bs-dark-border-subtle: #adb5bd; --bs-white-rgb: 255, 255, 255; --bs-black-rgb: 0, 0, 0; --bs-font-sans-serif: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; --bs-font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; --bs-gradient: linear-gradient(180deg, hsla(0, 0%, 100%, .15), hsla(0, 0%, 100%, 0)); --bs-body-font-family: var(--bs-font-sans-serif); --bs-body-font-size: 1rem; --bs-body-font-weight: 400; --bs-body-line-height: 1.5; --bs-body-color: #212529; --bs-body-color-rgb: 33, 37, 41; --bs-body-bg: #fff; --bs-body-bg-rgb: 255, 255, 255; --bs-emphasis-color: #000; --bs-emphasis-color-rgb: 0, 0, 0; --bs-secondary-color: rgba(33, 37, 41, .75); --bs-secondary-color-rgb: 33, 37, 41; --bs-secondary-bg: #e9ecef; --bs-secondary-bg-rgb: 233, 236, 239; --bs-tertiary-color: rgba(33, 37, 41, .5); --bs-tertiary-color-rgb: 33, 37, 41; --bs-tertiary-bg: #f8f9fa; --bs-tertiary-bg-rgb: 248, 249, 250; --bs-heading-color: inherit; --bs-link-color: #0d6efd; --bs-link-color-rgb: 13, 110, 253; --bs-link-decoration: underline; --bs-link-hover-color: #0a58ca; --bs-link-hover-color-rgb: 10, 88, 202; --bs-code-color: #d63384; --bs-highlight-color: #212529; --bs-highlight-bg: #fff3cd; --bs-border-width: 1px; --bs-border-style: solid; --bs-border-color: #dee2e6; --bs-border-color-translucent: rgba(0, 0, 0, .175); --bs-border-radius: .375rem; --bs-border-radius-sm: .25rem; --bs-border-radius-lg: .5rem; --bs-border-radius-xl: 1rem; --bs-border-radius-xxl: 2rem; --bs-border-radius-2xl: var(--bs-border-radius-xxl); --bs-border-radius-pill: 50rem; --bs-box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .15); --bs-box-shadow-sm: 0 .125rem .25rem rgba(0, 0, 0, .075); --bs-box-shadow-lg: 0 1rem 3rem rgba(0, 0, 0, .175); --bs-box-shadow-inset: inset 0 1px 2px rgba(0, 0, 0, .075); --bs-focus-ring-width: .25rem; --bs-focus-ring-opacity: .25; --bs-focus-ring-color: rgba(13, 110, 253, .25); --bs-form-valid-color: #198754; --bs-form-valid-border-color: #198754; --bs-form-invalid-color: #dc3545; --bs-form-invalid-border-color: #dc3545 } [data-bs-theme=dark] { color-scheme: dark; --bs-body-color: #dee2e6; --bs-body-color-rgb: 222, 226, 230; --bs-body-bg: #212529; --bs-body-bg-rgb: 33, 37, 41; --bs-emphasis-color: #fff; --bs-emphasis-color-rgb: 255, 255, 255; --bs-secondary-color: rgba(222, 226, 230, .75); --bs-secondary-color-rgb: 222, 226, 230; --bs-secondary-bg: #343a40; --bs-secondary-bg-rgb: 52, 58, 64; --bs-tertiary-color: rgba(222, 226, 230, .5); --bs-tertiary-color-rgb: 222, 226, 230; --bs-tertiary-bg: #2b3035; --bs-tertiary-bg-rgb: 43, 48, 53; --bs-primary-text-emphasis: #6ea8fe; --bs-secondary-text-emphasis: #a7acb1; --bs-success-text-emphasis: #75b798; --bs-info-text-emphasis: #6edff6; --bs-warning-text-emphasis: #ffda6a; --bs-danger-text-emphasis: #ea868f; --bs-light-text-emphasis: #f8f9fa; --bs-dark-text-emphasis: #dee2e6; --bs-primary-bg-subtle: #031633; --bs-secondary-bg-subtle: #161719; --bs-success-bg-subtle: #051b11; --bs-info-bg-subtle: #032830; --bs-warning-bg-subtle: #332701; --bs-danger-bg-subtle: #2c0b0e; --bs-light-bg-subtle: #343a40; --bs-dark-bg-subtle: #1a1d20; --bs-primary-border-subtle: #084298; --bs-secondary-border-subtle: #41464b; --bs-success-border-subtle: #0f5132; --bs-info-border-subtle: #087990; --bs-warning-border-subtle: #997404; --bs-danger-border-subtle: #842029; --bs-light-border-subtle: #495057; --bs-dark-border-subtle: #343a40; --bs-heading-color: inherit; --bs-link-color: #6ea8fe; --bs-link-hover-color: #8bb9fe; --bs-link-color-rgb: 110, 168, 254; --bs-link-hover-color-rgb: 139, 185, 254; --bs-code-color: #e685b5; --bs-highlight-color: #dee2e6; --bs-highlight-bg: #664d03; --bs-border-color: #495057; --bs-border-color-translucent: hsla(0, 0%, 100%, .15); --bs-form-valid-color: #75b798; --bs-form-valid-border-color: #75b798; --bs-form-invalid-color: #ea868f; --bs-form-invalid-border-color: #ea868f } *, :after, :before { box-sizing: border-box } @media(prefers-reduced-motion:no-preference) { :root { scroll-behavior: smooth } } body { background-color: var(--bs-body-bg); color: var(--bs-body-color); font-family: var(--bs-body-font-family); font-size: var(--bs-body-font-size); font-weight: var(--bs-body-font-weight); line-height: var(--bs-body-line-height); margin: 0; text-align: var(--bs-body-text-align); -webkit-text-size-adjust: 100%; -webkit-tap-highlight-color: transparent } h1, h2, h3, h4, h5, h6 { color: var(--bs-heading-color) } dl, ol, p, ul { margin-bottom: 1rem; margin-top: 0 } ol, ul { padding-left: 2rem } .blockquote > :last-child, .faq-question, .home-hero .estimate-form-text h2, .page-intro.estimate-intro .intro-title, ol ol, ol ul, ul ol, ul ul { margin-bottom: 0 } b, strong { font-weight: bolder } .mark, mark { background-color: var(--bs-highlight-bg); color: var(--bs-highlight-color); padding: .1875em } a { color: rgba(var(--bs-link-color-rgb), var(--bs-link-opacity, 1)); text-decoration: underline } a:hover { --bs-link-color-rgb: var(--bs-link-hover-color-rgb) } a:not([href]):not([class]), a:not([href]):not([class]):hover { color: inherit; text-decoration: none } code, kbd, pre, samp { font-family: var(--bs-font-monospace); font-size: 1em } img, svg { vertical-align: middle } table { border-collapse: collapse; caption-side: bottom } .list-inline-item, label { display: inline-block } .modal-fullscreen .modal-footer, .modal-fullscreen .modal-header, button { border-radius: 0 } .form-control-plaintext:focus, button:focus:not(:focus-visible) { outline: 0 } button, input, optgroup, select, textarea { font-family: inherit; font-size: inherit; line-height: inherit; margin: 0 } button, select { text-transform: none } .form-control-color:not(:disabled):not([readonly]), .form-control[type=file]:not(:disabled):not([readonly]), [role=button], [type=button]:not(:disabled), [type=reset]:not(:disabled), [type=submit]:not(:disabled), button:not(:disabled) { cursor: pointer } select { word-wrap: normal } .awards-strip img:hover, .service-card.visible, .service-gallery-slider .slick-slide.slick-active, .trust-badges img:hover, select:disabled { opacity: 1 } [list]:not([type=date]):not([type=datetime-local]):not([type=month]):not([type=week]):not([type=time])::-webkit-calendar-picker-indicator { display: none !important } [type=button], [type=reset], [type=submit], button { -webkit-appearance: button } ::-moz-focus-inner { border-style: none; padding: 0 } textarea { resize: vertical } fieldset { border: 0; margin: 0; min-width: 0; padding: 0 } legend { float: left; font-size: calc(1.275rem + .3vw); line-height: inherit; margin-bottom: .5rem; padding: 0; width: 100% } legend + * { clear: left } ::-webkit-datetime-edit-day-field, ::-webkit-datetime-edit-fields-wrapper, ::-webkit-datetime-edit-hour-field, ::-webkit-datetime-edit-minute, ::-webkit-datetime-edit-month-field, ::-webkit-datetime-edit-text, ::-webkit-datetime-edit-year-field { padding: 0 } ::-webkit-inner-spin-button { height: auto } [type=search] { -webkit-appearance: textfield; outline-offset: -2px } ::-webkit-search-decoration { -webkit-appearance: none } ::-webkit-color-swatch-wrapper { padding: 0 } ::-webkit-file-upload-button { -webkit-appearance: button; font: inherit } ::file-selector-button { -webkit-appearance: button; font: inherit } .form-control, .form-select { -webkit-appearance: none; -moz-appearance: none } .footer-menu-list, .footer-social, .list-inline, .list-unstyled { list-style: none; padding-left: 0 } .list-inline-item:not(:last-child) { margin-right: .5rem } .initialism { font-size: .875em; text-transform: uppercase } .blockquote { font-size: 1.25rem; margin-bottom: 1rem } .blockquote-footer { color: #6c757d; font-size: .875em; margin-bottom: 1rem; margin-top: -1rem } .blockquote-footer:before { content: "›" } .img-fluid { height: auto; max-width: 100% } .container, .container-fluid, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl { --bs-gutter-x: 1.5rem; --bs-gutter-y: 0; margin-left: auto; margin-right: auto; padding-left: calc(var(--bs-gutter-x)*.5); padding-right: calc(var(--bs-gutter-x)*.5); width: 100% } :root { --bs-breakpoint-xs: 0; --bs-breakpoint-sm: 576px; --bs-breakpoint-md: 768px; --bs-breakpoint-lg: 992px; --bs-breakpoint-xl: 1200px; --bs-breakpoint-xxl: 1400px } .row { --bs-gutter-x: 1.5rem; display: flex; flex-wrap: wrap; margin-left: calc(var(--bs-gutter-x)* - .5); margin-right: calc(var(--bs-gutter-x)* - .5); margin-top: calc(var(--bs-gutter-y)* - 1) } .row > * { flex-shrink: 0; margin-top: var(--bs-gutter-y); max-width: 100%; padding-left: calc(var(--bs-gutter-x)*.5); padding-right: calc(var(--bs-gutter-x)*.5); width: 100% } .col { flex: 1 0 0 } .col-auto, .row-cols-auto > * { flex: 0 0 auto; width: auto } .col-12, .row-cols-1 > * { flex: 0 0 auto; width: 100% } .col-6, .row-cols-2 > * { flex: 0 0 auto; width: 50% } .col-4, .row-cols-3 > * { flex: 0 0 auto; width: 33.33333333% } .col-3, .row-cols-4 > * { flex: 0 0 auto; width: 25% } .row-cols-5 > * { flex: 0 0 auto; width: 20% } .col-2, .row-cols-6 > * { flex: 0 0 auto; width: 16.66666667% } .col-1, .col-5 { flex: 0 0 auto } .col-1 { width: 8.33333333% } .col-5 { width: 41.66666667% } .col-7, .col-8 { flex: 0 0 auto } .col-7 { width: 58.33333333% } .col-8 { width: 66.66666667% } .col-9 { flex: 0 0 auto; width: 75% } .col-10 { flex: 0 0 auto; width: 83.33333333% } .col-11 { flex: 0 0 auto; width: 91.66666667% } .offset-1 { margin-left: 8.33333333% } .offset-2 { margin-left: 16.66666667% } .offset-3 { margin-left: 25% } .offset-4 { margin-left: 33.33333333% } .offset-5 { margin-left: 41.66666667% } .offset-6 { margin-left: 50% } .offset-7 { margin-left: 58.33333333% } .offset-8 { margin-left: 66.66666667% } .offset-9 { margin-left: 75% } .offset-10 { margin-left: 83.33333333% } .offset-11 { margin-left: 91.66666667% } .g-0, .gx-0 { --bs-gutter-x: 0 } .g-1, .gx-1 { --bs-gutter-x: .25rem } .g-1, .gy-1 { --bs-gutter-y: .25rem } .g-2, .gx-2 { --bs-gutter-x: .5rem } .g-2, .gy-2 { --bs-gutter-y: .5rem } .g-3, .gx-3 { --bs-gutter-x: 1rem } .g-3, .gy-3 { --bs-gutter-y: 1rem } .g-4, .gx-4 { --bs-gutter-x: 1.5rem } .g-4, .gy-4 { --bs-gutter-y: 1.5rem } .g-5, .gx-5 { --bs-gutter-x: 3rem } .g-5, .gy-5 { --bs-gutter-y: 3rem } .footer-menu-list li, .form-image, .form-label { margin-bottom: .5rem } .col-form-label { font-size: inherit; line-height: 1.5; margin-bottom: 0; padding-bottom: calc(.375rem + var(--bs-border-width)); padding-top: calc(.375rem + var(--bs-border-width)) } .col-form-label-lg { font-size: 1.25rem; padding-bottom: calc(.5rem + var(--bs-border-width)); padding-top: calc(.5rem + var(--bs-border-width)) } .col-form-label-sm { font-size: .875rem; padding-bottom: calc(.25rem + var(--bs-border-width)); padding-top: calc(.25rem + var(--bs-border-width)) } .form-text { color: var(--bs-secondary-color); font-size: .875em; margin-top: .25rem } .form-control, .form-control:focus { background-color: var(--bs-body-bg); color: var(--bs-body-color) } .form-control { appearance: none; background-clip: padding-box; border: var(--bs-border-width) solid var(--bs-border-color); border-radius: var(--bs-border-radius); display: block; font-size: 1rem; font-weight: 400; line-height: 1.5; padding: .375rem .75rem; transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out; width: 100% } .form-control:focus { border-color: #86b7fe; box-shadow: 0 0 0 .25rem rgba(13, 110, 253, .25); outline: 0 } .form-control::-webkit-date-and-time-value { height: 1.5em; margin: 0; min-width: 85px } .form-control::-webkit-datetime-edit { display: block; padding: 0 } .form-control::-moz-placeholder { color: var(--bs-secondary-color); opacity: 1 } .form-control::placeholder { color: var(--bs-secondary-color); opacity: 1 } .form-control-plaintext, .form-select { color: var(--bs-body-color); line-height: 1.5; display: block } .form-control:disabled { background-color: var(--bs-secondary-bg); opacity: 1 } .form-control::-webkit-file-upload-button { margin: -.375rem -.75rem; padding: .375rem .75rem; -webkit-margin-end: .75rem; background-color: var(--bs-tertiary-bg); border: 0 solid; border-color: inherit; border-inline-end-width: var(--bs-border-width); border-radius: 0; color: var(--bs-body-color); margin-inline-end: .75rem; pointer-events: none; -webkit-transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out; transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out } .form-control::file-selector-button { margin: -.375rem -.75rem; padding: .375rem .75rem; -webkit-margin-end: .75rem; background-color: var(--bs-tertiary-bg); border: 0 solid; border-color: inherit; border-inline-end-width: var(--bs-border-width); border-radius: 0; color: var(--bs-body-color); margin-inline-end: .75rem; pointer-events: none; transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out } .form-control:hover:not(:disabled):not([readonly])::-webkit-file-upload-button { background-color: var(--bs-secondary-bg) } .form-control:hover:not(:disabled):not([readonly])::file-selector-button { background-color: var(--bs-secondary-bg) } .form-control-plaintext { background-color: transparent; border: solid transparent; border-width: var(--bs-border-width) 0; margin-bottom: 0; padding: .375rem 0; width: 100% } .form-control-plaintext.form-control-lg, .form-control-plaintext.form-control-sm { padding-left: 0; padding-right: 0 } .form-control-sm { border-radius: var(--bs-border-radius-sm); font-size: .875rem; min-height: calc(1.5em + .5rem + var(--bs-border-width)*2); padding: .25rem .5rem } .form-control-sm::-webkit-file-upload-button { margin: -.25rem -.5rem; padding: .25rem .5rem; -webkit-margin-end: .5rem; margin-inline-end: .5rem } .form-control-sm::file-selector-button { margin: -.25rem -.5rem; padding: .25rem .5rem; -webkit-margin-end: .5rem; margin-inline-end: .5rem } .form-control-lg { border-radius: var(--bs-border-radius-lg); font-size: 1.25rem; min-height: calc(1.5em + 1rem + var(--bs-border-width)*2); padding: .5rem 1rem } .form-control-lg::-webkit-file-upload-button { margin: -.5rem -1rem; padding: .5rem 1rem; -webkit-margin-end: 1rem; margin-inline-end: 1rem } .form-control-lg::file-selector-button { margin: -.5rem -1rem; padding: .5rem 1rem; -webkit-margin-end: 1rem; margin-inline-end: 1rem } textarea.form-control { min-height: calc(1.5em + .75rem + var(--bs-border-width)*2) } textarea.form-control-sm { min-height: calc(1.5em + .5rem + var(--bs-border-width)*2) } textarea.form-control-lg { min-height: calc(1.5em + 1rem + var(--bs-border-width)*2) } .form-control-color { height: calc(1.5em + .75rem + var(--bs-border-width)*2); padding: .375rem; width: 3rem } .form-control-color::-moz-color-swatch { border: 0 !important; border-radius: var(--bs-border-radius) } .form-control-color::-webkit-color-swatch { border: 0 !important; border-radius: var(--bs-border-radius) } .form-control-color.form-control-sm { height: calc(1.5em + .5rem + var(--bs-border-width)*2) } .form-control-color.form-control-lg { height: calc(1.5em + 1rem + var(--bs-border-width)*2) } .form-select { --bs-form-select-bg-img: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3E%3C/svg%3E"); appearance: none; background-color: var(--bs-body-bg); background-image: var(--bs-form-select-bg-img), var(--bs-form-select-bg-icon, none); background-position: right .75rem center; background-repeat: no-repeat; background-size: 16px 12px; border: var(--bs-border-width) solid var(--bs-border-color); border-radius: var(--bs-border-radius); font-size: 1rem; font-weight: 400; padding: .375rem 2.25rem .375rem .75rem; transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out; width: 100% } .form-check-input:focus, .form-select:focus { border-color: #86b7fe; box-shadow: 0 0 0 .25rem rgba(13, 110, 253, .25); outline: 0 } .form-select[multiple], .form-select[size]:not([size="1"]) { background-image: none; padding-right: .75rem } .form-select:disabled { background-color: var(--bs-secondary-bg) } .form-select:-moz-focusring { color: transparent; text-shadow: 0 0 0 var(--bs-body-color) } .form-select-sm { border-radius: var(--bs-border-radius-sm); font-size: .875rem; padding-bottom: .25rem; padding-left: .5rem; padding-top: .25rem } .form-select-lg { border-radius: var(--bs-border-radius-lg); font-size: 1.25rem; padding-bottom: .5rem; padding-left: 1rem; padding-top: .5rem } [data-bs-theme=dark] .form-select { --bs-form-select-bg-img: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%23dee2e6' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3E%3C/svg%3E") } .form-check { display: block; margin-bottom: .125rem; min-height: 1.5rem; padding-left: 1.5em } .form-check .form-check-input { float: left; margin-left: -1.5em } .form-check-reverse { padding-left: 0; padding-right: 1.5em; text-align: right } .form-check-reverse .form-check-input { float: right; margin-left: 0; margin-right: -1.5em } .form-check-input { --bs-form-check-bg: var(--bs-body-bg); -webkit-appearance: none; -moz-appearance: none; appearance: none; background-color: var(--bs-form-check-bg); background-image: var(--bs-form-check-bg-image); background-position: 50%; background-repeat: no-repeat; background-size: contain; border: var(--bs-border-width) solid var(--bs-border-color); flex-shrink: 0; height: 1em; margin-top: .25em; -webkit-print-color-adjust: exact; vertical-align: top; width: 1em; color-adjust: exact; print-color-adjust: exact } .form-check-input[type=checkbox] { border-radius: .25em } .form-check-input[type=radio] { border-radius: 50% } .form-check-input:active { filter: brightness(90%) } .form-check-input:checked { background-color: #0d6efd; border-color: #0d6efd } .form-check-input:checked[type=checkbox] { --bs-form-check-bg-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3E%3C/svg%3E") } .form-check-input:checked[type=radio] { --bs-form-check-bg-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3E%3Ccircle r='2' fill='%23fff'/%3E%3C/svg%3E") } .form-check-input[type=checkbox]:indeterminate { background-color: #0d6efd; border-color: #0d6efd; --bs-form-check-bg-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10h8'/%3E%3C/svg%3E") } .form-check-input:disabled { filter: none; opacity: .5; pointer-events: none } .form-check-input:disabled ~ .form-check-label, .form-check-input[disabled] ~ .form-check-label { cursor: default; opacity: .5 } .form-switch { padding-left: 2.5em } .form-switch .form-check-input { --bs-form-switch-bg: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3E%3Ccircle r='3' fill='rgba(0, 0, 0, 0.25)'/%3E%3C/svg%3E"); background-image: var(--bs-form-switch-bg); background-position: 0 0; border-radius: 2em; margin-left: -2.5em; transition: background-position .15s ease-in-out; width: 2em } .form-switch .form-check-input:focus { --bs-form-switch-bg: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3E%3Ccircle r='3' fill='%2386b7fe'/%3E%3C/svg%3E") } .form-switch .form-check-input:checked { background-position: 100%; --bs-form-switch-bg: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3E%3Ccircle r='3' fill='%23fff'/%3E%3C/svg%3E") } .form-switch.form-check-reverse { padding-left: 0; padding-right: 2.5em } .form-switch.form-check-reverse .form-check-input { margin-left: 0; margin-right: -2.5em } .form-check-inline { display: inline-block; margin-right: 1rem } .btn-check { position: absolute; clip: rect(0, 0, 0, 0); pointer-events: none } .btn-check:disabled + .btn, .btn-check[disabled] + .btn { filter: none; opacity: .65; pointer-events: none } [data-bs-theme=dark] .form-switch .form-check-input:not(:checked):not(:focus) { --bs-form-switch-bg: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3E%3Ccircle r='3' fill='rgba(255, 255, 255, 0.25)'/%3E%3C/svg%3E") } .valid-feedback { color: var(--bs-form-valid-color); display: none; font-size: .875em; margin-top: .25rem; width: 100% } .invalid-tooltip, .valid-tooltip { border-radius: var(--bs-border-radius); display: none; font-size: .875rem; margin-top: .1rem; max-width: 100%; padding: .25rem .5rem; position: absolute; z-index: 5; top: 100% } .valid-tooltip { background-color: var(--bs-success); color: #fff } .is-valid ~ .valid-feedback, .is-valid ~ .valid-tooltip, .was-validated :valid ~ .valid-feedback, .was-validated :valid ~ .valid-tooltip { display: block } .form-control.is-valid, .was-validated .form-control:valid { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%23198754' d='M2.3 6.73.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1'/%3E%3C/svg%3E"); background-position: right calc(.375em + .1875rem) center; background-repeat: no-repeat; background-size: calc(.75em + .375rem) calc(.75em + .375rem); border-color: var(--bs-form-valid-border-color); padding-right: calc(1.5em + .75rem) } .form-control.is-valid:focus, .was-validated .form-control:valid:focus { border-color: var(--bs-form-valid-border-color); box-shadow: 0 0 0 .25rem rgba(var(--bs-success-rgb), .25) } .was-validated textarea.form-control:valid, textarea.form-control.is-valid { background-position: top calc(.375em + .1875rem) right calc(.375em + .1875rem); padding-right: calc(1.5em + .75rem) } .form-select.is-valid, .was-validated .form-select:valid { border-color: var(--bs-form-valid-border-color) } .form-select.is-valid:not([multiple]):not([size]), .form-select.is-valid:not([multiple])[size="1"], .was-validated .form-select:valid:not([multiple]):not([size]), .was-validated .form-select:valid:not([multiple])[size="1"] { --bs-form-select-bg-icon: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%23198754' d='M2.3 6.73.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1'/%3E%3C/svg%3E"); background-position: right .75rem center, center right 2.25rem; background-size: 16px 12px, calc(.75em + .375rem) calc(.75em + .375rem); padding-right: 4.125rem } .form-select.is-valid:focus, .was-validated .form-select:valid:focus { border-color: var(--bs-form-valid-border-color); box-shadow: 0 0 0 .25rem rgba(var(--bs-success-rgb), .25) } .form-control-color.is-valid, .was-validated .form-control-color:valid { width: calc(3.75rem + 1.5em) } .form-check-input.is-valid, .was-validated .form-check-input:valid { border-color: var(--bs-form-valid-border-color) } .form-check-input.is-valid:checked, .was-validated .form-check-input:valid:checked { background-color: var(--bs-form-valid-color) } .form-check-input.is-valid:focus, .was-validated .form-check-input:valid:focus { box-shadow: 0 0 0 .25rem rgba(var(--bs-success-rgb), .25) } .form-check-input.is-valid ~ .form-check-label, .was-validated .form-check-input:valid ~ .form-check-label { color: var(--bs-form-valid-color) } .form-check-inline .form-check-input ~ .invalid-feedback, .form-check-inline .form-check-input ~ .valid-feedback { margin-left: .5em } .input-group > .form-control:not(:focus).is-valid, .input-group > .form-floating:not(:focus-within).is-valid, .input-group > .form-select:not(:focus).is-valid, .was-validated .input-group > .form-control:not(:focus):valid, .was-validated .input-group > .form-floating:not(:focus-within):valid, .was-validated .input-group > .form-select:not(:focus):valid { z-index: 3 } .invalid-feedback { color: var(--bs-form-invalid-color); width: 100% } .invalid-tooltip { background-color: var(--bs-danger); color: #fff } .is-invalid ~ .invalid-feedback, .is-invalid ~ .invalid-tooltip, .was-validated :invalid ~ .invalid-feedback, .was-validated :invalid ~ .invalid-tooltip { display: block } .form-control.is-invalid, .was-validated .form-control:invalid { background-position: right calc(.375em + .1875rem) center; background-repeat: no-repeat; border-color: var(--bs-form-invalid-border-color); padding-right: calc(1.5em + .75rem) } .form-control.is-invalid:focus, .was-validated .form-control:invalid:focus { border-color: var(--bs-form-invalid-border-color); box-shadow: 0 0 0 .25rem rgba(var(--bs-danger-rgb), .25) } .was-validated textarea.form-control:invalid, textarea.form-control.is-invalid { background-position: top calc(.375em + .1875rem) right calc(.375em + .1875rem); padding-right: calc(1.5em + .75rem) } .form-select.is-invalid, .was-validated .form-select:invalid { border-color: var(--bs-form-invalid-border-color) } .form-select.is-invalid:not([multiple]):not([size]), .form-select.is-invalid:not([multiple])[size="1"], .was-validated .form-select:invalid:not([multiple]):not([size]), .was-validated .form-select:invalid:not([multiple])[size="1"] { --bs-form-select-bg-icon: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23dc3545' viewBox='0 0 12 12'%3E%3Ccircle cx='6' cy='6' r='4.5'/%3E%3Cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3E%3Ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3E%3C/svg%3E"); background-position: right .75rem center, center right 2.25rem; background-size: 16px 12px, calc(.75em + .375rem) calc(.75em + .375rem); padding-right: 4.125rem } .form-select.is-invalid:focus, .was-validated .form-select:invalid:focus { border-color: var(--bs-form-invalid-border-color); box-shadow: 0 0 0 .25rem rgba(var(--bs-danger-rgb), .25) } .form-control-color.is-invalid, .was-validated .form-control-color:invalid { width: calc(3.75rem + 1.5em) } .form-check-input.is-invalid, .was-validated .form-check-input:invalid { border-color: var(--bs-form-invalid-border-color) } .form-check-input.is-invalid:checked, .was-validated .form-check-input:invalid:checked { background-color: var(--bs-form-invalid-color) } .form-check-input.is-invalid:focus, .was-validated .form-check-input:invalid:focus { box-shadow: 0 0 0 .25rem rgba(var(--bs-danger-rgb), .25) } .form-check-input.is-invalid ~ .form-check-label, .was-validated .form-check-input:invalid ~ .form-check-label { color: var(--bs-form-invalid-color) } .input-group > .form-control:not(:focus).is-invalid, .input-group > .form-floating:not(:focus-within).is-invalid, .input-group > .form-select:not(:focus).is-invalid, .was-validated .input-group > .form-control:not(:focus):invalid, .was-validated .input-group > .form-floating:not(:focus-within):invalid, .was-validated .input-group > .form-select:not(:focus):invalid { z-index: 4 } .fade { transition: opacity .15s linear } .fade:not(.show), .modal-backdrop.fade { opacity: 0 } #moreInfo[hidden], .collapse:not(.show), .mainnav-trigger span, .more-features.hidden, .navbar-expand .navbar-toggler, .navbar-expand .offcanvas .offcanvas-header, .page-intro .supporting-img, .tab-content > .tab-pane { display: none } .collapsing { height: 0; transition: height .35s } .collapsing.collapse-horizontal { height: auto; transition: width .35s; width: 0 } .dropdown, .dropdown-center, .dropend, .dropstart, .dropup, .dropup-center { position: relative } .dropdown-menu, .navbar-expand .navbar-nav .dropdown-menu { position: absolute } .dropdown-toggle:after { border-bottom: 0; border-left: .3em solid transparent; border-right: .3em solid transparent; border-top: .3em solid; content: ""; display: inline-block; margin-left: .255em; vertical-align: .255em } .dropdown-toggle:empty:after { margin-left: 0 } .dropdown-menu { --bs-dropdown-zindex: 1000; --bs-dropdown-min-width: 10rem; --bs-dropdown-padding-x: 0; --bs-dropdown-padding-y: .5rem; --bs-dropdown-spacer: .125rem; --bs-dropdown-font-size: 1rem; --bs-dropdown-color: var(--bs-body-color); --bs-dropdown-bg: var(--bs-body-bg); --bs-dropdown-border-radius: var(--bs-border-radius); --bs-dropdown-border-width: var(--bs-border-width); --bs-dropdown-inner-border-radius: calc(var(--bs-border-radius) - var(--bs-border-width)); --bs-dropdown-divider-margin-y: .5rem; --bs-dropdown-box-shadow: var(--bs-box-shadow); --bs-dropdown-link-color: var(--bs-body-color); --bs-dropdown-link-hover-color: var(--bs-body-color); --bs-dropdown-link-hover-bg: var(--bs-tertiary-bg); --bs-dropdown-link-disabled-color: var(--bs-tertiary-color); --bs-dropdown-item-padding-x: 1rem; --bs-dropdown-item-padding-y: .25rem; --bs-dropdown-header-color: #6c757d; --bs-dropdown-header-padding-x: 1rem; --bs-dropdown-header-padding-y: .5rem; background-clip: padding-box; background-color: var(--bs-dropdown-bg); border: var(--bs-dropdown-border-width) solid var(--bs-dropdown-border-color); border-radius: var(--bs-dropdown-border-radius); color: var(--bs-dropdown-color); display: none; font-size: var(--bs-dropdown-font-size); list-style: none; margin: 0; min-width: var(--bs-dropdown-min-width); padding: var(--bs-dropdown-padding-y) var(--bs-dropdown-padding-x); text-align: left; z-index: var(--bs-dropdown-zindex) } .dropdown-menu[data-bs-popper] { left: 0; margin-top: var(--bs-dropdown-spacer); top: 100% } .dropdown-menu-start { --bs-position: start } .dropdown-menu-start[data-bs-popper] { left: 0; right: auto } .dropdown-menu-end { --bs-position: end } .dropdown-menu-end[data-bs-popper] { left: auto; right: 0 } .dropdown-divider { border-top: 1px solid var(--bs-dropdown-divider-bg); height: 0; margin: var(--bs-dropdown-divider-margin-y) 0; opacity: 1; overflow: hidden } .dropdown-item { background-color: transparent; border: 0; border-radius: var(--bs-dropdown-item-border-radius, 0); clear: both; color: var(--bs-dropdown-link-color); display: block; font-weight: 400; padding: var(--bs-dropdown-item-padding-y) var(--bs-dropdown-item-padding-x); text-align: inherit; width: 100% } .dropdown-item:focus, .dropdown-item:hover { background-color: var(--bs-dropdown-link-hover-bg); color: var(--bs-dropdown-link-hover-color) } .dropdown-item.active, .dropdown-item:active { background-color: var(--bs-dropdown-link-active-bg); color: var(--bs-dropdown-link-active-color) } .dropdown-item.disabled, .dropdown-item:disabled { background-color: transparent; color: var(--bs-dropdown-link-disabled-color); pointer-events: none } .dropdown-menu.show, .tab-content > .active { display: block } .dropdown-header { color: var(--bs-dropdown-header-color); display: block; font-size: .875rem; margin-bottom: 0; padding: var(--bs-dropdown-header-padding-y) var(--bs-dropdown-header-padding-x) } .dropdown-item-text { color: var(--bs-dropdown-link-color); display: block; padding: var(--bs-dropdown-item-padding-y) var(--bs-dropdown-item-padding-x) } .dropdown-menu-dark { --bs-dropdown-color: #dee2e6; --bs-dropdown-bg: #343a40; --bs-dropdown-box-shadow: ; --bs-dropdown-link-color: #dee2e6; --bs-dropdown-link-hover-color: #fff; --bs-dropdown-link-hover-bg: hsla(0, 0%, 100%, .15); --bs-dropdown-link-disabled-color: #adb5bd; --bs-dropdown-header-color: #adb5bd } .nav { --bs-nav-link-padding-x: 1rem; --bs-nav-link-color: var(--bs-link-color); --bs-nav-link-hover-color: var(--bs-link-hover-color); --bs-nav-link-disabled-color: var(--bs-secondary-color); display: flex; flex-wrap: wrap; margin-bottom: 0; padding-left: 0 } .nav-link { background: 0; border: 0; color: var(--bs-nav-link-color); display: block; font-size: var(--bs-nav-link-font-size); font-weight: var(--bs-nav-link-font-weight); padding: var(--bs-nav-link-padding-y) var(--bs-nav-link-padding-x); transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out } .nav-link:focus, .nav-link:hover { color: var(--bs-nav-link-hover-color) } .nav-link:focus-visible { box-shadow: 0 0 0 .25rem rgba(13, 110, 253, .25); outline: 0 } .nav-link.disabled, .nav-link:disabled { color: var(--bs-nav-link-disabled-color); cursor: default; pointer-events: none } .nav-tabs { --bs-nav-tabs-border-width: var(--bs-border-width); --bs-nav-tabs-border-color: var(--bs-border-color); --bs-nav-tabs-border-radius: var(--bs-border-radius); --bs-nav-tabs-link-hover-border-color: var(--bs-secondary-bg) var(--bs-secondary-bg) var(--bs-border-color); --bs-nav-tabs-link-active-color: var(--bs-emphasis-color); --bs-nav-tabs-link-active-bg: var(--bs-body-bg); --bs-nav-tabs-link-active-border-color: var(--bs-border-color) var(--bs-border-color) var(--bs-body-bg); border-bottom: var(--bs-nav-tabs-border-width) solid var(--bs-nav-tabs-border-color) } .nav-tabs .nav-link { border: var(--bs-nav-tabs-border-width) solid transparent; border-top-left-radius: var(--bs-nav-tabs-border-radius); border-top-right-radius: var(--bs-nav-tabs-border-radius); margin-bottom: calc(var(--bs-nav-tabs-border-width)* - 1) } .nav-tabs .nav-link:focus, .nav-tabs .nav-link:hover { border-color: var(--bs-nav-tabs-link-hover-border-color); isolation: isolate } .nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active { background-color: var(--bs-nav-tabs-link-active-bg); border-color: var(--bs-nav-tabs-link-active-border-color); color: var(--bs-nav-tabs-link-active-color) } .nav-tabs .dropdown-menu { border-top-left-radius: 0; border-top-right-radius: 0; margin-top: calc(var(--bs-nav-tabs-border-width)* - 1) } .nav-pills { --bs-nav-pills-border-radius: var(--bs-border-radius); --bs-nav-pills-link-active-color: #fff; --bs-nav-pills-link-active-bg: #0d6efd } .nav-pills .nav-link { border-radius: var(--bs-nav-pills-border-radius) } .nav-pills .nav-link.active, .nav-pills .show > .nav-link { background-color: var(--bs-nav-pills-link-active-bg); color: var(--bs-nav-pills-link-active-color) } .nav-underline { --bs-nav-underline-gap: 1rem; --bs-nav-underline-border-width: .125rem; --bs-nav-underline-link-active-color: var(--bs-emphasis-color); gap: var(--bs-nav-underline-gap) } .nav-underline .nav-link { border-bottom: var(--bs-nav-underline-border-width) solid transparent; padding-left: 0; padding-right: 0 } .nav-underline .nav-link:focus, .nav-underline .nav-link:hover { border-bottom-color: currentcolor } .nav-underline .nav-link.active, .nav-underline .show > .nav-link { border-bottom-color: currentcolor; color: var(--bs-nav-underline-link-active-color); font-weight: 700 } .nav-fill .nav-item, .nav-fill > .nav-link { flex: 1 1 auto; text-align: center } .nav-justified .nav-item, .nav-justified > .nav-link { flex-basis: 0; flex-grow: 1; text-align: center } .nav-fill .nav-item .nav-link, .nav-justified .nav-item .nav-link { width: 100% } .navbar { --bs-navbar-padding-x: 0; --bs-navbar-padding-y: .5rem; --bs-navbar-color: rgba(var(--bs-emphasis-color-rgb), 0.65); --bs-navbar-hover-color: rgba(var(--bs-emphasis-color-rgb), 0.8); --bs-navbar-disabled-color: rgba(var(--bs-emphasis-color-rgb), 0.3); --bs-navbar-active-color: rgba(var(--bs-emphasis-color-rgb), 1); --bs-navbar-brand-padding-y: .3125rem; --bs-navbar-brand-margin-end: 1rem; --bs-navbar-brand-font-size: 1.25rem; --bs-navbar-brand-color: rgba(var(--bs-emphasis-color-rgb), 1); --bs-navbar-brand-hover-color: rgba(var(--bs-emphasis-color-rgb), 1); --bs-navbar-nav-link-padding-x: .5rem; --bs-navbar-toggler-padding-y: .25rem; --bs-navbar-toggler-padding-x: .75rem; --bs-navbar-toggler-font-size: 1.25rem; --bs-navbar-toggler-icon-bg: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3E%3Cpath stroke='rgba(33, 37, 41, 0.75)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E"); --bs-navbar-toggler-border-color: rgba(var(--bs-emphasis-color-rgb), 0.15); --bs-navbar-toggler-border-radius: var(--bs-border-radius); --bs-navbar-toggler-focus-width: .25rem; --bs-navbar-toggler-transition: box-shadow .15s ease-in-out; align-items: center; display: flex; flex-wrap: wrap; justify-content: space-between; padding: var(--bs-navbar-padding-y) var(--bs-navbar-padding-x) } .navbar > .container, .navbar > .container-fluid, .navbar > .container-lg, .navbar > .container-md, .navbar > .container-sm, .navbar > .container-xl, .navbar > .container-xxl { align-items: center; display: flex; flex-wrap: inherit; justify-content: space-between } .navbar-brand { color: var(--bs-navbar-brand-color); font-size: var(--bs-navbar-brand-font-size); margin-right: var(--bs-navbar-brand-margin-end); padding-bottom: var(--bs-navbar-brand-padding-y); padding-top: var(--bs-navbar-brand-padding-y) } .navbar-text, .navbar-toggler { color: var(--bs-navbar-color) } .navbar-brand:focus, .navbar-brand:hover { color: var(--bs-navbar-brand-hover-color) } .navbar-nav { --bs-nav-link-padding-x: 0; --bs-nav-link-color: var(--bs-navbar-color); --bs-nav-link-hover-color: var(--bs-navbar-hover-color); --bs-nav-link-disabled-color: var(--bs-navbar-disabled-color); display: flex; flex-direction: column; margin-bottom: 0; padding-left: 0 } .navbar-nav .nav-link.active, .navbar-nav .nav-link.show, .navbar-text a, .navbar-text a:focus, .navbar-text a:hover { color: var(--bs-navbar-active-color) } .navbar-nav .dropdown-menu { position: static } .navbar-text { padding-bottom: .5rem; padding-top: .5rem } .navbar-collapse { align-items: center; flex-basis: 100%; flex-grow: 1 } .navbar-toggler { background-color: transparent; border: var(--bs-border-width) solid var(--bs-navbar-toggler-border-color); border-radius: var(--bs-navbar-toggler-border-radius); font-size: var(--bs-navbar-toggler-font-size); line-height: 1; padding: var(--bs-navbar-toggler-padding-y) var(--bs-navbar-toggler-padding-x); transition: var(--bs-navbar-toggler-transition) } .navbar-toggler:focus { box-shadow: 0 0 0 var(--bs-navbar-toggler-focus-width); outline: 0 } .navbar-toggler-icon { background-image: var(--bs-navbar-toggler-icon-bg); background-position: 50%; background-repeat: no-repeat; background-size: 100%; display: inline-block; height: 1.5em; vertical-align: middle; width: 1.5em } .navbar-nav-scroll { max-height: var(--bs-scroll-height, 75vh); overflow-y: auto } .navbar-expand { flex-wrap: nowrap; justify-content: flex-start } .navbar-expand .navbar-nav { flex-direction: row } .navbar-expand .navbar-nav .nav-link { padding-left: var(--bs-navbar-nav-link-padding-x); padding-right: var(--bs-navbar-nav-link-padding-x) } .navbar-expand .navbar-nav-scroll { overflow: visible } .navbar-expand .navbar-collapse { display: flex !important; flex-basis: auto } .navbar-expand .offcanvas { background-color: transparent !important; border: 0 !important; flex-grow: 1; height: auto !important; position: static; transform: none !important; transition: none; visibility: visible !important; width: auto !important; z-index: auto } .navbar-expand .offcanvas .offcanvas-body { display: flex; flex-grow: 0; overflow-y: visible; padding: 0 } .navbar-dark, .navbar[data-bs-theme=dark] { --bs-navbar-color: hsla(0, 0%, 100%, .55); --bs-navbar-hover-color: hsla(0, 0%, 100%, .75); --bs-navbar-disabled-color: hsla(0, 0%, 100%, .25); --bs-navbar-active-color: #fff; --bs-navbar-brand-color: #fff; --bs-navbar-brand-hover-color: #fff; --bs-navbar-toggler-border-color: hsla(0, 0%, 100%, .1) } .navbar-dark, .navbar[data-bs-theme=dark], [data-bs-theme=dark] .navbar-toggler-icon { --bs-navbar-toggler-icon-bg: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3E%3Cpath stroke='rgba(255, 255, 255, 0.55)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E") } .breadcrumb { --bs-breadcrumb-padding-x: 0; --bs-breadcrumb-padding-y: 0; --bs-breadcrumb-margin-bottom: 1rem; --bs-breadcrumb-bg: ; --bs-breadcrumb-border-radius: ; --bs-breadcrumb-divider-color: var(--bs-secondary-color); --bs-breadcrumb-item-padding-x: .5rem; --bs-breadcrumb-item-active-color: var(--bs-secondary-color); background-color: var(--bs-breadcrumb-bg); border-radius: var(--bs-breadcrumb-border-radius); display: flex; flex-wrap: wrap; font-size: var(--bs-breadcrumb-font-size); list-style: none; margin-bottom: var(--bs-breadcrumb-margin-bottom); padding: var(--bs-breadcrumb-padding-y) var(--bs-breadcrumb-padding-x) } .breadcrumb-item + .breadcrumb-item { padding-left: var(--bs-breadcrumb-item-padding-x) } .breadcrumb-item + .breadcrumb-item:before { color: var(--bs-breadcrumb-divider-color); content: var(--bs-breadcrumb-divider, "/"); float: left; padding-right: var(--bs-breadcrumb-item-padding-x) } .breadcrumb-item.active { color: var(--bs-breadcrumb-item-active-color) } .modal { --bs-modal-zindex: 1055; --bs-modal-width: 500px; --bs-modal-padding: 1rem; --bs-modal-margin: .5rem; --bs-modal-color: ; --bs-modal-bg: var(--bs-body-bg); --bs-modal-border-color: var(--bs-border-color-translucent); --bs-modal-border-width: var(--bs-border-width); --bs-modal-border-radius: var(--bs-border-radius-lg); --bs-modal-box-shadow: var(--bs-box-shadow-sm); --bs-modal-inner-border-radius: calc(var(--bs-border-radius-lg) - var(--bs-border-width)); --bs-modal-header-padding-x: 1rem; --bs-modal-header-padding-y: 1rem; --bs-modal-header-padding: 1rem 1rem; --bs-modal-header-border-color: var(--bs-border-color); --bs-modal-header-border-width: var(--bs-border-width); --bs-modal-title-line-height: 1.5; --bs-modal-footer-gap: .5rem; --bs-modal-footer-bg: ; --bs-modal-footer-border-color: var(--bs-border-color); --bs-modal-footer-border-width: var(--bs-border-width); display: none; height: 100%; left: 0; outline: 0; overflow-x: hidden; overflow-y: auto; position: fixed; top: 0; width: 100%; z-index: var(--bs-modal-zindex) } .modal-dialog { margin: var(--bs-modal-margin); pointer-events: none; position: relative; width: auto } .modal.fade .modal-dialog { transform: translateY(-50px); transition: transform .3s ease-out } .modal.show .modal-dialog { transform: none } .modal.modal-static .modal-dialog { transform: scale(1.02) } .modal-dialog-scrollable { height: calc(100% - var(--bs-modal-margin)*2) } .modal-dialog-scrollable .modal-content { max-height: 100%; overflow: hidden } .modal-dialog-scrollable .modal-body, .modal-fullscreen .modal-body { overflow-y: auto } .modal-dialog-centered { align-items: center; display: flex; min-height: calc(100% - var(--bs-modal-margin)*2) } .modal-content { background-clip: padding-box; background-color: var(--bs-modal-bg); border: var(--bs-modal-border-width) solid var(--bs-modal-border-color); border-radius: var(--bs-modal-border-radius); color: var(--bs-modal-color); display: flex; flex-direction: column; outline: 0; pointer-events: auto; position: relative; width: 100% } .modal-footer, .modal-header { align-items: center; display: flex } .modal-backdrop { --bs-backdrop-zindex: 1050; --bs-backdrop-bg: #000; --bs-backdrop-opacity: .5; background-color: var(--bs-backdrop-bg); height: 100vh; left: 0; position: fixed; top: 0; width: 100vw; z-index: var(--bs-backdrop-zindex) } .modal-backdrop.show { opacity: var(--bs-backdrop-opacity) } .modal-header { border-bottom: var(--bs-modal-header-border-width) solid var(--bs-modal-header-border-color); border-top-left-radius: var(--bs-modal-inner-border-radius); border-top-right-radius: var(--bs-modal-inner-border-radius); flex-shrink: 0; padding: var(--bs-modal-header-padding) } .modal-header .btn-close { margin: calc(var(--bs-modal-header-padding-y)* - .5) calc(var(--bs-modal-header-padding-x)* - .5) calc(var(--bs-modal-header-padding-y)* - .5) auto; padding: calc(var(--bs-modal-header-padding-y)*.5) calc(var(--bs-modal-header-padding-x)*.5) } .modal-title { line-height: var(--bs-modal-title-line-height); margin-bottom: 0 } .modal-body { flex: 1 1 auto; padding: var(--bs-modal-padding); position: relative } .modal-footer { background-color: var(--bs-modal-footer-bg); border-bottom-left-radius: var(--bs-modal-inner-border-radius); border-bottom-right-radius: var(--bs-modal-inner-border-radius); border-top: var(--bs-modal-footer-border-width) solid var(--bs-modal-footer-border-color); flex-shrink: 0; flex-wrap: wrap; justify-content: flex-end; padding: calc(var(--bs-modal-padding) - var(--bs-modal-footer-gap)*.5) } .modal-footer > * { margin: calc(var(--bs-modal-footer-gap)*.5) } .modal-fullscreen { height: 100%; margin: 0; max-width: none; width: 100vw } .modal-fullscreen .modal-content { border: 0; border-radius: 0; height: 100% } @media(max-width:991.98px) { .modal-fullscreen-lg-down { height: 100%; margin: 0; max-width: none; width: 100vw } .modal-fullscreen-lg-down .modal-content { border: 0; border-radius: 0; height: 100% } .modal-fullscreen-lg-down .modal-footer, .modal-fullscreen-lg-down .modal-header { border-radius: 0 } .modal-fullscreen-lg-down .modal-body { overflow-y: auto } } @media(max-width:1199.98px) { .modal-fullscreen-xl-down { height: 100%; margin: 0; max-width: none; width: 100vw } .modal-fullscreen-xl-down .modal-content { border: 0; border-radius: 0; height: 100% } .modal-fullscreen-xl-down .modal-footer, .modal-fullscreen-xl-down .modal-header { border-radius: 0 } .modal-fullscreen-xl-down .modal-body { overflow-y: auto } } @media(max-width:1399.98px) { .modal-fullscreen-xxl-down { height: 100%; margin: 0; max-width: none; width: 100vw } .modal-fullscreen-xxl-down .modal-content { border: 0; border-radius: 0; height: 100% } .modal-fullscreen-xxl-down .modal-footer, .modal-fullscreen-xxl-down .modal-header { border-radius: 0 } .modal-fullscreen-xxl-down .modal-body { overflow-y: auto } } .ratio { position: relative; width: 100% } .ratio:before { content: ""; display: block; padding-top: var(--bs-aspect-ratio) } .ratio > * { height: 100%; left: 0; position: absolute; top: 0; width: 100% } .ratio-1x1 { --bs-aspect-ratio: 100% } .ratio-4x3 { --bs-aspect-ratio: 75% } .ratio-16x9 { --bs-aspect-ratio: 56.25% } .ratio-21x9 { --bs-aspect-ratio: 42.8571428571% } .fixed-top, .sticky-top { top: 0 } .fixed-bottom, .fixed-top { left: 0; position: fixed; right: 0; z-index: 1030 } .fixed-bottom, .sticky-bottom { bottom: 0 } .sticky-bottom, .sticky-top { position: -webkit-sticky; position: sticky; z-index: 1020 } .hstack { align-items: center; flex-direction: row } .hstack, .vstack { align-self: stretch; display: flex } .vstack { flex: 1 1 auto; flex-direction: column } .visually-hidden, .visually-hidden-focusable:not(:focus):not(:focus-within) { height: 1px !important; margin: -1px !important; overflow: hidden !important; padding: 0 !important; width: 1px !important; clip: rect(0, 0, 0, 0) !important; border: 0 !important; white-space: nowrap !important } .position-absolute, .visually-hidden-focusable:not(:focus):not(:focus-within):not(caption), .visually-hidden:not(caption) { position: absolute !important } .stretched-link:after { bottom: 0; content: ""; left: 0; position: absolute; right: 0; top: 0; z-index: 1 } .align-baseline { vertical-align: baseline !important } .align-top { vertical-align: top !important } .align-middle { vertical-align: middle !important } .align-bottom { vertical-align: bottom !important } .align-text-bottom { vertical-align: text-bottom !important } .align-text-top { vertical-align: text-top !important } .float-start { float: left !important } .float-end { float: right !important } .float-none { float: none !important } .object-fit-contain { -o-object-fit: contain !important; object-fit: contain !important } .object-fit-cover { -o-object-fit: cover !important; object-fit: cover !important } .object-fit-fill { -o-object-fit: fill !important; object-fit: fill !important } .object-fit-scale { -o-object-fit: scale-down !important; object-fit: scale-down !important } .object-fit-none { -o-object-fit: none !important; object-fit: none !important } .opacity-0 { opacity: 0 !important } .opacity-25 { opacity: .25 !important } .opacity-50 { opacity: .5 !important } .opacity-75 { opacity: .75 !important } .opacity-100 { opacity: 1 !important } .overflow-auto { overflow: auto !important } .overflow-hidden { overflow: hidden !important } .overflow-visible { overflow: visible !important } .overflow-scroll { overflow: scroll !important } .overflow-x-auto { overflow-x: auto !important } .overflow-x-hidden { overflow-x: hidden !important } .overflow-x-visible { overflow-x: visible !important } .overflow-x-scroll { overflow-x: scroll !important } .overflow-y-auto { overflow-y: auto !important } .overflow-y-hidden { overflow-y: hidden !important } .overflow-y-visible { overflow-y: visible !important } .overflow-y-scroll { overflow-y: scroll !important } .d-inline { display: inline !important } .d-inline-block { display: inline-block !important } .d-block { display: block !important } .d-grid { display: grid !important } .d-inline-grid { display: inline-grid !important } .d-table { display: table !important } .d-table-row { display: table-row !important } .d-table-cell { display: table-cell !important } .d-flex { display: flex !important } .d-inline-flex { display: inline-flex !important } .d-none { display: none !important } .position-static { position: static !important } .position-relative { position: relative !important } .position-fixed { position: fixed !important } .position-sticky { position: -webkit-sticky !important; position: sticky !important } .top-0 { top: 0 !important } .top-50 { top: 50% !important } .top-100 { top: 100% !important } .bottom-0 { bottom: 0 !important } .bottom-50 { bottom: 50% !important } .bottom-100 { bottom: 100% !important } .start-0 { left: 0 !important } .start-50 { left: 50% !important } .start-100 { left: 100% !important } .end-0 { right: 0 !important } .end-50 { right: 50% !important } .end-100 { right: 100% !important } .translate-middle { transform: translate(-50%, -50%) !important } .translate-middle-x { transform: translateX(-50%) !important } .translate-middle-y { transform: translateY(-50%) !important } .w-25 { width: 25% !important } .w-50 { width: 50% !important } .w-75 { width: 75% !important } .w-100 { width: 100% !important } .w-auto { width: auto !important } .mw-100 { max-width: 100% !important } .vw-100 { width: 100vw !important } .min-vw-100 { min-width: 100vw !important } .h-25 { height: 25% !important } .h-50 { height: 50% !important } .h-75 { height: 75% !important } .h-100 { height: 100% !important } .h-auto { height: auto !important } .mh-100 { max-height: 100% !important } .vh-100 { height: 100vh !important } .min-vh-100 { min-height: 100vh !important } .flex-fill { flex: 1 1 auto !important } .flex-row { flex-direction: row !important } .flex-column { flex-direction: column !important } .flex-row-reverse { flex-direction: row-reverse !important } .flex-column-reverse { flex-direction: column-reverse !important } .flex-grow-0 { flex-grow: 0 !important } .flex-grow-1 { flex-grow: 1 !important } .flex-shrink-0 { flex-shrink: 0 !important } .flex-shrink-1 { flex-shrink: 1 !important } .flex-wrap { flex-wrap: wrap !important } .flex-nowrap { flex-wrap: nowrap !important } .flex-wrap-reverse { flex-wrap: wrap-reverse !important } .justify-content-start { justify-content: flex-start !important } .justify-content-end { justify-content: flex-end !important } .justify-content-center { justify-content: center !important } .justify-content-between { justify-content: space-between !important } .justify-content-around { justify-content: space-around !important } .justify-content-evenly { justify-content: space-evenly !important } .align-items-start { align-items: flex-start !important } .align-items-end { align-items: flex-end !important } .align-items-center { align-items: center !important } .align-items-baseline { align-items: baseline !important } .align-items-stretch { align-items: stretch !important } .align-content-start { align-content: flex-start !important } .align-content-end { align-content: flex-end !important } .align-content-center { align-content: center !important } .align-content-between { align-content: space-between !important } .align-content-around { align-content: space-around !important } .align-content-stretch { align-content: stretch !important } .align-self-auto { align-self: auto !important } .align-self-start { align-self: flex-start !important } .align-self-end { align-self: flex-end !important } .align-self-center { align-self: center !important } .align-self-baseline { align-self: baseline !important } .align-self-stretch { align-self: stretch !important } .order-first { order: -1 !important } .order-0 { order: 0 !important } .order-1 { order: 1 !important } .order-2 { order: 2 !important } .order-3 { order: 3 !important } .order-4 { order: 4 !important } .order-5 { order: 5 !important } .order-last { order: 6 !important } .m-0 { margin: 0 !important } .m-1 { margin: .25rem !important } .m-2 { margin: .5rem !important } .m-3 { margin: 1rem !important } .m-4 { margin: 1.5rem !important } .m-5 { margin: 3rem !important } .m-auto { margin: auto !important } .mx-0 { margin-left: 0 !important; margin-right: 0 !important } .mx-1 { margin-left: .25rem !important; margin-right: .25rem !important } .mx-2 { margin-left: .5rem !important; margin-right: .5rem !important } .mx-3 { margin-left: 1rem !important; margin-right: 1rem !important } .mx-4 { margin-left: 1.5rem !important; margin-right: 1.5rem !important } .mx-5 { margin-left: 3rem !important; margin-right: 3rem !important } .mx-auto { margin-left: auto !important; margin-right: auto !important } .my-0 { margin-bottom: 0 !important; margin-top: 0 !important } .my-1 { margin-bottom: .25rem !important; margin-top: .25rem !important } .my-2 { margin-bottom: .5rem !important; margin-top: .5rem !important } .my-3 { margin-bottom: 1rem !important; margin-top: 1rem !important } .my-4 { margin-bottom: 1.5rem !important; margin-top: 1.5rem !important } .my-5 { margin-bottom: 3rem !important; margin-top: 3rem !important } .my-auto { margin-bottom: auto !important; margin-top: auto !important } .mt-0 { margin-top: 0 !important } .mt-1 { margin-top: .25rem !important } .mt-2 { margin-top: .5rem !important } .mt-3 { margin-top: 1rem !important } .mt-4 { margin-top: 1.5rem !important } .mt-5 { margin-top: 3rem !important } .mt-auto { margin-top: auto !important } .me-0 { margin-right: 0 !important } .me-1 { margin-right: .25rem !important } .me-2 { margin-right: .5rem !important } .me-3 { margin-right: 1rem !important } .me-4 { margin-right: 1.5rem !important } .me-5 { margin-right: 3rem !important } .me-auto { margin-right: auto !important } .mb-0 { margin-bottom: 0 !important } .mb-1 { margin-bottom: .25rem !important } .mb-2 { margin-bottom: .5rem !important } .mb-3 { margin-bottom: 1rem !important } .mb-4 { margin-bottom: 1.5rem !important } .mb-5 { margin-bottom: 3rem !important } .mb-auto { margin-bottom: auto !important } .ms-0 { margin-left: 0 !important } .ms-1 { margin-left: .25rem !important } .ms-2 { margin-left: .5rem !important } .ms-3 { margin-left: 1rem !important } .ms-4 { margin-left: 1.5rem !important } .ms-5 { margin-left: 3rem !important } .ms-auto { margin-left: auto !important } .p-0 { padding: 0 !important } .p-1 { padding: .25rem !important } .p-2 { padding: .5rem !important } .p-3 { padding: 1rem !important } .p-4 { padding: 1.5rem !important } .p-5 { padding: 3rem !important } .px-0 { padding-left: 0 !important; padding-right: 0 !important } .px-1 { padding-left: .25rem !important; padding-right: .25rem !important } .px-2 { padding-left: .5rem !important; padding-right: .5rem !important } .px-3 { padding-left: 1rem !important; padding-right: 1rem !important } .px-4 { padding-left: 1.5rem !important; padding-right: 1.5rem !important } .px-5 { padding-left: 3rem !important; padding-right: 3rem !important } .py-0 { padding-bottom: 0 !important; padding-top: 0 !important } .py-1 { padding-bottom: .25rem !important; padding-top: .25rem !important } .py-2 { padding-bottom: .5rem !important; padding-top: .5rem !important } .py-3 { padding-bottom: 1rem !important; padding-top: 1rem !important } .py-4 { padding-bottom: 1.5rem !important; padding-top: 1.5rem !important } .py-5 { padding-bottom: 3rem !important; padding-top: 3rem !important } .pt-0 { padding-top: 0 !important } .pt-1 { padding-top: .25rem !important } .pt-2 { padding-top: .5rem !important } .pt-3 { padding-top: 1rem !important } .pt-4 { padding-top: 1.5rem !important } .pt-5 { padding-top: 3rem !important } .pe-0 { padding-right: 0 !important } .pe-1 { padding-right: .25rem !important } .pe-2 { padding-right: .5rem !important } .pe-3 { padding-right: 1rem !important } .pe-4 { padding-right: 1.5rem !important } .pe-5 { padding-right: 3rem !important } .pb-0 { padding-bottom: 0 !important } .pb-1 { padding-bottom: .25rem !important } .pb-2 { padding-bottom: .5rem !important } .pb-3 { padding-bottom: 1rem !important } .pb-4 { padding-bottom: 1.5rem !important } .pb-5 { padding-bottom: 3rem !important } .ps-0 { padding-left: 0 !important } .ps-1 { padding-left: .25rem !important } .ps-2 { padding-left: .5rem !important } .ps-3 { padding-left: 1rem !important } .ps-4 { padding-left: 1.5rem !important } .ps-5 { padding-left: 3rem !important } .gap-0 { gap: 0 !important } .gap-1 { gap: .25rem !important } .gap-2 { gap: .5rem !important } .gap-3 { gap: 1rem !important } .gap-4 { gap: 1.5rem !important } .gap-5 { gap: 3rem !important } .row-gap-0 { row-gap: 0 !important } .row-gap-1 { row-gap: .25rem !important } .row-gap-2 { row-gap: .5rem !important } .row-gap-3 { row-gap: 1rem !important } .row-gap-4 { row-gap: 1.5rem !important } .row-gap-5 { row-gap: 3rem !important } .column-gap-0 { -moz-column-gap: 0 !important; column-gap: 0 !important } .column-gap-1 { -moz-column-gap: .25rem !important; column-gap: .25rem !important } .column-gap-2 { -moz-column-gap: .5rem !important; column-gap: .5rem !important } .column-gap-3 { -moz-column-gap: 1rem !important; column-gap: 1rem !important } .column-gap-4 { -moz-column-gap: 1.5rem !important; column-gap: 1.5rem !important } .column-gap-5 { -moz-column-gap: 3rem !important; column-gap: 3rem !important } .font-monospace { font-family: var(--bs-font-monospace) !important } .fs-1 { font-size: calc(1.375rem + 1.5vw) !important } .fs-2 { font-size: calc(1.325rem + .9vw) !important } .fs-3 { font-size: calc(1.3rem + .6vw) !important } .fs-4 { font-size: calc(1.275rem + .3vw) !important } .fs-5 { font-size: 1.25rem !important } .fs-6 { font-size: 1rem !important } .fst-italic { font-style: italic !important } .fst-normal { font-style: normal !important } .fw-lighter { font-weight: lighter !important } .fw-light { font-weight: 300 !important } .fw-normal { font-weight: 400 !important } .fw-medium { font-weight: 500 !important } .fw-semibold { font-weight: 600 !important } .fw-bold { font-weight: 700 !important } .fw-bolder { font-weight: bolder !important } .lh-1 { line-height: 1 !important } .lh-sm { line-height: 1.25 !important } .lh-base { line-height: 1.5 !important } .lh-lg { line-height: 2 !important } .text-start { text-align: left !important } .text-end { text-align: right !important } .text-center { text-align: center !important } @media(min-width:576px) { .container, .container-sm { max-width: 540px } .col-sm { flex: 1 0 0 } .col-sm-auto, .row-cols-sm-auto > * { flex: 0 0 auto; width: auto } .col-sm-12, .row-cols-sm-1 > * { flex: 0 0 auto; width: 100% } .col-sm-6, .row-cols-sm-2 > * { flex: 0 0 auto; width: 50% } .col-sm-4, .row-cols-sm-3 > * { flex: 0 0 auto; width: 33.33333333% } .col-sm-3, .row-cols-sm-4 > * { flex: 0 0 auto; width: 25% } .row-cols-sm-5 > * { flex: 0 0 auto; width: 20% } .col-sm-2, .row-cols-sm-6 > * { flex: 0 0 auto; width: 16.66666667% } .col-sm-1 { flex: 0 0 auto; width: 8.33333333% } .col-sm-5 { flex: 0 0 auto; width: 41.66666667% } .col-sm-7 { flex: 0 0 auto; width: 58.33333333% } .col-sm-8 { flex: 0 0 auto; width: 66.66666667% } .col-sm-9 { flex: 0 0 auto; width: 75% } .col-sm-10 { flex: 0 0 auto; width: 83.33333333% } .col-sm-11 { flex: 0 0 auto; width: 91.66666667% } .offset-sm-0 { margin-left: 0 } .offset-sm-1 { margin-left: 8.33333333% } .offset-sm-2 { margin-left: 16.66666667% } .offset-sm-3 { margin-left: 25% } .offset-sm-4 { margin-left: 33.33333333% } .offset-sm-5 { margin-left: 41.66666667% } .offset-sm-6 { margin-left: 50% } .offset-sm-7 { margin-left: 58.33333333% } .offset-sm-8 { margin-left: 66.66666667% } .offset-sm-9 { margin-left: 75% } .offset-sm-10 { margin-left: 83.33333333% } .offset-sm-11 { margin-left: 91.66666667% } .g-sm-0, .gx-sm-0 { --bs-gutter-x: 0 } .g-sm-0, .gy-sm-0 { --bs-gutter-y: 0 } .g-sm-1, .gx-sm-1 { --bs-gutter-x: .25rem } .g-sm-1, .gy-sm-1 { --bs-gutter-y: .25rem } .g-sm-2, .gx-sm-2 { --bs-gutter-x: .5rem } .g-sm-2, .gy-sm-2 { --bs-gutter-y: .5rem } .g-sm-3, .gx-sm-3 { --bs-gutter-x: 1rem } .g-sm-3, .gy-sm-3 { --bs-gutter-y: 1rem } .g-sm-4, .gx-sm-4 { --bs-gutter-x: 1.5rem } .g-sm-4, .gy-sm-4 { --bs-gutter-y: 1.5rem } .g-sm-5, .gx-sm-5 { --bs-gutter-x: 3rem } .g-sm-5, .gy-sm-5 { --bs-gutter-y: 3rem } .dropdown-menu-sm-start { --bs-position: start } .dropdown-menu-sm-start[data-bs-popper] { left: 0; right: auto } .dropdown-menu-sm-end { --bs-position: end } .dropdown-menu-sm-end[data-bs-popper] { left: auto; right: 0 } .navbar-expand-sm { flex-wrap: nowrap; justify-content: flex-start } .navbar-expand-sm .navbar-nav { flex-direction: row } .navbar-expand-sm .navbar-nav .dropdown-menu { position: absolute } .navbar-expand-sm .navbar-nav .nav-link { padding-left: var(--bs-navbar-nav-link-padding-x); padding-right: var(--bs-navbar-nav-link-padding-x) } .navbar-expand-sm .navbar-nav-scroll { overflow: visible } .navbar-expand-sm .navbar-collapse { display: flex !important; flex-basis: auto } .navbar-expand-sm .navbar-toggler, .navbar-expand-sm .offcanvas .offcanvas-header { display: none } .navbar-expand-sm .offcanvas { background-color: transparent !important; border: 0 !important; flex-grow: 1; height: auto !important; position: static; transform: none !important; transition: none; visibility: visible !important; width: auto !important; z-index: auto } .navbar-expand-sm .offcanvas .offcanvas-body { display: flex; flex-grow: 0; overflow-y: visible; padding: 0 } .modal { --bs-modal-margin: 1.75rem; --bs-modal-box-shadow: var(--bs-box-shadow) } .modal-dialog { margin-left: auto; margin-right: auto; max-width: var(--bs-modal-width) } .modal-sm { --bs-modal-width: 300px } .sticky-sm-top { top: 0 } .sticky-sm-bottom, .sticky-sm-top { position: -webkit-sticky; position: sticky; z-index: 1020 } .sticky-sm-bottom { bottom: 0 } .float-sm-start { float: left !important } .float-sm-end { float: right !important } .float-sm-none { float: none !important } .object-fit-sm-contain { -o-object-fit: contain !important; object-fit: contain !important } .object-fit-sm-cover { -o-object-fit: cover !important; object-fit: cover !important } .object-fit-sm-fill { -o-object-fit: fill !important; object-fit: fill !important } .object-fit-sm-scale { -o-object-fit: scale-down !important; object-fit: scale-down !important } .object-fit-sm-none { -o-object-fit: none !important; object-fit: none !important } .d-sm-inline { display: inline !important } .d-sm-inline-block { display: inline-block !important } .d-sm-block { display: block !important } .d-sm-grid { display: grid !important } .d-sm-inline-grid { display: inline-grid !important } .d-sm-table { display: table !important } .d-sm-table-row { display: table-row !important } .d-sm-table-cell { display: table-cell !important } .d-sm-flex { display: flex !important } .d-sm-inline-flex { display: inline-flex !important } .d-sm-none { display: none !important } .flex-sm-fill { flex: 1 1 auto !important } .flex-sm-row { flex-direction: row !important } .flex-sm-column { flex-direction: column !important } .flex-sm-row-reverse { flex-direction: row-reverse !important } .flex-sm-column-reverse { flex-direction: column-reverse !important } .flex-sm-grow-0 { flex-grow: 0 !important } .flex-sm-grow-1 { flex-grow: 1 !important } .flex-sm-shrink-0 { flex-shrink: 0 !important } .flex-sm-shrink-1 { flex-shrink: 1 !important } .flex-sm-wrap { flex-wrap: wrap !important } .flex-sm-nowrap { flex-wrap: nowrap !important } .flex-sm-wrap-reverse { flex-wrap: wrap-reverse !important } .justify-content-sm-start { justify-content: flex-start !important } .justify-content-sm-end { justify-content: flex-end !important } .justify-content-sm-center { justify-content: center !important } .justify-content-sm-between { justify-content: space-between !important } .justify-content-sm-around { justify-content: space-around !important } .justify-content-sm-evenly { justify-content: space-evenly !important } .align-items-sm-start { align-items: flex-start !important } .align-items-sm-end { align-items: flex-end !important } .align-items-sm-center { align-items: center !important } .align-items-sm-baseline { align-items: baseline !important } .align-items-sm-stretch { align-items: stretch !important } .align-content-sm-start { align-content: flex-start !important } .align-content-sm-end { align-content: flex-end !important } .align-content-sm-center { align-content: center !important } .align-content-sm-between { align-content: space-between !important } .align-content-sm-around { align-content: space-around !important } .align-content-sm-stretch { align-content: stretch !important } .align-self-sm-auto { align-self: auto !important } .align-self-sm-start { align-self: flex-start !important } .align-self-sm-end { align-self: flex-end !important } .align-self-sm-center { align-self: center !important } .align-self-sm-baseline { align-self: baseline !important } .align-self-sm-stretch { align-self: stretch !important } .order-sm-first { order: -1 !important } .order-sm-0 { order: 0 !important } .order-sm-1 { order: 1 !important } .order-sm-2 { order: 2 !important } .order-sm-3 { order: 3 !important } .order-sm-4 { order: 4 !important } .order-sm-5 { order: 5 !important } .order-sm-last { order: 6 !important } .m-sm-0 { margin: 0 !important } .m-sm-1 { margin: .25rem !important } .m-sm-2 { margin: .5rem !important } .m-sm-3 { margin: 1rem !important } .m-sm-4 { margin: 1.5rem !important } .m-sm-5 { margin: 3rem !important } .m-sm-auto { margin: auto !important } .mx-sm-0 { margin-left: 0 !important; margin-right: 0 !important } .mx-sm-1 { margin-left: .25rem !important; margin-right: .25rem !important } .mx-sm-2 { margin-left: .5rem !important; margin-right: .5rem !important } .mx-sm-3 { margin-left: 1rem !important; margin-right: 1rem !important } .mx-sm-4 { margin-left: 1.5rem !important; margin-right: 1.5rem !important } .mx-sm-5 { margin-left: 3rem !important; margin-right: 3rem !important } .mx-sm-auto { margin-left: auto !important; margin-right: auto !important } .my-sm-0 { margin-bottom: 0 !important; margin-top: 0 !important } .my-sm-1 { margin-bottom: .25rem !important; margin-top: .25rem !important } .my-sm-2 { margin-bottom: .5rem !important; margin-top: .5rem !important } .my-sm-3 { margin-bottom: 1rem !important; margin-top: 1rem !important } .my-sm-4 { margin-bottom: 1.5rem !important; margin-top: 1.5rem !important } .my-sm-5 { margin-bottom: 3rem !important; margin-top: 3rem !important } .my-sm-auto { margin-bottom: auto !important; margin-top: auto !important } .mt-sm-0 { margin-top: 0 !important } .mt-sm-1 { margin-top: .25rem !important } .mt-sm-2 { margin-top: .5rem !important } .mt-sm-3 { margin-top: 1rem !important } .mt-sm-4 { margin-top: 1.5rem !important } .mt-sm-5 { margin-top: 3rem !important } .mt-sm-auto { margin-top: auto !important } .me-sm-0 { margin-right: 0 !important } .me-sm-1 { margin-right: .25rem !important } .me-sm-2 { margin-right: .5rem !important } .me-sm-3 { margin-right: 1rem !important } .me-sm-4 { margin-right: 1.5rem !important } .me-sm-5 { margin-right: 3rem !important } .me-sm-auto { margin-right: auto !important } .mb-sm-0 { margin-bottom: 0 !important } .mb-sm-1 { margin-bottom: .25rem !important } .mb-sm-2 { margin-bottom: .5rem !important } .mb-sm-3 { margin-bottom: 1rem !important } .mb-sm-4 { margin-bottom: 1.5rem !important } .mb-sm-5 { margin-bottom: 3rem !important } .mb-sm-auto { margin-bottom: auto !important } .ms-sm-0 { margin-left: 0 !important } .ms-sm-1 { margin-left: .25rem !important } .ms-sm-2 { margin-left: .5rem !important } .ms-sm-3 { margin-left: 1rem !important } .ms-sm-4 { margin-left: 1.5rem !important } .ms-sm-5 { margin-left: 3rem !important } .ms-sm-auto { margin-left: auto !important } .p-sm-0 { padding: 0 !important } .p-sm-1 { padding: .25rem !important } .p-sm-2 { padding: .5rem !important } .p-sm-3 { padding: 1rem !important } .p-sm-4 { padding: 1.5rem !important } .p-sm-5 { padding: 3rem !important } .px-sm-0 { padding-left: 0 !important; padding-right: 0 !important } .px-sm-1 { padding-left: .25rem !important; padding-right: .25rem !important } .px-sm-2 { padding-left: .5rem !important; padding-right: .5rem !important } .px-sm-3 { padding-left: 1rem !important; padding-right: 1rem !important } .px-sm-4 { padding-left: 1.5rem !important; padding-right: 1.5rem !important } .px-sm-5 { padding-left: 3rem !important; padding-right: 3rem !important } .py-sm-0 { padding-bottom: 0 !important; padding-top: 0 !important } .py-sm-1 { padding-bottom: .25rem !important; padding-top: .25rem !important } .py-sm-2 { padding-bottom: .5rem !important; padding-top: .5rem !important } .py-sm-3 { padding-bottom: 1rem !important; padding-top: 1rem !important } .py-sm-4 { padding-bottom: 1.5rem !important; padding-top: 1.5rem !important } .py-sm-5 { padding-bottom: 3rem !important; padding-top: 3rem !important } .pt-sm-0 { padding-top: 0 !important } .pt-sm-1 { padding-top: .25rem !important } .pt-sm-2 { padding-top: .5rem !important } .pt-sm-3 { padding-top: 1rem !important } .pt-sm-4 { padding-top: 1.5rem !important } .pt-sm-5 { padding-top: 3rem !important } .pe-sm-0 { padding-right: 0 !important } .pe-sm-1 { padding-right: .25rem !important } .pe-sm-2 { padding-right: .5rem !important } .pe-sm-3 { padding-right: 1rem !important } .pe-sm-4 { padding-right: 1.5rem !important } .pe-sm-5 { padding-right: 3rem !important } .pb-sm-0 { padding-bottom: 0 !important } .pb-sm-1 { padding-bottom: .25rem !important } .pb-sm-2 { padding-bottom: .5rem !important } .pb-sm-3 { padding-bottom: 1rem !important } .pb-sm-4 { padding-bottom: 1.5rem !important } .pb-sm-5 { padding-bottom: 3rem !important } .ps-sm-0 { padding-left: 0 !important } .ps-sm-1 { padding-left: .25rem !important } .ps-sm-2 { padding-left: .5rem !important } .ps-sm-3 { padding-left: 1rem !important } .ps-sm-4 { padding-left: 1.5rem !important } .ps-sm-5 { padding-left: 3rem !important } .gap-sm-0 { gap: 0 !important } .gap-sm-1 { gap: .25rem !important } .gap-sm-2 { gap: .5rem !important } .gap-sm-3 { gap: 1rem !important } .gap-sm-4 { gap: 1.5rem !important } .gap-sm-5 { gap: 3rem !important } .row-gap-sm-0 { row-gap: 0 !important } .row-gap-sm-1 { row-gap: .25rem !important } .row-gap-sm-2 { row-gap: .5rem !important } .row-gap-sm-3 { row-gap: 1rem !important } .row-gap-sm-4 { row-gap: 1.5rem !important } .row-gap-sm-5 { row-gap: 3rem !important } .column-gap-sm-0 { -moz-column-gap: 0 !important; column-gap: 0 !important } .column-gap-sm-1 { -moz-column-gap: .25rem !important; column-gap: .25rem !important } .column-gap-sm-2 { -moz-column-gap: .5rem !important; column-gap: .5rem !important } .column-gap-sm-3 { -moz-column-gap: 1rem !important; column-gap: 1rem !important } .column-gap-sm-4 { -moz-column-gap: 1.5rem !important; column-gap: 1.5rem !important } .column-gap-sm-5 { -moz-column-gap: 3rem !important; column-gap: 3rem !important } .text-sm-start { text-align: left !important } .text-sm-end { text-align: right !important } .text-sm-center { text-align: center !important } } @media(min-width:768px) { .container, .container-md, .container-sm { max-width: 720px } .col-md { flex: 1 0 0 } .col-md-auto, .row-cols-md-auto > * { flex: 0 0 auto; width: auto } .col-md-12, .row-cols-md-1 > * { flex: 0 0 auto; width: 100% } .col-md-6, .row-cols-md-2 > * { flex: 0 0 auto; width: 50% } .col-md-4, .row-cols-md-3 > * { flex: 0 0 auto; width: 33.33333333% } .col-md-3, .row-cols-md-4 > * { flex: 0 0 auto; width: 25% } .row-cols-md-5 > * { flex: 0 0 auto; width: 20% } .col-md-2, .row-cols-md-6 > * { flex: 0 0 auto; width: 16.66666667% } .col-md-1 { flex: 0 0 auto; width: 8.33333333% } .col-md-5 { flex: 0 0 auto; width: 41.66666667% } .col-md-7 { flex: 0 0 auto; width: 58.33333333% } .col-md-8 { flex: 0 0 auto; width: 66.66666667% } .col-md-9 { flex: 0 0 auto; width: 75% } .col-md-10 { flex: 0 0 auto; width: 83.33333333% } .col-md-11 { flex: 0 0 auto; width: 91.66666667% } .offset-md-0 { margin-left: 0 } .offset-md-1 { margin-left: 8.33333333% } .offset-md-2 { margin-left: 16.66666667% } .offset-md-3 { margin-left: 25% } .offset-md-4 { margin-left: 33.33333333% } .offset-md-5 { margin-left: 41.66666667% } .offset-md-6 { margin-left: 50% } .offset-md-7 { margin-left: 58.33333333% } .offset-md-8 { margin-left: 66.66666667% } .offset-md-9 { margin-left: 75% } .offset-md-10 { margin-left: 83.33333333% } .offset-md-11 { margin-left: 91.66666667% } .g-md-0, .gx-md-0 { --bs-gutter-x: 0 } .g-md-0, .gy-md-0 { --bs-gutter-y: 0 } .g-md-1, .gx-md-1 { --bs-gutter-x: .25rem } .g-md-1, .gy-md-1 { --bs-gutter-y: .25rem } .g-md-2, .gx-md-2 { --bs-gutter-x: .5rem } .g-md-2, .gy-md-2 { --bs-gutter-y: .5rem } .g-md-3, .gx-md-3 { --bs-gutter-x: 1rem } .g-md-3, .gy-md-3 { --bs-gutter-y: 1rem } .g-md-4, .gx-md-4 { --bs-gutter-x: 1.5rem } .g-md-4, .gy-md-4 { --bs-gutter-y: 1.5rem } .g-md-5, .gx-md-5 { --bs-gutter-x: 3rem } .g-md-5, .gy-md-5 { --bs-gutter-y: 3rem } .dropdown-menu-md-start { --bs-position: start } .dropdown-menu-md-start[data-bs-popper] { left: 0; right: auto } .dropdown-menu-md-end { --bs-position: end } .dropdown-menu-md-end[data-bs-popper] { left: auto; right: 0 } .navbar-expand-md { flex-wrap: nowrap; justify-content: flex-start } .navbar-expand-md .navbar-nav { flex-direction: row } .navbar-expand-md .navbar-nav .dropdown-menu { position: absolute } .navbar-expand-md .navbar-nav .nav-link { padding-left: var(--bs-navbar-nav-link-padding-x); padding-right: var(--bs-navbar-nav-link-padding-x) } .navbar-expand-md .navbar-nav-scroll { overflow: visible } .navbar-expand-md .navbar-collapse { display: flex !important; flex-basis: auto } .navbar-expand-md .navbar-toggler, .navbar-expand-md .offcanvas .offcanvas-header { display: none } .navbar-expand-md .offcanvas { background-color: transparent !important; border: 0 !important; flex-grow: 1; height: auto !important; position: static; transform: none !important; transition: none; visibility: visible !important; width: auto !important; z-index: auto } .navbar-expand-md .offcanvas .offcanvas-body { display: flex; flex-grow: 0; overflow-y: visible; padding: 0 } .sticky-md-top { top: 0 } .sticky-md-bottom, .sticky-md-top { position: -webkit-sticky; position: sticky; z-index: 1020 } .sticky-md-bottom { bottom: 0 } .float-md-start { float: left !important } .float-md-end { float: right !important } .float-md-none { float: none !important } .object-fit-md-contain { -o-object-fit: contain !important; object-fit: contain !important } .object-fit-md-cover { -o-object-fit: cover !important; object-fit: cover !important } .object-fit-md-fill { -o-object-fit: fill !important; object-fit: fill !important } .object-fit-md-scale { -o-object-fit: scale-down !important; object-fit: scale-down !important } .object-fit-md-none { -o-object-fit: none !important; object-fit: none !important } .d-md-inline { display: inline !important } .d-md-inline-block { display: inline-block !important } .d-md-block { display: block !important } .d-md-grid { display: grid !important } .d-md-inline-grid { display: inline-grid !important } .d-md-table { display: table !important } .d-md-table-row { display: table-row !important } .d-md-table-cell { display: table-cell !important } .d-md-flex { display: flex !important } .d-md-inline-flex { display: inline-flex !important } .d-md-none { display: none !important } .flex-md-fill { flex: 1 1 auto !important } .flex-md-row { flex-direction: row !important } .flex-md-column { flex-direction: column !important } .flex-md-row-reverse { flex-direction: row-reverse !important } .flex-md-column-reverse { flex-direction: column-reverse !important } .flex-md-grow-0 { flex-grow: 0 !important } .flex-md-grow-1 { flex-grow: 1 !important } .flex-md-shrink-0 { flex-shrink: 0 !important } .flex-md-shrink-1 { flex-shrink: 1 !important } .flex-md-wrap { flex-wrap: wrap !important } .flex-md-nowrap { flex-wrap: nowrap !important } .flex-md-wrap-reverse { flex-wrap: wrap-reverse !important } .justify-content-md-start { justify-content: flex-start !important } .justify-content-md-end { justify-content: flex-end !important } .justify-content-md-center { justify-content: center !important } .justify-content-md-between { justify-content: space-between !important } .justify-content-md-around { justify-content: space-around !important } .justify-content-md-evenly { justify-content: space-evenly !important } .align-items-md-start { align-items: flex-start !important } .align-items-md-end { align-items: flex-end !important } .align-items-md-center { align-items: center !important } .align-items-md-baseline { align-items: baseline !important } .align-items-md-stretch { align-items: stretch !important } .align-content-md-start { align-content: flex-start !important } .align-content-md-end { align-content: flex-end !important } .align-content-md-center { align-content: center !important } .align-content-md-between { align-content: space-between !important } .align-content-md-around { align-content: space-around !important } .align-content-md-stretch { align-content: stretch !important } .align-self-md-auto { align-self: auto !important } .align-self-md-start { align-self: flex-start !important } .align-self-md-end { align-self: flex-end !important } .align-self-md-center { align-self: center !important } .align-self-md-baseline { align-self: baseline !important } .align-self-md-stretch { align-self: stretch !important } .order-md-first { order: -1 !important } .order-md-0 { order: 0 !important } .order-md-1 { order: 1 !important } .order-md-2 { order: 2 !important } .order-md-3 { order: 3 !important } .order-md-4 { order: 4 !important } .order-md-5 { order: 5 !important } .order-md-last { order: 6 !important } .m-md-0 { margin: 0 !important } .m-md-1 { margin: .25rem !important } .m-md-2 { margin: .5rem !important } .m-md-3 { margin: 1rem !important } .m-md-4 { margin: 1.5rem !important } .m-md-5 { margin: 3rem !important } .m-md-auto { margin: auto !important } .mx-md-0 { margin-left: 0 !important; margin-right: 0 !important } .mx-md-1 { margin-left: .25rem !important; margin-right: .25rem !important } .mx-md-2 { margin-left: .5rem !important; margin-right: .5rem !important } .mx-md-3 { margin-left: 1rem !important; margin-right: 1rem !important } .mx-md-4 { margin-left: 1.5rem !important; margin-right: 1.5rem !important } .mx-md-5 { margin-left: 3rem !important; margin-right: 3rem !important } .mx-md-auto { margin-left: auto !important; margin-right: auto !important } .my-md-0 { margin-bottom: 0 !important; margin-top: 0 !important } .my-md-1 { margin-bottom: .25rem !important; margin-top: .25rem !important } .my-md-2 { margin-bottom: .5rem !important; margin-top: .5rem !important } .my-md-3 { margin-bottom: 1rem !important; margin-top: 1rem !important } .my-md-4 { margin-bottom: 1.5rem !important; margin-top: 1.5rem !important } .my-md-5 { margin-bottom: 3rem !important; margin-top: 3rem !important } .my-md-auto { margin-bottom: auto !important; margin-top: auto !important } .mt-md-0 { margin-top: 0 !important } .mt-md-1 { margin-top: .25rem !important } .mt-md-2 { margin-top: .5rem !important } .mt-md-3 { margin-top: 1rem !important } .mt-md-4 { margin-top: 1.5rem !important } .mt-md-5 { margin-top: 3rem !important } .mt-md-auto { margin-top: auto !important } .me-md-0 { margin-right: 0 !important } .me-md-1 { margin-right: .25rem !important } .me-md-2 { margin-right: .5rem !important } .me-md-3 { margin-right: 1rem !important } .me-md-4 { margin-right: 1.5rem !important } .me-md-5 { margin-right: 3rem !important } .me-md-auto { margin-right: auto !important } .mb-md-0 { margin-bottom: 0 !important } .mb-md-1 { margin-bottom: .25rem !important } .mb-md-2 { margin-bottom: .5rem !important } .mb-md-3 { margin-bottom: 1rem !important } .mb-md-4 { margin-bottom: 1.5rem !important } .mb-md-5 { margin-bottom: 3rem !important } .mb-md-auto { margin-bottom: auto !important } .ms-md-0 { margin-left: 0 !important } .ms-md-1 { margin-left: .25rem !important } .ms-md-2 { margin-left: .5rem !important } .ms-md-3 { margin-left: 1rem !important } .ms-md-4 { margin-left: 1.5rem !important } .ms-md-5 { margin-left: 3rem !important } .ms-md-auto { margin-left: auto !important } .p-md-0 { padding: 0 !important } .p-md-1 { padding: .25rem !important } .p-md-2 { padding: .5rem !important } .p-md-3 { padding: 1rem !important } .p-md-4 { padding: 1.5rem !important } .p-md-5 { padding: 3rem !important } .px-md-0 { padding-left: 0 !important; padding-right: 0 !important } .px-md-1 { padding-left: .25rem !important; padding-right: .25rem !important } .px-md-2 { padding-left: .5rem !important; padding-right: .5rem !important } .px-md-3 { padding-left: 1rem !important; padding-right: 1rem !important } .px-md-4 { padding-left: 1.5rem !important; padding-right: 1.5rem !important } .px-md-5 { padding-left: 3rem !important; padding-right: 3rem !important } .py-md-0 { padding-bottom: 0 !important; padding-top: 0 !important } .py-md-1 { padding-bottom: .25rem !important; padding-top: .25rem !important } .py-md-2 { padding-bottom: .5rem !important; padding-top: .5rem !important } .py-md-3 { padding-bottom: 1rem !important; padding-top: 1rem !important } .py-md-4 { padding-bottom: 1.5rem !important; padding-top: 1.5rem !important } .py-md-5 { padding-bottom: 3rem !important; padding-top: 3rem !important } .pt-md-0 { padding-top: 0 !important } .pt-md-1 { padding-top: .25rem !important } .pt-md-2 { padding-top: .5rem !important } .pt-md-3 { padding-top: 1rem !important } .pt-md-4 { padding-top: 1.5rem !important } .pt-md-5 { padding-top: 3rem !important } .pe-md-0 { padding-right: 0 !important } .pe-md-1 { padding-right: .25rem !important } .pe-md-2 { padding-right: .5rem !important } .pe-md-3 { padding-right: 1rem !important } .pe-md-4 { padding-right: 1.5rem !important } .pe-md-5 { padding-right: 3rem !important } .pb-md-0 { padding-bottom: 0 !important } .pb-md-1 { padding-bottom: .25rem !important } .pb-md-2 { padding-bottom: .5rem !important } .pb-md-3 { padding-bottom: 1rem !important } .pb-md-4 { padding-bottom: 1.5rem !important } .pb-md-5 { padding-bottom: 3rem !important } .ps-md-0 { padding-left: 0 !important } .ps-md-1 { padding-left: .25rem !important } .ps-md-2 { padding-left: .5rem !important } .ps-md-3 { padding-left: 1rem !important } .ps-md-4 { padding-left: 1.5rem !important } .ps-md-5 { padding-left: 3rem !important } .gap-md-0 { gap: 0 !important } .gap-md-1 { gap: .25rem !important } .gap-md-2 { gap: .5rem !important } .gap-md-3 { gap: 1rem !important } .gap-md-4 { gap: 1.5rem !important } .gap-md-5 { gap: 3rem !important } .row-gap-md-0 { row-gap: 0 !important } .row-gap-md-1 { row-gap: .25rem !important } .row-gap-md-2 { row-gap: .5rem !important } .row-gap-md-3 { row-gap: 1rem !important } .row-gap-md-4 { row-gap: 1.5rem !important } .row-gap-md-5 { row-gap: 3rem !important } .column-gap-md-0 { -moz-column-gap: 0 !important; column-gap: 0 !important } .column-gap-md-1 { -moz-column-gap: .25rem !important; column-gap: .25rem !important } .column-gap-md-2 { -moz-column-gap: .5rem !important; column-gap: .5rem !important } .column-gap-md-3 { -moz-column-gap: 1rem !important; column-gap: 1rem !important } .column-gap-md-4 { -moz-column-gap: 1.5rem !important; column-gap: 1.5rem !important } .column-gap-md-5 { -moz-column-gap: 3rem !important; column-gap: 3rem !important } .text-md-start { text-align: left !important } .text-md-end { text-align: right !important } .text-md-center { text-align: center !important } } @media(min-width:992px) { .container, .container-lg, .container-md, .container-sm { max-width: 960px } .col-lg { flex: 1 0 0 } .col-lg-auto, .row-cols-lg-auto > * { flex: 0 0 auto; width: auto } .col-lg-12, .row-cols-lg-1 > * { flex: 0 0 auto; width: 100% } .col-lg-6, .row-cols-lg-2 > * { flex: 0 0 auto; width: 50% } .col-lg-4, .row-cols-lg-3 > * { flex: 0 0 auto; width: 33.33333333% } .col-lg-3, .row-cols-lg-4 > * { flex: 0 0 auto; width: 25% } .row-cols-lg-5 > * { flex: 0 0 auto; width: 20% } .col-lg-2, .row-cols-lg-6 > * { flex: 0 0 auto; width: 16.66666667% } .col-lg-1 { flex: 0 0 auto; width: 8.33333333% } .col-lg-5 { flex: 0 0 auto; width: 41.66666667% } .col-lg-7 { flex: 0 0 auto; width: 58.33333333% } .col-lg-8 { flex: 0 0 auto; width: 66.66666667% } .col-lg-9 { flex: 0 0 auto; width: 75% } .col-lg-10 { flex: 0 0 auto; width: 83.33333333% } .col-lg-11 { flex: 0 0 auto; width: 91.66666667% } .offset-lg-0 { margin-left: 0 } .offset-lg-1 { margin-left: 8.33333333% } .offset-lg-2 { margin-left: 16.66666667% } .offset-lg-3 { margin-left: 25% } .offset-lg-4 { margin-left: 33.33333333% } .offset-lg-5 { margin-left: 41.66666667% } .offset-lg-6 { margin-left: 50% } .offset-lg-7 { margin-left: 58.33333333% } .offset-lg-8 { margin-left: 66.66666667% } .offset-lg-9 { margin-left: 75% } .offset-lg-10 { margin-left: 83.33333333% } .offset-lg-11 { margin-left: 91.66666667% } .g-lg-0, .gx-lg-0 { --bs-gutter-x: 0 } .g-lg-0, .gy-lg-0 { --bs-gutter-y: 0 } .g-lg-1, .gx-lg-1 { --bs-gutter-x: .25rem } .g-lg-1, .gy-lg-1 { --bs-gutter-y: .25rem } .g-lg-2, .gx-lg-2 { --bs-gutter-x: .5rem } .g-lg-2, .gy-lg-2 { --bs-gutter-y: .5rem } .g-lg-3, .gx-lg-3 { --bs-gutter-x: 1rem } .g-lg-3, .gy-lg-3 { --bs-gutter-y: 1rem } .g-lg-4, .gx-lg-4 { --bs-gutter-x: 1.5rem } .g-lg-4, .gy-lg-4 { --bs-gutter-y: 1.5rem } .g-lg-5, .gx-lg-5 { --bs-gutter-x: 3rem } .g-lg-5, .gy-lg-5 { --bs-gutter-y: 3rem } .dropdown-menu-lg-start { --bs-position: start } .dropdown-menu-lg-start[data-bs-popper] { left: 0; right: auto } .dropdown-menu-lg-end { --bs-position: end } .dropdown-menu-lg-end[data-bs-popper] { left: auto; right: 0 } .navbar-expand-lg { flex-wrap: nowrap; justify-content: flex-start } .navbar-expand-lg .navbar-nav { flex-direction: row } .navbar-expand-lg .navbar-nav .dropdown-menu { position: absolute } .navbar-expand-lg .navbar-nav .nav-link { padding-left: var(--bs-navbar-nav-link-padding-x); padding-right: var(--bs-navbar-nav-link-padding-x) } .navbar-expand-lg .navbar-nav-scroll { overflow: visible } .navbar-expand-lg .navbar-collapse { display: flex !important; flex-basis: auto } .navbar-expand-lg .navbar-toggler, .navbar-expand-lg .offcanvas .offcanvas-header { display: none } .navbar-expand-lg .offcanvas { background-color: transparent !important; border: 0 !important; flex-grow: 1; height: auto !important; position: static; transform: none !important; transition: none; visibility: visible !important; width: auto !important; z-index: auto } .navbar-expand-lg .offcanvas .offcanvas-body { display: flex; flex-grow: 0; overflow-y: visible; padding: 0 } .modal-lg, .modal-xl { --bs-modal-width: 800px } .sticky-lg-top { top: 0 } .sticky-lg-bottom, .sticky-lg-top { position: -webkit-sticky; position: sticky; z-index: 1020 } .sticky-lg-bottom { bottom: 0 } .float-lg-start { float: left !important } .float-lg-end { float: right !important } .float-lg-none { float: none !important } .object-fit-lg-contain { -o-object-fit: contain !important; object-fit: contain !important } .object-fit-lg-cover { -o-object-fit: cover !important; object-fit: cover !important } .object-fit-lg-fill { -o-object-fit: fill !important; object-fit: fill !important } .object-fit-lg-scale { -o-object-fit: scale-down !important; object-fit: scale-down !important } .object-fit-lg-none { -o-object-fit: none !important; object-fit: none !important } .d-lg-inline { display: inline !important } .d-lg-inline-block { display: inline-block !important } .d-lg-block { display: block !important } .d-lg-grid { display: grid !important } .d-lg-inline-grid { display: inline-grid !important } .d-lg-table { display: table !important } .d-lg-table-row { display: table-row !important } .d-lg-table-cell { display: table-cell !important } .d-lg-flex { display: flex !important } .d-lg-inline-flex { display: inline-flex !important } .d-lg-none { display: none !important } .flex-lg-fill { flex: 1 1 auto !important } .flex-lg-row { flex-direction: row !important } .flex-lg-column { flex-direction: column !important } .flex-lg-row-reverse { flex-direction: row-reverse !important } .flex-lg-column-reverse { flex-direction: column-reverse !important } .flex-lg-grow-0 { flex-grow: 0 !important } .flex-lg-grow-1 { flex-grow: 1 !important } .flex-lg-shrink-0 { flex-shrink: 0 !important } .flex-lg-shrink-1 { flex-shrink: 1 !important } .flex-lg-wrap { flex-wrap: wrap !important } .flex-lg-nowrap { flex-wrap: nowrap !important } .flex-lg-wrap-reverse { flex-wrap: wrap-reverse !important } .justify-content-lg-start { justify-content: flex-start !important } .justify-content-lg-end { justify-content: flex-end !important } .justify-content-lg-center { justify-content: center !important } .justify-content-lg-between { justify-content: space-between !important } .justify-content-lg-around { justify-content: space-around !important } .justify-content-lg-evenly { justify-content: space-evenly !important } .align-items-lg-start { align-items: flex-start !important } .align-items-lg-end { align-items: flex-end !important } .align-items-lg-center { align-items: center !important } .align-items-lg-baseline { align-items: baseline !important } .align-items-lg-stretch { align-items: stretch !important } .align-content-lg-start { align-content: flex-start !important } .align-content-lg-end { align-content: flex-end !important } .align-content-lg-center { align-content: center !important } .align-content-lg-between { align-content: space-between !important } .align-content-lg-around { align-content: space-around !important } .align-content-lg-stretch { align-content: stretch !important } .align-self-lg-auto { align-self: auto !important } .align-self-lg-start { align-self: flex-start !important } .align-self-lg-end { align-self: flex-end !important } .align-self-lg-center { align-self: center !important } .align-self-lg-baseline { align-self: baseline !important } .align-self-lg-stretch { align-self: stretch !important } .order-lg-first { order: -1 !important } .order-lg-0 { order: 0 !important } .order-lg-1 { order: 1 !important } .order-lg-2 { order: 2 !important } .order-lg-3 { order: 3 !important } .order-lg-4 { order: 4 !important } .order-lg-5 { order: 5 !important } .order-lg-last { order: 6 !important } .m-lg-0 { margin: 0 !important } .m-lg-1 { margin: .25rem !important } .m-lg-2 { margin: .5rem !important } .m-lg-3 { margin: 1rem !important } .m-lg-4 { margin: 1.5rem !important } .m-lg-5 { margin: 3rem !important } .m-lg-auto { margin: auto !important } .mx-lg-0 { margin-left: 0 !important; margin-right: 0 !important } .mx-lg-1 { margin-left: .25rem !important; margin-right: .25rem !important } .mx-lg-2 { margin-left: .5rem !important; margin-right: .5rem !important } .mx-lg-3 { margin-left: 1rem !important; margin-right: 1rem !important } .mx-lg-4 { margin-left: 1.5rem !important; margin-right: 1.5rem !important } .mx-lg-5 { margin-left: 3rem !important; margin-right: 3rem !important } .mx-lg-auto { margin-left: auto !important; margin-right: auto !important } .my-lg-0 { margin-bottom: 0 !important; margin-top: 0 !important } .my-lg-1 { margin-bottom: .25rem !important; margin-top: .25rem !important } .my-lg-2 { margin-bottom: .5rem !important; margin-top: .5rem !important } .my-lg-3 { margin-bottom: 1rem !important; margin-top: 1rem !important } .my-lg-4 { margin-bottom: 1.5rem !important; margin-top: 1.5rem !important } .my-lg-5 { margin-bottom: 3rem !important; margin-top: 3rem !important } .my-lg-auto { margin-bottom: auto !important; margin-top: auto !important } .mt-lg-0 { margin-top: 0 !important } .mt-lg-1 { margin-top: .25rem !important } .mt-lg-2 { margin-top: .5rem !important } .mt-lg-3 { margin-top: 1rem !important } .mt-lg-4 { margin-top: 1.5rem !important } .mt-lg-5 { margin-top: 3rem !important } .mt-lg-auto { margin-top: auto !important } .me-lg-0 { margin-right: 0 !important } .me-lg-1 { margin-right: .25rem !important } .me-lg-2 { margin-right: .5rem !important } .me-lg-3 { margin-right: 1rem !important } .me-lg-4 { margin-right: 1.5rem !important } .me-lg-5 { margin-right: 3rem !important } .me-lg-auto { margin-right: auto !important } .mb-lg-0 { margin-bottom: 0 !important } .mb-lg-1 { margin-bottom: .25rem !important } .mb-lg-2 { margin-bottom: .5rem !important } .mb-lg-3 { margin-bottom: 1rem !important } .mb-lg-4 { margin-bottom: 1.5rem !important } .mb-lg-5 { margin-bottom: 3rem !important } .mb-lg-auto { margin-bottom: auto !important } .ms-lg-0 { margin-left: 0 !important } .ms-lg-1 { margin-left: .25rem !important } .ms-lg-2 { margin-left: .5rem !important } .ms-lg-3 { margin-left: 1rem !important } .ms-lg-4 { margin-left: 1.5rem !important } .ms-lg-5 { margin-left: 3rem !important } .ms-lg-auto { margin-left: auto !important } .p-lg-0 { padding: 0 !important } .p-lg-1 { padding: .25rem !important } .p-lg-2 { padding: .5rem !important } .p-lg-3 { padding: 1rem !important } .p-lg-4 { padding: 1.5rem !important } .p-lg-5 { padding: 3rem !important } .px-lg-0 { padding-left: 0 !important; padding-right: 0 !important } .px-lg-1 { padding-left: .25rem !important; padding-right: .25rem !important } .px-lg-2 { padding-left: .5rem !important; padding-right: .5rem !important } .px-lg-3 { padding-left: 1rem !important; padding-right: 1rem !important } .px-lg-4 { padding-left: 1.5rem !important; padding-right: 1.5rem !important } .px-lg-5 { padding-left: 3rem !important; padding-right: 3rem !important } .py-lg-0 { padding-bottom: 0 !important; padding-top: 0 !important } .py-lg-1 { padding-bottom: .25rem !important; padding-top: .25rem !important } .py-lg-2 { padding-bottom: .5rem !important; padding-top: .5rem !important } .py-lg-3 { padding-bottom: 1rem !important; padding-top: 1rem !important } .py-lg-4 { padding-bottom: 1.5rem !important; padding-top: 1.5rem !important } .py-lg-5 { padding-bottom: 3rem !important; padding-top: 3rem !important } .pt-lg-0 { padding-top: 0 !important } .pt-lg-1 { padding-top: .25rem !important } .pt-lg-2 { padding-top: .5rem !important } .pt-lg-3 { padding-top: 1rem !important } .pt-lg-4 { padding-top: 1.5rem !important } .pt-lg-5 { padding-top: 3rem !important } .pe-lg-0 { padding-right: 0 !important } .pe-lg-1 { padding-right: .25rem !important } .pe-lg-2 { padding-right: .5rem !important } .pe-lg-3 { padding-right: 1rem !important } .pe-lg-4 { padding-right: 1.5rem !important } .pe-lg-5 { padding-right: 3rem !important } .pb-lg-0 { padding-bottom: 0 !important } .pb-lg-1 { padding-bottom: .25rem !important } .pb-lg-2 { padding-bottom: .5rem !important } .pb-lg-3 { padding-bottom: 1rem !important } .pb-lg-4 { padding-bottom: 1.5rem !important } .pb-lg-5 { padding-bottom: 3rem !important } .ps-lg-0 { padding-left: 0 !important } .ps-lg-1 { padding-left: .25rem !important } .ps-lg-2 { padding-left: .5rem !important } .ps-lg-3 { padding-left: 1rem !important } .ps-lg-4 { padding-left: 1.5rem !important } .ps-lg-5 { padding-left: 3rem !important } .gap-lg-0 { gap: 0 !important } .gap-lg-1 { gap: .25rem !important } .gap-lg-2 { gap: .5rem !important } .gap-lg-3 { gap: 1rem !important } .gap-lg-4 { gap: 1.5rem !important } .gap-lg-5 { gap: 3rem !important } .row-gap-lg-0 { row-gap: 0 !important } .row-gap-lg-1 { row-gap: .25rem !important } .row-gap-lg-2 { row-gap: .5rem !important } .row-gap-lg-3 { row-gap: 1rem !important } .row-gap-lg-4 { row-gap: 1.5rem !important } .row-gap-lg-5 { row-gap: 3rem !important } .column-gap-lg-0 { -moz-column-gap: 0 !important; column-gap: 0 !important } .column-gap-lg-1 { -moz-column-gap: .25rem !important; column-gap: .25rem !important } .column-gap-lg-2 { -moz-column-gap: .5rem !important; column-gap: .5rem !important } .column-gap-lg-3 { -moz-column-gap: 1rem !important; column-gap: 1rem !important } .column-gap-lg-4 { -moz-column-gap: 1.5rem !important; column-gap: 1.5rem !important } .column-gap-lg-5 { -moz-column-gap: 3rem !important; column-gap: 3rem !important } .text-lg-start { text-align: left !important } .text-lg-end { text-align: right !important } .text-lg-center { text-align: center !important } } @media(min-width:1200px) { .h1, h1 { font-size: 2.5rem } .h2, h2 { font-size: 2rem } .h3, h3 { font-size: 1.75rem } .h4, h4, legend { font-size: 1.5rem } .container, .container-lg, .container-md, .container-sm, .container-xl { max-width: 1140px } .col-xl { flex: 1 0 0 } .col-xl-auto, .row-cols-xl-auto > * { flex: 0 0 auto; width: auto } .col-xl-12, .row-cols-xl-1 > * { flex: 0 0 auto; width: 100% } .col-xl-6, .row-cols-xl-2 > * { flex: 0 0 auto; width: 50% } .col-xl-4, .row-cols-xl-3 > * { flex: 0 0 auto; width: 33.33333333% } .col-xl-3, .row-cols-xl-4 > * { flex: 0 0 auto; width: 25% } .row-cols-xl-5 > * { flex: 0 0 auto; width: 20% } .col-xl-2, .row-cols-xl-6 > * { flex: 0 0 auto; width: 16.66666667% } .col-xl-1 { flex: 0 0 auto; width: 8.33333333% } .col-xl-5 { flex: 0 0 auto; width: 41.66666667% } .col-xl-7 { flex: 0 0 auto; width: 58.33333333% } .col-xl-8 { flex: 0 0 auto; width: 66.66666667% } .col-xl-9 { flex: 0 0 auto; width: 75% } .col-xl-10 { flex: 0 0 auto; width: 83.33333333% } .col-xl-11 { flex: 0 0 auto; width: 91.66666667% } .offset-xl-0 { margin-left: 0 } .offset-xl-1 { margin-left: 8.33333333% } .offset-xl-2 { margin-left: 16.66666667% } .offset-xl-3 { margin-left: 25% } .offset-xl-4 { margin-left: 33.33333333% } .offset-xl-5 { margin-left: 41.66666667% } .offset-xl-6 { margin-left: 50% } .offset-xl-7 { margin-left: 58.33333333% } .offset-xl-8 { margin-left: 66.66666667% } .offset-xl-9 { margin-left: 75% } .offset-xl-10 { margin-left: 83.33333333% } .offset-xl-11 { margin-left: 91.66666667% } .g-xl-0, .gx-xl-0 { --bs-gutter-x: 0 } .g-xl-0, .gy-xl-0 { --bs-gutter-y: 0 } .g-xl-1, .gx-xl-1 { --bs-gutter-x: .25rem } .g-xl-1, .gy-xl-1 { --bs-gutter-y: .25rem } .g-xl-2, .gx-xl-2 { --bs-gutter-x: .5rem } .g-xl-2, .gy-xl-2 { --bs-gutter-y: .5rem } .g-xl-3, .gx-xl-3 { --bs-gutter-x: 1rem } .g-xl-3, .gy-xl-3 { --bs-gutter-y: 1rem } .g-xl-4, .gx-xl-4 { --bs-gutter-x: 1.5rem } .g-xl-4, .gy-xl-4 { --bs-gutter-y: 1.5rem } .g-xl-5, .gx-xl-5 { --bs-gutter-x: 3rem } .g-xl-5, .gy-xl-5 { --bs-gutter-y: 3rem } .dropdown-menu-xl-start { --bs-position: start } .dropdown-menu-xl-start[data-bs-popper] { left: 0; right: auto } .dropdown-menu-xl-end { --bs-position: end } .dropdown-menu-xl-end[data-bs-popper] { left: auto; right: 0 } .navbar-expand-xl { flex-wrap: nowrap; justify-content: flex-start } .navbar-expand-xl .navbar-nav { flex-direction: row } .navbar-expand-xl .navbar-nav .dropdown-menu { position: absolute } .navbar-expand-xl .navbar-nav .nav-link { padding-left: var(--bs-navbar-nav-link-padding-x); padding-right: var(--bs-navbar-nav-link-padding-x) } .navbar-expand-xl .navbar-nav-scroll { overflow: visible } .navbar-expand-xl .navbar-collapse { display: flex !important; flex-basis: auto } .navbar-expand-xl .navbar-toggler, .navbar-expand-xl .offcanvas .offcanvas-header { display: none } .navbar-expand-xl .offcanvas { background-color: transparent !important; border: 0 !important; flex-grow: 1; height: auto !important; position: static; transform: none !important; transition: none; visibility: visible !important; width: auto !important; z-index: auto } .navbar-expand-xl .offcanvas .offcanvas-body { display: flex; flex-grow: 0; overflow-y: visible; padding: 0 } .modal-xl { --bs-modal-width: 1140px } .sticky-xl-top { top: 0 } .sticky-xl-bottom, .sticky-xl-top { position: -webkit-sticky; position: sticky; z-index: 1020 } .sticky-xl-bottom { bottom: 0 } .float-xl-start { float: left !important } .float-xl-end { float: right !important } .float-xl-none { float: none !important } .object-fit-xl-contain { -o-object-fit: contain !important; object-fit: contain !important } .object-fit-xl-cover { -o-object-fit: cover !important; object-fit: cover !important } .object-fit-xl-fill { -o-object-fit: fill !important; object-fit: fill !important } .object-fit-xl-scale { -o-object-fit: scale-down !important; object-fit: scale-down !important } .object-fit-xl-none { -o-object-fit: none !important; object-fit: none !important } .d-xl-inline { display: inline !important } .d-xl-inline-block { display: inline-block !important } .d-xl-block { display: block !important } .d-xl-grid { display: grid !important } .d-xl-inline-grid { display: inline-grid !important } .d-xl-table { display: table !important } .d-xl-table-row { display: table-row !important } .d-xl-table-cell { display: table-cell !important } .d-xl-flex { display: flex !important } .d-xl-inline-flex { display: inline-flex !important } .d-xl-none { display: none !important } .flex-xl-fill { flex: 1 1 auto !important } .flex-xl-row { flex-direction: row !important } .flex-xl-column { flex-direction: column !important } .flex-xl-row-reverse { flex-direction: row-reverse !important } .flex-xl-column-reverse { flex-direction: column-reverse !important } .flex-xl-grow-0 { flex-grow: 0 !important } .flex-xl-grow-1 { flex-grow: 1 !important } .flex-xl-shrink-0 { flex-shrink: 0 !important } .flex-xl-shrink-1 { flex-shrink: 1 !important } .flex-xl-wrap { flex-wrap: wrap !important } .flex-xl-nowrap { flex-wrap: nowrap !important } .flex-xl-wrap-reverse { flex-wrap: wrap-reverse !important } .justify-content-xl-start { justify-content: flex-start !important } .justify-content-xl-end { justify-content: flex-end !important } .justify-content-xl-center { justify-content: center !important } .justify-content-xl-between { justify-content: space-between !important } .justify-content-xl-around { justify-content: space-around !important } .justify-content-xl-evenly { justify-content: space-evenly !important } .align-items-xl-start { align-items: flex-start !important } .align-items-xl-end { align-items: flex-end !important } .align-items-xl-center { align-items: center !important } .align-items-xl-baseline { align-items: baseline !important } .align-items-xl-stretch { align-items: stretch !important } .align-content-xl-start { align-content: flex-start !important } .align-content-xl-end { align-content: flex-end !important } .align-content-xl-center { align-content: center !important } .align-content-xl-between { align-content: space-between !important } .align-content-xl-around { align-content: space-around !important } .align-content-xl-stretch { align-content: stretch !important } .align-self-xl-auto { align-self: auto !important } .align-self-xl-start { align-self: flex-start !important } .align-self-xl-end { align-self: flex-end !important } .align-self-xl-center { align-self: center !important } .align-self-xl-baseline { align-self: baseline !important } .align-self-xl-stretch { align-self: stretch !important } .order-xl-first { order: -1 !important } .order-xl-0 { order: 0 !important } .order-xl-1 { order: 1 !important } .order-xl-2 { order: 2 !important } .order-xl-3 { order: 3 !important } .order-xl-4 { order: 4 !important } .order-xl-5 { order: 5 !important } .order-xl-last { order: 6 !important } .m-xl-0 { margin: 0 !important } .m-xl-1 { margin: .25rem !important } .m-xl-2 { margin: .5rem !important } .m-xl-3 { margin: 1rem !important } .m-xl-4 { margin: 1.5rem !important } .m-xl-5 { margin: 3rem !important } .m-xl-auto { margin: auto !important } .mx-xl-0 { margin-left: 0 !important; margin-right: 0 !important } .mx-xl-1 { margin-left: .25rem !important; margin-right: .25rem !important } .mx-xl-2 { margin-left: .5rem !important; margin-right: .5rem !important } .mx-xl-3 { margin-left: 1rem !important; margin-right: 1rem !important } .mx-xl-4 { margin-left: 1.5rem !important; margin-right: 1.5rem !important } .mx-xl-5 { margin-left: 3rem !important; margin-right: 3rem !important } .mx-xl-auto { margin-left: auto !important; margin-right: auto !important } .my-xl-0 { margin-bottom: 0 !important; margin-top: 0 !important } .my-xl-1 { margin-bottom: .25rem !important; margin-top: .25rem !important } .my-xl-2 { margin-bottom: .5rem !important; margin-top: .5rem !important } .my-xl-3 { margin-bottom: 1rem !important; margin-top: 1rem !important } .my-xl-4 { margin-bottom: 1.5rem !important; margin-top: 1.5rem !important } .my-xl-5 { margin-bottom: 3rem !important; margin-top: 3rem !important } .my-xl-auto { margin-bottom: auto !important; margin-top: auto !important } .mt-xl-0 { margin-top: 0 !important } .mt-xl-1 { margin-top: .25rem !important } .mt-xl-2 { margin-top: .5rem !important } .mt-xl-3 { margin-top: 1rem !important } .mt-xl-4 { margin-top: 1.5rem !important } .mt-xl-5 { margin-top: 3rem !important } .mt-xl-auto { margin-top: auto !important } .me-xl-0 { margin-right: 0 !important } .me-xl-1 { margin-right: .25rem !important } .me-xl-2 { margin-right: .5rem !important } .me-xl-3 { margin-right: 1rem !important } .me-xl-4 { margin-right: 1.5rem !important } .me-xl-5 { margin-right: 3rem !important } .me-xl-auto { margin-right: auto !important } .mb-xl-0 { margin-bottom: 0 !important } .mb-xl-1 { margin-bottom: .25rem !important } .mb-xl-2 { margin-bottom: .5rem !important } .mb-xl-3 { margin-bottom: 1rem !important } .mb-xl-4 { margin-bottom: 1.5rem !important } .mb-xl-5 { margin-bottom: 3rem !important } .mb-xl-auto { margin-bottom: auto !important } .ms-xl-0 { margin-left: 0 !important } .ms-xl-1 { margin-left: .25rem !important } .ms-xl-2 { margin-left: .5rem !important } .ms-xl-3 { margin-left: 1rem !important } .ms-xl-4 { margin-left: 1.5rem !important } .ms-xl-5 { margin-left: 3rem: !important } .ms-xl-auto { margin-left: auto !important } .p-xl-0 { padding: 0 !important } .p-xl-1 { padding: .25rem !important } .p-xl-2 { padding: .5rem !important } .p-xl-3 { padding: 1rem !important } .p-xl-4 { padding: 1.5rem !important } .p-xl-5 { padding: 3rem !important } .px-xl-0 { padding-left: 0 !important; padding-right: 0 !important } .px-xl-1 { padding-left: .25rem !important; padding-right: .25rem !important } .px-xl-2 { padding-left: .5rem !important; padding-right: .5rem !important } .px-xl-3 { padding-left: 1rem !important; padding-right: 1rem !important } .px-xl-4 { padding-left: 1.5rem !important; padding-right: 1.5rem !important } .px-xl-5 { padding-left: 3rem !important; padding-right: 3rem !important } .py-xl-0 { padding-bottom: 0 !important; padding-top: 0 !important } .py-xl-1 { padding-bottom: .25rem !important; padding-top: .25rem !important } .py-xl-2 { padding-bottom: .5rem !important; padding-top: .5rem !important } .py-xl-3 { padding-bottom: 1rem !important; padding-top: 1rem !important } .py-xl-4 { padding-bottom: 1.5rem !important; padding-top: 1.5rem !important } .py-xl-5 { padding-bottom: 3rem !important; padding-top: 3rem !important } .pt-xl-0 { padding-top: 0 !important } .pt-xl-1 { padding-top: .25rem !important } .pt-xl-2 { padding-top: .5rem !important } .pt-xl-3 { padding-top: 1rem !important } .pt-xl-4 { padding-top: 1.5rem !important } .pt-xl-5 { padding-top: 3rem !important } .pe-xl-0 { padding-right: 0 !important } .pe-xl-1 { padding-right: .25rem !important } .pe-xl-2 { padding-right: .5rem !important } .pe-xl-3 { padding-right: 1rem !important } .pe-xl-4 { padding-right: 1.5rem !important } .pe-xl-5 { padding-right: 3rem !important } .pb-xl-0 { padding-bottom: 0 !important } .pb-xl-1 { padding-bottom: .25rem !important } .pb-xl-2 { padding-bottom: .5rem !important } .pb-xl-3 { padding-bottom: 1rem !important } .pb-xl-4 { padding-bottom: 1.5rem !important } .pb-xl-5 { padding-bottom: 3rem !important } .ps-xl-0 { padding-left: 0 !important } .ps-xl-1 { padding-left: .25rem !important } .ps-xl-2 { padding-left: .5rem !important } .ps-xl-3 { padding-left: 1rem !important } .ps-xl-4 { padding-left: 1.5rem !important } .ps-xl-5 { padding-left: 3rem !important } .gap-xl-0 { gap: 0 !important } .gap-xl-1 { gap: .25rem !important } .gap-xl-2 { gap: .5rem !important } .gap-xl-3 { gap: 1rem !important } .gap-xl-4 { gap: 1.5rem !important } .gap-xl-5 { gap: 3rem !important } .row-gap-xl-0 { row-gap: 0 !important } .row-gap-xl-1 { row-gap: .25rem !important } .row-gap-xl-2 { row-gap: .5rem !important } .row-gap-xl-3 { row-gap: 1rem !important } .row-gap-xl-4 { row-gap: 1.5rem !important } .row-gap-xl-5 { row-gap: 3rem !important } .column-gap-xl-0 { -moz-column-gap: 0 !important; column-gap: 0 !important } .column-gap-xl-1 { -moz-column-gap: .25rem !important; column-gap: .25rem !important } .column-gap-xl-2 { -moz-column-gap: .5rem !important; column-gap: .5rem !important } .column-gap-xl-3 { -moz-column-gap: 1rem !important; column-gap: 1rem !important } .column-gap-xl-4 { -moz-column-gap: 1.5rem !important; column-gap: 1.5rem !important } .column-gap-xl-5 { -moz-column-gap: 3rem !important; column-gap: 3rem !important } .text-xl-start { text-align: left !important } .text-xl-end { text-align: right !important } .text-xl-center { text-align: center !important } .fs-1 { font-size: 2.5rem !important } .fs-2 { font-size: 2rem !important } .fs-3 { font-size: 1.75rem !important } .fs-4 { font-size: 1.5rem !important } } @media(min-width:1400px) { .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl { max-width: 1320px } .col-xxl { flex: 1 0 0 } .col-xxl-auto, .row-cols-xxl-auto > * { flex: 0 0 auto; width: auto } .col-xxl-12, .row-cols-xxl-1 > * { flex: 0 0 auto; width: 100% } .col-xxl-6, .row-cols-xxl-2 > * { flex: 0 0 auto; width: 50% } .col-xxl-4, .row-cols-xxl-3 > * { flex: 0 0 auto; width: 33.33333333% } .col-xxl-3, .row-cols-xxl-4 > * { flex: 0 0 auto; width: 25% } .row-cols-xxl-5 > * { flex: 0 0 auto; width: 20% } .col-xxl-2, .row-cols-xxl-6 > * { flex: 0 0 auto; width: 16.66666667% } .col-xxl-1 { flex: 0 0 auto; width: 8.33333333% } .col-xxl-5 { flex: 0 0 auto; width: 41.66666667% } .col-xxl-7 { flex: 0 0 auto; width: 58.33333333% } .col-xxl-8 { flex: 0 0 auto; width: 66.66666667% } .col-xxl-9 { flex: 0 0 auto; width: 75% } .col-xxl-10 { flex: 0 0 auto; width: 83.33333333% } .col-xxl-11 { flex: 0 0 auto; width: 91.66666667% } .offset-xxl-0 { margin-left: 0 } .offset-xxl-1 { margin-left: 8.33333333% } .offset-xxl-2 { margin-left: 16.66666667% } .offset-xxl-3 { margin-left: 25% } .offset-xxl-4 { margin-left: 33.33333333% } .offset-xxl-5 { margin-left: 41.66666667% } .offset-xxl-6 { margin-left: 50% } .offset-xxl-7 { margin-left: 58.33333333% } .offset-xxl-8 { margin-left: 66.66666667% } .offset-xxl-9 { margin-left: 75% } .offset-xxl-10 { margin-left: 83.33333333% } .offset-xxl-11 { margin-left: 91.66666667% } .g-xxl-0, .gx-xxl-0 { --bs-gutter-x: 0 } .g-xxl-0, .gy-xxl-0 { --bs-gutter-y: 0 } .g-xxl-1, .gx-xxl-1 { --bs-gutter-x: .25rem } .g-xxl-1, .gy-xxl-1 { --bs-gutter-y: .25rem } .g-xxl-2, .gx-xxl-2 { --bs-gutter-x: .5rem } .g-xxl-2, .gy-xxl-2 { --bs-gutter-y: .5rem } .g-xxl-3, .gx-xxl-3 { --bs-gutter-x: 1rem } .g-xxl-3, .gy-xxl-3 { --bs-gutter-y: 1rem } .g-xxl-4, .gx-xxl-4 { --bs-gutter-x: 1.5rem } .g-xxl-4, .gy-xxl-4 { --bs-gutter-y: 1.5rem } .g-xxl-5, .gx-xxl-5 { --bs-gutter-x: 3rem } .g-xxl-5, .gy-xxl-5 { --bs-gutter-y: 3rem } .dropdown-menu-xxl-start { --bs-position: start } .dropdown-menu-xxl-start[data-bs-popper] { left: 0; right: auto } .dropdown-menu-xxl-end { --bs-position: end } .dropdown-menu-xxl-end[data-bs-popper] { left: auto; right: 0 } .navbar-expand-xxl { flex-wrap: nowrap; justify-content: flex-start } .navbar-expand-xxl .navbar-nav { flex-direction: row } .navbar-expand-xxl .navbar-nav .dropdown-menu { position: absolute } .navbar-expand-xxl .navbar-nav .nav-link { padding-left: var(--bs-navbar-nav-link-padding-x); padding-right: var(--bs-navbar-nav-link-padding-x) } .navbar-expand-xxl .navbar-nav-scroll { overflow: visible } .navbar-expand-xxl .navbar-collapse { display: flex !important; flex-basis: auto } .navbar-expand-xxl .navbar-toggler, .navbar-expand-xxl .offcanvas .offcanvas-header { display: none } .navbar-expand-xxl .offcanvas { background-color: transparent !important; border: 0 !important; flex-grow: 1; height: auto !important; position: static; transform: none !important; transition: none; visibility: visible !important; width: auto !important; z-index: auto } .navbar-expand-xxl .offcanvas .offcanvas-body { display: flex; flex-grow: 0; overflow-y: visible; padding: 0 } .sticky-xxl-top { top: 0 } .sticky-xxl-bottom, .sticky-xxl-top { position: -webkit-sticky; position: sticky; z-index: 1020 } .sticky-xxl-bottom { bottom: 0 } .float-xxl-start { float: left !important } .float-xxl-end { float: right !important } .float-xxl-none { float: none !important } .object-fit-xxl-contain { -o-object-fit: contain !important; object-fit: contain !important } .object-fit-xxl-cover { -o-object-fit: cover !important; object-fit: cover !important } .object-fit-xxl-fill { -o-object-fit: fill !important; object-fit: fill !important } .object-fit-xxl-scale { -o-object-fit: scale-down !important; object-fit: scale-down !important } .object-fit-xxl-none { -o-object-fit: none !important; object-fit: none !important } .d-xxl-inline { display: inline !important } .d-xxl-inline-block { display: inline-block !important } .d-xxl-block { display: block !important } .d-xxl-grid { display: grid !important } .d-xxl-inline-grid { display: inline-grid !important } .d-xxl-table { display: table !important } .d-xxl-table-row { display: table-row !important } .d-xxl-table-cell { display: table-cell !important } .d-xxl-flex { display: flex !important } .d-xxl-inline-flex { display: inline-flex !important } .d-xxl-none { display: none !important } .flex-xxl-fill { flex: 1 1 auto !important } .flex-xxl-row { flex-direction: row !important } .flex-xxl-column { flex-direction: column !important } .flex-xxl-row-reverse { flex-direction: row-reverse !important } .flex-xxl-column-reverse { flex-direction: column-reverse !important } .flex-xxl-grow-0 { flex-grow: 0 !important } .flex-xxl-grow-1 { flex-grow: 1 !important } .flex-xxl-shrink-0 { flex-shrink: 0 !important } .flex-xxl-shrink-1 { flex-shrink: 1 !important } .flex-xxl-wrap { flex-wrap: wrap !important } .flex-xxl-nowrap { flex-wrap: nowrap !important } .flex-xxl-wrap-reverse { flex-wrap: wrap-reverse !important } .justify-content-xxl-start { justify-content: flex-start !important } .justify-content-xxl-end { justify-content: flex-end !important } .justify-content-xxl-center { justify-content: center !important } .justify-content-xxl-between { justify-content: space-between !important } .justify-content-xxl-around { justify-content: space-around !important } .justify-content-xxl-evenly { justify-content: space-evenly !important } .align-items-xxl-start { align-items: flex-start !important } .align-items-xxl-end { align-items: flex-end !important } .align-items-xxl-center { align-items: center !important } .align-items-xxl-baseline { align-items: baseline !important } .align-items-xxl-stretch { align-items: stretch !important } .align-content-xxl-start { align-content: flex-start !important } .align-content-xxl-end { align-content: flex-end !important } .align-content-xxl-center { align-content: center !important } .align-content-xxl-between { align-content: space-between !important } .align-content-xxl-around { align-content: space-around !important } .align-content-xxl-stretch { align-content: stretch !important } .align-self-xxl-auto { align-self: auto !important } .align-self-xxl-start { align-self: flex-start !important } .align-self-xxl-end { align-self: flex-end !important } .align-self-xxl-center { align-self: center !important } .align-self-xxl-baseline { align-self: baseline !important } .align-self-xxl-stretch { align-self: stretch !important } .order-xxl-first { order: -1 !important } .order-xxl-0 { order: 0 !important } .order-xxl-1 { order: 1 !important } .order-xxl-2 { order: 2 !important } .order-xxl-3 { order: 3 !important } .order-xxl-4 { order: 4 !important } .order-xxl-5 { order: 5 !important } .order-xxl-last { order: 6 !important } .m-xxl-0 { margin: 0 !important } .m-xxl-1 { margin: .25rem !important } .m-xxl-2 { margin: .5rem !important } .m-xxl-3 { margin: 1rem !important } .m-xxl-4 { margin: 1.5rem !important } .m-xxl-5 { margin: 3rem !important } .m-xxl-auto { margin: auto !important } .mx-xxl-0 { margin-left: 0 !important; margin-right: 0 !important } .mx-xxl-1 { margin-left: .25rem !important; margin-right: .25rem !important } .mx-xxl-2 { margin-left: .5rem !important; margin-right: .5rem !important } .mx-xxl-3 { margin-left: 1rem !important; margin-right: 1rem !important } .mx-xxl-4 { margin-left: 1.5rem !important; margin-right: 1.5rem !important } .mx-xxl-5 { margin-left: 3rem !important; margin-right: 3rem !important } .mx-xxl-auto { margin-left: auto !important; margin-right: auto !important } .my-xxl-0 { margin-bottom: 0 !important; margin-top: 0 !important } .my-xxl-1 { margin-bottom: .25rem !important; margin-top: .25rem !important } .my-xxl-2 { margin-bottom: .5rem !important; margin-top: .5rem !important } .my-xxl-3 { margin-bottom: 1rem !important; margin-top: 1rem !important } .my-xxl-4 { margin-bottom: 1.5rem !important; margin-top: 1.5rem !important } .my-xxl-5 { margin-bottom: 3rem !important; margin-top: 3rem !important } .my-xxl-auto { margin-bottom: auto !important; margin-top: auto !important } .mt-xxl-0 { margin-top: 0 !important } .mt-xxl-1 { margin-top: .25rem !important } .mt-xxl-2 { margin-top: .5rem !important } .mt-xxl-3 { margin-top: 1rem !important } .mt-xxl-4 { margin-top: 1.5rem !important } .mt-xxl-5 { margin-top: 3rem !important } .mt-xxl-auto { margin-top: auto !important } .me-xxl-0 { margin-right: 0 !important } .me-xxl-1 { margin-right: .25rem !important } .me-xxl-2 { margin-right: .5rem !important } .me-xxl-3 { margin-right: 1rem !important } .me-xxl-4 { margin-right: 1.5rem !important } .me-xxl-5 { margin-right: 3rem !important } .me-xxl-auto { margin-right: auto !important } .mb-xxl-0 { margin-bottom: 0 !important } .mb-xxl-1 { margin-bottom: .25rem !important } .mb-xxl-2 { margin-bottom: .5rem !important } .mb-xxl-3 { margin-bottom: 1rem !important } .mb-xxl-4 { margin-bottom: 1.5rem !important } .mb-xxl-5 { margin-bottom: 3rem !important } .mb-xxl-auto { margin-bottom: auto !important } .ms-xxl-0 { margin-left: 0 !important } .ms-xxl-1 { margin-left: .25rem !important } .ms-xxl-2 { margin-left: .5rem !important } .ms-xxl-3 { margin-left: 1rem !important } .ms-xxl-4 { margin-left: 1.5rem !important } .ms-xxl-5 { margin-left: 3rem !important } .ms-xxl-auto { margin-left: auto !important } .p-xxl-0 { padding: 0 !important } .p-xxl-1 { padding: .25rem !important } .p-xxl-2 { padding: .5rem !important } .p-xxl-3 { padding: 1rem !important } .p-xxl-4 { padding: 1.5rem !important } .p-xxl-5 { padding: 3rem !important } .px-xxl-0 { padding-left: 0 !important; padding-right: 0 !important } .px-xxl-1 { padding-left: .25rem !important; padding-right: .25rem !important } .px-xxl-2 { padding-left: .5rem !important; padding-right: .5rem !important } .px-xxl-3 { padding-left: 1rem !important; padding-right: 1rem !important } .px-xxl-4 { padding-left: 1.5rem !important; padding-right: 1.5rem !important } .px-xxl-5 { padding-left: 3rem !important; padding-right: 3rem !important } .py-xxl-0 { padding-bottom: 0 !important; padding-top: 0 !important } .py-xxl-1 { padding-bottom: .25rem !important; padding-top: .25rem !important } .py-xxl-2 { padding-bottom: .5rem !important; padding-top: .5rem !important } .py-xxl-3 { padding-bottom: 1rem !important; padding-top: 1rem !important } .py-xxl-4 { padding-bottom: 1.5rem !important; padding-top: 1.5rem !important } .py-xxl-5 { padding-bottom: 3rem !important; padding-top: 3rem !important } .pt-xxl-0 { padding-top: 0 !important } .pt-xxl-1 { padding-top: .25rem !important } .pt-xxl-2 { padding-top: .5rem !important } .pt-xxl-3 { padding-top: 1rem !important } .pt-xxl-4 { padding-top: 1.5rem !important } .pt-xxl-5 { padding-top: 3rem !important } .pe-xxl-0 { padding-right: 0 !important } .pe-xxl-1 { padding-right: .25rem !important } .pe-xxl-2 { padding-right: .5rem !important } .pe-xxl-3 { padding-right: 1rem !important } .pe-xxl-4 { padding-right: 1.5rem !important } .pe-xxl-5 { padding-right: 3rem !important } .pb-xxl-0 { padding-bottom: 0 !important } .pb-xxl-1 { padding-bottom: .25rem !important } .pb-xxl-2 { padding-bottom: .5rem !important } .pb-xxl-3 { padding-bottom: 1rem !important } .pb-xxl-4 { padding-bottom: 1.5rem !important } .pb-xxl-5 { padding-bottom: 3rem !important } .ps-xxl-0 { padding-left: 0 !important } .ps-xxl-1 { padding-left: .25rem !important } .ps-xxl-2 { padding-left: .5rem !important } .ps-xxl-3 { padding-left: 1rem !important } .ps-xxl-4 { padding-left: 1.5rem !important } .ps-xxl-5 { padding-left: 3rem !important } .gap-xxl-0 { gap: 0 !important } .gap-xxl-1 { gap: .25rem !important } .gap-xxl-2 { gap: .5rem !important } .gap-xxl-3 { gap: 1rem !important } .gap-xxl-4 { gap: 1.5rem !important } .gap-xxl-5 { gap: 3rem !important } .row-gap-xxl-0 { row-gap: 0 !important } .row-gap-xxl-1 { row-gap: .25rem !important } .row-gap-xxl-2 { row-gap: .5rem !important } .row-gap-xxl-3 { row-gap: 1rem !important } .row-gap-xxl-4 { row-gap: 1.5rem !important } .row-gap-xxl-5 { row-gap: 3rem !important } .column-gap-xxl-0 { -moz-column-gap: 0 !important; column-gap: 0 !important } .column-gap-xxl-1 { -moz-column-gap: .25rem !important; column-gap: .25rem !important } .column-gap-xxl-2 { -moz-column-gap: .5rem !important; column-gap: .5rem !important } .column-gap-xxl-3 { -moz-column-gap: 1rem !important; column-gap: 1rem !important } .column-gap-xxl-4 { -moz-column-gap: 1.5rem !important; column-gap: 1.5rem !important } .column-gap-xxl-5 { -moz-column-gap: 3rem !important; column-gap: 3rem !important } .text-xxl-start { text-align: left !important } .text-xxl-end { text-align: right !important } .text-xxl-center { text-align: center !important } } @media print { .d-print-inline { display: inline !important } .d-print-inline-block { display: inline-block !important } .d-print-block { display: block !important } .d-print-grid { display: grid !important } .d-print-inline-grid { display: inline-grid !important } .d-print-table { display: table !important } .d-print-table-row { display: table-row !important } .d-print-table-cell { display: table-cell !important } .d-print-flex { display: flex !important } .d-print-inline-flex { display: inline-flex !important } .d-print-none { display: none !important } }@keyframes fadeIn { to { opacity: 1 } } @keyframes floatIn { 0% { opacity: 0; transform: translateY(20px) scale(.95) } to { opacity: 1; transform: translateY(0) scale(1) } } @keyframes slideFadeIn { to { opacity: 1; transform: translateY(0) } } @keyframes popIn { to { opacity: 1; transform: scale(1) } } @keyframes fadeUp { to { opacity: 1; transform: translateY(0) } } @keyframes fadeInUp { 0% { opacity: 0; transform: translateY(10px) } to { opacity: 1; transform: translateY(0) } } @keyframes pop-up-fade { 0% { opacity: 0; transform: translateY(20%) } to { opacity: 1; transform: translateY(0) } } @keyframes zoomin { 0%, to { transform: scale(1) } 50% { transform: scale(1.05) } } .estimate-form-hero h2, .oswald, .spotlights li { color: #121212; font-family: Oswald, sans-serif } .topbar-links a, .topbar-links a.estimate-btn { text-align: center; transition: background-color .3s } .header-topbar, .navbar-nav { background-color: #0e2a4e } .main-nav .dropdown-menu .dropdown-item, .main-nav .nav-item .nav-link { font-family: Oswald, sans-serif; font-size: 1.275rem; font-weight: 400; letter-spacing: 2px; transition: .5s } #scrollToTopBtn:focus, .section-gallery a:active img, .section-gallery a:focus img, .section-gallery a:hover img { transform: scale(1.05) } .h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 { color: #003c69; font-weight: 500; line-height: 1.2; margin-bottom: .5rem; margin-top: 0 } .h1, h1 { font-size: calc(1.375rem + 1.5vw) } .mt3-0 { margin-top: 3em } .mt3-5 { margin-top: 3.5rem } .mt4-0 { margin-top: 4rem } .mt4-5, .mt5-0 { margin-top: 4.5rem } .h2, h2 { font-size: calc(1.325rem + .9vw) } .h3, h3 { font-size: calc(1.3rem + .6vw) } .h4, h4 { font-size: calc(1.275rem + .3vw) } .h5, h5 { font-size: 1.25rem } .h6, .service-tier-card sup, h6 { font-size: 1rem } .blue, .contact-alt-box, .contact-item a, .dark-blue, .faq-toggle:focus, .faq-toggle:hover, .faq-toggle[aria-expanded=true] .faq-icon, .gallery-section h2 { color: #003c69 } .contact-alt-box a, .dark-red { color: #9a181c } .semi-bold { font-weight: 300 } .bold { font-weight: 500 } .estimate-form strong, .xbold { font-weight: 600 } .xxbold { font-weight: 700 } .xxxbold { font-weight: 800 } .font-110 { font-size: 110%; line-height: 110% } .font-115 { font-size: 115%; line-height: 115% } .font-120 { font-size: 120%; line-height: 120% } .font-125 { font-size: 125%; line-height: 125% } .font-130 { font-size: 130%; line-height: 130% } .font-140 { font-size: 140%; line-height: 140% } .lora { font-family: Lora, serif } .anton { font-family: Anton, sans-serif } .white-bg { background-color: #fff !important } @font-face { font-display: swap; font-family: Open Sans; font-style: normal; font-weight: 400; src: url(/css/fonts/open-sans-v40-latin-regular.woff2) format("woff2") } @font-face { font-display: swap; font-family: Open Sans; font-style: normal; font-weight: 300; src: url(/css/fonts/open-sans-v40-latin-300.woff2) format("woff2") } @font-face { font-display: swap; font-family: Open Sans; font-style: normal; font-weight: 500; src: url(/css/fonts/open-sans-v40-latin-500.woff2) format("woff2") } @font-face { font-display: swap; font-family: Open Sans; font-style: normal; font-weight: 600; src: url(/css/fonts/open-sans-v40-latin-600.woff2) format("woff2") } @font-face { font-display: swap; font-family: Open Sans; font-style: normal; font-weight: 700; src: url(/css/fonts/open-sans-v43-latin-700.woff2) format("woff2") } @font-face { font-display: swap; font-family: Oswald; font-style: normal; font-weight: 400; src: url(/css/fonts/oswald-v56-latin-regular.woff2) format("woff2") } @font-face { font-display: swap; font-family: Oswald; font-style: normal; font-weight: 500; src: url(/css/fonts/oswald-v56-latin-500.woff2) format("woff2") } @font-face { font-display: swap; font-family: Oswald; font-style: normal; font-weight: 600; src: url(/css/fonts/oswald-v56-latin-600.woff2) format("woff2") } @font-face { font-display: swap; font-family: Oswald; font-style: normal; font-weight: 700; src: url(/css/fonts/oswald-v56-latin-700.woff2) format("woff2") } @font-face { font-display: swap; font-family: Anton; font-style: normal; font-weight: 400; src: url(/css/fonts/anton-v25-latin-regular.woff2) format("woff2") } @font-face {font-display: swap;font-family: 'Raleway';font-style: normal;font-weight: 500;src: url('/css/fonts/raleway-v37-latin-500.woff2') format('woff2');} @font-face { font-display: swap; font-family: Font Awesome\ 6 Free; font-style: normal; font-weight: 900; src: url(/css/webfonts/fa-solid-900.woff2) format("woff2"), url(/css/webfonts/fa-solid-900.ttf) format("truetype") } @font-face { font-display: swap; font-family: Font Awesome\ 6 Brands; font-style: normal; font-weight: 400; src: url(/css/webfonts/fa-brands-400.woff2) format("woff2"), url(/css/webfonts/fa-brands-400.ttf) format("truetype") } body { color: #444; font-family: Open Sans, sans-serif; font-size: 1.15rem; font-weight: 400; height: 100%; line-height: 1.4 } .fade-in-onload { animation: .75s ease-out forwards fadeIn; opacity: 0 } .fade-slide { transition: opacity .2s, transform .2s } .pop-in { animation: .5s ease-out forwards popIn; opacity: 0; transform: scale(.95) } .fade-on-scroll { opacity: 0; transform: translateY(20px); transition: opacity .6s ease-out, transform .6s ease-out } .fade-on-scroll.fade-in, .service-wrapper-callout.visible { opacity: 1; transform: translateY(0) } .no-js .fade-on-scroll { opacity: 1 !important; transform: none !important; } .animation-delay-200, .delay-1, .guard-card:first-child, .testimonial-slide-mini:nth-child(2) { animation-delay: .2s } .delay-2, .guard-card:nth-child(2), .recap-card:nth-child(3).fade-in { animation-delay: .4s } .delay-3 { animation-delay: .6s } .animation-delay-100 { animation-delay: .1s } .animation-delay-300 { animation-delay: .3s } @media(prefers-reduced-motion:reduce) { .form-control { transition: none } .form-control::-webkit-file-upload-button { -webkit-transition: none; transition: none } .form-control::file-selector-button { transition: none } .collapsing, .collapsing.collapse-horizontal, .fade, .form-select, .form-switch .form-check-input, .modal.fade .modal-dialog, .nav-link, .navbar-toggler { transition: none } .fade-in-onload, .fade-slide, .pop-in { animation: none !important; opacity: 1 !important; transform: none !important; transition: none !important; } } .google-review { align-items: center; color: #fff; display: flex; font-size: .875rem; font-weight: 500; gap: .5rem } .google-logo { display: block; height: 35px; width: 35px } .rating-block { display: flex; flex-direction: column; justify-content: center; line-height: 1.2 } .google-label { color: #fff; font-size: 1rem; font-weight: 400; letter-spacing: .05rem; margin-bottom: 2px } .star-row { align-items: center; display: flex; gap: .4rem } .rating-value { font-size: 1rem; font-weight: 600 } .star-group { display: flex; gap: .25rem } .star { height: 15px; width: 15px; fill: #ffc107 } .review-count { color: #fff; font-size: 1rem; letter-spacing: .05rem } .header-topbar { color: #fff; font-size: .9rem; padding: .25rem 0 } .header-topbar .topbar-links { background-color: rgb(0 0 0/.2); border-radius: 6px; padding: 1rem .5rem; width: 100% } .topbar-links li { color: #fff; display: inline-block; font-size: 1rem; width: 100% } .topbar-links a { background-color: #00335a; border: 1px solid #fff0; border-radius: 0; color: #fff; display: block; font-size: 1rem; padding: .75rem } .topbar-links a:active, .topbar-links a:focus, .topbar-links a:hover { background-color: #daefff; color: #00335a; text-decoration: underline } .topbar-links a.estimate-btn { background-color: #991c27; border: 0; border-radius: 0; box-shadow: 0 2px 4px rgb(0 0 0/.2); color: #fff; font-size: 1rem; font-weight: 500; letter-spacing: .05rem; margin: .275rem 0; padding: .75rem .5rem; text-decoration: none; width: 100% } .hero-text-wrapper .hero-kicker, .hero-text-wrapper .hero-textlg { font-family: Oswald, sans-serif; font-weight: 700; text-align: center } .topbar-links a.estimate-btn:active, .topbar-links a.estimate-btn:focus, .topbar-links a.estimate-btn:hover { background-color: #a81f2a; color: #fff; filter: brightness(110%); text-decoration: none } .main-nav, .main-nav .container { max-width: 100%; padding: 0 } .main-nav .nav-item .nav-link { border-bottom: 1px solid #011f39; border-top: 1px solid #15355e; color: #fff; font-size: 1.375rem; padding: 1.5rem; text-decoration: none } .main-nav .nav-item .nav-link i { float: right; font-size: 1.2rem } .navbar-nav .nav-item .nav-link i::before { font-size: .9rem; transition: transform .3s ease-in-out; font-weight: 600 !important; display: inline-block } .main-nav .nav-item .nav-link:active, .main-nav .nav-item .nav-link:focus, .main-nav .nav-item .nav-link:hover { background: #143867 } .navbar-nav .nav-link.active, .navbar-nav .nav-link.show { background-color: #9e201d; color: #fff } .dropdown-toggle::after { border: none !important } .main-nav .dropdown-menu { background-color: #fff; border-radius: 0; border-top: 1px solid #8a1d00 } .main-nav .dropdown-menu .dropdown-item { border-bottom: 1px solid #e9e9e9; color: #222; display: block; font-family: Open Sans, sans-serif; font-size: 1.1rem; font-weight: 400; letter-spacing: normal; padding: 16px 20px; position: relative } .main-nav .dropdown-menu .dropdown-item:active, .main-nav .dropdown-menu .dropdown-item:focus, .main-nav .dropdown-menu .dropdown-item:hover { color: #8a1d00; padding-left: 40px } .main-nav .dropdown-menu .dropdown-item:before { color: #8a1d00; content: "\f101"; font-family: Font Awesome\ 6 Free; font-size: 15px; font-style: normal; font-weight: 900; left: 20px; position: absolute; top: 17px; transform: scale(0); transition: .5s } .navbar-nav .nav-item.show .nav-link i::before { -webkit-transform: rotate(-90deg); -moz-transform: rotate(-90deg); -ms-transform: rotate(-90deg); -o-transform: rotate(-90deg); transform: rotate(-90deg) } .main-nav .dropdown-menu .dropdown-item:active:before, .main-nav .dropdown-menu .dropdown-item:focus:before, .main-nav .dropdown-menu .dropdown-item:hover:before { transform: scale(1) } .mainnav-trigger { border: 0; border-radius: 4px; color: #003c69; font-family: Kanit; font-size: 2rem !important; font-weight: 500; letter-spacing: 2px; padding: 15px 1px !important; text-transform: uppercase; width: 100px } .mainnav-trigger:active, .mainnav-trigger:focus, .mainnav-trigger:hover, .mainnav-trigger:not(.collapsed) { box-shadow: none; color: #8a1d00 } .main-nav .nav-item .nav-link.estimate-btn { background-color: #8a1d00; color: #fff; font-size: 1.4rem; font-weight: 600; letter-spacing: 2px; text-align: center; text-transform: uppercase; transition: .3s ease-out } .main-nav .nav-item .nav-link.estimate-btn:active, .main-nav .nav-item .nav-link.estimate-btn:focus, .main-nav .nav-item .nav-link.estimate-btn:hover { background-color: #a81f2a; color: #fff } .navbar-brand, ul.guard-spotlights { padding: 0 } .sticky-wrapper { transition: transform .3s, opacity .3s; will-change: transform; box-shadow: 0 2px 4px rgb(0 0 0/.05); position: relative; z-index: 20 } .sticky-wrapper.slide-down { animation: .3s ease-out forwards slideDownFade } @keyframes slideDownFade { 0% { opacity: 0; transform: translateY(-30%) } 100% { opacity: 1; transform: translateY(0) } } .sticky-wrapper .logo img { max-width: 200px; transition: max-width .4s ease-in-out } .sticky-wrapper.sticky { background-color: #fff; box-shadow: 0 5px 5px rgb(0 0 0/.3); left: 0; position: fixed; right: 0; top: 0; width: 100%; z-index: 100 } .home-hero .container { max-width: 100% } .home-hero { background-position: top; background-repeat: no-repeat; background-size: contain; padding-bottom: 0; position: relative } @media(min-width:768px) { .header-topbar ul li { display: inline-block; width: auto } .topbar-links a { padding: .75rem 2.75rem } .mainnav-trigger.collapsed { max-width: 120px } .sticky-wrapper .logo img { margin-left: 10px; max-width: 230px; transition: max-width .4s ease-in-out } .sticky-wrapper.sticky .logo img { max-width: 225px } } @media(min-width:992px) { .home-hero { background-position: top; background-repeat: no-repeat; background-size: cover; border-radius: 0; padding: 3rem 1.5rem; position: relative } } @media(min-width:1024px) { .sticky-wrapper.sticky .logo img { max-width: 240px } .mainnav-trigger i { font-size: 2.25rem } .topbar-links a { padding: .75rem 1.5rem; width: 275px } .topbar-links a.estimate-btn { width: 275px } } @media(min-width:1200px) { .h1, h1 { font-size: 2.5rem } .h2, h2 { font-size: 2rem } .h3, h3 { font-size: 1.75rem } .h4, h4 { font-size: 1.5rem } .main-nav .container { padding: 0 20px } .sticky-wrapper .logo img, .sticky-wrapper.sticky .logo img { margin-left: 5px; max-width: 165px } .main-nav .nav-item .nav-link.estimate-btn { background-color: #fff; border: 2px solid #a81f2a; border-radius: 5px; color: #a81f2a; font-size: .85rem; font-weight: 600; margin-left: 10px; padding: 12px 15px; text-align: center; text-transform: uppercase; transition: .3s ease-out } .main-nav .nav-item .nav-link { border: 0; color: #062b58; font-size: 1.15rem; letter-spacing: normal; padding: 25px 20px } .main-nav .nav-item .nav-link:active, .main-nav .nav-item .nav-link:focus, .main-nav .nav-item .nav-link:hover { background: 0; color: #b01c21 } .dropdown-toggle:after { margin-left: .05rem } .navbar-nav .nav-item:hover .nav-link i::before { -webkit-transform: rotate(-90deg); -moz-transform: rotate(-90deg); -ms-transform: rotate(-90deg); -o-transform: rotate(-90deg); transform: rotate(-90deg) } .navbar-nav { background-color: #fff } .navbar .navbar-nav .nav-item .dropdown-menu { min-width: 280px; opacity: 1; padding: 10px 0; top: auto; left: 0; z-index: 1050; opacity: 0; width: 250px; display: inline-block; border-radius: 0 0 10px 10px; position: absolute; visibility: hidden; -webkit-box-shadow: rgba(0, 0, 0, .07) 0 1px 1px, rgba(0, 0, 0, .07) 0 2px 2px, rgba(0, 0, 0, .07) 0 4px 4px, rgba(0, 0, 0, .07) 0 8px 8px, rgba(0, 0, 0, .07) 0 16px 16px; box-shadow: rgba(0, 0, 0, .07) 0 1px 1px, rgba(0, 0, 0, .07) 0 2px 2px, rgba(0, 0, 0, .07) 0 4px 4px, rgba(0, 0, 0, .07) 0 8px 8px, rgba(0, 0, 0, .07) 0 16px 16px; background-color: #fff; -webkit-transition: .8s; transition: .8s; -webkit-transform-origin: 0 0; transform-origin: 0 0; -webkit-transform: rotateX(-90deg); transform: rotateX(-90deg) } .navbar .navbar-nav .nav-item:hover .dropdown-menu { opacity: 1; visibility: visible; -webkit-transform: rotateX(0); transform: rotateX(0) } .dropdown:hover > .dropdown-menu { display: block } .dropdown > .dropdown-toggle:active { pointer-events: none } .main-nav .dropdown-menu .dropdown-item { color: #0d0d0d; font-size: 14px; font-weight: 500; letter-spacing: .05rem; padding: .85rem .75rem .85rem 1.25rem } .main-nav .dropdown-menu .dropdown-item:before { font-size: 12px; left: 13px; top: 16px } .main-nav .dropdown-menu .dropdown-item:active, .main-nav .dropdown-menu .dropdown-item:focus, .main-nav .dropdown-menu .dropdown-item:hover { padding-left: 30px } .sticky-wrapper.sticky .main-nav .nav-item .nav-link.estimate-btn { padding: 10px } .main-nav .logo { left: 0; position: absolute; z-index: 9 } .home-hero { padding: 4rem 2rem 1rem } } @media(min-width:1280px) { .sticky-wrapper .logo img { margin-left: 5px; max-width: 190px } .main-nav .nav-item .nav-link { font-size: 1.175rem; letter-spacing: normal; padding: 25px 23px } .sticky-wrapper.sticky .main-nav .nav-item .nav-link { padding: 25px } .review-count { color: #fff; font-size: .95rem; letter-spacing: .05rem } } @media(min-width:1366px) { .home-hero { padding: 4.5rem 2rem 1rem } .home-hero .estimate-form-text h2 { font-size: 2rem; line-height: normal; margin-bottom: 0 } .header-topbar .container { padding: 0 10px } .sticky-wrapper .logo img { margin-left: 10px; max-width: 225px } .main-nav .nav-item .nav-link { padding: 25px 15px } .main-nav .nav-item .nav-link.estimate-btn { background-color: #fff; border: 2px solid #8a1d00; border-radius: 5px; color: #8a1d00; font-size: 1rem; font-weight: 500; margin-left: 15px; padding: 12px 15px; text-align: center; text-transform: uppercase; text-wrap: nowrap; transition: .3s ease-out; width: auto } .sticky-wrapper.sticky .main-nav .nav-item .nav-link { padding: 25px 20px } .d-est-btn { display: block !important } .d-xxl-tb-est-btn { display: none !important } .d-xxl-social-flex { display: inline-flex !important } .google-block { width: 58.33333333% !important } .google-block, .social-block { flex: 0 0 auto; justify-content: flex-end !important } .social-block { width: 41.66666667% } .home-slider-section .container { max-width: 1280px } } @media(min-width:1440px) { .main-nav .container { padding: 0 15px } .sticky-wrapper .logo img { max-width: 275px } .main-nav .nav-item .nav-link { font-size: 1.25rem; padding: 25px 14px } .sticky-wrapper.sticky .main-nav .nav-item .nav-link { padding: 25px 22px } } @media(min-width:1536px) { .main-nav .container { padding: 0 20px } .sticky-wrapper .logo img { max-width: 315px } .home-hero { padding: 5.5rem 2rem 1rem } .main-nav .nav-item .nav-link { padding: 25px 18px } .sticky-wrapper.sticky .main-nav .nav-item .nav-link { padding: 25px 28px } .home-hero .container { padding: 0 60px } .home-hero .estimate-form-text h2 { font-size: 2.275rem; line-height: 1.2; margin-bottom: 0 } } @media(min-width:1600px) { .sticky-wrapper.sticky .logo img { max-width: 185px; padding-top: 5px } .main-nav .nav-item .nav-link.estimate-btn { font-size: 1rem !important } .main-nav .nav-item .nav-link { font-size: 1.3rem; padding: 25px 20px } .sticky-wrapper.sticky .main-nav .nav-item .nav-link { padding: 25px 29px } .service-gallery .container { max-width: 1400px } } @media(min-width:1700px) { .sticky-wrapper .logo img { max-width: 295px } .main-nav .logo { left: 20px } .main-nav .nav-item .nav-link { padding: 25px 27px } .sticky-wrapper.sticky .main-nav .nav-item .nav-link { padding: 25px 35px } .home-hero { padding: 6rem 2rem 2rem } } @media(min-width:1800px) { .sticky-wrapper .logo img { max-width: 315px } .main-nav .nav-item .nav-link { padding: 25px 30px } .sticky-wrapper.sticky .main-nav .nav-item .nav-link { padding: 25px 40px } } @media(min-width:1920px) { .sticky-wrapper.sticky .main-nav .nav-item .nav-link { padding: 25px 48px } .main-nav .nav-item .nav-link { padding: 25px 38px } .main-nav, .main-nav .container { max-width: 1920px } } .hero-text-wrapper { padding: 60% 0 0 } .hero-text-wrapper .hero-textlg { color: #003c69; font-size: clamp(2.5rem, 5vw + .75rem, 4.5rem); line-height: 1.1; margin: 0 0 .5rem; text-transform: uppercase } .hero-text-wrapper .hero-kicker { color: #ac0f22; font-size: 1.5rem; font-weight: 600; line-height: 1.2; margin: .75rem 0 2rem; text-transform: uppercase } .spotlights { list-style: none; margin-bottom: 0; padding-left: 0 } .spotlights li { font-size: 1.5rem; margin-bottom: 1.15rem; padding-left: 25px; position: relative } .spotlights li:before { background: url(../img/checkmarkred.webp); content: ""; display: inline-block; height: 20px; left: 0; position: absolute; top: 5px; width: 19px } .form-wrapper { background: #fff; border: 1px solid #ddd; border-radius: 0; box-shadow: 0 4px 10px rgb(0 0 0/.04); margin: 2rem 0; padding: .75rem .5rem } .estimate-form-hero { background-color: #991c27; border-radius: .5rem; box-shadow: 0 0 25px rgb(0 0 0/.15); color: #fff; padding: 2rem 1rem 3rem; text-align: center } .estimate-form-hero h2 { color: #fff; font-size: 2.15rem; line-height: 1.2; margin-bottom: 1rem; text-align: center; text-transform: uppercase } .form-header-text { font-size: 1.3rem; font-weight: 300; margin-bottom: 1rem } .form-footer-text { font-size: 1.1rem; font-weight: 300 } .form-footer-byline { font-size: .9rem; margin-bottom: 0; text-align: center } .estimate-form-hero input, .estimate-form-hero select, .estimate-form-hero textarea { border: 1px solid #ddd; border-radius: 4px; font-size: .95rem; padding: .4rem .5rem; width: 100% } .form-footer { font-size: .95rem } .estimate-form-hero .btn-estimate { background-color: #fff; border: 2px solid #b1282c; color: #b1282c; font-weight: 600; padding: .75rem 1.5rem; transition: .2s } .estimate-form-hero .btn-estimate:active, .estimate-form-hero .btn-estimate:focus, .estimate-form-hero .btn-estimate:hover { background-color: #b1282c; color: #fff } @media(min-width:2000px) { .container { max-width: 1920px } } @media(min-width:768px) { .hero-text-wrapper .hero-kicker { font-size: 2rem } .spotlights { list-style: none; margin: 0; padding-left: 0 } .form-wrapper { margin: 0 auto 4rem; max-width: 550px } .service-option input:checked + span { background-image: url(../img/checkmarkred.webp); background-position: 5px; background-repeat: no-repeat; background-size: 15px } } @media(min-width:992px) { .header-topbar .container { max-width: 100%; padding: 0 30px } .hero-text-wrapper .hero-kicker, .hero-text-wrapper .hero-textlg { color: #f2f2f2; text-align: left; text-shadow: 2px 2px 2px rgba(0, 0, 0, .9) } .home-hero .hero-text-wrapper { color: #fff; padding: 0 } .hero-text-wrapper .hero-textlg { line-height: .975 } .hero-text-wrapper .hero-kicker { border-top: 3px solid #c8102e; display: inline-block; font-size: 2.25rem; font-weight: 400; letter-spacing: .04em; padding-top: .5rem } .spotlights { margin: 0 } .spotlights li { color: #fff; font-size: 1.75rem; margin: 1.25rem 0 1.25rem 1rem; padding-bottom: 0; padding-left: 2.5rem; text-shadow: 2px 2px 4px #000 } .home-hero .hero-text-wrapper ul.spotlights li:before { background: url(../img/checkmark.webp) 0 0/30px no-repeat; content: ""; display: inline-block; height: 30px; left: 0; margin-right: 17px; position: absolute; top: 3px; width: 30px } .form-wrapper { padding: .5rem } .estimate-form-hero { background-color: #a11e2a; border-radius: .5rem; color: #fff; padding: 1.5rem 1rem; text-align: center } } @media(min-width:1200px) { .header-topbar .container { padding: 0 15px } .header-topbar .topbar-links { background-color: #fff0; border-radius: 0; padding: 0; width: auto } .header-topbar .header-top-right ul li { color: #fff; display: inline-block; font-size: .8rem } .topbar-links a { background-color: #fff0; padding: .75rem .25rem; text-wrap: nowrap; width: auto } .topbar-links a:active, .topbar-links a:focus, .topbar-links a:hover { background-color: #fff0; color: #daefff } .topbar-links .social-icons a { padding: .75rem 1rem } .topbar-links .social-icons a i { color: #fff; font-size: 20px; margin-right: 0; transition: .3s ease-out } .topbar-links .social-icons a i:active, .topbar-links .social-icons a i:focus, .topbar-links .social-icons a i:hover { color: #daefff } .topbar-links a.estimate-btn { border: 1px solid #ac202b; border-radius: 5px; margin-left: .5rem; padding: .5rem; width: auto } .home-hero .container { align-items: flex-start; display: flex; gap: 2rem; justify-content: space-between } .hero-text-wrapper .hero-kicker { font-size: 2.275rem } .spotlights li { font-size: 1.675rem; margin: 1.75rem 0 1.75rem 1rem } .form-wrapper { max-width: 540px; padding: .85rem .75rem } .estimate-form-hero h2 { font-size: 1.75rem } } .estimate-form .service-select-group .service-option span, .service-option span { padding: .5rem .25rem; transition: background-color .2s ease-in-out, color .2s ease-in-out } @media(min-width:1400px) { .hero-text-wrapper .hero-textlg { font-size: 4.75rem } .hero-text-wrapper .hero-kicker { font-size: 2.75rem } .service-addons .container { max-width: 1140px } } @media(min-width:1700px) { .hero-text-wrapper .hero-kicker { font-size: 3rem } } .service-select-group { border: 0; display: grid; gap: .75rem; grid-template-columns: repeat(3, 1fr); margin: .25rem 0; max-width: 100%; padding: 0; text-align: center } .service-option { border: 0; border-radius: 4px; cursor: pointer; display: block; font-size: .85rem; font-weight: 500; overflow: hidden; position: relative } .service-option input { opacity: 0; pointer-events: none; position: absolute } .service-option span { background-color: #a32121; border: 2px solid #fff; border-radius: 4px; color: #fff; display: inline-block; width: 100% } .service-option input:checked + span { background-color: #fff; border-color: #fff; color: #a32121 } .service-option:active span, .service-option:focus span, .service-option:hover span { background-color: #c33434 } .hero-form a { color: #fff; text-decoration: underline } @media(max-width:480px) { .service-select-group { grid-template-columns: repeat(2, 1fr) } } .awards-section:before { background: hsla(0, 0%, 100%, .125); content: ""; height: 100%; left: 0; position: absolute; top: 0; width: 100%; z-index: 0 } .awards-section { background: url(../img/awardsbg.webp) #e9f5ff; border-bottom: 1px solid #d6e3ed; border-top: 1px solid #d6e3ed; color: #333; padding: 3rem 1rem 8rem; text-shadow: 1px 1px 1px rgb(0 0 0/.15) } .about-intro strong, .awards-section .section-title, .awards-title, .manufacturers a, .page-intro li strong, .page-intro strong, .service-spotlight a { color: #00335a } .awards-section h3 { font-size: 1.5rem } .awards-title, .cservice-section h2, .gallery-section h2, .our-services-section h2, .service-gallery h2, .testimonials-section .section-title { font-family: Anton, sans-serif; font-size: 3.25rem } .awards-title { line-height: 1; margin-bottom: .5rem } .awards-text { color: #121212; font-size: 1.3rem; font-weight: 300 } .awards-section .splide__arrow--next, .awards-section .splide__arrow--prev { height: 58px; width: 56px; z-index: 99 } .awards-section .splide__arrow--prev { bottom: 25px; left: 0; right: auto; top: auto } .awards-section .splide__arrow--next { bottom: 25px; left: auto; right: 0; top: auto } .awards-slider .splide__arrow--next:active, .awards-slider .splide__arrow--next:focus, .awards-slider .splide__arrow--next:hover, .awards-slider .splide__arrow--prev:active, .awards-slider .splide__arrow--prev:focus, .awards-slider .splide__arrow--prev:hover, .btn-estimate, .cta-card, .service-gallery-slider .splide__arrow--prev:active, .service-gallery-slider .splide__arrow--prev:focus, .testimonials-slider .splide__arrow--next:active, .testimonials-slider .splide__arrow--next:focus, .testimonials-slider .splide__arrow--next:hover, .testimonials-slider .splide__arrow--prev:active, .testimonials-slider .splide__arrow--prev:focus, .testimonials-slider .splide__arrow--prev:hover { transition: .3s } .h2-leadin { color: #fff; font-family: Oswald, sans-serif; font-size: 1.675rem; text-transform: uppercase } .hero-divider { border-left: 4px solid #c8102e; color: #f2f2f2; font-size: 1.5rem; font-weight: 400; letter-spacing: .05em; line-height: 1.2; margin: 0 auto; padding-left: 1rem; text-align: left } .hero-divider .highlight-thanks { color: #de2c49; font-style: italic; font-weight: 700; letter-spacing: .02em; text-transform: uppercase } .hero-divider:active, .hero-divider:focus, .hero-divider:focus-within, .hero-divider:hover { border-left-color: #f44336 } .our-services-section { background-color: #f8f8f8; background-image: linear-gradient(180deg, hsla(0, 0%, 97%, .96) 0, hsla(0, 0%, 100%, .95) 100%), url(../img/jhawklogo-hawk.svg); background-position: top; background-repeat: repeat-y; background-size: contain; color: #212529; padding: 4rem 1rem; position: relative } .our-services-section .byline, .our-services-section h2 { color: #00335a; margin-bottom: 1.25rem; text-align: center } .our-services-section h3 { color: #00335a; font-family: Anton, sans-serif; font-size: 2.5rem; margin-bottom: .75rem } .our-services-section .byline { font-size: 1.5rem; font-weight: 400; margin-bottom: 2rem } .service-card { background-color: #fff; border: 1px solid #ddd; border-radius: .25rem; box-shadow: 0 2px 6px rgb(0 0 0/.04); height: 100%; opacity: 0; padding: .75rem; position: relative; transition: box-shadow .3s, opacity .6s ease-out; display: flex; flex-direction: column; } .service-card:active, .service-card:focus, .service-card:hover { box-shadow: 0 0 0 2px rgb(179 0 0/.6) } .service-card img { border-radius: .25rem } .service-card p { color: #444; font-size: 1.25rem; line-height: 1.6; flex-grow: 1; } .service-body { padding-top: 1rem; flex: 1; display: flex; flex-direction: column; } .btn-service-callout { background-color: #b30000; color: #fff; padding: .75rem 1.5rem; position: relative !important } .btn-service-callout:active, .btn-service-callout:focus, .btn-service-callout:hover { background-color: #7d0000; color: #fff !important; text-decoration: none } .service-wrapper-callout { border-bottom: 1px solid #eee; border-top: 4px solid #b30000; box-shadow: 0 2px 6px rgb(0 0 0/.2); opacity: 0; padding: 0 0 2rem; transform: translateY(40px); transition: box-shadow .3s, opacity .6s ease-out, transform .6s ease-out } .service-wrapper-callout:hover { box-shadow: 0 0 2px 1px rgb(179 0 0/.8); transform: translateY(-3px); transition: transform .3s, box-shadow .3s } .service-callout-text { background-color: #fff; box-shadow: 0 .5rem 1rem rgb(0 0 0/.05); font-size: 1.25rem; height: 100%; line-height: 1.6; margin-bottom: 1rem; padding: 1rem 1.5rem } .footer-logo, .service-wrapper-callout .property-management, .testimonial-top { margin-bottom: 1rem } .testimonials-section { background-color: #003b68; background: linear-gradient(180deg, #0a3d6f, #003b68); color: #fff; padding: 4rem 1rem 3rem; position: relative } .testimonials-section .section-title { color: #fff; line-height: 1.1; margin-bottom: 1rem } .testimonials-section .byline { color: #fff; font-size: 1.25rem; line-height: 1.6; margin: 0 auto 2rem; max-width: 900px } .testimonials-section .splide__arrow--prev { bottom: -60px; left: 25%; right: auto; top: auto } .testimonials-section .splide__arrow--next { bottom: -60px; left: auto; right: 25%; top: auto } .testimonials-item:before { color: #000; content: ""; font-family: Georgia, serif; font-size: 15rem; opacity: .075; position: absolute; right: 5px; top: -80px; z-index: 9 } .testimonials-item { background: hsla(0, 0%, 100%, .95); border-radius: 4px; box-shadow: 0 4px 20px rgb(0 0 0/.08); margin: 0 1rem 3rem; min-height: 370px !important; padding: 1rem .75rem; position: relative; transition: box-shadow .3s } .testimonial-logo { max-width: 30px } .testimonial-rating { max-width: 100px } .testimonial-review { display: flex; flex-direction: column; justify-content: space-between } .testimonial-quote, .testimonials-mini-quote, .testimonials-quote {	color: #444;font-family: "Raleway", sans-serif;font-size: 1.2rem;font-weight: 500;	line-height: 1.35;margin: 0;padding: 0;text-shadow: 0 1px 2px rgba(0, 0, 0, .15);} .source-link { color: #444; font-size: 1rem; text-decoration: none } .cservice-section h2, .whytitle { color: #fff; margin-bottom: .5rem } .reviewer-name { color: #00335a; font-size: 1.1rem; font-weight: 500; margin-top: auto } .google-review-link { background-color: #b30000; border-radius: 4px; color: #fff; display: inline-block; font-size: 1.1rem; font-weight: 600; margin-top: 2rem; padding: 15px 20px !important; text-decoration: none } .google-review-link:active, .google-review-link:focus, .google-review-link:hover, .windows-more-link:active, .windows-more-link:focus, .windows-more-link:hover { background-color: #900; text-decoration: underline } .gallery-section { background-color: #fff; font-size: 1.25rem; padding: 4rem 0 3rem } .cservice-section { background: linear-gradient(180deg, #b3001b, #a41623), repeating-linear-gradient(45deg, hsla(0, 0%, 100%, .03) 0, hsla(0, 0%, 100%, .03) 1px, transparent 0, transparent 8px), repeating-linear-gradient(-45deg, hsla(0, 0%, 100%, .03) 0, hsla(0, 0%, 100%, .03) 1px, transparent 0, transparent 8px); background-blend-mode: overlay; color: #fff; padding: 3rem 1rem } .cservice-section .byline { font-size: 1.25rem; line-height: 1.6; margin-bottom: 1.5rem } .whyus-box { background-color: rgb(179 0 27/.4); border: 1px solid; border-radius: 0; height: 100%; transition: background-color .2s ease-in-out } .whyus-box:active, .whyus-box:focus, .whyus-box:hover { background-color: hsla(0, 0%, 100%, .1) } .whytitle { font-size: 1.5rem; font-weight: 600 } .whydesc { color: #e0e0e0; font-size: 1.2rem } .btn-estimate { background-color: #fff; border: 2px solid #b1282c; color: #b1282c; font-weight: 600; padding: .75rem 1.5rem; text-decoration: none } .btn-estimate:hover { background-color: #b1282c; color: #fff; text-decoration: none } .footer-wrapper { background-color: #12345e; border-top: 1px solid #002138; color: #fff; font-size: 1.125rem; padding: 3rem 0 0 } .footer-wrapper h2 { color: #fff; font-family: Anton, sans-serif; font-size: 1.75rem; margin-bottom: 1rem; margin-top: 3rem } .about-intro ul li, .footer-wrapper p, .page-intro ul li { margin-bottom: .75rem } .btn-outline-red:focus, .btn-outline-red:hover, .footer-wrapper a, .service-gallery a:active, .service-gallery a:focus, .service-gallery a:hover { color: #fff; text-decoration: none } .footer-menu-list a:active, .footer-menu-list a:focus, .footer-menu-list a:hover, .footer-wrapper a:active, .footer-wrapper a:focus, .footer-wrapper a:hover { color: #daefff; text-decoration: underline } .footer-wrapper p { color: #fff; font-size: 1.125rem; line-height: 1.4 } .footer-social { display: flex; gap: 1rem; margin-top: 1rem } .footer-social li a { color: #fff; font-size: 2rem; height: 3rem; padding: 0; transition: color .2s ease-in-out; width: 3rem } .footer-social li a:active, .footer-social li a:focus, .footer-social li a:hover { color: #daefff } .footer-menu-list a { font-size: 1.125rem; font-weight: 400 } .footer-bottom-wrapper { background-color: #09263e; border-top: 1px solid #1f3d56; font-size: 14px; font-style: italic; margin-top: 2rem; padding: 5px 0; text-align: center } .contact-info { align-items: start; color: #e0e0e0; display: flex; gap: .75rem } .contact-info i { color: #fff; font-size: 1.2rem; margin-top: .5rem } .contact-red { color: #aa1b1f; font-size: 1rem; font-style: italic; line-height: 1.2 } .copyright { color: #ccc; font-size: .85rem; padding: .5rem 0; text-align: center } .header-wrapper, .navbar { position: relative; z-index: 1100 } #scrollToTopBtn { background: #c8102e; border: 0; border-radius: 4px; bottom: 2rem; color: #fff; cursor: pointer; font-size: 1.25rem; opacity: 0; padding: .5rem .75rem; pointer-events: none; position: fixed; right: 1.5rem; transition: opacity .3s ease-in-out; z-index: 999 } #scrollToTopBtn.visible { opacity: 1; pointer-events: auto } #scrollToTopBtn:focus { background: #a10d23; box-shadow: 0 0 0 4px rgb(200 16 46/.4) } .skip-nav { background-color: #a11e2a } .skip-nav-item a { color: #fff; display: block; padding: 1em; text-align: center; text-decoration: none } .skip-nav-item a:active, .skip-nav-item a:focus { background-color: #8a1d00; outline: 0; text-decoration: underline } .service-page { font-size: 1.3rem; letter-spacing: .04rem; line-height: 2rem } .service-page h2, .service-page h3, .service-page h4, .service-page h5, .service-page h6 { color: #003761; font-family: Anton, sans-serif } .small, small { font-size: .85em !important; line-height: 1.75 } .text-muted { color: #6c757d !important } .contact-alt-box a:active, .contact-alt-box a:focus, .contact-alt-box a:hover, .contact-item a:active, .contact-item a:focus, .contact-item a:hover, .red { color: #b71d22 } .blue { color: #0e2a4e } .padding-1, .testimonial-slider-section .slick-list, .testimonial-slider-white-section .slick-list { padding: 1rem 0 } .padding-2, .page-intro { padding: 2rem 0 } .awards-strip, .padding-3 { padding: 3rem 0 } .padding-4 { padding: 4rem 0 } .padding-5 { padding: 5rem 0 } .padding-6 { padding: 6rem 0 } .section-white { background-color: #fff } .section-gray { background-color: #f8f9fa } .section-dark { background-color: #062f57; color: #fff } .section-red { background-color: #bf2c2c; color: #fff } .section-navy { background-color: #003b68; color: #fff } #gutter-guards, #gutter-repair, #gutter-replacement, #section-hero { scroll-margin-top: 120px } .service-hero { background-position: bottom; background-repeat: no-repeat; background-size: cover; padding: 3rem 0 0; position: relative } .service-hero:before { background: rgb(14 42 78/.8); content: ""; inset: 0; position: absolute; z-index: 1 } .hero-content { color: #fff; position: relative; z-index: 2 } .hero-content .hero-title { border-left: 10px solid #b71d22; color: #fff; font-family: Oswald, sans-serif; font-size: clamp(2rem, 1vw + 1rem, 4.5rem); font-weight: 700; line-height: 1.1; margin-bottom: 1.5rem; padding: 0 0 .5rem .5rem; text-transform: uppercase } .hero-content .hero-intro { font-size: 1.1rem; line-height: 2rem; text-shadow: 1px 1px 2px rgb(0 0 0/.8) } .breadcrumb-white, .breadcrumb-white .breadcrumb, .breadcrumb-white .breadcrumb a, .breadcrumb-white .breadcrumb-item, .breadcrumb-white .breadcrumb-item + .breadcrumb-item:before, .breadcrumb-white .breadcrumb-item.active, .estimate-form .form-label, .faq-toggle[aria-expanded=true] i, .hero-content strong, .service-addons a, .service-gallery a, .testimonial-slider-section { color: #fff } .hero-subtitle, .hero-tagline, .hero-title { text-shadow: 0 1px 3px rgb(0 0 0/.6), 0 2px 8px rgb(0 0 0/.4) } .hero-content .brand-wrap img { margin: 10px; max-width: 100px } .hero-cta { background-color: #b71d22; border: 0; border-radius: 0; color: #fff; display: block; font-size: 1.05rem; font-weight: 600; margin-top: 3rem; padding: .85rem 1.25rem; text-align: center; text-decoration: none; transition: .3s } .hero-cta:active, .hero-cta:focus, .hero-cta:hover { background-color: #d32f2f; box-shadow: 0 4px 12px rgb(0 0 0/.15); color: #fff; text-decoration: none; transform: translateY(-2px) } .breadcrumb-nav { font-size: .85rem; margin-top: 1.5rem; position: relative; z-index: 2 } .breadcrumb { font-size: .9rem; margin-bottom: 0 !important } .breadcrumb a { display: inline-block; padding: 2px 4px } .breadcrumb a, .breadcrumb-item + .breadcrumb-item:before, .breadcrumb-item.active { color: #fff !important } .breadcrumb a:active, .breadcrumb a:focus, .breadcrumb a:hover, .breadcrumb-white .breadcrumb a:active, .breadcrumb-white .breadcrumb a:focus, .breadcrumb-white .breadcrumb a:hover { opacity: .85; text-decoration: underline } @media(prefers-contrast:more) { .breadcrumb a, .breadcrumb-item.active { color: #fff !important; text-decoration: underline } } .page-intro .intro-title { color: #00335a; font-family: Anton, sans-serif; font-size: 2.275rem; font-weight: 400; line-height: 1.1; margin: 0; text-transform: uppercase } .page-intro .intro-subtitle { color: #bf1f20; font-family: Oswald, sans-serif; font-size: 1.2785rem; font-weight: 500; line-height: 1.1; margin: 0 0 1.5rem; text-transform: uppercase } @media(min-width:390px) { .page-intro { padding: 2rem .5rem } .page-intro .intro-title { font-size: clamp(2.275rem, 3.5vw + .75rem, 3.5rem) } .page-intro .intro-subtitle { font-size: clamp(1.65rem, 3.25vw + .25rem, 2rem) } } .service-page ul.checkmark li { list-style-type: none; padding: 3px 0 3px 30px; position: relative } .service-page ul.checkmark li:before { background: url(../img/checkmarkred.webp) no-repeat; content: ""; height: 20px; left: 0; position: absolute; top: 10px; width: 20px } .intro-closer { color: #a40000; font-family: Oswald, sans-serif; font-size: 1.575rem; font-weight: 400; letter-spacing: .045rem } .about-intro .container, .page-intro .container, .service-hero .container { max-width: 1500px } .about-intro a, .page-intro a { color: #00335a; text-decoration: underline; text-underline-offset: 3px; transition: .2s ease-in-out } .about-intro a:focus, .about-intro a:hover, .page-intro a:focus, .page-intro a:hover { color: #b71d22; text-decoration-color: #b71d22; text-decoration-thickness: 2px } .about-intro ul, .page-intro ul { list-style: none; margin-bottom: 2rem; margin-top: 1.5rem; padding-left: 0 } .page-intro ul li:before { color: #b71d22; content: "›"; display: inline-block; font-size: 1.75rem; font-weight: 600; width: 1rem } .intro-image { box-shadow: 0 3px 6px rgb(0 0 0/.16), 0 3px 6px rgb(0 0 0/.23) } .cta-card i, .faq-icon i, .img-zoom, .testimonial-slide.slick-active { transition: transform .3s } .feature-icon .icon, .feature-title { transition: transform .35s cubic-bezier(.25, 1, .5, 1), box-shadow .35s } .feature-wrapper svg, .service-card-horizontal:hover { transition: transform .3s, box-shadow .3s } @media(min-width:1280px) { .hero-content .hero-title { font-size: clamp(2rem, 5vw + .75rem, 3.5rem) } .page-intro .intro-title { font-size: 2.385rem } .page-intro .intro-subtitle { font-size: clamp(1.375rem, 5vw + .25rem, 1.75rem) } .window-service-callout-text { padding: 1rem 1.5rem 6rem } } @media(hover:hover) and (pointer:fine) { .img-zoom:hover { transform: scale(1.03) } } .section-leadin { background-color: #08365f; background: linear-gradient(180deg, #003b68 0, #002a49); padding: 2rem 1rem 1.5rem } .feature-strip .container { max-width: 1600px } .feature-strip { background-color: #003b68; box-shadow: inset 0 1px 12px rgb(0 0 0/.35); color: #fff; padding: 3rem 1rem 1.5rem } .feature-wrapper { padding: 1rem 1rem 2rem } .recap-card { opacity: 0; transform: translateY(20px) } .recap-card.fade-in { animation: .6s forwards fadeUp } .recap-card:first-child.fade-in { animation-delay: .1s } .recap-card:nth-child(2).fade-in { animation-delay: .25s } .recap-card:nth-child(4).fade-in { animation-delay: .55s } .feature-icon .icon { height: 2.875rem; width: 2.875rem; fill: #f0f9ff } .feature-wrapper:hover .icon { fill: #3fb8e5 !important; box-shadow: 0 4px 8px rgb(0 0 0/.1); transform: translateY(-3px) } .feature-title { color: #fff !important; font-family: Oswald, sans-serif !important; font-size: 1.87rem; font-weight: 500; line-height: 1.2; margin-bottom: .25rem } .feature-wrapper:hover .feature-title { box-shadow: 0 4px 8px rgb(0 0 0/.1); color: #3fb8e5 !important; transform: translateY(-3px) } .feature-strip .feature-desc { font-size: 1.2rem; line-height: 1.5; margin: 0 auto; max-width: 320px } .service-overview { background-color: #fff; color: #212529; padding: 4rem 0; position: relative } .about-services:before, .service-overview:before { background-image: url(../img/jhawklogo-hawk.svg); background-position: top; background-repeat: no-repeat; background-size: 400px; bottom: 0; content: ""; left: 0; opacity: .1; pointer-events: none; position: absolute; right: 0; top: 0; z-index: 2 } .service-overview .section-title { color: #003761; font-family: Anton, sans-serif; font-size: 3rem; margin-bottom: 1.25rem; text-align: center } .service-card-horizontal { background: hsla(0, 0%, 100%, .8); border: 1px solid #ddd; border-radius: .15rem; box-shadow: 0 1px 4px rgb(0 0 0/.1); margin: 0 .25rem 4rem; padding: .75rem 0; position: relative; z-index: 2 } .service-overview .section-subtitle { color: #003c69; font-family: Anton, sans-serif; font-size: 1.75rem; font-weight: 500; line-height: 1.2; margin-bottom: .5rem; margin-top: 0 } .service-overview .section-intro { color: #00335a; font-size: 1.3rem; font-weight: 400; margin-bottom: 3rem; margin-left: auto; margin-right: auto } .btn-subcall, .fa-fw, .fa-li, .section-subline { text-align: center } .service-card-horizontal:hover { box-shadow: 0 5px 10px rgb(0 0 0/.15); transform: translateY(-3px) } .service-card-horizontal:last-child { margin-bottom: 2rem } .service-overview .service-title { color: #003c69; font-size: 2.25rem; margin-bottom: .5rem; margin-top: .75rem } .service-overview .service-desc { height: 100%; margin-bottom: .5rem } .about-intro li strong, .contact-intro strong, .service-overview .service-desc strong, .service-spotlight strong, .service-tier-card strong { color: #00335a; font-weight: 600 } .service-red { background: 0; border: 0; color: #a40000; font-weight: 400; padding: 0; text-decoration: underline; transition: color .2s ease-in-out } .service-red:hover { color: #7d0000; text-decoration: none } .btn-service-estimate { border: 2px solid #a40000; color: #a40000; display: inline-block; font-size: 1rem; font-weight: 600; padding: .65rem 1.25rem; text-align: center; text-decoration: none; transition: .2s ease-in-out; width: 100% } .btn-addon-service-estimate, .btn-gutter-link { display: inline-block; font-size: 1rem; font-weight: 600; transition: background-color .3s, transform .3s, box-shadow .3s; text-decoration: none } .btn-service-estimate:focus, .btn-service-estimate:hover { background-color: #a40000; box-shadow: 0 4px 12px rgb(164 0 0/.25); color: #fff; text-decoration: none; transform: translateY(-2px) } @media(min-width:375px) { .service-overview .service-title { font-size: 2.25rem } } .service-addons { background: #003b68; color: #fff; padding: 4rem 0 3rem } .service-addons .section-title { color: #fff; display: block; font-family: Anton, sans-serif; font-size: 3.25rem; margin-bottom: 1.25rem; position: relative; text-align: center; text-shadow: 1px 1px rgb(0 0 0/.3) } .service-addons .section-title:after { background-color: #b71d22; content: ""; display: block; height: 2px; margin: .5rem auto 0; opacity: .8; width: 75% } .service-addons .section-intro { margin-bottom: 4rem; margin-top: .75rem; text-shadow: 1px 1px rgb(0 0 0/.3) } .btn-addon-service-estimate { background-color: #bf1f20; border: 0; border-radius: 2px; color: #fff; padding: .65rem 1.25rem } .faq-intro, .faq-title { color: #00335a; text-align: center } .btn-addon-service-estimate:hover { background-color: #a71b1b; box-shadow: 0 4px 12px rgb(164 0 0/.25); transform: translateY(-2px) } .guard-card { border: 2px solid #003054; box-shadow: 0 2px 1px rgb(0 0 0/.09), 0 4px 2px rgb(0 0 0/.09), 0 8px 4px rgb(0 0 0/.09), 0 16px 8px rgb(0 0 0/.09), 0 32px 16px rgb(0 0 0/.09); padding: 1rem } .faq-question, .faq-toggle { border-radius: 0; position: relative } ul.guard-spotlights li { font-size: 1.18rem; list-style-type: none; padding: 3px 0 3px 28px; position: relative } ul.guard-spotlights li:before { color: #fff; content: "✔"; display: inline-block; font-size: 1.5rem; height: 30px; left: 0; margin-right: 17px; position: absolute; top: 3px; width: 30px } .guard-card:hover { box-shadow: 0 8px 18px rgb(0 0 0/.25); transform: translateY(-4px) !important; transition: .3s } .btn-gutter-link { border: 1px solid; border-radius: 2px; margin: 2rem 0 1rem; padding: .65rem 1.25rem } .btn-gutter-link:active, .btn-gutter-link:focus, .btn-gutter-link:hover { background-color: #fff; color: #003c69 } .service-addons .guard-title { color: #fff; font-size: 2.25rem; margin-bottom: .5rem; margin-top: .75rem } .faq-title, .testimonial-slider-section .testimonial-heading { font-family: Anton, sans-serif; line-height: 1.1; margin-bottom: 1rem } .faq-toggle, .quote-name, .section-pretitle, .section-subline, .testimonial-author, .testimonial-slider-section .section-subline { font-family: Oswald, sans-serif } .faq-section { background-image: linear-gradient(180deg, #f7f9fb, #edf3f9, #e3ebf5); padding: 5rem 1rem 3rem } .cta-section .section-title, .faq-title { font-size: 3rem } .faq-intro { font-size: 1.35rem; line-height: 1.6; margin: 0 auto 4rem } .faq-item { margin-bottom: 1.5rem; transition: box-shadow .2s } .faq-answer { color: #474747; font-size: 1.2rem; letter-spacing: 1px; line-height: 1.6; margin-top: 0; max-height: 0; opacity: 0; overflow: hidden; padding: 0 3rem; position: relative; transform: translateY(50%); transition: opacity .3s, transform .4s; will-change: transform, opacity; z-index: 2 } .faq-item.active .faq-answer { background: #fff; max-height: 800px; opacity: 1; padding-bottom: 1rem; padding-top: 1rem; transform: translate(0) } .faq-toggle { align-items: center; background-color: #f5f8fa; border: solid #d6e3ed; border-width: 1px 1px 3px; box-shadow: 0 3px 5px rgb(0 0 0/.04); color: #003c69; display: flex; font-size: 1.4rem; line-height: 1.4; overflow-anchor: none; padding: 1.25rem 2.875rem 1.25rem 1rem; text-align: left; transition: border-color .3s, box-shadow .3s; width: 100% } .faq-toggle.active { border-color: #003c69 } .faq-toggle:hover, .faq-toggle[aria-expanded=true] { background-color: #003c69; box-shadow: 0 4px 12px rgb(0 0 0/.05); color: #fff; outline: 0 } .faq-icon { position: absolute; right: 15px; top: 50%; transform: translateY(-50%) } .faq-toggle[aria-expanded=true] .fa-minus { transform: rotate(180deg) } .faq-toggle[aria-expanded=true] .fa-plus { transform: rotate(45deg) } .testimonial-slider-white-section { background: url(../img/awardsbg.webp) hsla(0, 0%, 100%, .15); background-blend-mode: overlay; border-bottom: 1px solid #d6e3ed; border-top: 1px solid #d6e3ed; color: #002d48; padding: 4rem 1rem } .testimonial-slider-white-section .section-subline { color: #b01c21; display: block; font-family: Oswald, sans-serif; font-size: 1.5rem; font-weight: 500; margin-top: .5rem; text-align: left; text-transform: uppercase } .testimonial-slide { background: #fff; border-left: 4px solid #b71d22; box-shadow: 0 4px 10px rgb(0 0 0/.04); height: 100%; margin: 0; padding: 1rem; position: relative } .testimonial-slider-white-section h2 { color: #003b68; font-family: Anton, sans-serif; font-size: 3rem; line-height: 1.1; margin-bottom: 1rem } .testimonial-slide:hover, .testimonial-slider .testimonial-slide:hover, .testimonial-slider-mini .testimonial-slide:hover { box-shadow: 0 12px 24px rgb(0 0 0/.08); transform: translateY(-6px) } .testimonial-slide.fade-on-scroll { opacity: 0; transform: translateY(30px) } .quote-name, .testimonial-author { color: #0e2a4e; display: block; font-style: normal; font-weight: 500; letter-spacing: .5px; margin-top: .5rem } .btn-google-reviews { background-color: #00335a; border: 1px solid #fff; color: #fff; display: block; font-size: 1.1rem; font-weight: 600; line-height: 1; margin: 1rem auto; padding: 1.25rem 1.75rem; text-align: center; text-decoration: none; text-transform: capitalize; transition: .3s ease-in-out; width: 300px } .quote-name, .section-pretitle { text-transform: uppercase; display: block } .btn-google-reviews:focus, .btn-google-reviews:hover { background-color: #003d6b; border-color: #fff; color: #fff; transform: scale(1.05) } .btn-google-reviews.visible { box-shadow: 0 1px 1px rgb(0 0 0/.11), 0 2px 2px rgb(0 0 0/.11), 0 4px 4px rgb(0 0 0/.11), 0 6px 8px rgb(0 0 0/.11), 0 8px 16px rgb(0 0 0/.11); opacity: 1; transform: translateY(0); transition: .4s } .testimonial-slider, .testimonial-slider-white { margin-top: 3rem; padding-bottom: 6rem; position: relative } .splide__arrow { background: #fff; height: 3em; opacity: 1; width: 3em } .splide__arrow:hover { background: #dd2229 } .splide__arrow svg { height: 1.3em; width: 1.3em; fill: #003c69 } .testimonial-slider-section .testimonial-heading { color: #00335a; font-size: 3rem } .testimonial-slider-section .section-subline { color: #d63230; display: block; font-size: 1.375rem; font-weight: 600; margin-top: .5rem; text-align: center; text-shadow: 1px 2px 2px rgb(0 0 0/.2); text-transform: uppercase } .cta-section .section-title, .testimonial-slider-section h2 { color: #fff; font-family: Anton, sans-serif; margin-bottom: 1rem } .testimonial-slider-section h2 { font-size: 3rem; line-height: 1.1; text-align: center; text-shadow: 1px 2px 2px rgb(0 0 0/.2) } .about-cta h2, .final-cta h2 { text-shadow: 0 1px 1px hsla(0, 0%, 100%, .4) } .testimonial-slider-section .splide__arrow--next, .testimonial-slider-section .splide__arrow--prev { bottom: -50px; box-shadow: 2px 2px 2px rgba(0, 0, 0, .8); top: auto; transition: transform .25s, box-shadow .25s } .testimonial-slider-section .splide__arrow--prev { left: 25%; right: auto } .testimonial-slider-section .splide__arrow--next, .testimonial-slider-white-section .splide__arrow--next { left: auto; right: 25% } .testimonial-slider .splide__arrow--next:focus, .testimonial-slider .splide__arrow--next:hover, .testimonial-slider .splide__arrow--prev:focus, .testimonial-slider .splide__arrow--prev:hover { box-shadow: 0 0 8px rgba(0, 0, 0, .4); color: #9f1310; scale: 1.02 } .testimonial-slider-section { border-bottom: 3px solid #002942 } .testimonial-slider-section, .testimonial-slider-section-mini { background: linear-gradient(45deg, transparent 49%, #004275 49% 51%, transparent 51%), linear-gradient(-45deg, transparent 49%, #004275 49% 51%, transparent 51%); background-color: #003c69; background-size: 1em 1em; opacity: 1; padding: 4rem 1rem; position: relative; text-shadow: 2px 2px 2px rgb(0 0 0/.08) } .testimonial-slider-section .testimonial-slide, .testimonial-slider-section-mini .testimonial-mini-slide { margin: 2rem auto 0; max-width: 900px; overflow: hidden; position: relative } .testimonial-slider-section-mini .section-title { color: #fff; font-family: Anton, sans-serif; font-size: 3rem; line-height: 1.1; margin-bottom: 1rem; text-shadow: 2px 2px 2px rgb(0 0 0/.08) } .home-slider-section .section-intro, .testimonial-slider-section-mini .section-intro { color: #fff; font-size: 1.35rem; margin: 0 auto 3rem; max-width: 1120px; text-align: center; text-shadow: 2px 2px 2px rgb(0 0 0/.08); width: 100% } .testimonial-slider .testimonial-slide, .testimonial-slider-mini .testimonial-mini-slide { background: #fff; border-left: 4px solid #b71d22; border-radius: 4px; box-shadow: 0 4px 10px rgb(0 0 0/.04); height: 100%; margin: 0; padding: 1.5rem 1rem; position: relative; transition: transform .3s, box-shadow .3s } .testimonial-slider .testimonial-slide.fade-on-scroll, .testimonial-slider-mini .testimonial-slide.fade-on-scroll { opacity: 0; transform: translateY(0) } .testimonial-mini-slide:before, .testimonial-slide:before { color: #b71d22; content: ""; font-family: Georgia, sans-serif; font-size: 8.5rem; left: .25rem; opacity: .1; position: absolute; top: 3.25rem } .testimonial-mini-slide:before { font-family: Georgia, sans-serif } .quote-name { color: #0e2a4e; font-size: .95rem; font-style: normal; font-weight: 500; letter-spacing: .5px; margin-left: 2rem } .testimonial-slide-mini:first-child { animation-delay: .1s } .testimonial-mini-quote:before { color: #003c69; content: ""; font-size: 2.5rem; left: 1rem; position: absolute; top: .25rem } @media(min-width:576px) { .awards-slider img { max-width: 175px } .service-overview:before { background-position: center 65px } .service-overview .service-title { font-size: 3rem } .testimonial-slider-section h2 { font-size: 2.5rem } .testimonial-slider-section .section-subline { font-size: 1.55rem } .testimonial-slider-section-mini h2 { font-size: 2rem } .midpage-cta .btn { min-width: 240px } } @media(min-width:768px) { .awards-title, .our-services-section h2 { font-size: 3rem } .our-services-section { padding: 4em 2rem } .service-wrapper-callout img { display: block; height: 100%; object-fit: cover; width: 100% } .our-services-section h3 { font-size: 1.75rem } .service-callout-text { padding: 1rem } .testimonials-section h2 { font-size: 3.25rem } .testimonials-section .byline { color: #fff; font-size: 1.25rem; line-height: 1.6; margin: 0 auto 1.5rem; max-width: 900px } .testimonials-section .testimonials-item { box-shadow: 0 0 20px 0 hsla(0, 0%, 87%, .4); margin: .5rem 1rem 2rem; padding: 1rem .75rem; transition: .5s } .testimonials-item { min-height: 250px !important } .testimonials-section { padding: 4rem 1rem .5rem } .testimonials-item:active, .testimonials-item:focus, .testimonials-item:hover { box-shadow: 0 6px 18px rgb(0 0 0/.08) } .testimonials-section .splide__arrow--prev { bottom: -70px; left: 25%; right: auto; top: auto } .testimonials-section .splide__arrow--next { bottom: -70px; left: auto; right: 25%; top: auto } .testimonials-slider .splide__arrow--next:active, .testimonials-slider .splide__arrow--next:focus, .testimonials-slider .splide__arrow--next:hover, .testimonials-slider .splide__arrow--prev:active, .testimonials-slider .splide__arrow--prev:focus, .testimonials-slider .splide__arrow--prev:hover { color: #b30000 } .exterior-gallery a { max-width: 215px } .service-hero { padding: 3rem 0 4rem } .hero-cta { width: fit-content } .breadcrumb-nav { bottom: 0; position: absolute; z-index: 2 } .intro-wrapper { padding: 0 } .service-overview { padding: 7rem 0 3rem } .service-overview .service-title { font-size: 2.75rem } .service-overview:before { background-position: top; background-size: 700px } .service-overview .section-intro { margin-bottom: 4rem } .service-card-horizontal { margin-bottom: 6rem } .btn-service-estimate { width: max-content } .btn-subcall { text-align: left } .faq-toggle { font-size: 1.5rem } .testimonial-slider-section, .testimonial-slider-section-mini { padding: 5rem 1rem 6rem } .testimonial-slider .splide__arrow--next, .testimonial-slider .splide__arrow--prev { bottom: -25px } .testimonial-slider.home-slider { padding-bottom: 8rem } } @media(min-width:992px) { .awards-section .splide__arrow--next { bottom: 20px; left: auto; right: 40px; top: auto } .awards-section .splide__arrow--prev { bottom: 20px; left: 40px; right: auto; top: auto } .awards-section, .testimonials-section { padding: 2rem 0 } .our-services-section h2 { font-size: 3.25rem } .our-services-section h3 { font-size: 2rem } .testimonials-section .splide__arrow--next { bottom: 0; left: auto; right: 40px; top: 50% } .testimonials-section .splide__arrow--prev { bottom: 0; left: 40px; right: auto; top: 50% } .service-wrapper-callout { padding: 0 0 .75rem } .service-hero { min-height: 375px; padding: 4.5rem 1rem 6rem } .hero-body { max-width: 850px } .page-intro { padding: 2.75rem .5rem } .about-services:before, .service-overview:before { background-position: center 10px; background-size: 750px } .service-card-horizontal { margin-bottom: 4rem } .service-overview .service-title { font-size: 2.25rem; margin-bottom: .75rem; margin-top: .75rem } .service-overview .service-desc { line-height: 1.5; margin-bottom: 0 } .service-card-horizontal img { height: 100%; object-fit: cover; padding: 0 } .service-addons .section-title, .service-overview .section-title { font-size: 2.7rem } .testimonial-slider { margin-top: 0; padding-bottom: 4rem } .testimonial-slider-section, .testimonial-slider-section-mini { padding: 5rem 1rem 4rem } .testimonial-slider-mini { padding-bottom: 4rem } .btn-google-reviews { width: 250px; margin: 1rem } .testimonial-slider .splide__arrow--next, .testimonial-slider .splide__arrow--prev { bottom: -25px } .testimonial-slider-section .splide__arrow--prev { left: 35% } .testimonial-slider-section .splide__arrow--next { right: 35% } .testimonial-slider .splide__arrow--next:active, .testimonial-slider .splide__arrow--next:focus, .testimonial-slider .splide__arrow--next:hover, .testimonial-slider .splide__arrow--prev:active, .testimonial-slider .splide__arrow--prev:focus, .testimonial-slider .splide__arrow--prev:hover, .testimonial-slider.home-slider .splide__arrow--next:active, .testimonial-slider.home-slider .splide__arrow--next:focus, .testimonial-slider.home-slider .splide__arrow--next:hover, .testimonial-slider.home-slider .splide__arrow--prev:active, .testimonial-slider.home-slider .splide__arrow--prev:focus, .testimonial-slider.home-slider .splide__arrow--prev:hover { scale: 1.05 } } @media(min-width:1200px) { .service-option { font-size: .75rem } .service-card .container { max-width: 95% } .testimonials-item { min-height: 275px !important } .footer-wrapper p { font-size: 1.25rem } .hero-body { max-width: 100% } .feature-strip { background-color: #003c69; border-bottom: 4px solid #002942; border-top: 2px solid #002942; box-shadow: inset 0 1px 12px rgb(0 0 0/.35); color: #f0f9ff; padding: 3rem 1rem 0 } .feature-title { font-size: 1.5rem } .faq-title, .service-overview .section-title { font-size: 3rem } .faq-toggle { font-size: 1.45rem } .testimonial-slider { padding: 0 8rem } .testimonial-slider.home-slider { padding: 0 7rem 3rem } .btn-google-reviews { line-height: 1.3; margin: 0 .75rem; padding: 1rem 1.75rem; width: auto } .btn-google-reviews:hover { box-shadow: 0 4px 12px rgb(0 0 0/.1); transform: translateY(-5px) } .testimonial-slider-white-section .splide__arrow--prev { bottom: auto; left: 40px; right: auto; top: 50% } .testimonial-slider-white-section .splide__arrow--next { bottom: auto; right: 40px; top: 50% } } @media(min-width:1400px) { .faq-toggle { font-size: 1.5rem; padding: 1.25rem 2.125rem 1.25rem 1rem } .home-slider-section .container { max-width: 1366px } .btn-google-reviews { font-size: 1rem; line-height: 1.3; margin: 0 .5rem; padding: 1rem .25rem; width: 200px } } @media(min-width:1600px) { .hero-text-wrapper .hero-textlg { font-size: 5rem } .home-slider-section .container { max-width: 1500px } } .cta-section { animation: .8s ease-out both fadeInUp; background: linear-gradient(180deg, #aa1b1f, #bb0a21), repeating-linear-gradient(45deg, hsla(0, 0%, 100%, .03) 0, hsla(0, 0%, 100%, .03) 1px, transparent 0, transparent 8px), repeating-linear-gradient(-45deg, hsla(0, 0%, 100%, .03) 0, hsla(0, 0%, 100%, .03) 1px, transparent 0, transparent 8px); background-blend-mode: overlay; border-bottom: 1px solid #841518; border-top: 5px solid hsla(0, 0%, 100%, .8); color: #fff; padding: 4rem 1rem 3rem; text-align: center } .cta-section.no-border-top { border-top: 0 } .cta-section .section-intro { color: #fff; font-size: 1.35rem; line-height: 1.6; margin: 0 auto 3rem; opacity: .95; text-align: center } .cta-card { border: 1px solid hsla(0, 0%, 100%, .375); box-shadow: 0 4px 15px rgb(0 0 0/.1); height: 100%; padding: 3rem 1.5rem; text-align: center } .cta-card:hover { background-color: hsla(0, 0%, 100%, .08); box-shadow: 0 8px 24px rgb(0 0 0/.15); transform: translateY(-5px) } .cta-card:hover i { transform: scale(1.15) } .btn-estimate:hover { box-shadow: 0 0 0 3px hsla(0, 0%, 100%, .2); transform: scale(1.05) } .cta-card h3 { color: #fff; font-size: 2rem; margin-bottom: .75rem } .cta-section .btn-estimate { background-color: #fff; border: 2px solid #fff; border-radius: 2px; color: #a41623; display: inline-block; font-size: 1rem; font-weight: 600; padding: .75rem 1.25rem; text-align: center; text-decoration: none; transition: .3s } .btn-estimate:active, .btn-estimate:focus, .cta-section .btn-estimate:hover { background-color: #fff0; box-shadow: 0 6px 14px rgb(0 0 0/.15); color: #fff; text-decoration: none; transform: translateY(-2px) } .trust-badges img { opacity: .85; transition: opacity .3s } .wrap-callout { border-bottom: 3px solid #d4dce2; border-top: 3px solid #aa1b1f; padding: 2rem 0 3rem; text-align: center; text-shadow: 1px 1px 1px rgb(0 0 0/.08) } .wrap-callout.wrap--gradient { border-top: 3px solid #ebf7ff; background: linear-gradient(0deg, rgba(245, 251, 255, 0.73) 0, rgba(245, 251, 255, 0) 100%); background-color: #f5fbff } .section-pretitle { color: #b01c21; font-size: 1.5rem; font-weight: 500; margin-top: .5rem } .wrap-callout-heading { color: #00335a; font-size: 1.65rem; margin-bottom: .5rem } .wrap-callout-icon { color: #00335a; font-size: 3.5rem; margin: 2rem auto .75rem } .wrap-callout .section-title { color: #00335a; font-size: 2.75rem; margin-bottom: 1rem } .step, .wrap-callout .section-intro { margin-bottom: 3rem } .wrap-callout-text { color: #444; line-height: 1.6 } .wrap-callout-link { background: 0; border: 2px solid #aa1b1f; border-radius: 3px; color: #aa1b1f; display: block; font-size: 1rem; font-weight: 600; margin: 1.25rem auto 2rem; max-width: 300px; padding: .5rem .75rem; text-decoration: none; text-shadow: none; transition: transform .3s, box-shadow .3s } .home-gallery-slider img, .service-gallery-slider img, .testimonial-slide { border-radius: 2px; transition: transform .3s, box-shadow .3s } .testimonial-slide.fade-on-scroll.fade-in, .testimonial-slider .testimonial-slide.fade-on-scroll.fade-in, .testimonial-slider-mini .testimonial-slide.fade-on-scroll.fade-in, .wrap-callout-link.fade-on-scroll.fade-in { opacity: 1; transform: translateY(0); transition: opacity .6s, transform .6s } .awards-slider .splide__slide img:focus, .awards-slider .splide__slide img:hover, .testimonial-slide.slick-active:hover { transform: translateY(-4px) } .wrap-callout-link:focus, .wrap-callout-link:hover { background-color: #a40000; box-shadow: 0 4px 12px rgb(164 0 0/.25); color: #fff; text-decoration: none; transform: scale(1.03); transform: translateY(-2px) } .service-gallery { background: #003c69; background: linear-gradient(0deg, #002d4f, #003c69 20%, #003c69 60%, #002d4f); border-top: 5px solid #003054; color: #fff; font-size: 1.25rem; gap: 1rem; padding: 4rem 0 } .service-gallery .section-title { color: #fff; font-size: 3rem; text-shadow: 1px 1px 1px rgb(0 0 0/.8) } .service-gallery .section-intro { color: #fff; font-size: 1.3rem; margin: 0 auto 3rem !important; max-width: 1120px; text-align: center; width: 100% } .home-gallery-slider, .service-gallery-slider { font-size: 1.25rem; gap: 1rem; padding: 1rem 1rem 5rem; position: relative } .gallery-photos { font-size: 1.25rem; gap: 1rem; padding: 1rem 0 } .gallery-photos a { border: 1px solid #ddd; border-radius: 4px; box-shadow: 0 2px 8px 0 rgba(99, 99, 99, .2); display: block; height: auto; overflow: hidden; position: relative; transition: transform .2s ease-in-out } .gallery-photos a:active, .gallery-photos a:focus, .gallery-photos a:hover { box-shadow: 0 5px 15px rgba(0, 0, 0, .35); transform: scale(1.02) } .service-gallery-slider a:active img, .service-gallery-slider a:focus img, .service-gallery-slider a:hover img { box-shadow: 0 5px 15px rgba(0, 0, 0, .35); transform: scale(1.03) } .gallery-photos img { border-radius: 2px; height: auto; transition: transform .3s } .service-gallery-slider img { box-shadow: 0-25px 20px -20px rgb(0 0 0/.45), 0 25px 20px -20px rgb(0 0 0/.45), -25px 0 20px -20px rgb(0 0 0/.45); height: auto; margin: 0 1rem } #home-gallery-splide .splide__slide { align-items: center; display: flex; justify-content: center; padding-bottom: 1.5rem; padding-top: .75rem } #home-gallery-splide .splide__slide > .card, #home-gallery-splide .splide__slide > figure, #home-gallery-splide .splide__slide > img { display: block; margin-inline: auto } #home-gallery-splide .splide__list { align-items: center; padding-left: 0 } #home-gallery-splide .splide__arrow { background: #003c69; box-shadow: 1px 1px 3px rgba(0, 0, 0, .4); opacity: 1; transition: transform .25s, box-shadow .25s } #home-gallery-splide .splide__arrow:active, #home-gallery-splide .splide__arrow:focus, #home-gallery-splide .splide__arrow:hover { background: #b30000; box-shadow: 1px 1px 5px rgba(0, 0, 0, .4); scale: 1.02 } #home-gallery-splide .splide__arrow svg { fill: #fff } .home-gallery-slider img { box-shadow: 0 4px 8px -2px rgba(9, 30, 66, .25), 0 0 0 1px rgba(9, 30, 66, .08) } .service-gallery-slider img:active, .service-gallery-slider img:focus, .service-gallery-slider img:hover { box-shadow: 0 4px 16px rgb(0 0 0/.15); transform: scale(1.05) } .home-gallery-slider .splide__arrow--next, .service-gallery-slider .splide__arrow--next { bottom: -50px; left: auto; right: 25%; top: auto } .home-gallery-slider .splide__arrow--prev, .service-gallery-slider .splide__arrow--prev { bottom: -50px; left: 25%; right: auto; top: auto } .home-gallery-slider .splide__arrow--next i, .home-gallery-slider .splide__arrow--prev i, .service-gallery-slider .splide__arrow--next i, .service-gallery-slider .splide__arrow--prev i { bottom: -50px; color: #fff; font-size: 2.5rem; text-shadow: 0 0 6px rgb(0 0 0/.4); transition: .3s } .about-cta a.btn, .final-cta a.btn { background-color: #0e2a4e; transition: background-color .3s } @media(min-width:768px) { .testimonial-slider-section h2 { font-size: 3rem } .wrap-callout-link { font-size: .9rem; padding: .5rem } .service-gallery { padding: 4rem 0 5rem } /* .service-gallery-slider img { max-width: 200px }*/ .about-services { padding: 7rem 0 4rem } .about-services:before { background-position: top; background-size: 700px } } @media(min-width:992px) { .testimonial-slider-section .section-subline, .testimonial-slider-section h2 { text-align: left } .cta-section .section-title { font-size: 3rem } .wrap-callout-link { font-size: 1rem; padding: .5rem .75rem } .service-gallery .section-title { font-size: 2.75rem } .home-gallery-slider .splide__arrow--prev, .service-gallery-slider .splide__arrow--prev { left: 35% } .home-gallery-slider .splide__arrow--next, .service-gallery-slider .splide__arrow--next { right: 35% } } @media(min-width:1024px) { .service-gallery-slider .splide__arrow--next { right: 40% } .service-gallery-slider .splide__arrow--prev { left: 40% } } @media(min-width:1800px) { .hero-text-wrapper .hero-textlg { font-size: 5.5rem } .sticky-wrapper .logo img { max-width: 320px } .home-hero .container { padding: 0 110px } .service-gallery .container { max-width: 1600px } } .btn-outline-red { background-color: #00335a; border: 1px solid #fff; color: #fff; display: block; font-size: 1.1rem; font-weight: 500; margin: 0 auto; padding: .5rem 1.25rem; text-decoration: none; text-transform: capitalize; transition: .3s ease-in-out; width: fit-content } .final-cta { background: url(../img/awardsbg.webp) #e9f5ff; border-top: 2px solid; padding: 3rem 1rem; text-align: center } .final-cta h2 { color: #002d48; font-size: 2rem; margin-bottom: 1rem } .final-cta p { color: #333; font-size: 1.125rem; line-height: 1.6; margin: 0 auto 2rem; max-width: 700px } .final-cta a.btn { border: 0; border-radius: 4px; color: #fff; font-size: 1rem; font-weight: 600; padding: .75rem 1.5rem; text-decoration: none } .about-cta a.btn:hover, .final-cta a.btn:hover { background-color: #143b6a } @media(max-width:768px) { .cta-button, .sticky-mobile-cta { background-color: #003c69; display: flex } .sticky-mobile-cta { bottom: 0; box-shadow: 0-2px 8px rgb(0 0 0/.15); justify-content: space-around; left: 0; position: fixed; width: 100%; z-index: 9999 } .cta-button { align-items: center; border-right: 1px solid hsla(0, 0%, 100%, .2); box-shadow: 0 2px 6px rgb(0 0 0/.08); color: #fff; flex: 1; font-size: 1rem; font-weight: 600; gap: .5rem; justify-content: center; padding: 1rem; text-align: center; text-decoration: none; transition: background-color .2s, transform .2s } .cta-button.call-now { background: #b1282c; border-right: 0 } .cta-button:focus, .cta-button:hover { background-color: #f3f7fa; color: #b1282c; outline: 0; transform: translateY(-2px) } body { padding-bottom: 60px } #scrollToTopBtn { bottom: 4rem } .sticky-mobile-cta { transition: transform .4s, opacity .4s } .sticky-mobile-cta.hide-footer, .sticky-mobile-cta.is-js { opacity: 0; transform: translateY(100%) } .sticky-mobile-cta.show-footer { opacity: 1; transform: translateY(0) } } .sticky-mobile-cta { bottom: 0; box-shadow: 0-2px 6px rgb(0 0 0/.15); display: flex; justify-content: space-around; left: 0; position: fixed; right: 0; transition: transform .3s, opacity .3s; z-index: 9999 } .sticky-mobile-cta.hidden { opacity: 0; pointer-events: none; transform: translateY(100%) } .sticky-mobile-cta.revealed { animation: .4s pop-up-fade; box-shadow: 0-4px 12px rgb(0 0 0/.25) } .about-intro ul li:before { color: #b71d22; content: "›"; display: inline-block; font-size: 2rem; font-weight: 600; width: 1.25rem } .about-services .section-title { color: #00335a; font-family: Anton, sans-serif; font-size: 3rem; margin-bottom: 1rem; text-shadow: 1px 1px 3px rgb(0 0 0/.1) } .about-services .section-intro { color: #00335a; font-size: 1.5rem; font-weight: 400; margin-bottom: 3rem; margin-left: auto; margin-right: auto; text-shadow: 0 1px 2px rgb(0 0 0/.1) } .jayhawk-warranty strong, .section-subline { font-size: 1.75rem } .section-subline, .section-subline-small { color: #b01c21; display: block; font-weight: 500; height: auto; margin-top: 1.5rem; text-transform: uppercase } .section-subline-small { font-family: Oswald, sans-serif; font-size: 1.5rem } .about-services .mini-service-card { background-color: #fff; border-radius: 2px; box-shadow: 0 1px 4px rgb(0 0 0/.16), 0 3px 4px rgb(0 0 0/.23); margin: .75rem auto; max-width: 400px; position: relative; transition: transform .3s, box-shadow .3s } .mini-service-card:after { background: #003c69; background: linear-gradient(0deg, #003c69, rgb(0 60 105/.5)); content: ""; inset: 0; position: absolute; transition: background .3s } .about-services .mini-service-card, .mini-service-card img { display: block; height: auto; width: 100% } .mini-service-card:hover { box-shadow: 0 3px 6px rgb(0 0 0/.16), 0 3px 6px rgb(0 0 0/.23); transform: translateY(-5px) } .mini-service-card:hover:after { background: linear-gradient(0deg, #003c69, rgb(0 60 105/.1) 50%) } .about-services .service-label { bottom: 1.25rem; color: #fff; font-family: Oswald, sans-serif; font-size: 1.75rem; font-weight: 600; left: 50%; letter-spacing: 2px; position: absolute; text-align: center; text-shadow: 2px 3px 5px rgb(0 0 0/.2); text-transform: uppercase; transform: translateX(-50%); z-index: 2; width: 100% } .service-area-section { padding: 4rem 1rem } .service-area-section .section-title { font-size: 3rem; margin-bottom: 0 } .section-byline { color: #b01c21; font-family: Oswald, sans-serif; font-size: 1.665rem; font-weight: 500; line-height: 1.3 } .area-list { column-count: 2; list-style: none; margin-top: 1rem; padding-left: 0 } .area-list li:before { color: #b71d22; content: "✔"; margin-right: .5rem } .area-list li { align-items: center; display: flex; margin-bottom: .75rem } .area-link { color: #00335a; font-weight: 500; text-decoration: underline } .area-link:focus, .area-link:hover { color: #b00000; text-decoration: none } .service-area-section strong { color: #00335a; font-size: 1.25rem } .map-wrapper iframe { border-radius: .5rem; box-shadow: 0 4px 15px rgba(0, 0, 0, .1) } .service-map { border-radius: .5rem; box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .05); object-fit: cover } .about-cta { background: url(../img/awardsbg.webp) #e9f5ff; border-bottom: 1px solid #d6e3ed; border-top: 1px solid #d6e3ed; color: #fff; padding: 3.5rem 1rem; text-align: center } .about-cta .cta-title, .about-cta h2 { font-size: 2.25rem; margin-bottom: 1rem } .about-cta .cta-subtitle, .about-cta p { font-size: 1.25rem; margin: 0 auto 2rem } .about-cta .about-cta-tagline, .contact-intro .intro-subtitle { font-family: Oswald, sans-serif; line-height: 1.1; margin: 5px 0 1.5rem; text-transform: uppercase } .about-cta .btn, .about-cta a.btn { font-size: 1rem; font-weight: 600; padding: .75rem 1.5rem } .about-cta .btn { border-radius: .375rem; transition: .2s ease-in-out } .about-cta .btn:hover { transform: translateY(-2px) } .about-cta h2 { color: #002d48; font-size: 2rem } .about-cta p { color: #333; font-size: 1.125rem; line-height: 1.6 } .about-cta a.btn { border: 0; border-radius: 4px; color: #fff; display: block; margin: 1rem auto; text-decoration: none; width: 300px } .about-cta .about-cta-tagline { color: #0e2a4e; font-size: 1.15rem; font-weight: 500; letter-spacing: .03em } .contact-intro .intro-subtitle { color: #bf1f20; font-size: 1.75rem; font-weight: 500 } .contact-detail em { color: #aa1b1f; font-size: 90% } .contact-form input, .contact-form textarea, .estimate-form .form-control, .estimate-form .form-select { border: 1px solid #ccc; border-radius: 4px; padding: .75rem; width: 100% } .page-intro.contact-intro { padding-top: 3rem } .contact-form button { background-color: #003c69; border: 0; border-radius: 0; color: #fff; font-weight: 700; margin-top: 2rem; padding: .75rem 2rem; transition: .5s } .page-intro.contact-intro .contact-form .contact-form-intro .intro-title { font-size: 2rem; margin-top: 0 } .page-intro.contact-intro .intro-title { font-size: 1.875rem; margin-bottom: 1rem } .contact-form-intro { border-bottom: 1px solid #f1f1f1; font-size: 1.375rem; margin-bottom: 3rem; padding-bottom: .25rem } .contact-form { background-color: #f4f9fd; border: 1px solid #e1eff9; border-radius: 6px; box-shadow: 0 2px 6px rgba(0, 0, 0, .04); padding: 2rem 1rem } .form-label { color: #003c69; font-size: 1.175rem; font-weight: 500 } .contact-form button:active, .contact-form button:focus, .contact-form button:hover { background-color: #a40000; box-shadow: 0 12px 24px rgba(0, 0, 0, .08); transform: translateY(-2px) } .contact-info-list { color: #0e2a4e; list-style: none; margin: 3rem 0 0 1rem } .contact-info-list .contact-icon { color: #c82333; font-size: 1.5rem; margin-right: 1rem; vertical-align: middle } .contact-item { display: flex; justify-content: flex-start; margin: .75rem 0 } .alt-form-link { color: #003c69; font-family: Anton, sans-serif; font-size: 1.75rem } .contact-alt-box, .moreInfo { margin-top: 2rem } .btn-contact-estimate { background-color: #fff; border: 2px solid #b1282c; color: #b1282c; display: inline-block; font-weight: 600; padding: .5rem 1.15rem; text-decoration: none; transition: .5s } .btn-contact-estimate:hover { background-color: #b1282c; border: 2px solid #b1282c; box-shadow: 0 12px 24px rgba(0, 0, 0, .08); color: #fff; transform: translateY(-2px) } .map-wrapper, .service-btn-group { margin-top: 3rem } .map-responsive { border-top: 1px solid #f1f1f1 } .map-wrapper .map-heading { background-color: #003c69; color: #fff; font-size: 2.75rem; margin: 0; padding: 2rem 0 } @media(min-width:1300px) { .hero-body { max-width: 1225px } .page-intro .intro-title { font-size: clamp(2.25rem, 1.2vw + 1.525rem, 2.675rem) } .page-intro .intro-subtitle { font-size: clamp(1.375rem, 5vw + .25rem, 1.7rem) } .faq-toggle { font-size: 1.5rem; padding: 1.25rem 2.125rem 1.25rem 1rem } .faq-icon { right: 10px } .cta-section .container { max-width: 1280px } .cta-card h3 { font-size: 1.8rem } .contact-intro .intro-title { font-size: 2.5rem } .intro-text { max-width: 725px } } @media(min-width:1400px) { .contact-intro .intro-title { font-size: 2.75rem } } @media(min-width:1500px) { .contact-intro .intro-title { font-size: 2.875rem } .intro-text { max-width: 800px } } .awards-strip img { max-height: 60px; opacity: .75; transition: opacity .3s } .estimate-page .service-hero { background: rgba(14, 42, 78, .65); min-height: auto; padding: 4.5rem 1rem 3rem } .page-intro.estimate-intro { background-color: #fff; color: #212529; padding: 3rem 1rem; position: relative } .estimate-form-wrapper { background-color: rgba(255, 255, 255, .6); border-radius: 6px; box-shadow: rgba(0, 0, 0, .05) 0 6px 24px 0, rgba(0, 0, 0, .08) 0 0 0 1px; position: relative; padding: 4rem 1rem; margin-bottom: 2rem } .contact-form label, .estimate-form label:not(.service-option) { font-size: 1.1rem; font-weight: 700; color: #003c69; margin-bottom: .2rem; margin-top: 1rem } .project-description, .service-select-group legend { display: block; float: none; text-align: left; color: #00335a; margin-top: 1.5rem; font-size: 1.1rem; font-weight: 700 } .estimate-form-btn, .step-icon svg { font-size: 1rem; margin-bottom: 1rem } .estimate-form .service-select-group .service-option span { border: 1px solid #ccc; border-radius: 4px; color: #555; display: inline-block; width: 100%; background-color: transparent; font-weight: 400 } .estimate-form { scroll-margin-top: 125px } .estimate-form .service-option { cursor: pointer; font-size: .8rem; font-weight: 500 } .estimate-form .service-select-group .service-option:active span, .estimate-form .service-select-group .service-option:focus span, .estimate-form .service-select-group .service-option:hover span { background-color: #a32121; border-color: #a32121; color: #fff; font-weight: 700 } .estimate-form .service-option input:checked + span { background-color: #a32121; border-color: #a32121; color: #fff } .estimate-form-btn { background-color: #a11b1b; border: 1px solid #a11b1b; border-radius: 4px; color: #fff; transition: .3s; font-weight: 600; padding: .65rem 1.25rem; text-decoration: none; margin-top: 3rem } .estimate-form-btn:active, .estimate-form-btn:focus, .estimate-form-btn:hover { background-color: #bd0000; transform: translateY(-2px); box-shadow: rgba(0, 0, 0, .24) 0 3px 8px } .estimate-nextsteps { background: url(../img/awardsbg.webp) #e9f5ff; border-bottom: 1px solid #d6e3ed; border-top: 1px solid #d6e3ed; padding: 3rem 1rem 3.5rem; text-align: center; text-shadow: 1px 1px 1px rgb(0 0 0/.2) } .nextsteps-heading { color: #00335a; font-size: 2.5rem; margin-bottom: 4rem; text-transform: uppercase } .step-icon svg { color: #00335a; height: 3.5rem; width: 3.5rem; fill: #00335a } .step-title { color: #00335a; font-size: 1.75rem; margin-bottom: .25rem } .step p { color: #333; font-size: 1rem; margin: 0 auto; max-width: 320px } .divider { background-color: #ddd; border: 0; height: 1px; margin: 2.5rem auto; width: 80% } .nextsteps-trust { display: flex; flex-wrap: wrap; gap: 1.5rem; justify-content: center } .callout-box, .trust-item { border-radius: 4px; font-size: 1rem } .trust-item { background: #00335a; box-shadow: 0 1px 4px rgba(0, 0, 0, .05); color: #fff; padding: .75rem 1rem; width: 100% } @media(min-width:768px) { .testimonial-slider-section-mini h2 { font-size: 4rem } .testimonial-slider-mini .testimonial-mini-slide { min-height: 210px !important } .section-byline { font-size: 1.75rem } .about-cta .cta-title { font-size: 3rem; margin-bottom: 1rem } .page-intro.contact-intro { padding-top: 4rem } .page-intro.contact-intro .contact-form .contact-form-intro .intro-title { font-size: 2.5rem; text-align: center } .page-intro.contact-intro .intro-title { font-size: 2.5rem } .estimate-form .service-option { font-size: .9rem } .estimate-form .service-select-group .form-check-input:focus + span, .estimate-form .service-select-group .service-option:active span, .estimate-form .service-select-group .service-option:focus span, .estimate-form .service-select-group .service-option:hover span { background-color: #fff; border-color: #a32121; color: #a32121; font-weight: 700 } .estimate-form .service-option input:checked + span { background-color: #fff; background-image: url(../img/checkmarkred.webp); background-position: 7px; background-repeat: no-repeat; border-color: #a32121; color: #a32121; border-width: 2px } .trust-item { width: 330px } .estimate-form-wrapper { padding: 4rem 2rem } } .callout-box { background: #f8f9fa; border-left: 4px solid #003c69; padding: 1.5rem } .highlight { color: #003c69; font-weight: 600 } .midpage-cta-light, .service-spotlight-light { background-color: #f5fbff; border-top: 1px solid #e9ecef; color: #444; padding: 2rem 0; text-align: center } .midpage-cta, .service-spotlight { background-color: #003c69; border-top: 1px solid #e9ecef; color: #fff; padding: 2rem 0; text-align: center } .service-spotlight .spotlight-closer { color: #b01c21 } .service-spotlight .container { max-width: 1200px } .inline-service-spotlight { margin: 4rem 0 } .inline-service-spotlight h3 { font-size: 2.25rem } .spotlight-subline { color: #b01c21; font-family: Oswald, sans-serif; font-size: 1.65rem; font-weight: 500; margin-top: 1.5rem; text-align: center; text-transform: uppercase } .service-tier-card { background-color: #fff; border: 1px solid #ddd; border-radius: .15rem; box-shadow: 0 2px 6px rgb(0 0 0/.04); display: flex; flex-direction: column; height: 100%; padding: .75rem .75rem 2rem; position: relative; transition: box-shadow .3s, opacity .6s ease-out } .btn-callout-service, .btn-service, .btn-window-service, .btn-window-service-callout { background: #b30000; text-align: center; color: #fff; font-weight: 600; text-decoration: none } .service-tier-card h3, .window-service-callout-text h3 { color: #00335a; font-family: Anton, sans-serif; font-size: 2rem; margin-bottom: .75rem; margin-top: 1rem } .service-tier-card:hover, .vb-services .service-card:hover { box-shadow: 0 0 2px 1px rgba(179, 0, 0, .8); transition: transform .3s, box-shadow .3s } .service-tier-img { border-radius: 2px; object-fit: cover } .service-tier-card .roofing-step { font-size: 1.2rem } .window-warranty-blurb { margin-top: 1.5rem } .btn-callout-service, .btn-window-service { border: 2px solid #fff; border-radius: 4px; display: block; font-size: .95rem; margin: auto; padding: .5rem 2rem; transition: .2s } @media(min-width:992px) { .about-cta a.btn { margin: 1rem; width: 250px } .page-intro.contact-intro .contact-form .contact-form-intro .intro-title { font-size: 1.5rem; text-align: center } .page-intro.contact-intro .intro-title { font-size: 2.275rem } .estimate-form .service-option input:checked + span { background-position: 15px; background-size: 20px } .trust-item { background: #00335a; box-shadow: 0 1px 4px rgba(0, 0, 0, .05); color: #fff; padding: .75rem 1rem; width: auto } .estimate-form-wrapper { padding: 4rem } .btn-callout-service, .btn-window-service { padding: .5rem 3rem } } @media(min-width:1400px) { .btn-callout-service, .btn-window-service { padding: .5rem 1rem; font-size: .85rem } } .btn-callout-service:active, .btn-callout-service:focus, .btn-callout-service:hover, .btn-service:active, .btn-service:focus, .btn-service:hover, .btn-window-service:active, .btn-window-service:focus, .btn-window-service:hover { background: #900; border-color: #900; color: #fff; text-decoration: none } .btn-service { border: 2px solid #fff; border-radius: 4px; display: block; font-size: .95rem; margin: 1rem; padding: .5rem 1rem; transition: .3s } .btn-callout-service, .btn-window-service-callout { display: inline-block; font-size: .9rem; padding: .75rem; text-transform: uppercase; transition: color .3s, background-color .3s, border-color .2s; width: auto } .btn-window-service-callout { border: 2px solid; border-radius: 5px; margin-top: 1rem } .btn-callout-service { border: 2px solid; border-radius: 5px } .windows-more-link { background-color: #b30000; border-radius: 4px; color: #fff; display: block; font-size: 1rem; font-weight: 600; margin-top: 2rem; padding: .75rem 1.5rem; text-decoration: none } .windows-more-link:hover { background: #7d0000; text-decoration: none } .service-tier-features { color: #444; font-size: 1.1rem; line-height: 1.5; list-style-type: none; padding-left: .25rem; text-align: left } .service-tier-features li { margin-bottom: .5rem; padding-left: 1.275rem; position: relative } .service-tier-features li:before { color: #900; content: "✔"; font-size: 1.1rem; left: 0; position: absolute } .service-tier-desc { color: #333; font-size: 1.175rem; font-weight: 500; margin-bottom: 1rem } .service-note { margin: 1rem auto 3rem } .service-spotlight h3 { font-size: 2rem; margin-bottom: 1rem } .service-card-horizontal .btn-service { margin: .5rem; padding: .75rem 2rem } .btn-show-more[aria-expanded=true] .fa-chevron-down { transform: rotate(180deg); transition: transform .3s } .btn-show-more { background-image: none; border: 1px solid transparent; border-radius: 4px; cursor: pointer; display: inline-block; font-size: 14px; font-weight: 400; line-height: 1.42857143; margin-bottom: 0; padding: 6px 12px; text-align: center; -ms-touch-action: manipulation; touch-action: manipulation; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; vertical-align: middle; white-space: nowrap } .hero-badges, .home-hero-badges { flex-wrap: wrap; margin-bottom: 1rem } .hero-badges img { filter: drop-shadow(0 4px 6px rgba(0, 0, 0, .4)); max-width: 120px } .badge-row img, .home-hero-badges img { max-width: 120px } .shingle-options { color: #444; padding: 1rem 0 4rem; text-align: center } .shingle-options .section-subline { margin-bottom: 3rem; margin-top: 0 } .shingle-options .section-title { font-size: 2.75rem; margin-bottom: 1rem } .manufacturers { font-size: 1rem; margin-top: 2rem } .manufacturers strong { color: #00335a; font-weight: 500 } .badge-row { flex-wrap: wrap; gap: .75rem; justify-content: center; margin: 3rem 0 } .badge-col, .badge-row { align-items: center; display: flex } .badge-col { flex-direction: column } .badge-cap { color: #0c3656; display: none; font-size: .95rem; line-height: 1.35; margin: .5rem 0 0 } .warranty-callout { background: url(../img/awardsbg.webp) #f0f9ff; border-bottom: 1px solid #d6e3ed; border-top: 1px solid #eef2f6; padding: 3.5rem 1rem; text-shadow: 1px 1px 1px rgb(0 0 0/.08) } .warranty-callout .section-title { font-size: 3rem; margin-bottom: 1.25rem } .warranty-callout .card { background: hsla(0, 0%, 100%, .85); border: 1px solid #d1ecff; border-radius: .5rem; box-shadow: 0 2px 6px rgba(0, 0, 0, .06); transition: transform .2s } .warranty-callout .card-body { color: #333; font-size: 1rem; padding: 1rem .9rem } .warranty-callout .warranty-title { font-size: 1.75rem; text-align: center } .warranty-callout .warranty-desc { color: #333; font-size: 1.125rem; font-weight: 500; margin-bottom: .5rem } .warranty-callout .text-muted { color: #003c69 !important; font-size: 1.275rem; font-style: italic; line-height: 1.4 } .warranty-callout .card ul li { line-height: 1.6; margin-bottom: .4rem; padding-left: 1.25em; text-indent: -1.25em } .warranty-callout li:before { color: #1ea139; content: "\2714"; margin-right: .5rem } .warranty-callout li.not-included:before { color: #a11e1e; content: "\2716"; margin-right: .5rem } .gaf-warranty { color: #1a1a1a; font-size: 1.5rem; margin-bottom: 1rem; margin-top: 2.5rem; padding-bottom: .25rem; text-align: center } .jayhawk-warranty { background-color: #fff; border: 2px solid #a71b1b; border-radius: .25rem; color: #a71b1b; font-family: Oswald, sans-serif; font-size: 1.275rem; line-height: 1.2; margin: 2rem auto 1.5rem; padding: .75rem 1.75rem; text-align: center } .midpage-cta .btn, .text1-125 { font-size: 1rem } .midpage-cta .btn, .midpage-cta-light .btn { font-weight: 600; padding: .5rem 1.25rem; text-decoration: none; text-transform: none; transition: .2s ease-in-out; font-size: 1rem } .midpage-cta .btn-mini-cta, .midpage-cta-light .btn-mini-cta { background-color: #b01c21; border: 0; color: #fff } .midpage-cta .btn-mini-cta:focus, .midpage-cta .btn-mini-cta:hover, .midpage-cta-light .btn-mini-cta:focus, .midpage-cta-light .btn-mini-cta:hover { background-color: #8e171b; transform: translateY(-2px) } .midpage-cta .btn-mini-cta-outline, .midpage-cta-light .btn-mini-cta-outline { background: 0; border: 2px solid #b01c21; color: #b01c21 } .midpage-cta .btn-mini-cta-outline:focus, .midpage-cta .btn-mini-cta-outline:hover, .midpage-cta-light .btn-mini-cta-outline:focus, .midpage-cta-light .btn-mini-cta-outline:hover { background-color: #8e171b; color: #fff; transform: translateY(-2px) } .midpage-cta .d-flex { gap: 1rem } @media(max-width:575.98px) { .modal-fullscreen-sm-down { height: 100%; margin: 0; max-width: none; width: 100vw } .modal-fullscreen-sm-down .modal-content { border: 0; border-radius: 0; height: 100% } .modal-fullscreen-sm-down .modal-footer, .modal-fullscreen-sm-down .modal-header { border-radius: 0 } .modal-fullscreen-sm-down .modal-body { overflow-y: auto } .midpage-cta .btn { font-size: 1rem; padding: .85rem 1.25rem; width: 100% } } .img-shadow { box-shadow: 0 4px 12px rgba(0, 0, 0, .12); transition: box-shadow .3s } .img-shadow:hover { box-shadow: 0 10px 24px rgba(0, 0, 0, .2) } hr.custom-divider { border: 0; border-bottom: 1px solid hsla(0, 0%, 100%, .3); border-top: 1px solid rgba(0, 0, 0, .1); height: 0; margin: 4rem auto 1.5rem; width: 70% } @media(min-width:375px) { .badge-row img { max-width: 130px } } @media(min-width:414px) { .hero-badges img { max-width: 130px } .badge-row img { max-width: 135px } } .thank-you-confirmation { background-color: rgba(255, 255, 255, .6); border-radius: 6px; box-shadow: rgba(0, 0, 0, .05) 0 6px 24px 0, rgba(0, 0, 0, .08) 0 0 0 1px; position: relative; padding: 4rem 1rem; margin: 0 auto 6rem; max-width: 1200px; border: 2px dashed #ad2600 } .awards-slider .splide__slide { align-items: center; display: flex; justify-content: center; padding: 8px 16px } .awards-slider .splide__slide img { height: auto; max-height: 250px; object-fit: contain; transition: transform .25s, box-shadow .25s; width: auto } .awards-slider .splide__arrow--next { bottom: -100px; left: auto; right: 25%; top: auto } .awards-slider .splide__arrow--prev { bottom: -100px; left: 25%; right: auto; top: auto } .awards-slider .splide__arrow { background: #08365f; box-shadow: 0 0 3px rgba(0, 0, 0, .4); opacity: 1; transition: transform .25s, box-shadow .25s } .awards-slider .splide__arrow:active, .awards-slider .splide__arrow:focus, .awards-slider .splide__arrow:hover { box-shadow: 0 0 8px rgba(0, 0, 0, .4); scale: 1.02 } .awards-slider .splide__arrow svg { height: 1.3em; width: 1.3em; fill: #fff } @media(min-width:768px) { .service-tier-card h3, .window-service-callout-text h3 { font-size: 1.75rem } .btn-service { font-size: .95rem; margin: .5rem } .windows-more-link { display: inline-block; margin: 1rem } .window-service-callout-text { background-color: #fff; font-size: 1.25rem; line-height: 1.6; padding: 1rem 1.5rem 6rem } .btn-callout-service { padding: .75rem 1.5rem } .hero-badges img, .home-hero-badges img { max-width: 130px } .badge-row img { max-width: 140px } .awards-section { padding: 4rem 1rem 10rem } .awards-slider .splide__slide img { max-height: 150px } .awards-slider .splide__arrow--next, .awards-slider .splide__arrow--prev { bottom: -120px } .awards-slider .splide__arrow--prev { left: 35% } .awards-slider .splide__arrow--next { right: 35% } } @media(min-width:992px) { .service-tier-card { margin: 0 auto; max-width: 400px } .service-tier-card h3 { font-size: 1.75rem } .system-overview .service-tier-card h3, .window-service-callout-text h3 { font-size: 1.5rem } .service-spotlight { text-align: left } .service-card { padding: .75rem .75rem 1rem } .service-callout-text { position: relative } .awards-section { padding: 3rem 1rem } .awards-slider { padding: 0 6rem } .awards-slider .splide__arrow--prev { bottom: auto; left: 25px; right: auto; top: 50% } .awards-slider .splide__arrow--next { bottom: auto; left: auto; right: 25px; top: 50% } .awards-slider .splide__slide img { max-height: 160px } } @media(min-width:1200px) { .testimonial-slider { padding: 0 8rem } #home-gallery-splide .splide__arrow--next, #home-gallery-splide .splide__arrow--prev, .testimonial-slider-section .splide__arrow--next, .testimonial-slider-section .splide__arrow--prev { bottom: auto; top: 50% } .testimonial-slider-section .splide__arrow--prev { left: 40px; right: auto } .testimonial-slider-section .splide__arrow--next { left: auto; right: 40px } .home-gallery-slider { padding: 1rem 5rem } #home-gallery-splide .splide__arrow--prev { left: 0; right: auto } #home-gallery-splide .splide__arrow--next { left: auto; right: 0 } .cta-section .section-title, .service-overview .section-title { font-size: 3rem } .awards-slider, .service-gallery-slider { padding: 0 5rem } .service-gallery-slider .splide__arrow--prev { bottom: auto; left: 0; right: auto; top: 50% } .service-gallery-slider .splide__arrow--next { bottom: auto; right: 0; top: 50% } .service-gallery-slider .splide__arrow--next:before, .service-gallery-slider .splide__arrow--prev:before { color: #fff; font-size: 2.5rem } .service-area-section .section-title { font-size: 3.25rem } .section-byline { font-size: 1.65rem } .about-cta .cta-title { font-size: 3.25rem; margin-bottom: 1rem } .about-testimonials .testimonial-slider-mini .testimonial-mini-slide { min-height: 260px !important } .roofing-testimonials .testimonial-slider-mini .testimonial-mini-slide { min-height: 470px !important } .contact-intro { padding: 4rem 1.25rem 8rem } .page-intro.contact-intro .intro-title { font-size: 2.65rem } .page-intro.contact-intro .contact-form .contact-form-intro .intro-title { font-size: 1.875rem; text-align: center } .map-wrapper { margin-top: 0 } .btn-service { margin: .5rem 0; padding: .7rem 1rem } .hero-badges img, .home-hero-badges img { max-width: 130px } .awards-slider .splide__slide img { max-height: 150px } .awards-slider .splide__arrow--prev { bottom: auto; left: 15px; right: auto; top: 50% } .awards-slider .splide__arrow--next { bottom: auto; right: 15px; top: 50% } .no-js .nav-item.dropdown:hover > .dropdown-menu { display: block; opacity: 1; visibility: visible; transform: translateY(0) } } @media(min-width:1400px) { .btn-service { font-size: .9rem; line-height: 1.6; margin: .5rem; min-width: 185px; padding: .75rem .5rem } .awards-text { max-width: 360px } .awards-slider { padding: 0 6rem } .awards-slider .splide__arrow--prev { left: 30px } .awards-slider .splide__arrow--next { right: 30px } } .nav-item.dropdown .dropdown-menu { display: none; opacity: 0; visibility: hidden; transform: translateY(-10px); transition: opacity .2s, transform .2s } .nav-item.dropdown.show .dropdown-menu { display: block; opacity: 1; visibility: visible; transform: translateY(0) } .invalid-feedback { color: #b71d22; display: none; font-size: 1rem; margin-top: .15rem; text-align: left; font-family: Open sans } .alert-danger, .alert-danger strong { color: #842029 } .form-control.is-invalid, .was-validated .form-control:invalid { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23B5212E' viewBox='0 0 12 12'%3E%3Ccircle cx='6' cy='6' r='4.5'/%3E%3Cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3E%3Ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3E%3C/svg%3E"); background-size: calc(.75em + .375rem) calc(.75em + .375rem); border: 2px dashed #ffb3b3 } .alert-danger { border: 1px solid #842029; padding: 1rem 2rem } .red-feedback { color: #b30000; font-size: 1.7rem; font-family: Oswald, sans-serif; margin-bottom: 2rem; text-align: center; margin-top: -2rem } .invalid-feedback-faux { color: #b71d22; font-size: 1rem; margin-top: .15rem; text-align: left; font-family: Open sans } #estimateForm, #response-message { scroll-margin-top: 150px } .estimate-form .form-control.is-invalid, .estimate-form .was-validated .form-control:invalid { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23B5212E' viewBox='0 0 12 12'%3E%3Ccircle cx='6' cy='6' r='4.5'/%3E%3Cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3E%3Ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3E%3C/svg%3E"); background-size: calc(.75em + .375rem) calc(.75em + .375rem); border: 2px solid #ffb3b3 } .form-control.is-invalid:focus, .was-validated .form-control:invalid:focus { border-color: #ffb3b3; box-shadow: 0 0 0 .25rem rgba(var(--bs-danger-rgb), .25) } hr.form-rule { border: 0; height: 0; border-top: 1px solid rgba(0, 0, 0, .1); border-bottom: 1px solid rgba(255, 255, 255, .3) } .visualizer-cta-box { background-color: #fff; border: 1px solid #ddd; border-radius: 6px; transition: box-shadow .2s } .visualizer-cta-box:hover { box-shadow: 0 4px 10px rgba(0, 0, 0, .08) } @media(max-width:767.98px) { .modal-fullscreen-md-down { height: 100%; margin: 0; max-width: none; width: 100vw } .modal-fullscreen-md-down .modal-content { border: 0; border-radius: 0; height: 100% } .modal-fullscreen-md-down .modal-footer, .modal-fullscreen-md-down .modal-header { border-radius: 0 } .modal-fullscreen-md-down .modal-body { overflow-y: auto } .visualizer-callout-row { flex-direction: column } } :host, :root { --fa-style-family-classic: 'Font Awesome 6 Free'; --fa-font-solid: normal 900 1em/1 'Font Awesome 6 Free'; --fa-style-family-brands: 'Font Awesome 6 Brands'; --fa-font-brands: normal 400 1em/1 'Font Awesome 6 Brands' } .fa-solid, .fas { font-weight: 900 } .fa-sr-only, .fa-sr-only-focusable:not(:focus), .sr-only, .sr-only-focusable:not(:focus) { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border-width: 0 } .fa-brands, .fab { font-family: 'Font Awesome 6 Brands'; font-weight: 400 } .fa-beat, .fa-bounce { animation-delay: var(--fa-animation-delay, 0s); animation-direction: var(--fa-animation-direction, normal); animation-duration: var(--fa-animation-duration, 1s); animation-iteration-count: var(--fa-animation-iteration-count, infinite) } .fa { font-family: var(--fa-style-family, "Font Awesome 6 Free"); font-weight: var(--fa-style, 900) } .fa, .fa-brands, .fa-regular, .fa-solid, .fab, .far, .fas { -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; display: var(--fa-display, inline-block); font-style: normal; font-variant: normal; line-height: 1; text-rendering: auto } .fa-brands::before, .fa-regular::before, .fa-solid::before, .fa::before, .fab::before, .far::before, .fas::before { content: var(--fa) } .fa-classic, .fa-regular, .fa-solid, .far, .fas { font-family: 'Font Awesome 6 Free' } .fa-1x { font-size: 1em } .fa-2x, .fa-stack-2x { font-size: 2em } .fa-3x { font-size: 3em } .fa-4x { font-size: 4em } .fa-5x { font-size: 5em } .fa-6x { font-size: 6em } .fa-7x { font-size: 7em } .fa-8x { font-size: 8em } .fa-9x { font-size: 9em } .fa-10x { font-size: 10em } .fa-2xs { font-size: .625em; line-height: .1em; vertical-align: .225em } .fa-xs { font-size: .75em; line-height: .08333em; vertical-align: .125em } .fa-sm { font-size: .875em; line-height: .07143em; vertical-align: .05357em } .fa-lg { font-size: 1.25em; line-height: .05em; vertical-align: -.075em } .fa-xl { font-size: 1.5em; line-height: .04167em; vertical-align: -.125em } .fa-2xl { font-size: 2em; line-height: .03125em; vertical-align: -.1875em } .fa-fw { width: 1.25em } .fa-phone-volume, .fa-volume-control-phone { --fa: "\f2a0" } .fa-envelopes-bulk, .fa-mail-bulk { --fa: "\f674" } .fa-facebook-f { --fa: "\f39e" } .fa-instagram { --fa: "\f16d" } .fa-twitter { --fa: "\f099" } .fa-bars, .fa-navicon { --fa: "\f0c9" } .fa-home, .fa-home-alt, .fa-home-lg-alt, .fa-house { --fa: "\f015" } .fa-add, .fa-plus { --fa: "\2b" } .fa-water { --fa: "\f773" } .fa-screwdriver-wrench, .fa-tools { --fa: "\f7d9" } .fa-shield-alt, .fa-shield-halved { --fa: "\f3ed" } .fa-clipboard-check { --fa: "\f46c" } .fa-location-dot, .fa-map-marker-alt { --fa: "\f3c5" } .fa-map-location-dot, .fa-map-marked-alt { --fa: "\f5a0" } .fa-phone { --fa: "\f095" } .fa-envelope { --fa: "\f0e0" } .fa-clock, .fa-clock-four { --fa: "\f017" } .fa-minus, .fa-subtract { --fa: "\f068" } .fa-angle-double-right, .fa-angles-right { --fa: "\f101" } .fa-circle-dollar-to-slot, .fa-donate { --fa: "\f4b9" } .fa-house-chimney-window { --fa: "\e00d" } .fa-people-roof { --fa: "\e537" } .fa-brush { --fa: "\f55d" } .fa-wind { --fa: "\f72e" } .fa-exclamation-triangle, .fa-triangle-exclamation, .fa-warning { --fa: "\f071" } .fa-house-circle-check { --fa: "\e509" } .fa-house-flood-water { --fa: "\e50e" } .fa-house-chimney-crack, .fa-house-damage { --fa: "\f6f1" } .fa-chevron-circle-left, .fa-circle-chevron-left { --fa: "\f137" } .fa-chevron-circle-right, .fa-circle-chevron-right { --fa: "\f138" } .fa-clipboard-list { --fa: "\f46d" } .fa-medal { --fa: "\f5a2" } .fa-home-lg, .fa-house-chimney { --fa: "\e3af" } .fa-award { --fa: "\f559" } .fa-drivers-license, .fa-id-card { --fa: "\f2c2" } .fa-flag-usa { --fa: "\f74d" } .fa-hands-helping, .fa-handshake-angle { --fa: "\f4c4" } .fa-hard-hat, .fa-hat-hard, .fa-helmet-safety { --fa: "\f807" } .fa-user-shield { --fa: "\f505" } .fa-thumbs-up { --fa: "\f164" } .fa-hand-holding-heart { --fa: "\f4be" } .fa-balance-scale, .fa-scale-balanced { --fa: "\f24e" } .fa-check-circle, .fa-circle-check { --fa: "\f058" } .fa-hammer { --fa: "\f6e3" } .fa-map-pin { --fa: "\f276" } .fa-check-square, .fa-square-check { --fa: "\f14a" } .fa-star { --fa: "\f005" } .fa-house-crack { --fa: "\e3b1" } .fa-paint-roller { --fa: "\f5aa" } .fa-door-open { --fa: "\f52b" } .fa-house-lock { --fa: "\e510" } .fa-comments { --fa: "\f086" } .fa-handshake { --fa: "\f2b5" } .fa-windows { --fa: "\f17a" } .fa-home-user, .fa-house-user { --fa: "\e1b0" } .fa-chevron-down { --fa: "\f078" } .fa-magnifying-glass-chart { --fa: "\e522" } .fa-eye-dropper, .fa-eye-dropper-empty, .fa-eyedropper { --fa: "\f1fb" } .fa-file-pdf { --fa: "\f1c1" } .fa-arrow-up-right-from-square, .fa-external-link { --fa: "\f08e" } .fa-check-double { --fa: "\f560" } .fa-arrow-down-up-across-line { --fa: "\e4af" } .fa-broom { --fa: "\f51a" } .fa-ruler-combined { --fa: "\f546" } .fa-lightbulb { --fa: "\f0eb" } .fa-user-check { --fa: "\f4fc" } .fa-table-cells-large, .fa-th-large { --fa: "\f009" } .fa-recycle { --fa: "\f1b8" } .fa-layer-group { --fa: "\f5fd" } .fa-calendar-check { --fa: "\f274" } .fa-window-restore { --fa: "\f2d2" } .fa-certificate { --fa: "\f0a3" } .fa-cloud-bolt, .fa-thunderstorm { --fa: "\f76c" } .fa-sun { --fa: "\f185" } .fa-temperature-3, .fa-temperature-three-quarters, .fa-thermometer-3, .fa-thermometer-three-quarters { --fa: "\f2c8" } .fa-tree { --fa: "\f1bb" } .fa-check { --fa: "\f00c" } .fa-xmark { --fa: "\f00d" } .fa-cloud-showers-heavy { --fa: "\f740" } .fa-fan { --fa: "\f863" } .white { color: #fff !important }
.gallery-cta-tile {
  position: relative;
  display: block;
  text-decoration: none;
  color: inherit;
}

.gallery-cta-tile img {
  width: 100%;
  height: auto;
  display: block;
}

.gallery-cta-tile .overlay {
  position: absolute;
  inset: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  background: rgba(0,0,0,0.45);
  color: #fff;
  font-weight: 600;
  font-size: clamp(0.95rem, 2vw, 1.3rem);
  padding: 0.5rem 1rem;
  opacity: 0;
  transition: opacity 0.3s ease;
}

.gallery-cta-tile:hover .overlay {
  opacity: 1;
}

/* Optional: Always show overlay on touch devices */
@media (hover: none) {
  .gallery-cta-tile .overlay {
    opacity: 1;
  }
}