{"version":3,"file":"carousel/carousel.css","sources":["carousel/carousel.scss","../global/_global.scss","../global/_variables.scss","../global/_breakpoints.scss","../global/_mixins.scss"],"sourcesContent":["@import './global/global';\n\n.cu-carousel {\n  display: grid;\n  gap: var(--cu-vr1);\n  align-items: stretch;\n  --background-accent-color: #222;\n\n  &.cu-colorscheme--dark {\n    --background-accent-color: #6C6C6C;\n  }\n\n  &[class*=\"cu-colorscheme--\"] {\n    padding: var(--cu-vr1) 0 var(--cu-vr1) var(--cu-ps1);\n  }\n}\n\n@include breakpoint(md) {\n  .cu-carousel {\n    grid-template-columns: 2fr 3fr;\n    gap: var(--cu-ps3);\n\n    &[class*=\"cu-colorscheme--\"] {\n      padding: var(--cu-vr3) 0 var(--cu-vr3) var(--cu-ps4);\n    }\n  }\n}\n\n.cu-carousel__content {\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  padding-right: var(--cu-ps1);\n\n  @include breakpoint(md) {\n    padding: var(--cu-vr3) 0;\n  }\n}\n\n.cu-carousel__item-wrapper {\n  padding: var(--cu-vr1) 0;\n  margin: 0;\n  background: linear-gradient(to right,rgba(0, 0, 0, 0) 132px, var(--background-accent-color) 132px);\n  overflow-x: scroll;\n  scroll-snap-type: x mandatory;\n\n  @include breakpoint(md) {\n    padding: var(--cu-vr3) 0;\n    overflow-x: hidden;\n  }\n}\n\n.cu-carousel__items {\n  margin: 0;\n  padding: 0;\n  display: flex;\n  align-items: center;\n  height: 100%;\n  gap: var(--cu-ps1);\n  list-style-type: none;\n}\n\n.cu-carousel__item {\n  scroll-snap-align: start;\n  flex-basis: content;\n  flex-grow: 0;\n  flex-shrink: 0;\n\n  &:last-of-type {\n    padding-right: var(--cu-ps1);\n  }\n\n  > * {\n    max-height: 400px;\n  }\n\n  // YouTube videos, mainly.\n  iframe {\n    height: 400px;\n    width: auto;\n    aspect-ratio: 9/16;\n    border: none;\n    border-radius: 10px;\n  }\n}\n\n.cu-carousel__navigation {\n  display: none;\n\n  @include breakpoint(md) {\n    padding-left: 0;\n    position: absolute;\n    margin: 0;\n    bottom: 25px;\n    right: calc((var(--cu-ps3) + 79px + 25px) * -1);\n    display: flex;\n    gap: 5px;\n    list-style-type: none;\n\n    .cu-carousel__navigation-button {\n      padding: 0;\n      background-color: transparent;\n      border: none;\n      // background-color: var(--cu-colorscheme-accent);\n      // stroke: white;\n      cursor: pointer;\n\n      > * {\n        display: block;\n        border: 2px solid var(--cu-colorscheme-accent);\n      }\n    }\n  }\n}\n\n.cu-carousel[data-scrollposition=\"start\"] .cu-carousel__navigation-button[data-direction=\"prev\"],\n.cu-carousel[data-scrollposition=\"end\"] .cu-carousel__navigation-button[data-direction=\"next\"] {\n  opacity: .25;\n  cursor: initial;\n}\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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"}