{"version":3,"file":"banner/banner.css","sources":["banner/banner.scss","../global/_global.scss","../global/_variables.scss","../global/_breakpoints.scss","../global/_mixins.scss"],"sourcesContent":["@import './global/global';\n\n.cu-banner {\n  position: relative;\n}\n\n/*=============================================\n=            Panel banner            =\n=============================================*/\n.cu-banner--panel {\n  padding: 1em 33% 1em 2em;\n\n  @include breakpoint(md) {\n    display: grid;\n    grid-template-columns: 66% 34%;\n    padding: 0;\n  }\n\n  .cu-banner__content {\n    @include breakpoint(md) {\n      display: flex;\n      flex-direction: column;\n      justify-content: center;\n      padding: var(--cu-vr1) var(--cu-ps2);\n    }\n\n  }\n\n  .cu-button {\n    align-self: flex-start;\n  }\n\n  .cu-banner__media {\n    @include overlay;\n    position: absolute;\n    overflow: hidden;\n    max-width: none;\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 100%;\n    // z-index: -2;\n\n    // Only specific Replaced Elements can cover the media div.\n    // See https://html.spec.whatwg.org/multipage/rendering.html#replaced-elements\n    img, video {\n      object-fit: cover;\n      width: 100%;\n      height: 100%;\n    }\n\n    // Any element in the media section that isn't a replaced element should\n    // be ignored. This will allow the object-fit property to work even if the\n    // img or video is nested in other markup.\n    :not(img):not(video) {\n      display: contents;\n    }\n\n    @include breakpoint(md) {\n      position: relative;\n      grid-column: 1;\n      grid-row: 1;\n    }\n  }\n}\n\n.cu-banner--panel-left {\n  @include breakpoint(md) {\n    grid-template-columns: 34% 66%;\n  }\n\n  .cu-banner__media {\n    @include breakpoint(md) {\n      grid-column: 2;\n    }\n  }\n}\n\n/*=============================================\n=            Page banner                      =\n=============================================*/\n.cu-banner--page {\n\n  &.cu-banner--with-media {\n    // Override any colorscheme.\n    // @todo Use ::has(.cu-banner__media) once supported in Firefox.\n    --cu-text-color: #{$white};\n  }\n\n  &.cu-banner--with-media.cu-colorscheme--light {\n    .cu-button {\n      --cu-text-color: #{$black};\n    }\n  }\n\n  padding: var(--cu-vr1);\n\n  @include breakpoint(sm) {\n    padding: var(--cu-vr1) var(--cu-vr2);\n  }\n\n  @include breakpoint(md) {\n    padding: var(--cu-vr1) var(--cu-vr4);\n  }\n\n  .cu-breadcrumb {\n    margin-bottom: var(--cu-vr1);\n  }\n\n  .cu-banner__content {\n    max-width: var(--cu-max-width-section, #{$max-width-section});\n    margin: 0 auto;\n    z-index: 2;\n    position: relative;\n  }\n\n  .cu-banner__summary {\n    margin-bottom: var(--cu-vr2);\n  }\n\n  .cu-banner__list-heading {\n    --cu-font-size: var(--cu-ms0); // @todo check me\n    --cu-font-weight: bold !important;\n  }\n\n  .cu-banner__list {\n    --cu-font-size: var(--cu-ms-1);\n    padding: 0;\n    list-style-type: none;\n  }\n\n  .cu-banner__list-item {\n    padding-bottom: var(--cu-vr-1);\n    margin-bottom: var(--cu-vr-1);\n    max-width: 75%;\n    position: relative;\n\n    &::after {\n      content: '';\n      display: block;\n      position: absolute;\n      left: 0;\n      bottom: 0;\n      width: 10%;\n      max-width: 100%;\n      padding: .25em 0 0 0;\n      border-bottom: 4px solid var(--cu-color-brand, #{$cornell-red});\n    }\n  }\n\n  .cu-banner__media {\n    @include overlay;\n    position: absolute;\n    overflow: hidden;\n    max-width: none;\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 100%;\n    z-index: 1;\n\n    // Only specific Replaced Elements can cover the media div.\n    // See https://html.spec.whatwg.org/multipage/rendering.html#replaced-elements\n    img, video {\n      object-fit: cover;\n      width: 100%;\n      height: 100%;\n    }\n\n    // Any element in the media section that isn't a replaced element should\n    // be ignored. This will allow the object-fit property to work even if the\n    // img or video is nested in other markup.\n    :not(img):not(video) {\n      display: contents;\n    }\n  }\n}\n\n/*=====  End of Page banner  ======*/\n\n\n/*=============================================\n=            Video banner                     =\n=============================================*/\n.cu-banner--video {\n  .cu-banner__content {\n    position: absolute;\n    pointer-events: none;\n    width: 100%;\n    height: 100%;\n    display: flex;\n    flex-direction: column;\n    justify-content: space-between;\n    padding: var(--cu-vr1) var(--cu-ps1);\n    z-index: 1; // Required for Chrome to see the hover state and selection in content markup.\n\n    > * {\n      pointer-events: auto;\n    }\n\n    @include breakpoint(lg) {\n      padding: var(--cu-vr1) var(--cu-ps3);\n    }\n\n    &--align-bottom {\n      justify-content: flex-end;\n    }\n  }\n\n  .cu-banner__media {\n    overflow: hidden;\n    max-width: none;\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 100%;\n\n    // Only specific Replaced Elements can cover the media div.\n    // See https://html.spec.whatwg.org/multipage/rendering.html#replaced-elements\n    img, video {\n      object-fit: cover;\n      width: 100%;\n      height: 100%;\n    }\n\n    // Any element in the media section that isn't a replaced element should\n    // be ignored. This will allow the object-fit property to work even if the\n    // img or video is nested in other markup.\n    :not(img):not(video) {\n      display: contents;\n    }\n  }\n\n  .video-pause {\n    position: absolute;\n    right: 0;\n    top: 1rem;\n  }\n}\n/*=====  End of Video banner  ======*/\n","@import 'variables';\n@import 'breakpoints';\n@import 'mixins';\n","// Variables\n\n// Colors\n$black: #222; // ILR Brand black\n$white: #fff;\n$cornell-red: #b31b1b;\n$gray-light: #efefef;\n$gray-medium: #757575;\n$gray-medium-new: #6c6c6c;\n$gray-dark: #464646;\n\n// Color usage\n$color-text: $black;\n$color-light: $white;\n$color-brand: $cornell-red;\n$color-bg-body: $white;\n$color-alert: $cornell-red;\n$color-border: #ccc;\n$color-bg-card--default: transparent;\n$color-bg-card--light: $white;\n$color-bg-card--medium: $gray-light;\n$color-bg-card--dark: $gray-dark;\n$color-bg--dark: #222;\n$color-bg--lightest: #F5F5F5;\n$color-text--light: $white;\n$color-text--medium: $gray-medium;\n\n// Color status indictors\n$color-info: #5bc0de !default;\n$color-info--dark: darken($color-info, 30%) !default;\n$color-info--light: lighten($color-info, 30%) !default;\n$color-status: #5cb85c !default;\n$color-status--dark: darken($color-status, 20%) !default;\n$color-status--light: lighten($color-status, 38%) !default;\n$color-warning: #ffc107 !default;\n$color-warning--dark: darken($color-warning, 20%) !default;\n$color-warning--light: lighten($color-warning, 40%) !default;\n$color-error: #d9534f !default;\n$color-error--dark: darken($color-error, 20%) !default;\n$color-error--light: lighten($color-error, 33%) !default;\n\n// Fonts and typography\n$base-font-size-percentage: 100% !default;\n$base-font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';\n$base-font-size: 1rem !default;\n$base-font-weight: 300 !default;\n$base-line-height: 1.5 !default;\n$reduced-line-height: 1.2 !default;\n$base-heading-line-height: 1.2 !default;\n$base-heading-font-family: $base-font-family !default;\n$base-heading-font-weight: 300 !default;\n$ps-base: 1em !default;\n$vr-base: $base-font-size !default;\n\n$dt-font-weight: 700;\n$font-weight-bolder: 800;\n\n// Spacing\n$headings-margin-bottom: 0.5rem;\n$paragraph-margin-bottom: 1rem;\n$max-width-section: 1060px;\n\n// Links\n$color-link: $cornell-red;\n$link-decoration: none;\n$color-link-hover: lighten($cornell-red, 0.1);\n$link-hover-decoration: underline;\n\n// Tables\n$table-cell-padding: 0.75rem;\n$color-table-caption: $black;\n$label-margin-bottom: 0.5rem;\n","$breakpoints: (xs: 30rem, // ~480px\n  sm: 37.5rem, // ~600px\n  md: 61rem, // ~976px\n  lg: 80rem, // ~1280px\n  xl: 90rem // ~1440px\n);\n\n@mixin breakpoint($breakpoint, $logic: false) {\n  @if($logic) {\n    @media #{$logic} and (min-width: map-get($map: $breakpoints, $key: $breakpoint)) {\n      @content;\n    }\n  }\n\n  @else {\n    @media (min-width: map-get($map: $breakpoints, $key: $breakpoint)) {\n      @content;\n    }\n  }\n}\n","// Global mixins - distinct from component mixins\n\n//*----------------------------------*\\\n//  #TOOLS - VISUALLY HIDDEN\n//\\*----------------------------------*/\n\n/// Visually hidden - Make an element visually hidden, but accessible to screen readers, etc.\n/// @author John Albin\n/// @see http://snook.ca/archives/html_and_css/hiding-content-for-accessibility\n/// @link https://github.com/JohnAlbin/zen-style-guide/blob/gh-pages/sass/init/visually-hidden/_visually-hidden.scss\n/// @group Tools\n/// @example scss - basic usage\n///   .centered {\n///     @include visually-hidden();\n///   }\n/// @output Output from the example\n///   .centered {\n///     position: absolute !important;\n///     height: 1px;\n///     width: 1px;\n///     overflow: hidden;\n///     clip: rect(1px, 1px, 1px, 1px);\n///     word-wrap: normal;\n///   }\n\n@mixin visually-hidden {\n  position: absolute !important;\n  height: 1px;\n  width: 1px;\n  overflow: hidden;\n  clip: rect(1px, 1px, 1px, 1px);\n  word-wrap: normal;\n}\n\n@mixin overlay($color: #000, $opacity: 0.5, $z-index: 2, $gradient: null) {\n  position: relative;\n  pointer-events: none;\n\n  &::before {\n    content: '';\n    position: absolute;\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 100%;\n    background: rgba($color, $opacity);\n    background: rgba($color, var(--cu-overlay-opacity, #{$opacity}));\n    z-index: $z-index;\n\n    // Initial boolean implementation for portrait gradients.\n    // The gradient implementation will be extended to include variations here.\n    @if $gradient {\n      background: transparent;\n      background-image: linear-gradient(to bottom, transparent 25%, rgba($color, $opacity) 100%);\n\n      @include breakpoint(md) {\n        background-image: linear-gradient(to bottom, transparent 50%, rgba($color, $opacity) 100%);\n      }\n    }\n  }\n}\n"],"names":[],"mappings":"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"}