/*
 * C. T. Bauer College of Business
 * University of Houston
 * Style sheet for 2021-2022 Redesign
 * Created 2021-2022 by Bauer College Web Development Team
 * Contact Brandon Moeller & Marla Molony for assistance with this file.
 *
 * Table of Contents:
 * ------------------
 * Directory Styles
 * Mobile Menu Title
 * Breadcrumbs
 * COVID-19 header
 * Left Nav Styles
 * Alex Brush font
 * Social Icons in the Header
 * Add to UH's headers-footers.css
 * Audience Menu
 * Headroom.js for UH Header Minimum proposal
 * Jquery toggle for minimum header  
 * Classes From /css/template.css
 * Table styles from Foundation
 * Flex-video widescreen styles for iframe Youtube video embeds
 * Accordion styles
 * 
 */

/* ==========================================================================
 Import Web Fonts
 ========================================================================== */

/* Via https://www.uh.edu/css/fonts.css on July 10, 2021 */
@import url('/css/uh/fonts.css');

/* Alex Brush added on Sept. 3, 2021 */

@font-face {
  font-family: 'Alex Brush';
  src: url('../fonts/AlexBrush-Regular.woff2') format('woff2');
  font-style: normal;
}

/* Directory Styles - see /search/ - previously filed under "Subsite Styles" */
.directorylist ul {
  margin: 0;
  padding: 0;
  list-style-type: none;
  text-align: left;
}

.directorylist ul li {
  display: inline;
}

.directorylist ul li a {
  text-decoration: none;
  padding: .1em .4em;
  color: #fff;
  background-color: #666;
  white-space: nowrap;
  line-height: 1.8;
}

.directorylist ul li a:hover {
  color: #fff;
  background-color: #999;
}

dl#DirectoryProfileInfo dt {
  float: left;
  font-weight: bold;
  clear: left;
  padding: 2px;
}

dl#DirectoryProfileInfo dd {
  padding: 2px;
}

.wp-caption {
  float: right;
  background: #F7F7F7;
  border: 1px solid #CCC;
  padding: 5px;
  text-align: center;
  margin: 5px 10px 8px;
  color: #036;
  line-height: 12px;
}

.wp-caption p {
  font-size: 80%;
  margin-bottom: 5px;
}

.profileImage {
  max-width: 170px;
}

/* Mobile Menu Title */

/* This is the title that appears in the Mobile Menu */

h5.mobile-menu-title {
  font-family: 'League Gothic', sans-serif;
  font-size: 45px;
  font-weight: normal;
  line-height: 1.2;
  text-transform: uppercase;
  padding: 20px 20px 0 20px;
  color: #fff;
  text-align: center;
}

/* COVID-19 Header */

.uh-covid-header {
  background-color: #f6be00;
  text-align: center;
  font-family: 'League Gothic';
  font-size: 1.5rem;
  line-height: 1.9rem;
  padding: 20px;
  text-transform: uppercase;
}

.uh-covid-header a, .uh-covid-header a:visited {
  color: #c81023;
  text-decoration: none;
  text-align: center;
  font-family: 'League Gothic';
}

.uh-covid-header a:hover, .uh-covid-header a:focus, .uh-covid-header a:visited:hover {
  color: #960c22;
  text-decoration: none;
}

/* LeftNav Styles */

.sublist {
  display: none;
}

.sublistshown {
  /* added in via JS, see: /js/bauer/template.js */
  display: block;
}

/* Social Icons in the Header */

/* Via uh.edu/class homepage.css */

.class-social {
  display: flex;
  margin-left: auto;
  margin-right: .40em;
  /* flex-flow: row wrap; */
  /* text-align: right; */
}

/* Hide the social icons so they don't interfere with top nav menu or appear on mobile at all */

@media only screen and (max-width: 1230px) {
  .class-social {
    display: none;
  }
}

.icons-class {
  background: #FFF9D9;
  border-radius: 50%;
  display: block;
  height: 50px;
  padding: 8px;
  transition: background .25s ease;
  width: 50px;
  color: white;
  margin-bottom: .75em;
  margin-right: .25em;
}

@media screen and (min-width: 500px) {
  .icons-class {
    background: #FFF9D9;
    border-radius: 50%;
    display: block;
    height: 40px;
    width: 40px;
    margin-bottom: .75em;
    margin-right: .25em;
    padding: 8px !important;
  }
}

