{"version":3,"sourceRoot":"","sources":["../scss-styles/components/_hero-banner.scss","../scss-styles/variables/_main-colors.scss"],"names":[],"mappings":"AAAA,aACI,WAKQ,yCACI,aAIR,2BACI,kBAEA,iCACI,qBACA,gBACA,oBACA,WACA,gBACA,sBAIJ,oDACI,kBACA,SACA,WACA,UACA,8DACA,MCmER,KDlEQ,sBACA,kBACA,WACA,YACA,aACA,mBACA,uBACA,eACA,wDAEA,6EACI,eAGJ,0DACI,iBC3CL,QD8CC,0DACI,0BACA,iBCxBJ,QD8BJ,+BAGI,kBAEA,sBAQR,8CACI,WAEA,yDACI,YACA,aACA,WACA,WAEA,4DACI,SACA,qDAGJ,2DACI,WACA,qBAEA,iEACI,0BAKZ,2DACI,iBCER,KDDQ,YACA,4BACA,MCRF,QDUE,6DACI,SACA,gBACA,8CAGJ,gEACI,iBACA,yBACA,qBAOpB,qCAIgB,oDACI,SACA,YAOpB,qCAIgB,+BACI,WAIZ,kCACI,UACA,SACA,gBAKZ,qCACI,aACI,aACA,kBACA,kBAEA,oBACI,aACA,kBACA,gBAEA,MACA,OACA,WAGA,2BACI,kBACA,WACA,YACA,MACA,OAEA,iCACI,kBACA,WAMJ,+BACI,QACA,SACA,gCACA,gBACA,eAKZ,kCACI","file":"hero-banner.css","sourcesContent":[".hero-banner {\r\n    width: 100%;\r\n\r\n    .media {\r\n\r\n        &:has(>.video) {\r\n            picture {\r\n                display: none;\r\n            }\r\n        }\r\n\r\n        .video {\r\n            position: relative;\r\n\r\n            video {\r\n                display: inline-block;\r\n                object-fit: fill;\r\n                pointer-events: none;\r\n                width: 100%;\r\n                min-height: 100%;\r\n                vertical-align: middle;\r\n\r\n            }\r\n\r\n            button.video-control-btn {\r\n                position: absolute;\r\n                top: 2rem;\r\n                right: 2rem;\r\n                z-index: 1;\r\n                background-color: color-mix(in srgb, $dark-grey-1 40%, transparent);\r\n                color: $white;\r\n                border: 2px solid $white;\r\n                border-radius: 50%;\r\n                width: 60px;\r\n                height: 60px;\r\n                display: flex;\r\n                align-items: center;\r\n                justify-content: center;\r\n                cursor: pointer;\r\n                transition: background-color 0.3s ease, transform 0.2s ease;\r\n\r\n                .material-icons-outlined {\r\n                    font-size: 2rem;\r\n                }\r\n\r\n                &:hover {\r\n                    background-color: $blue-primary;\r\n                }\r\n\r\n                &:focus {\r\n                    outline: 3px solid $orange-primary;\r\n                    background-color: $blue-25-shade;\r\n                }\r\n            }\r\n        }\r\n\r\n        .image {\r\n            img {\r\n                //width: 100%;\r\n                //height: auto;\r\n                position: relative;\r\n\r\n                vertical-align: middle;\r\n\r\n                //object-fit: fill;\r\n            }\r\n        }\r\n    }\r\n\r\n    .hero-banner-content {\r\n        .banner-box {\r\n            width: 100%;\r\n\r\n            .title-box {\r\n                opacity: 90%;\r\n                padding: 1rem;\r\n                color: white;\r\n                width: 100%;\r\n\r\n                h2 {\r\n                    margin: 0;\r\n                    font-size: calc(2.48832em + .56344 * ((100vw - 36em) / 39));\r\n                }\r\n\r\n                a {\r\n                    color: white;\r\n                    text-decoration: none;\r\n\r\n                    &:hover {\r\n                        text-decoration: underline;\r\n                    }\r\n                }\r\n            }\r\n\r\n            .content-box {\r\n                background-color: $white;\r\n                opacity: 90%;\r\n                padding: 2rem 1rem 1rem 1rem;\r\n                color: $dark-grey-2;\r\n\r\n                p {\r\n                    margin: 0;\r\n                    line-height: 1.5;\r\n                    font-size: calc(1.2em + .05 * ((100vw - 36em) / 39));\r\n                }\r\n\r\n                .btn {\r\n                    font-size: 1.5rem;\r\n                    margin: 1rem 1rem 0.5rem 0;\r\n                    display: inline-block;\r\n                }\r\n            }\r\n        }\r\n    }\r\n}\r\n\r\n@media screen and (max-width: map-get($breakpoints, 'sm')) {\r\n    .hero-banner {\r\n        .media {\r\n            .video {\r\n                button.video-control-btn {\r\n                    top: 1rem;\r\n                    right: 1rem;\r\n                }\r\n            }\r\n        }\r\n    }\r\n}\r\n\r\n@media screen and (max-width: map-get($breakpoints, 'lg')) {\r\n    .hero-banner {\r\n        .media {\r\n            .image {\r\n                img {\r\n                    width: 100%;\r\n                }\r\n            }\r\n        }\r\n        .hero-banner-content {\r\n            padding: 0;\r\n            margin: 0;\r\n            max-width: 100%;\r\n        }\r\n    }\r\n}\r\n\r\n@media screen and (min-width: map-get($breakpoints, 'lg')) {\r\n    .hero-banner {\r\n        height: 580px;\r\n        position: relative;\r\n        align-content: end;\r\n\r\n        .media {\r\n            height: 580px;\r\n            position: absolute;\r\n            overflow: hidden;\r\n\r\n            top: 0;\r\n            left: 0;\r\n            width: 100%;\r\n\r\n\r\n            .video {\r\n                position: absolute;\r\n                width: 100%;\r\n                height: 100%;\r\n                top: 0;\r\n                left: 0;\r\n\r\n                video {\r\n                    position: absolute;\r\n                    width: 100%;\r\n                    //height: 100%;\r\n                }\r\n            }\r\n\r\n            .image {\r\n                img {\r\n                    top: 50%;\r\n                    left: 50%;\r\n                    transform: translate(-50%, -50%);\r\n                    min-height: 100%;\r\n                    min-width: 100%;\r\n                }\r\n            }\r\n        }\r\n\r\n        .hero-banner-content {\r\n            padding: 2rem 15px;\r\n        }\r\n    }\r\n}\r\n","// Any variable that can be altered by a theme should be placed\r\n// in the theme variable file, not in here\r\n\r\n$blue-primary: #00539b;\r\n$blue-5-tint: #0d5ca0;\r\n$blue-10-tint: #1a64a5;\r\n$blue-15-tint: #266daa;\r\n$blue-20-tint: #3375af;\r\n$blue-25-tint: #407eb4;\r\n$blue-30-tint: #4d87b9;\r\n$blue-35-tint: #5a8fbe;\r\n$blue-40-tint: #6698c3;\r\n$blue-45-tint: #73a0c8;\r\n$blue-50-tint: #80a9cd;\r\n$blue-55-tint: #8db2d2;\r\n$blue-60-tint: #99bad7;\r\n$blue-65-tint: #a6c3dc;\r\n$blue-70-tint: #b3cbe1;\r\n$blue-75-tint: #c0d4e6;\r\n$blue-80-tint: #ccddeb;\r\n$blue-85-tint: #d9e5f0;\r\n$blue-90-tint: #e6eef5;\r\n$blue-95-tint: #f2f6fa;\r\n$blue-5-shade: #004f93;\r\n$blue-10-shade: #004a8c;\r\n$blue-15-shade: #004684;\r\n$blue-20-shade: #00427c;\r\n$blue-25-shade: #003e74;\r\n$blue-30-shade: #003a6d;\r\n$blue-35-shade: #003665;\r\n$blue-40-shade: #00325d;\r\n$blue-45-shade: #002e55;\r\n$blue-50-shade: #002a4e;\r\n$blue-55-shade: #002546;\r\n$blue-60-shade: #00213e;\r\n$blue-65-shade: #001d36;\r\n$blue-70-shade: #00192e;\r\n$blue-75-shade: #001527;\r\n$blue-80-shade: #00111f;\r\n$blue-85-shade: #000c17;\r\n$blue-90-shade: #000810;\r\n$blue-95-shade: #000408;\r\n$light-blue-primary: #0071b3;\r\n$light-blue-light-bg: #e0f2fd;\r\n$light-blue-5-tint: #1a7bbc;\r\n$light-blue-10-tint: #3385c5;\r\n$light-blue-15-tint: #4d8fce;\r\n$light-blue-20-tint: #6699d7;\r\n$light-blue-25-tint: #4095c6;\r\n$light-blue-30-tint: #99a3e0;\r\n$light-blue-35-tint: #b3ade9;\r\n$light-blue-40-tint: #ccb7f2;\r\n$light-blue-45-tint: #e6c1fb;\r\n$light-blue-50-tint: #80b8d9;\r\n$light-blue-55-tint: #99c2e2;\r\n$light-blue-60-tint: #b3cceb;\r\n$light-blue-65-tint: #ccd6f4;\r\n$light-blue-70-tint: #e6e0fd;\r\n$light-blue-75-tint: #f0eafd;\r\n$light-blue-80-tint: #f5f0fe;\r\n$light-blue-85-tint: #faf5fe;\r\n$light-blue-90-tint: #fcf9fe;\r\n$light-blue-95-tint: #fdfdfe;\r\n$light-blue-5-shade: #006baa;\r\n$light-blue-10-shade: #0066a1;\r\n$light-blue-15-shade: #006098;\r\n$light-blue-20-shade: #005a8f;\r\n$light-blue-25-shade: #005586;\r\n$light-blue-30-shade: #004f7d;\r\n$light-blue-35-shade: #004a74;\r\n$light-blue-40-shade: #00446b;\r\n$light-blue-45-shade: #003e62;\r\n$light-blue-50-shade: #003959;\r\n$light-blue-55-shade: #003351;\r\n$light-blue-60-shade: #002d48;\r\n$light-blue-65-shade: #00283f;\r\n$light-blue-70-shade: #002236;\r\n$light-blue-75-shade: #001c2e;\r\n$light-blue-80-shade: #001625;\r\n$light-blue-85-shade: #00101d;\r\n$light-blue-90-shade: #000a14;\r\n$light-blue-95-shade: #000509;\r\n\r\n\r\n$red-primary: #ea1a13;\r\n$red-st-andrews: #ee312a;\r\n$red-25-tint: #ef534e;\r\n$red-50-tint: #f58d89;\r\n$red-25-shade: #b0140e;\r\n$dark-grey-1: #202024;\r\n$dark-grey-2: #0f0f11;\r\n$grey: #6a6a6b;\r\n$mid-grey-1: #949494;\r\n$mid-grey-2: #dedede;\r\n$light-grey-1: #f0f0f0;\r\n$light-grey-2: #fafafa;\r\n$dark-grey-3: #4f4f4f;\r\n$white: #ffffff;\r\n$orange-primary: #ffb400;\r\n$dark-orange: #bf5909;\r\n$dark-orange-25-shade: #98490c;\r\n$yellow:  #ffdf00;\r\n// Additional Colors\r\n$green-primary: #00853f;\r\n$green-light-bg: #d2f9e3;\r\n$green-5-tint: #0d8b49;\r\n$green-10-tint: #1a9152;\r\n$green-15-tint: #26985c;\r\n$green-20-tint: #339e65;\r\n$green-25-tint: #40a46f;\r\n$green-30-tint: #4daa79;\r\n$green-35-tint: #5ab082;\r\n$green-40-tint: #66b68c;\r\n$green-45-tint: #73bc95;\r\n$green-50-tint: #80c29f;\r\n$green-55-tint: #8dc8a9;\r\n$green-60-tint: #99ceb2;\r\n$green-65-tint: #a6d4bc;\r\n$green-70-tint: #b3dac5;\r\n$green-75-tint: #c0e0cf;\r\n$green-80-tint: #cce7d9;\r\n$green-85-tint: #d9ede2;\r\n$green-90-tint: #e6f3ec;\r\n$green-95-tint: #f2f9f5;\r\n$green-5-shade: #007e3c;\r\n$green-10-shade: #007839;\r\n$green-15-shade: #007135;\r\n$green-20-shade: #006a32;\r\n$green-25-shade: #00642f;\r\n$green-30-shade: #005d2c;\r\n$green-35-shade: #005729;\r\n$green-40-shade: #005026;\r\n$green-45-shade: #004a23;\r\n$green-50-shade: #004320;\r\n$green-55-shade: #003d1d;\r\n$green-60-shade: #00361a;\r\n$green-65-shade: #003017;\r\n$green-70-shade: #002914;\r\n$green-75-shade: #002311;\r\n$green-80-shade: #001c0e;\r\n$green-85-shade: #00160b;\r\n$green-90-shade: #000f08;\r\n$green-95-shade: #000904;\r\n\r\n\r\n\r\n\r\n$purple-primary: #7b439a;\r\n$purple-light-bg: #f4e3ff;\r\n$purple-5-tint: #824c9f;\r\n$purple-10-tint: #8856a4;\r\n$purple-15-tint: #8f5fa9;\r\n$purple-20-tint: #9569ae;\r\n$purple-25-tint: #9c72b3;\r\n$purple-30-tint: #a37bb8;\r\n$purple-35-tint: #a985bd;\r\n$purple-40-tint: #b08ec3;\r\n$purple-45-tint: #b698c8;\r\n$purple-50-tint: #bda1cd;\r\n$purple-55-tint: #c4aad2;\r\n$purple-60-tint: #cab4d7;\r\n$purple-65-tint: #d1bddc;\r\n$purple-70-tint: #d7c7e1;\r\n$purple-75-tint: #ded0e6;\r\n$purple-80-tint: #e5d9eb;\r\n$purple-85-tint: #ebe3f0;\r\n$purple-90-tint: #f2ecf5;\r\n$purple-95-tint: #f8f6fa;\r\n$purple-5-shade: #754092;\r\n$purple-10-shade: #6f3c8b;\r\n$purple-15-shade: #693983;\r\n$purple-20-shade: #633680;\r\n$purple-25-shade: #5c3274;\r\n$purple-30-shade: #562f6c;\r\n$purple-35-shade: #502c64;\r\n$purple-40-shade: #4a285c;\r\n$purple-45-shade: #442555;\r\n$purple-50-shade: #3e224d;\r\n$purple-55-shade: #371e45;\r\n$purple-60-shade: #311b3e;\r\n$purple-65-shade: #2b1836;\r\n$purple-70-shade: #25142e;\r\n$purple-75-shade: #1f1127;\r\n$purple-80-shade: #190d1f;\r\n$purple-85-shade: #120a17;\r\n$purple-90-shade: #0c070f;\r\n$purple-95-shade: #060308;\r\n\r\n\r\n\r\n\r\n$burgundy-primary: #c60c46;\r\n$burgundy-light-bg: #ffd3e1;\r\n$burgundy-5-tint: #c9184f;\r\n$burgundy-10-tint: #cc2458;\r\n$burgundy-15-tint: #ce3162;\r\n$burgundy-20-tint: #d13d6b;\r\n$burgundy-25-tint: #d44974;\r\n$burgundy-30-tint: #d7557d;\r\n$burgundy-35-tint: #da6187;\r\n$burgundy-40-tint: #dd6e90;\r\n$burgundy-45-tint: #e07a9a;\r\n$burgundy-50-tint: #e386a3;\r\n$burgundy-55-tint: #e692ac;\r\n$burgundy-60-tint: #e99eb5;\r\n$burgundy-65-tint: #ebaabf;\r\n$burgundy-70-tint: #eeb6c8;\r\n$burgundy-75-tint: #f1c2d1;\r\n$burgundy-80-tint: #f4cfda;\r\n$burgundy-85-tint: #f7dbe3;\r\n$burgundy-90-tint: #f9e7ed;\r\n$burgundy-95-tint: #fcf3f6;\r\n$burgundy-5-shade: #bc0b43;\r\n$burgundy-10-shade: #b20b3f;\r\n$burgundy-15-shade: #a80a3c;\r\n$burgundy-20-shade: #9e0a38;\r\n$burgundy-25-shade: #950935;\r\n$burgundy-30-shade: #8b0831;\r\n$burgundy-35-shade: #81082e;\r\n$burgundy-40-shade: #77072a;\r\n$burgundy-45-shade: #6d0727;\r\n$burgundy-50-shade: #630623;\r\n$burgundy-55-shade: #59051f;\r\n$burgundy-60-shade: #4f051c;\r\n$burgundy-65-shade: #450418;\r\n$burgundy-70-shade: #3b0415;\r\n$burgundy-75-shade: #310311;\r\n$burgundy-80-shade: #27020e;\r\n$burgundy-85-shade: #1d020a;\r\n$burgundy-90-shade: #130107;\r\n$burgundy-95-shade: #090004;\r\n\r\n\r\n\r\n// Contextual Colors\r\n$success: #00853f;\r\n$information: #00539b;\r\n$warning: #bf5909;\r\n$danger: #ea1a13;\r\n"]}