:root {
  --logo-blue: #004fa3;
  --logo-red: #ed1a3b;
  --red-dark: #5e1b15;
  --red-medium: #961e28;
  --red: #c4122f;
  --blue-dark: #162249;
  --blue: #13477d;
  --blue-light: #005099;
  --blue-pale: #c4d1df;
  --taupe: #7e6d5f;
  --taupe-dark: #4d4037;
  --taupe-light: #d0c4b6;
  --taupe-pale: #e2dfdb;
  --slate: #446c73;
  --slate-dark: #034775;
  --slate-light: #aabdbe;
  --slate-pale: #d9e1e3;
  --green: #526a3e;
  --green-dark: #526a3e;
  --green-light: #526a3e;
  --green-pale: #d6e2cf;
  --teal: #008290;
  --teal-dark: #00616c;
  --teal-light: #64c7c7;
  --teal-pale: #d9ecf3;
  --yellow: #eeb137;
  --yellow-dark: #bb7b0f;
  --yellow-light: #f4c74b;
  --yellow-pale: #fcf4e9;
  --warm-blue: #005578;
  --warm-blue-dark: #184359;
  --warm-blue-light: #006796;
  --warm-blue-pale: #d1d9de;
  --grey: #5e6769;
  --grey-dark: #414547;
  --grey-light: #99a3a6;
  --grey-pale: #d9dada;
  --orange: #d46b21;
  --default-border-color: #d2d2d2;
  --default-text: #343434;
  --default-heading: var(--navy-dark);
  --default-subhead: #4d4037;
  --default-topic: #6d6d6d;
  --default-disabled: #5e6769;
  --default-link: var(--logo-blue);
  --default-link-hover: var(--logo-blue);
  --default-link-visit: var(--navy-dark);
  --hover-collapse-color: #e5f0f4;
  --school-primary: #13477d;
}
@font-face {
  font-family: "GT Walsheim";
  src: url('https://cloudfront.american.edu/assets/fonts/GT-Walsheim-Regular.woff') format('woff'), url('https://cloudfront.american.edu/assets/fonts/GT-Walsheim-Regular.woff2') format('woff2');
  font-weight: 400 600;
}
@font-face {
  font-family: "GT Walsheim";
  src: url('https://cloudfront.american.edu/assets/fonts/GT-Walsheim-Regular-Oblique.woff') format('woff'), url('https://cloudfront.american.edu/assets/fonts/GT-Walsheim-Regular-Oblique.woff2') format('woff2');
  font-weight: 400 600;
  font-style: italic;
}
@font-face {
  font-family: "GT Walsheim";
  src: url('https://cloudfront.american.edu/assets/fonts/GT-Walsheim-Bold.woff') format('woff'), url('https://cloudfront.american.edu/assets/fonts/GT-Walsheim-Bold.woff2') format('woff2');
  font-weight: 700 900;
}
@font-face {
  font-family: "GT Walsheim";
  src: url('https://cloudfront.american.edu/assets/fonts/GT-Walsheim-Bold-Oblique.woff') format('woff'), url('https://cloudfront.american.edu/assets/fonts/GT-Walsheim-Bold-Oblique.woff2') format('woff2');
  font-weight: 700 900;
  font-style: italic;
}
@font-face {
  font-family: "GT Walsheim";
  src: url('https://cloudfront.american.edu/assets/fonts/GT-Walsheim-Light.woff') format('woff'), url('https://cloudfront.american.edu/assets/fonts/GT-Walsheim-Light.woff2') format('woff2');
  font-weight: 100 300;
}
@font-face {
  font-family: "GT Walsheim";
  src: url('https://cloudfront.american.edu/assets/fonts/GT-Walsheim-Light-Oblique.woff') format('woff'), url('https://cloudfront.american.edu/assets/fonts/GT-Walsheim-Light-Oblique.woff2') format('woff2');
  font-weight: 100 300;
  font-style: italic;
}
:root {
  --logo-blue: #004fa3;
  --logo-red: #ed1a3b;
  --navy-dark: #182449;
  --turquoise: #00b398;
  --purple: #3c208c;
  --periwinkle: #6995dd;
  --slate-dark: #034775;
  --gray-light: #d9dce3;
  --gray-mid: #8a95a5;
  --magenta: #bc1f66;
  --blue-dark: #162249;
  --botany-blue: #6995dd;
  --default-text: #182449;
  --default-heading: var(--navy-dark);
  --default-border-color: #d2d2d2;
  --default-link: var(--logo-blue);
  --default-link-hover: var(--logo-blue);
  --default-link-visit: var(--navy-dark);
  --default-body-bg: #eef0f3;
  --default-footer-bg: #c5c9d1;
  --scale: calc(1920px - 100vw / 1920);
  --challenge-gradient: linear-gradient(to right, #e0263c 0%, #e0263c 11%, #3c208c 89%, #3c208c 100%);
  --challenge-gradient-120deg: linear-gradient(120deg, #e0263c 0%, #e0263c 11%, #3c208c 89%, #3c208c 100%);
  --challenge-gradient-135deg: linear-gradient(120deg, #e0263c 0%, #e0263c 11%, #3c208c 89%, #3c208c 100%);
  --challenge-gradient-vertical: linear-gradient(to bottom, #e0263c 0%, #e0263c 11%, #3c208c 89%, #3c208c 100%);
  --max-width: 1920px;
  --default-padding: clamp(1rem, 0.8333vw, 1.6rem);
  --default-padding-md: clamp(2rem, 1.6667vw, 3.2rem);
  --default-padding-lg: clamp(3.2rem, 3.3333vw, 6.4rem);
  --default-padding-xl: clamp(4rem, 4.2vw, 8rem);
}
/*
[12:20 PM] Jack Esteve
    Blake Patterson Marcus Melo I'm making some tweaks to the 2021-rebrand.css to adjust lede styles, heading styles, and adding some new CSS vars for paddings based on the XD
    --max-width: 1920px;
    --default-padding: 1.6rem;
    --default-padding-md: 3.2rem;
    --default-padding-lg: 6.4rem;
    --default-padding-xl: 8rem;

    Layout with CSS Grid
        template-columns: 2fr 1fr;
        template-rows: repeat(8, min-content);
        template-areas: "search cas" "search ksb" ... "search wcl"
        grid-gap: 1rem 2.5rem			

    align-self center
    border-gradient bottom-only
    border 6 pixels

    01/25/25 - Mods by BG and BP adding 3rd button, cleaning chaotic styles
*/
#program-finder {
  margin: 20px -15px 0 -15px;
  padding: var(--default-padding-md);
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
}
#program-finder h2,
#program-finder .brand-h2 {
  font-family: "GT Walsheim", Arial, sans-serif;
  font-weight: 700;
  color: var(--default-heading);
  font-size: clamp(2.4rem, 1.6vw, 3rem);
  line-height: 3.2rem;
  letter-spacing: 0em;
  text-transform: none;
  margin: 0 0 10px;
}
#program-finder .bg-blue.dark a[href]:not(.btn) {
  text-decoration: none;
  color: #fff !important;
}
#program-finder .bg-blue.dark a[href]:not(.btn):visited {
  color: rgba(255, 255, 255, 0.97) !important;
}
#program-finder .bg-blue.dark {
  background-color: var(--navy-dark) !important;
}
#program-finder a[href] {
  font-family: Arial, sans-serif;
  text-decoration: none;
  color: var(--logo-blue);
}
#program-finder .btn.btn-white {
  text-transform: capitalize;
  padding: 0.4rem 1.6rem;
  font-size: 2.3rem;
  line-height: 4rem;
  height: auto;
  font-weight: 400;
  font-family: "GT Walsheim", Arial, sans-serif;
  color: var(--navy-dark) !important;
  text-decoration: none;
  max-width: 100%;
  margin-top: 0;
  border: 2px solid #fff;
  transition: color 0.5s ease-in, text-decoration 0.5s ease-in, background-color 0.5s ease-in;
  background-color: #fff;
}
#program-finder .btn.btn-white:visited {
  color: var(--default-link-visit);
  background-color: rgba(255, 255, 255, 0.97);
}
#program-finder .grid-container {
  display: grid;
  grid-gap: 1rem 2.5rem;
  grid-template-rows: repeat(3, min-content);
  grid-template-columns: 1fr;
  grid-template-areas: "form" "browseBy" "searchBtns";
}
#program-finder .item-form {
  grid-area: form;
  padding: var(--default-padding-md) var(--default-padding-md) 0;
}
#program-finder .item-browseBy {
  grid-area: browseBy;
  padding: var(--default-padding-md);
  margin-top: -1em;
}
#program-finder .item-browseBtn {
  grid-area: browseBtn;
}
#program-finder .item-searchBtns {
  grid-area: searchBtns;
}
#program-finder .item-searchBtns .bg-blue.dark {
  margin-bottom: 10px;
}
#program-finder .item-undergrad {
  grid-area: undergrad;
}
#program-finder .item-grad {
  grid-area: grad;
}
#program-finder .item-pl {
  grid-area: pl;
}
#program-finder .item-CAS {
  grid-area: search-CAS;
}
#program-finder .item-KOGOD {
  grid-area: search-KOGOD;
}
#program-finder .item-SOC {
  grid-area: search-SOC;
}
#program-finder .item-SOE {
  grid-area: search-SOE;
}
#program-finder .item-SIS {
  grid-area: search-SIS;
}
#program-finder .item-SPEXS {
  grid-area: search-SPEXS;
}
#program-finder .item-SPA {
  grid-area: search-SPA;
}
#program-finder .item-WCL {
  grid-area: search-WCL;
}
#program-finder form {
  position: relative;
}
#program-finder form input {
  display: block;
  width: 100%;
  color: #FFFFFF !important;
  background-color: transparent;
  margin-top: 0.6em;
  border-width: 0 0 6px 0;
}
#program-finder form button {
  border: none;
  cursor: pointer;
  right: 0.1rem;
  position: absolute;
  background: transparent;
  color: #FFFFFF !important;
  transform: rotate(90deg);
}
#program-finder label {
  position: absolute;
  width: 100%;
  top: -3rem;
  transition: font-size 0.5s ease;
  color: #FFFFFF !important;
}
#program-finder label.overlay {
  position: absolute;
}
#program-finder h2 {
  font-size: 1.8rem;
  color: #FFFFFF !important;
}
#program-finder div.bg-blue > p {
  margin: 0;
}
#program-finder div.bg-blue > p > a {
  display: block;
  padding: 7px 0px 10px 15px;
  text-decoration: none;
}
#program-finder div.bg-blue > p > a:hover {
  color: #FFFFFF;
  text-decoration: underline;
  background-color: #034775;
}
/* Ultra small screen */
@media (max-width: 320px) {
  #program-finder {
    padding: var(--default-padding);
  }
  #program-finder form input {
    font-size: 1.7rem;
  }
  #program-finder form button {
    font-size: 2.5rem;
    top: -1rem;
    /* -3rem; */
  }
  #program-finder label.overlay {
    font-size: 1.7rem;
  }
  #program-finder .btn-white {
    font-size: 1.7rem;
  }
  #program-finder div.bg-blue > p > a {
    font-size: 1.7rem;
  }
}
/* Mobile/Tablet Version 767px 1169px */
@media (max-width: 991px) {
  #program-finder {
    background-image: url('../jpg/program-finder-mobile_1_5726964_414x375.jpg');
  }
  #program-finder .grid-container {
    grid-template-columns: 1fr;
  }
  #program-finder .grid-browseBtn {
    grid-template-columns: 1fr;
  }
  #program-finder form input {
    font-size: 2.1rem;
  }
  #program-finder form button {
    font-size: 3rem;
    top: -1rem;
    /* -3rem; */
  }
  #program-finder label.overlay {
    font-size: 2.1rem;
  }
  #program-finder .btn-white {
    font-size: 1.8rem;
  }
}
/* Desktop Version 768px 1170px */
@media (min-width: 992px) {
  #program-finder {
    padding: var(--default-padding-xl);
    background-image: url('../jpg/program-finder-desktop_5726962_1920x650.jpg');
    max-width: 100vw;
  }
  #program-finder .grid-container {
    grid-template-columns: 2fr 1fr;
    grid-template-areas: "form 		searchBtns" "browseBy 	searchBtns";
  }
  #program-finder .grid-browseBtn .btn-white {
    min-width: 23rem;
    line-height: 3rem;
  }
  #program-finder .grid-browseBtn .preLB::before {
    content: "\A";
    white-space: pre;
  }
  #program-finder form {
    margin-top: 11rem;
    margin-bottom: 0;
  }
  #program-finder .item-browseBy {
    padding-top: 4.5rem;
  }
  #program-finder form input {
    font-size: 2.5rem;
  }
  #program-finder form button {
    font-size: 3.5rem;
    top: -1.3rem;
    /* -2.3rem;	*/
  }
  #program-finder label.overlay {
    font-size: 2.9rem;
  }
  #program-finder .btn-white {
    min-width: 25rem;
  }
}
/* For 3rd action button addition */
@media (max-width: 1470px) {
  #program-finder .grid-browseBtn {
    padding: var(--default-padding);
    grid-area: browseBtn;
    display: grid;
    grid-gap: 2rem;
    grid-template-rows: 2fr;
    grid-template-columns: 1fr;
    grid-template-areas: "undergrad" "grad" "pl";
  }
}
/* For 3rd action button addition */
@media (min-width: 1471px) {
  #program-finder .grid-browseBtn {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: justify;
        justify-content: space-between;
  }
  #program-finder .grid-browseBtn .btn-white {
    min-width: 23rem;
  }
}