/* Add to UH's headers-footers.css */

.uh-header .nav-primary .class-social li:hover {
  background: none;
}

/* Inspired by .social-media-list in /css/uh/refresh/landing-page.css: */

.class-social li {
  margin: 0 2px 0 0;
}

.class-social li.last {
  margin: 0 0 0 0;
}

.class-social a {
  background: #FFF9D9;
  border-radius: 50%;
  display: block;
  height: 40px;
  padding: 8px;
  transition: background .25s ease;
  width: 40px;
}

.class-social a:hover {
  background: #fff;
}

.class-social svg {
  /* fill: white; */
  fill: #c8102e;
}

/* Audience Menu moved from /css/uh/refresh/landing-page.css to here */

.nav-gateway {
  /* background: #FFF9D9; */
  background: #54585A;
  font: 1rem 'Milo', sans-serif;
  /* 16px */
  line-height: 1.5;
  margin: 0;
  max-height: 0;
  overflow: hidden;
  padding: 0;
  transition: max-height .5s ease;
  -webkit-order: -3;
  order: -3;
}

.active-nav .nav-gateway {
  max-height: 20rem;
}

.nav-gateway h5 {
  /*display: inline-block;*/
  font-size: inherit;
  font-style: italic;
  font-weight: bold;
  line-height: inherit;
  margin: 0 1.33333333em 0 0;
  padding: .5em 0;
  color: #fff;
}

.nav-gateway ul {
  /*display: inline;*/
  list-style: none;
  padding: 0;
}

.nav-gateway a {
  font-weight: bold;
  padding: .5em 0;
  display: block;
  color: #FFF9D9;
}

.nav-gateway a:hover {
  color: #FFF;
}

@media screen and (min-width: 992px) {
  .nav-gateway {
    font: 'Milo', sans-serif;
    /* 1.125rem ~ 18px */
    /* https://www.smashingmagazine.com/2016/05/fluid-typography/#controlling-the-rate-of-scale */
    font-size: calc(15px + (17 - 15) * (100vw - 970px)/(1200 - 970));
    /* scale between 11px and 12px (see above link and nav-primary in headers-footers.css) */
    max-height: none;
    padding: .5em 0;
  }
  .nav-gateway h5 {
    display: inline-block;
    padding: .25em 0;
  }
  .nav-gateway ul>li {
    display: inline-block;
    /* margin: 0 1.33333333em 0 0; */
    margin: 0 1.33333333em 0 0;
  }
  .nav-gateway ul {
    display: inline;
  }
  .nav-gateway a {
    padding: .25em 0;
  }
}

@media screen and (min-width: 1200px) {
  .nav-gateway {
    font-size: 1.125rem;
    /* 18px */
  }
}

/* Headroom.Js */

/**
 * Note: I have omitted any vendor-prefixes for clarity.
 * Adding them is left as an exercise for the developer in future commits.
 */

.headroom {
  will-change: transform;
  transition: transform 200ms linear;
}

.headroom--pinned {
  transform: translateY(0%);
}

.headroom--unpinned {
  transform: translateY(-100%);
}

/* jQuery toggle for minimum header */

.goner {
  display: none;
}

@media (max-width: 767px) {
  .gonermobile {
    display: none;
  }
}

/* Classes From /css/template.css */

.clear {
  clear: both;
}

.intro {
  /*font-size: large;*/
  /*font-size: 18px;*/
  font-size: 22px;
  line-height: 140%;
}

/* Select table styles from Previous template */

table {
  width: 100%;
}

/* From /css/foundation.css */

table tbody tr:nth-child(even) {
  background: #f9f9f9;
}

table tbody tr td, table tbody tr th {
  padding: 9px 10px 9px 10px;
}

/* BEGIN Flex-video widescreen styles from /css/foundation.min.css */

/* Video - Mad props to http://www.alistapart.com/articles/creating-intrinsic-ratios-for-video/ ---------------------- */

.flex-video {
  position: relative;
  padding-top: 25px;
  padding-bottom: 67.5%;
  height: 0;
  margin-bottom: 16px;
  overflow: hidden;
}

.flex-video.widescreen {
  padding-bottom: 57.25%;
}

.flex-video.vimeo {
  padding-top: 0;
}

