/*
Running Squiz Matrix
Developed by Squiz - http://www.squiz.net
Squiz, Squiz Matrix, MySource, MySource Matrix and Squiz.net are registered Trademarks of Squiz Pty Ltd
Page generated: 27 February 2025 19:24:46
*/
/* UC brand colours.*/
/* Non-standard:*/
/* Bootstrap functions*/
/**/
/* Utility mixins and functions for evaluating source code across our variables, maps, and mixins.*/
/* Ascending*/
/* Used to evaluate Sass maps like our grid breakpoints.*/
/* Starts at zero*/
/* Used to ensure the min-width of the lowest breakpoint starts at 0.*/
/* Replace `$search` with `$replace` in `$string`*/
/* Used on our SVG icon backgrounds for custom forms.*/
/**/
/* @author Hugo Giraudel*/
/* @param {String} $string - Initial string*/
/* @param {String} $search - Substring to replace*/
/* @param {String} $replace ('') - New value*/
/* @return {String} - Updated string*/
/* See https://codepen.io/kevinweber/pen/dXWoRw*/
/**/
/* Requires the use of quotes around data URIs.*/
/* Color contrast*/
/* Retrieve color Sass maps*/
/* Request a theme color level*/
/* Return valid calc*/
/* Variables*/
/**/
/* Variables should follow the `$component-state-property-size` formula for*/
/* consistent naming. Ex: $nav-link-disabled-color and $modal-content-box-shadow-xs.*/
/* Color system*/
/* Set a specific jump point for requesting color jumps*/
/* The yiq lightness value that determines when the lightness of color changes from "dark" to "light". Acceptable values are between 0 and 255.*/
/* Customize the light and dark text colors for use in our YIQ color contrast function.*/
/* Characters which are escaped by the escape-svg function*/
/* Options*/
/**/
/* Quickly modify global styling by enabling or disabling optional features.*/
/* Deprecated, no longer affects any compiled CSS*/
/* Spacing*/
/**/
/* Control the default styling of most Bootstrap elements by modifying these*/
/* variables. Mostly focused on spacing.*/
/* You can add more entries to the $spacers map, should you need more variation.*/
/* This variable affects the `.h-*` and `.w-*` classes.*/
/* Body*/
/**/
/* Settings for the `` element.*/
/* Links*/
/**/
/* Style anchor elements.*/
/* Darken percentage for links with `.text-*` class (e.g. `.text-success`)*/
/* Paragraphs*/
/**/
/* Style p element.*/
/* Grid breakpoints*/
/**/
/* Define the minimum dimensions at which your layout will change,*/
/* adapting to different screen sizes, for use in media queries.*/
/* Do nothing*/
/* Do nothing*/
/* Do nothing*/
/* Do nothing*/
/* Do nothing*/
/* Grid containers*/
/**/
/* Define the maximum width of `.container` for different screen sizes.*/
/* Do nothing*/
/* Do nothing*/
/* Do nothing*/
/* Do nothing*/
/* Grid columns*/
/**/
/* Set the number of columns and specify the width of the gutters.*/
/* Components*/
/**/
/* Define common padding and border radius sizes and more.*/
/* Typography*/
/**/
/* Font, line-height, and color for body text, headings, and more.*/
/* stylelint-disable value-keyword-case*/
/* stylelint-enable value-keyword-case*/
/* Assumes the browser default, typically `16px`*/
/* Tables*/
/**/
/* Customizes the `.table` component with basic values, each used across all table variations.*/
/* Buttons + Forms*/
/**/
/* Shared variables that are reassigned to `$input-` and `$btn-` specific variables.*/
/* Buttons*/
/**/
/* For each of Bootstrap's buttons, define text, background, and border color.*/
/* Set to `nowrap` to prevent text wrapping*/
/* Allows for customizing button radius independently from global border radius*/
/* Forms*/
/* Extra padding to account for the presence of the background-image based indicator*/
/* In pixels because image dimensions*/
/* Used so we can have multiple background elements (e.g., arrow and feedback icon)*/
/* For focus box shadow issue in IE/Edge*/
/* Form validation*/
/* Z-index master list*/
/**/
/* Warning: Avoid customizing these values. They're used for a bird's eye view*/
/* of components dependent on the z-axis and are designed to all work together.*/
/* Navs*/
/* Navbar*/
/* Compute the navbar-brand padding-y so the navbar-brand will have the same height as navbar-text and nav-link*/
/* Dropdowns*/
/**/
/* Dropdown menu container and contents.*/
/* Pagination*/
/* Jumbotron*/
/* Cards*/
/* Tooltips*/
/* Form tooltips must come after regular tooltips*/
/* Popovers*/
/* Toasts*/
/* Badges*/
/* Use a higher than normal value to ensure completely rounded edges when*/
/* customizing padding or font-size on labels.*/
/* Modals*/
/* Padding applied to the modal body*/
/* Margin between elements in footer, must be lower than or equal to 2 * $modal-inner-padding*/
/* Keep this for backwards compatibility*/
/* Alerts*/
/**/
/* Define alert colors, border radius, and padding.*/
/* Progress bars*/
/* List group*/
/* Image thumbnails*/
/* Figures*/
/* Breadcrumbs*/
/* Carousel*/
/* Define transform transition first if using multiple transitions (e.g., `transform 2s ease, opacity .5s ease-out`)*/
/* Spinners*/
/* Close*/
/* Code*/
/* Utilities*/
/* Printing*/
/* Toggles*/
/**/
/* Used in conjunction with global variables to enable certain theme features.*/
/* Vendor*/
/* stylelint-disable property-blacklist, scss/dollar-variable-default*/
/* SCSS RFS mixin*/
/**/
/* Automated font-resizing*/
/**/
/* See https://github.com/twbs/rfs*/
/* Configuration*/
/* Base font size*/
/* Breakpoint at where font-size starts decreasing if screen width is smaller*/
/* Resize font-size based on screen height and width*/
/* Factor of decrease*/
/* Generate enable or disable classes. Possibilities: false, "enable" or "disable"*/
/* 1 rem = $rfs-rem-value px*/
/* Safari iframe resize bug: https://github.com/twbs/rfs/issues/14*/
/* Disable RFS by setting $enable-responsive-font-sizes to false*/
/* Cache $rfs-base-font-size unit*/
/* Remove px-unit from $rfs-base-font-size for calculations*/
/* Cache $rfs-breakpoint unit to prevent multiple calls*/
/* Remove unit from $rfs-breakpoint for calculations*/
/* The font-size & responsive-font-size mixin uses RFS to rescale font sizes*/
/* Deprecate*/
/* Deprecate mixin*/
/**/
/* This mixin can be used to deprecate mixins or functions.*/
/* `$enable-deprecation-messages` is a global variable, `$ignore-warning` is a variable that can be passed to*/
/* some deprecated mixins to suppress the warning (for example if the mixin is still be used in the current version of Bootstrap)*/
/* Utilities*/
/* Breakpoint viewport sizes and media queries.*/
/**/
/* Breakpoints are defined as a map of (name: minimum width), order from small to large:*/
/**/
/* (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px)*/
/**/
/* The map defined in the `$grid-breakpoints` global variable is used as the `$breakpoints` argument by default.*/
/* Name of the next breakpoint, or null for the last breakpoint.*/
/**/
/* >> breakpoint-next(sm)*/
/* md*/
/* >> breakpoint-next(sm, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))*/
/* md*/
/* >> breakpoint-next(sm, $breakpoint-names: (xs sm md lg xl))*/
/* md*/
/* Minimum breakpoint width. Null for the smallest (first) breakpoint.*/
/**/
/* >> breakpoint-min(sm, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))*/
/* 576px*/
/* Maximum breakpoint width. Null for the largest (last) breakpoint.*/
/* The maximum value is calculated as the minimum of the next one less 0.02px*/
/* to work around the limitations of `min-` and `max-` prefixes and viewports with fractional widths.*/
/* See https://www.w3.org/TR/mediaqueries-4/#mq-min-max*/
/* Uses 0.02px rather than 0.01px to work around a current rounding bug in Safari.*/
/* See https://bugs.webkit.org/show_bug.cgi?id=178261*/
/**/
/* >> breakpoint-max(sm, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))*/
/* 767.98px*/
/* Returns a blank string if smallest breakpoint, otherwise returns the name with a dash in front.*/
/* Useful for making responsive utilities.*/
/**/
/* >> breakpoint-infix(xs, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))*/
/* "" (Returns a blank string)*/
/* >> breakpoint-infix(sm, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))*/
/* "-sm"*/
/* Media of at least the minimum breakpoint width. No query for the smallest breakpoint.*/
/* Makes the @content apply to the given breakpoint and wider.*/
/* Media of at most the maximum breakpoint width. No query for the largest breakpoint.*/
/* Makes the @content apply to the given breakpoint and narrower.*/
/* Media that spans multiple breakpoint widths.*/
/* Makes the @content apply between the min and max breakpoints*/
/* Media between the breakpoint's minimum and maximum widths.*/
/* No minimum for the smallest breakpoint, and no maximum for the largest one.*/
/* Makes the @content apply only to the given breakpoint, not viewports any wider or narrower.*/
/* Hover mixin and `$enable-hover-media-query` are deprecated.*/
/**/
/* Originally added during our alphas and maintained during betas, this mixin was*/
/* designed to prevent `:hover` stickiness on iOS-an issue where hover styles*/
/* would persist after initial touch.*/
/**/
/* For backward compatibility, we've kept these mixins and updated them to*/
/* always return their regular pseudo-classes instead of a shimmed media query.*/
/**/
/* Issue: https://github.com/twbs/bootstrap/issues/25195*/
/* Image Mixins*/
/* - Responsive image*/
/* - Retina image*/
/* Responsive image*/
/**/
/* Keep images from scaling beyond the width of their parents.*/
/* Retina image*/
/**/
/* Short retina mixin for setting background-image and -size.*/
/* Resize anything*/
/* Only display content to screen readers*/
/**/
/* See: https://www.a11yproject.com/posts/2013-01-11-how-to-hide-content/*/
/* See: https://hugogiraudel.com/2016/10/13/css-hide-and-seek/*/
/* Use in conjunction with .sr-only to only display content when it's focused.*/
/**/
/* Useful for "Skip to main content" links; see https://www.w3.org/TR/2013/NOTE-WCAG20-TECHS-20130905/G1*/
/**/
/* Credit: HTML5 Boilerplate*/
/* Sizing shortcuts*/
/* stylelint-disable declaration-no-important*/
/* Typography*/
/* CSS image replacement*/
/* Text truncate*/
/* Requires inline-block or block for proper styling*/
/* stylelint-disable declaration-no-important*/
/* Visibility*/
/* Components*/
/* Button variants*/
/**/
/* Easily pump out default styles, as well as :hover, :focus, :active,*/
/* and disabled options for all buttons*/
/* Button sizes*/
/* Pagination*/
/* Lists*/
/* Unstyled keeps list items block level, just removes default browser padding and list-style*/
/* List Groups*/
/* Horizontal dividers*/
/**/
/* Dividers (basically an hr) within dropdowns and nav lists*/
/* Form control focus state*/
/**/
/* Generate a customized focus state and for any input with the specified color,*/
/* which defaults to the `$input-focus-border-color` variable.*/
/**/
/* We highly encourage you to not customize the default value, but instead use*/
/* this to tweak colors on an as-needed basis. This aesthetic change is based on*/
/* WebKit's default styles, but applicable to a wider range of browsers. Its*/
/* usability and accessibility should be taken into account with any change.*/
/**/
/* Example usage: change the default blue border and shadow to white for better*/
/* contrast against a dark gray background.*/
/* This mixin uses an `if()` technique to be compatible with Dart Sass*/
/* See https://github.com/sass/sass/issues/1873#issuecomment-152293725 for more details*/
/* Tables*/
/* Skins*/
/* stylelint-disable declaration-no-important*/
/* Contextual backgrounds*/
/* stylelint-disable property-disallowed-list*/
/* Single side border-radius*/
/* Helper function to replace negative values with 0*/
/* Gradients*/
/* Horizontal gradient, from left to right*/
/**/
/* Creates two color stops, start and end, by specifying a color and position for each color stop.*/
/* Vertical gradient, from top to bottom*/
/**/
/* Creates two color stops, start and end, by specifying a color and position for each color stop.*/
/* stylelint-disable property-disallowed-list*/
/* Layout*/
/* Framework grid generation*/
/**/
/* Used only by Bootstrap to generate the correct number of grid classes given*/
/* any value of `$grid-columns`.*/
/*/ Grid system*/
/**/
/* Generate semantic grid columns with these mixins.*/
/* For each breakpoint, define the maximum width of the container in a media query*/
/* Row columns*/
/**/
/* Specify on a parent element(e.g., .row) to force immediate children into NN*/
/* numberof columns. Supports wrapping to new lines, but does not do a Masonry*/
/* style grid.*/
/* stylelint-disable declaration-no-important*/
/* stylelint-disable-line scss/at-import-partial-extension*/
.bg-ucblue {
background-color: #009abc !important;
}
.btn-pill {
border-radius: 9999px !important;
}
.btn-campaign-cta {
font-family: "Verlag A", "Verlag B", "Lato", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !important;
font-weight: bold !important;
border-width: 3px !important;
padding-left: 1.75em !important;
padding-right: 1.75em !important;
font-size: 1.25rem !important;
}
.btn-campaign-cta.btn-lg {
font-size: 1.5rem;
}
.btn-campaign-white {
color: #212529;
background-color: #fff;
border-color: #fff;
/* Disabled comes first so active can properly restyle*/
color: #006c91 !important;
}
.btn-campaign-white:hover {
color: #212529;
background-color: #ececec;
border-color: #e6e6e6;
}
.btn-campaign-white:focus, .btn-campaign-white.focus {
color: #212529;
background-color: #ececec;
border-color: #e6e6e6;
/* Avoid using mixin so we can pass custom focus shadow properly*/
box-shadow: 0 0 0 0.2rem rgba(222, 222, 223, 0.5);
}
.btn-campaign-white.disabled, .btn-campaign-white:disabled {
color: #212529;
background-color: #fff;
border-color: #fff;
/* Remove CSS gradients if they're enabled*/
}
.btn-campaign-white:not(:disabled):not(.disabled):active, .btn-campaign-white:not(:disabled):not(.disabled).active, .show > .btn-campaign-white.dropdown-toggle {
color: #212529;
background-color: #e6e6e6;
border-color: #dfdfdf;
}
.btn-campaign-white:not(:disabled):not(.disabled):active:focus, .btn-campaign-white:not(:disabled):not(.disabled).active:focus, .show > .btn-campaign-white.dropdown-toggle:focus {
/* Avoid using mixin so we can pass custom focus shadow properly*/
box-shadow: 0 0 0 0.2rem rgba(222, 222, 223, 0.5);
}
.btn-outline-primary {
border-color: #006c91;
color: #006c91;
}
.btn-outline-primary:hover {
color: #fff;
border-color: #006c91;
background-color: #006c91;
}
.bg-primary {
background: #006c91 !important;
}
.bg-light {
background: #f1f1f1 !important;
}
.text-dark {
color: #414042 !important;
}
.hero-banner {
position: relative;
z-index: 0;
}
.hero-banner .hero-banner-text {
font-size: 24px;
}
.hero-banner .hero-banner-title {
font-size: 4.375rem;
font-family: "Verlag A", "Verlag B", "Lato", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
font-weight: bold;
margin-bottom: 1.75rem;
}
.hero-banner .hero-banner-image {
text-align: center;
}
.hero-banner .hero-banner-image img {
max-width: 100%;
height: auto;
}
@media (min-width: 992px) {
.hero-banner .hero-banner-image {
position: relative;
}
.hero-banner .hero-banner-image::after {
content: '';
display: block;
padding-bottom: 100%;
}
.hero-banner .hero-banner-image img {
position: absolute;
z-index: -1;
top: 0;
right: 0;
height: 100%;
width: auto;
max-width: none;
}
}
.jumbo-heading {
font-weight: 700;
margin: 0;
}
@media (min-width: 576px) {
.jumbo-heading {
font-size: 2.25rem;
}
}
@media (min-width: 992px) {
.jumbo-heading {
font-size: 4.375rem;
}
}
.jumbo-heading.jumbo-accent {
position: relative;
}
.jumbo-heading.jumbo-accent::after {
content: '';
display: block;
width: 70px;
border-bottom: 0.5rem solid #92d6e3;
margin-top: 0.75rem;
margin-bottom: 0.75rem;
}
@media (min-width: 992px) {
.jumbo-heading.jumbo-accent::after {
width: 100px;
border-bottom: 0.75rem solid #92d6e3;
margin-top: 2.5rem;
}
}
.jumbo-bg {
padding-right: 16%;
position: relative;
}
.jumbo-bg::before, .jumbo-bg::after {
content: '';
display: block;
position: absolute;
z-index: -10;
top: -40px;
bottom: -70px;
left: -250px;
right: 12%;
}
.jumbo-bg.jumbo-bg-blue::before {
background-color: #009abc;
}
.jumbo-bg.jumbo-bg-dark-teal::before {
background-color: #006c91;
}
.jumbo-bg.jumbo-bg-hale-navy::before {
background-color: #414d61;
}
@media (min-width: 992px) {
.jumbo-bg {
padding-right: 0;
}
.jumbo-bg::before, .jumbo-bg::after {
top: -70px;
right: -150px;
}
}
.jumbo-bg.jumbo-bg-pathway::after {
overflow: hidden;
opacity: 0.25;
background-repeat: no-repeat;
background-size: 100% auto;
}
@media (min-width: 992px) {
.jumbo-bg.jumbo-bg-pathway::after {
background-image: url('https://www.canberra.edu.au/_designs/ucweb/common/images/indigenous-elements/trust.png');
background-position: center top 190px;
}
}
.jumbo-bg.jumbo-bg-news::after {
overflow: hidden;
opacity: 0.15;
background-repeat: no-repeat;
background-size: 400px auto;
}
@media (min-width: 992px) {
.jumbo-bg.jumbo-bg-news::after {
background-image: url('https://www.canberra.edu.au/_designs/ucweb/common/images/indigenous-elements/diversity.png');
background-position: right -150px top -50px;
}
}
.jumbo-row {
padding-top: 70px;
}
@media (min-width: 992px) {
.jumbo-row {
padding-bottom: 70px;
}
}
.campaign-card {
display: -ms-flexbox;
display: flex;
flex-direction: column;
position: relative;
z-index: 0;
}
.campaign-card > .campaign-card-image {
order: -1;
}
@media (min-width: 992px) {
.campaign-card.campaign-card-horizontal {
flex-direction: row;
}
.campaign-card.campaign-card-horizontal > .campaign-card-content {
flex: 1;
}
.campaign-card.campaign-card-horizontal > .campaign-card-image {
flex: 1;
}
}
.campaign-card .campaign-card-content {
background: #fff;
box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
}
.campaign-card .campaign-card-image {
position: relative;
margin-bottom: 0;
}
.campaign-card .campaign-card-image img {
position: absolute;
z-index: -1;
max-width: 100%;
height: auto;
top: 0;
left: 0;
}
.campaign-card .campaign-card-image::after {
content: '';
display: block;
width: 100%;
padding-top: 56.25%;
}
.campaign-card .campaign-card-image.campaign-card-image-4by3::after {
padding-top: 75%;
}
@media (min-width: 992px) {
.campaign-card .campaign-card-image {
margin-bottom: -10%;
}
.campaign-card.campaign-card-horizontal {
align-items: center;
}
.campaign-card.campaign-card-horizontal .campaign-card-image {
margin-bottom: 0;
}
.campaign-card.campaign-card-horizontal .campaign-card-image img {
max-width: none;
top: 0;
left: 0;
height: 100%;
}
.campaign-card.campaign-card-horizontal .campaign-card-image.anchor-right {
order: 1;
}
.campaign-card.campaign-card-horizontal .campaign-card-image.anchor-right img {
left: auto;
right: 0;
}
}
.pathway-items .pathway-item {
padding: 1.5rem;
background: #fff;
}
.pathway-items .pathway-item h3, .pathway-items .pathway-item h3 a {
color: #006c91 !important;
font-weight: 700;
font-size: 1.5rem;
}
.pathway-items .pathway-item p {
margin-bottom: 0;
}
@media (max-width: 991.98px) {
.pathway-items {
padding-top: 1rem;
padding-bottom: 1rem;
}
.pathway-items .pathway-item {
margin-bottom: 1rem;
background: #fff;
box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
}
}
@media (min-width: 992px) {
.pathway-items {
padding: 1.5rem;
background: #fff;
box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
}
.pathway-items::after {
display: block;
clear: both;
content: "";
}
.pathway-items .pathway-item {
float: left;
width: 50%;
}
}
.course-search-bar {
width: 100%;
height: 55px;
padding: 10px 65px 10px 20px;
position: relative;
background: #e3f5f8;
border-radius: 9999px;
}
.course-search-bar input[type="text"] {
font-size: 1.25rem;
height: 35px;
border: none;
width: 100%;
padding: 5px;
border: none;
background: transparent;
}
.course-search-bar input[type="text"]::placeholder {
color: #18535e;
opacity: 0.5;
}
.course-search-bar button[type="submit"] {
position: absolute;
top: 0;
right: 0;
bottom: 0;
padding: 0;
border: none;
border-radius: 9999px;
background: #009abc;
appearance: none;
-moz-appearance: none;
-webkit-appearance: none;
}
.course-search-bar button[type="submit"]::after {
content: '';
display: block;
background: url('/_designs/ucweb/common/images/icons/search.png') no-repeat center;
background-size: 25px 25px;
width: 55px;
height: 55px;
}
@media (min-width: 992px) {
.course-search-bar {
height: 75px;
padding: 17.5px 92.5px 17.5px 35px;
}
.course-search-bar input[type="text"] {
font-size: 1.5rem;
height: 40px;
}
.course-search-bar button[type="submit"]::after {
background-size: 30px 30px;
width: 75px;
height: 75px;
}
}
.course-category {
text-align: center;
margin-bottom: 2rem;
}
.course-category::after {
display: block;
clear: both;
content: "";
}
.course-category img {
max-width: 70px;
max-height: 70px;
height: 70px;
margin-bottom: 1rem;
}
.course-category a {
color: #006c91;
font-size: 1rem;
font-weight: bold;
float: left;
width: 100%;
}
.selling-point {
font-family: "Verlag A", "Verlag B", "Lato", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
text-align: center;
font-size: 1.25rem;
padding-top: 1rem;
padding-bottom: 1rem;
position: relative;
z-index: 1;
}
.selling-point > img {
max-width: 100px;
margin: 1rem 0;
height: auto;
}
.selling-point.selling-point-main {
background: #009abc;
color: #fff;
font-size: 24px;
padding-top: 2rem;
padding-bottom: 2rem;
}
.selling-point.selling-point-main .selling-point-highlight {
display: block;
font-size: 3.25rem;
}
.selling-point-background.campaign-card-image {
display: none;
}
@media (min-width: 992px) {
.selling-point-background.campaign-card-image {
display: block;
}
.selling-point-background.campaign-card-image img {
left: -25%;
width: 120%;
max-width: none;
}
}
.nav.news-selector {
flex-direction: column;
font-family: "Verlag A", "Verlag B", "Lato", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
font-size: 1.25rem;
}
.jumbo-bg .nav.news-selector .nav-link {
font-size: 21px;
color: #fff;
padding: 0.75rem 0;
border-bottom: 1px solid rgba(255, 255, 255, 80);
}
.jumbo-bg .nav.news-selector .nav-item:last-child .nav-link {
border-bottom: none;
}
.jumbo-bg .nav.news-selector .nav-link.active {
color: #92d6e3;
font-weight: bold;
cursor: default;
}
.news-item-card {
box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
background: #fff;
display: -ms-flexbox;
display: flex;
flex-direction: column;
}
@media (min-width: 992px) {
.news-item-card {
height: 100%;
min-height: 29.75em;
}
}
.news-item-card .news-item-image {
order: -1;
width: 100%;
padding-top: 56.25%;
position: relative;
overflow: hidden;
}
.news-item-card .news-item-image img {
position: absolute;
width: auto;
height: 100%;
margin: auto;
top: -100%;
right: -100%;
bottom: -100%;
left: -100%;
}
@media (min-width: 992px) {
.news-item-card .news-item-image {
padding-top: 75%;
}
}
.news-item-card .news-item-date {
padding: 1rem;
font-size: 0.875rem;
font-weight: bold;
text-transform: uppercase;
color: #414042;
}
.news-item-card .news-item-summary {
order: 1;
flex: 1;
padding: 0 1rem;
font-size: 0.95rem;
}
.news-item-card .news-item-summary h4 {
font-size: 1.25em;
font-weight: bold;
margin: 0 0 1.25rem;
}
.news-item-card .news-item-summary h4 a {
color: #006c91 !important;
}
@media (max-width: 992px) {
.news-item-card .news-item-image img {
height: 120% !important;
}
}