.flex-video iframe, .flex-video object, .flex-video embed, .flex-video video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

@media only screen and (max-device-width: 800px), only screen and (device-width: 1024px) and (device-height: 600px), only screen and (width: 1280px) and (orientation: landscape), only screen and (device-width: 800px), only screen and (max-width: 767px) {
  .flex-video {
    padding-top: 0;
  }
}

/* END Flex-video widescreen styles from /css/foundation.min.css */

/* BEGIN Accordion styles */

/* UNCSS'd with https://uncss-online.com/ from sources: /css/foundation.css and /css/template.css */

ul.accordion2021 {
  margin: 0 0 22px 0;
  border-bottom: 1px solid #e9e9e9;
  padding-left: 0;
}

ul.accordion2021>li {
  list-style: none;
  margin: 0;
  padding: 0;
  border-top: 1px solid #e9e9e9;
}

ul.accordion2021>li .title {
  cursor: pointer;
  background: #f6f6f6;
  padding: 15px;
  margin: 0;
  position: relative;
  border-left: 1px solid #e9e9e9;
  border-right: 1px solid #e9e9e9;
  -webkit-transition: 0.15s background linear;
  -moz-transition: 0.15s background linear;
  -o-transition: 0.15s background linear;
  transition: 0.15s background linear;
}

/* Accordion2021 Headings */
ul.accordion2021>li .title h1, ul.accordion2021>li .content h1 {
  margin: 0;
  font-size: 4rem
}

ul.accordion2021>li .title h2, ul.accordion2021>li .content h2 {
  margin: 0;
  font-size: 3.5rem
}

/* Real */
ul.accordion2021>li .title h3, ul.accordion2021>li .content h3 {
  margin: 0;
  font-size: 3rem
}

ul.accordion2021>li .title h4, ul.accordion2021>li .content h4 {
  margin: 0;
  font-size: 3rem
}

/* REAL */
ul.accordion2021>li .title h5, ul.accordion2021>li .content h5 {
  margin: 0;
  font-size: 2.75rem
}

ul.accordion2021>li .title h6, ul.accordion2021>li .content h6 {
  margin: 0;
  font-size: 2.5rem
}

/* Toward styling all the text in the .content inspired by ecity .page-content p */
ul.accordion2021>li .content, ul.accordion2021>li .content p, ul.accordion2021>li .content ul li, ul.accordion2021>li .content ol li, ul.accordion2021>li .content ul li ul li, ul.accordion2021>li .content ol li ol li, ul.accordion2021>li .content ul li ol li, ul.accordion2021>li .content ol li ul li { 
  font-size: 2.4rem;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.33;
  letter-spacing: normal;
} 

/* Also let there be a medium font size, too */
ul.accordion2021>li .content .medium, ul.accordion2021>li .content p.medium, ul.accordion2021>li .content ul.medium li, ul.accordion2021>li .content ol.medium li, ul.accordion2021>li .content ul.medium li ul.medium li, ul.accordion2021>li .content ol.medium li ol.medium li, ul.accordion2021>li .content ul.medium li ol.medium li, ul.accordion2021>li .content ol.medium li ul.medium li { 
  font-size: 2rem;
  line-height: 1.5
}

ul.accordion2021>li .title:after {
  /* content: "";
  display: block;
  width: 0;
  height: 0;
  border: solid 6px;
  border-color: transparent #9d9d9d transparent transparent;
  position: absolute;
  right: 15px;
  top: 21px; */
  font-family: "Font Awesome 6 Pro";
  position: absolute;
  color: #c8102e;
  right: 15px;
  top: 18px;
  font-size: 2.2rem;
  content: "\2b" !important
}

ul.accordion2021>li .content {
  display: none;
  padding: 15px;
}

ul.accordion2021>li.active {
  border-top: 3px solid #cc0000;
}

ul.accordion2021>li.active .title {
  background: white;
  padding-top: 13px;
}

ul.accordion2021>li.active .title:after {
  font-family: "Font Awesome 6 Pro";
  content: "\f068" !important;
  position: absolute;
  color: #c8102e;
  right: 15px;
  top: 18px;
  font-size: 2.2rem
  /* content: "";
  display: block;
  width: 0;
  height: 0;
  border: solid 6px;
  border-color: #9d9d9d transparent transparent transparent; */
}

ul.accordion2021>li.active .content {
  background: white;
  display: block;
  border-left: 1px solid #e9e9e9;
  border-right: 1px solid #e9e9e9;
}

.accordion2021 {
  margin-left: 0;
  background: #fefefe;
  list-style-type: none;
}

ul.accordion2021>li .content .note, ul.accordion2021>li .content p.note {
  background: #FFF9D9;
  padding: 5px 10px;
  margin-bottom: 10px;
  border: #EEE 1px solid;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  -ms-border-radius: 5px;
  -o-border-radius: 5px;
  border-radius: 5px;
  clear: both
}

/* END Accordion styles */

/* HEADINGS - 
/* 
/* Default Heading Structure, 
/* Media Queries for Default Headings, 
/* Subheadline Structure & Style,  
/* Optional Thinner Style for Subheadlines
/* Media Queries for Subheadline Headings
/* New Kicker Style from eCity
/* Subheader Style - DEPRECATED
/* Caps style
/* Colors
/* Brand Color Background Styles
/* Other heading styles from ..styles-formatted.css
/*
*/

/* Default Heading Structure H1-H6 */

.page-content h1 {
  font-family: "League Gothic", sans-serif;
  font-size: 8rem;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  color: #000;
  margin-bottom: 2.5rem;
}

.page-content h2 {
  font-family: "League Gothic", sans-serif;
  font-size: 7rem;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  color: #000;
  margin-bottom: 2.5rem
}

.page-content h3 {
  font-family: "League Gothic", sans-serif;
  font-size: 6rem;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  color: #000;
  margin-bottom: 2.5rem
}

/* Adjust margin bottom for Modal Titles */
.page-content h3.modal-title { 
  margin-bottom: 0;
}

.page-content h4 {
  font-family: "League Gothic", sans-serif;
  font-size: 5.5rem;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  color: #000;
  text-transform: none;
  margin-bottom: 2.5rem
}

.page-content h5 {
  font-family: "League Gothic", sans-serif;
  font-size: 5rem;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  color: #000;
  text-transform: none;
  margin-bottom: 2.5rem
}

.page-content h6 {
  font-family: "League Gothic", sans-serif;
  font-size: 4.5rem;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  color: #000;
  text-transform: none;
  margin-bottom: 2.5rem
}

/* Media Queries for Default Headings */

@media only screen and (max-width: 992px) {

  .page-content h1 {
    font-size: 7rem;
  }

  .page-content h1, .page-content h2, .page-content h3 .page-content h4, .page-content h5, .page-content h6 {
    line-height: 1.08;
    margin-bottom: 1rem
  }
  
  .page-content h2 {
    font-size: 6rem;
  }

  .page-content h3 {
    font-size: 5rem;
  }

  .page-content h4 {
    font-size: 4.5rem
  }

  .page-content h5 {
    font-size: 4rem
  }

  .page-content h6 {
    font-size: 3.5rem
  }

}

/* Subheadline Structure & Style (.sub) */

.page-content h1.sub {
  font-family: "Source Sans Pro", sans-serif;
  font-style: normal;
  font-weight: normal;
  font-size: 5.5rem;
  font-stretch: normal;
  line-height: 1;
  color: #000;
  margin-bottom: 2.5rem;
}

.page-content h2.sub {
  font-family: "Source Sans Pro", sans-serif;
  font-style: normal;
  font-weight: normal;
  font-size: 5rem;
  font-stretch: normal;
  line-height: 1;
  color: #000;
  margin-bottom: 2.5rem;
}

.page-content h3.sub {
  font-family: "Source Sans Pro", sans-serif;
  font-style: normal;
  font-weight: normal;
  font-size: 4.5rem;
  font-stretch: normal;
  line-height: 1;
  color: #000;
  margin-bottom: 2.5rem;
}

.page-content h4.sub {
  font-family: "Source Sans Pro", sans-serif;
  font-style: normal;
  font-weight: normal;
  font-size: 4rem;
  font-stretch: normal;
  line-height: 1;
  color: #000;
  margin-bottom: 2.5rem;
}

.page-content h5.sub {
  font-family: "Source Sans Pro", sans-serif;
  font-style: normal;
  font-weight: normal;
  font-size: 3.5rem;
  font-stretch: normal;
  line-height: 1;
  color: #000;
  margin-bottom: 2.5rem;
}

.page-content h6.sub {
  font-family: "Source Sans Pro", sans-serif;
  font-style: normal;
  font-weight: normal;
  font-size: 3rem;
  font-stretch: normal;
  line-height: 1;
  color: #000;
  margin-bottom: 2.5rem;
}

/* Optional Thinner Style (.thinner) for Subheadlines */
.page-content h1.thinner, .page-content h2.thinner, .page-content h3.thinner, .page-content h4.thinner, .page-content h5.thinner, .page-content h6.thinner {
  font-weight: 200
}

/* Media Queries for Subheadline Headings */
@media only screen and (max-width: 992px) {

  .page-content h1.sub {
    font-size: 4.5rem;
    margin-bottom: 1rem
  }

  .page-content h2.sub {
    font-size: 4rem;
    margin-bottom: 1rem
  }

  .page-content h3.sub {
    font-size: 3.5rem;
    margin-bottom: 1rem
  }

  .page-content h4.sub {
    font-size: 3rem;
    margin-bottom: 1rem
  }

  .page-content h5.sub {
    font-size: 2.5rem;
    margin-bottom: 1rem
  }

  .page-content h6.sub {
    font-size: 2rem;
    margin-bottom: 1rem
  }

}

/* New Kicker Style from eCity */

.page-content h4.kicker {
  font-family: "Source Sans Pro Bold", serif;
  font-size: 1.4rem;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.43;
  letter-spacing: 0.88px;
  color: #c8102e;
  text-transform: uppercase;
  margin-bottom: 1.5rem
}

/* Subheader Style (.subheader) - DEPRECATED */

.page-content h1.subheader, .page-content h2.subheader, .page-content h3.subheader, .page-content h4.subheader, .page-content h5.subheader, .page-content h6.subheader {
  font-family: 'League Gothic';
  color: #888b8d;
}

/* Caps style (.caps) */

.page-content h1.caps, .page-content h2.caps, .page-content h3.caps, .page-content h4.caps, .page-content h5.caps, .page-content h6.caps, p.caps, .page-content s.caps, .page-content span.caps {
  text-transform: uppercase;
}

/* Colors */

/* Brand Colors that "pass" for default white backgrounds */
.page-content h1.red, .page-content h2.red, .page-content h3.red, .page-content h4.red, .page-content h5.red, .page-content h6.red, p.red, .page-content s.red, .page-content span.red, ul.red li {
  color: #c8102e;
}

.page-content h1.gray, .page-content h2.gray, .page-content h3.gray, .page-content h4.gray, .page-content h5.gray, .page-content h6.gray, p.gray, .page-content s.gray, .page-content span.gray, ul.gray li, .page-content a.gray, .page.content a.gray:hover, .page-content a.gray:active, .page-content a.gray:focus {
  color: #888b8d;
}

.page-content h1.brick, .page-content h2.brick, .page-content h3.brick, .page-content h4.brick, .page-content h5.brick, .page-content h6.brick, p.brick, .page-content s.brick, .page-content span.brick, ul.brick li, .page-content a.brick, .page.content a.brick:hover, .page-content a.brick:active, .page-content a.brick:focus {
  color: #960c22;
}

.page-content h1.green, .page-content h2.green, .page-content h3.green, .page-content h4.green, .page-content h5.green, .page-content h6.green, p.green, .page-content s.green, .page-content span.green, ul.green li, .page-content a.green, .page.content a.green:hover, .page-content a.green:active, .page-content a.green:focus {
  color: #00866c;
}

.page-content h1.slate, .page-content h2.slate, .page-content h3.slate, .page-content h4.slate, .page-content h5.slate, .page-content h6.slate, p.slate, .page-content s.slate, .page-content span.slate, ul.slate li, .page-content a.slate, .page.content a.slate:hover, .page-content a.slate:active, .page-content a.slate:focus {
  color: #54585a;
}

.page-content h1.chocolate, .page-content h2.chocolate, .page-content h3.chocolate, .page-content h4.chocolate, .page-content h5.chocolate, .page-content h6.chocolate, p.chocolate, .page-content s.chocolate, .page-content span.chocolate, ul.chocolate li, .page-content a.chocolate, .page.content a.chocolate:hover, .page-content a.chocolate:active, .page-content a.chocolate:focus {
  color: #640817;
}

.page-content h1.forest, .page-content h2.forest, .page-content h3.forest, .page-content h4.forest, .page-content h5.forest, .page-content h6.forest, p.forest, .page-content s.forest, .page-content span.forest, ul.forest li, .page-content a.forest, .page.content a.forest:hover, .page-content a.forest:active, .page-content a.forest:focus {
  color: #005950;
}

.page-content h1.ocher, .page-content h2.ocher, .page-content h3.ocher, .page-content h4.ocher, .page-content h5.ocher, .page-content h6.ocher, p.ocher, .page-content s.ocher, .page-content span.ocher, ul.ocher li, .page-content a.ocher, .page.content a.ocher:hover, .page-content a.ocher:active, .page-content a.ocher:focus {
  color: #b97800;
}

/* Brand Colors that "fail" for default white backgrounds */
.page-content h1.teal, .page-content h2.teal, .page-content h3.teal, .page-content h4.teal, .page-content h5.teal, .page-content h6.teal, p.teal, .page-content s.teal, .page-content span.teal, ul.teal li, .page-content a.teal, .page.content a.teal:hover, .page-content a.teal:active, .page-content a.teal:focus {
  color: #00b388;
}

.page-content h1.gold, .page-content h2.gold, .page-content h3.gold, .page-content h4.gold, .page-content h5.gold, .page-content h6.gold, p.gold, .page-content s.gold, .page-content span.gold, ul.gold li, .page-content a.gold, .page.content a.gold:hover, .page-content a.gold:active, .page-content a.gold:focus {
  color: #f6be00;
}

.page-content h1.white, .page-content h2.white, .page-content h3.white, .page-content h4.white, .page-content h5.white, .page-content h6.white, p.white, .page-content s.white, .page-content span.white, ul.white li, .page-content a.white, .page.content a.white:hover, .page-content a.white:active, .page-content a.white:focus {
  color: #ffffff;
}

.page-content h1.mustard, .page-content h2.mustard, .page-content h3.mustard, .page-content h4.mustard, .page-content h5.mustard, .page-content h6.mustard, p.mustard, .page-content s.mustard, .page-content span.mustard, ul.mustard li, .page-content a.mustard, .page.content a.mustard:hover, .page-content a.mustard:active, .page-content a.mustard:focus {
  color: #d89b00;
}

.page-content h1.cream, .page-content h2.cream, .page-content h3.cream, .page-content h4.cream, .page-content h5.cream, .page-content h6.cream, p.cream, .page-content s.cream, .page-content span.cream, ul.cream li, .page-content a.cream, .page.content a.cream:hover, .page-content a.cream:active, .page-content a.cream:focus {
  color: #fff9d9;
}

/* Brand Color Background Styles */

.whiteback {
  background-color: #fff;
}

.whiteback-20 {
  background-color: rgba(255, 255, 255, 0.2)
}

.whiteback-60 {
  background-color: rgba(255, 255, 255, 0.6)
}

.blackback {
  background-color: #000;
}

.redback {
  background-color: #c8102e;
}

.redback-20 {
  background-color: rgba(200, 16, 46, 0.2);
}

.redback-30 {
  background-color: rgba(200, 16, 46, 0.3);
}

.redback-40 {
  background-color: rgba(200, 16, 46, 0.4);
}

.redback-50 {
  background-color: rgba(200, 16, 46, 0.5);
}

.redback-60 {
  background-color: rgba(200, 16, 46, 0.6);
}

.redback-70 {
  background-color: rgba(200, 16, 46, 0.7);
}

.redback-80 {
  background-color: rgba(200, 16, 46, 0.8);
}

.redback-84 {
  background-color: rgba(200, 16, 46, 0.84);
}

.redback-88 {
  background-color: rgba(200, 16, 46, 0.88);
}

.redback-90 {
  background-color: rgba(200, 16, 46, 0.9);
}

.redback-92 {
  background-color: rgba(200, 16, 46, 0.92);
}

.redback-94 {
  background-color: rgba(200, 16, 46, 0.94);
}

.redback-95 {
  background-color: rgba(200, 16, 46, 0.95);
}

.redback-96 {
  background-color: rgba(200, 16, 46, 0.96);
}

.redback-97 {
  background-color: rgba(200, 16, 46, 0.97);
}

.redback-98 {
  background-color: rgba(200, 16, 46, 0.98);
}

.tealback {
  background-color: #00b388;
}

.goldback {
  background-color: #f6be00;
}

.grayback {
  background-color: #888b8d;
}

.grayback-20 {
  background-color: rgba(136, 139, 141, 0.2);
    /* background-color: #888b8d; */
    /* #E7E8E8 */
}

.brickback {
  background-color: #960c22;
}

.brickback-20 {
  background-color: rgba(150, 12, 34, 0.2)
  /* background-color: #960c22; */
}

.brickback-40 {
  background-color: rgba(150, 12, 34, 0.4)
  /* background-color: #960c22; */
}

.brickback-60 {
  background-color: rgba(150, 12, 34, 0.6)
  /* background-color: #960c22; */
}

.brickback-80 {
  background-color: rgba(150, 12, 34, 0.8)
  /* background-color: #960c22; */
}

.greenback {
  background-color: #00866c;
}

.mustardback {
  background-color: #d89b00;
}

.slateback {
  background-color: #54585a;
}

.creamback {
  background-color: #fff9d9;
}

.chocolateback {
  background-color: #640817;
}

.forestback {
  background-color: #005950;
}

.ocherback {
  background-color: #b97800;
}

/* Other heading styles from /stylesheets/styles-formatted.css */

/* originally changed 220218 see commit 1cb6c86, reverted back on 220314 */
.page-content h2 span {
  color: #c8102e;
  display: block
}

@media only screen and (max-width: 992px) {
  .page-content h2 span {
    color: #000;
    display: inline
  }
}

.page-content h2.search-title, .page-content h2.md-special {
  font-size: 6rem;
  line-height: 1.08;
}

.page-content h2.search-title span, .page-content h2.md-special span {
  display: inline;
  color: #c8102e;
  text-decoration: underline
}

@media only screen and (max-width: 992px) {
  .page-content h2.search-title, .page-content h2.md-special {
    font-size: 5rem;
    line-height: 1.1;
  }
}

@media only screen and (max-width: 992px) {
  .page-content h2.sm-special {
    font-size: 5rem;
    line-height: 1.1;
  }
}

@media only screen and (max-width: 992px) {
  .page-content h3.sm-special {
    font-size: 4rem;
    margin-bottom: 1.5rem
  }
}

/* Note style from previous template.css. Good for paragraphs or divs. */
.page-content .note {
  background: #FFF9D9;
  padding: 5px 10px;
  margin-bottom: 10px;
  border: #EEE 1px solid;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  -ms-border-radius: 5px;
  -o-border-radius: 5px;
  border-radius: 5px;
  /* behavior: url(/js/border-radius.htc); */
  clear: both
}


/* Searchbox */
.col-12 label {
  display: inherit; /* Fixes the display block inline in the scss that i cant figure out how to otherwise turn off */
}

/* Footer - Space before footer starts */
/* Nah, because then we can't have images flow into it, see: /redesign/examples/page-additional.php */
/* footer { 
  margin-top: 30px
} */

/* Rule lines - Breathing space */
.page-content hr { 
  padding-top: 10px; 
  padding-bottom: 10px
}

/* Improving Sliderjq - see /departments/marketing-entrepreneurship/seminars/ */
.page-content ul#sliderjq li { 
  list-style: none;
}

.page-content ul#sliderjq li h4 {
  font-size: 3rem;
  margin-top: 10px;
}

/* Improving Dropdown-menu */
.page-content .dropdown-menu {
  font-size: 2rem;
}

/* Bring back the redbar */
.redbar { 
  border-bottom: 4px solid #c00;
  padding-top: 5px;
  margin-bottom: 5px;
}

/* Modal adjustments */
.modal-body {
  padding: 1.5rem;
}

/* Application Deadline Table Style */
.deadlinetable { 
  border-left:.5px solid #ccc;
}

@media only screen and (max-width: 1450px) {
  .deadlinetable { 
    border-left:.5px solid #ccc;
  }
}

@media only screen and (max-width: 992px) {
  .deadlinetable { 
    border-left:0px none;
  }
}

/* For horizontal menus */
@supports ((position:-webkit-sticky) or (position:sticky)) {
  .sticky-top-horiz-menu {
    position:-webkit-sticky;
    position:sticky;
    top:0;
    z-index:1
  }
}