/********** BIG PARTS **********/

html {
     position: relative;
     min-height: 100%;
}

body {
   font-family: var(--il-font-source-sans);
   -moz-osx-font-smoothing: grayscale;
   margin-bottom: 60px; /* Margin bottom by footer height */
}

a {
     text-decoration: none !important;
     white-space: nowrap !important;
}

/********** BIG PARTS **********/



/********** SPINNER **********/
/********** https://codepen.io/yic666kr/pen/mxmvbV **********/

#spin_overlay{
     position: fixed;
     top: 0;
     z-index: 100;
     width: 100%;
     height:100%;
     display: none;
     background: rgba(0,0,0,0.6);
}
.spin_wrap {
     height: 100%;
     display: flex;
     justify-content: center;
     align-items: center;  
}
.spin_span {
     width: 7rem;
     height: 7rem;
     border: .3rem #ddd solid;
     border-top: .3em var(--il-blue) solid;
     border-radius: 50%;
     animation: sp-anime 0.8s infinite linear;
}
@keyframes sp-anime {
     100% {
          transform: rotate(360deg);
     }
}

/********** SPINNER **********/



/********** COLORS **********/

/********** UIUC Oranges **********/
.il-orange           {background-color: var(--il-orange);}
.il-altgeld          {background-color: var(--il-altgeld);}
.il-altgeld-dark1    {background-color: var(--il-altgeld-darker-1);}

.il-orange-btn       {background-color: var(--il-orange);         color:#FFFFFF;}
.il-orange-btn:hover {background-color: var(--il-altgeld);        color:#FFFFFF;}

.il-orange-link      {color: var(--il-orange);}
.il-orange-link:hover{color: var(--il-altgeld);}

.il-orange-txt      {color: var(--il-orange);}


/********** UIUC Blues **********/
.il-blue             {fill: var(--il-blue);           background-color: var(--il-blue)!important;}
.il-blue-lite1       {fill: var(--il-blue-lighter-1); background-color: var(--il-blue-lighter-1)!important;}
.il-blue-lite2       {fill: var(--il-blue-lighter-2); background-color: var(--il-blue-lighter-2)!important;}
.il-blue-lite3       {fill: var(--il-blue-lighter-3); background-color: var(--il-blue-lighter-3)!important;}
.il-blue-lite4       {fill: var(--il-blue-lighter-4); background-color: var(--il-blue-lighter-4)!important;}
.il-blue-dark1       {fill: var(--il-blue-darker-1); background-color: var(--il-blue-darker-1)!important;}
.il-blue-dark2       {fill: var(--il-blue-darker-1); background-color: var(--il-blue-darker-2)!important;}

.il-blue-btn         {background-color: var(--il-blue);           color:#FFFFFF;}
.il-blue-btn:hover   {background-color: var(--il-blue-lighter-1); color:#FFFFFF;}
.il-blue-btn-active  {background-color: var(--il-blue-lighter-1); border: 5px solid var(--il-blue-lighter-2)!important;}

.il-blue-txt         {color: var(--il-blue);}
.il-blue-link        {color: var(--il-blue);}
.il-blue-link:hover  {color: var(--il-blue-lighter-1);}


/********** UIUC Grays ("Storms") **********/
.il-storm           {background-color: var(--il-storm);}
.il-storm-lite1     {background-color: var(--il-storm-lighter-1);}
.il-storm-lite2     {background-color: var(--il-storm-lighter-2);}
.il-storm-lite3     {background-color: var(--il-storm-lighter-3);}
.il-storm-lite4     {background-color: var(--il-storm-lighter-4);}
.il-storm-dark1     {background-color: var(--il-darker-1);}
.il-storm-dark2     {background-color: var(--il-darker-2);}

.il-storm-btn       {background-color: var(--il-storm);           color:#FFFFFF;}
.il-storm-btn:hover {background-color: var(--il-storm-lighter-1); color:#FFFFFF;}
.il-storm-btn-active{background-color: var(--il-storm-lighter-1); border: 5px solid var(--il-storm-lighter-2);}

/********** COLORS **********/



/********** OTHER **********/
.lit{
     background: #ffff99;
}
/********** OTHER **********/:root {
    --ila-cookieb-margin: .25rem;
    --ila-cookieb-padding-x: 1rem;
    --ila-cookieb-padding-y: .3rem;
    --ila-cookieb-font-white: #ffffff;
    --ila-cookieb-button-border-color: #001E62;
    /* These are echoed here to provide non-toolkit sites consistent style: */
    --ila-cookieb-border-gray: #707070; /* from toolkit v2 --il-gray-2 */
    --ila-cookieb-button-blue: #13294b; /* from toolkit v2 --il-blue */
    --ila-cookieb-button-background-color: #ffffff; /* white */
    --ila-cookieb-font-sans: "Source Sans", sans-serif;
    --ila-cookieb-button-foreground-color: #13294b; /* from --il-blue */
    /* https://brand.illinois.edu/visual-identity/color */
    --ila-cookieb-small-link-focus: #c84113; /* from -il-altgeld */
}

.cookieb-holder {
    position: fixed;
    bottom: 0;
    left: 0rem;
    width: auto;
    z-index: 29000; /* Some University site headers (or parts of headers) have z-index 10,000, displaying under can cause mixed content display */
}

.cookieb-holder h2,
.cookieb-holder p{
    color: var(--ila-cookieb-font-white);
    font-family: "Source Sans", sans-serif;
}

.cookieb-slideover-holder h2,
.cookieb-slideover-holder h3,
.cookieb-slideover-holder p{
    font-family: "Source Sans", sans-serif;
}

#ilaCookieSlideover {
    z-index: 30000; /* Some University site headers (or parts of headers) have z-index 10,000, displaying under can cause mixed content display */
}

.ila-cookieb__cookieb {
    border: 1px solid var(--ila-cookieb-border-gray);
    margin: var(--ila-cookieb-margin);
    padding: var(--ila-cookieb-padding-y) var(--ila-cookieb-padding-x);
    background-color: white;
    position: relative;
}

.ila-cookieb__h3 {
    margin: 0.5rem 0 auto auto;
}

.ila-cookieb__content p {
    margin: 0;
    padding: 0;
    line-height: 1.5rem;
    width: 60%;
}

.ila-cookieb__content {
    margin: 10px 0;
    display: flex;
    flex-wrap: wrap;
}

.ila-cookieb__actions {
    padding-top: 1rem;
    padding-left: 1rem;
}

.ila-cookieb__button {
  --color-primary: #fff;
  --color-secondary: var(--ila-cookieb-button-blue);
  background-color: var(--ila-cookieb-button-background-color);
  color: var(--ila-cookieb-button-foreground-color);
  display: inline-block;
  padding: 12px 20px;
  text-align: center;
  text-decoration: none;
  border-radius: .25em;
  border: 2px solid var(--ila-cookieb-button-border-color);
  font: 700 1.1875rem/1.25rem var(--ila-cookieb-font-sans);
  letter-spacing: .01em;
  transition: background-color .3s;
  cursor: pointer;
  margin: 0 0 .5rem .5rem;
}

.ila-cookieb__button-center-slideover {
    display: flex;
    justify-content: center;
}

.ila-cookieb__button-close-slideover:hover,
.ila-cookieb__button-close-slideover:focus,
.ila-cookieb__button-close-slideover:active {
    transition: background-color 0.3s;
    background-color: var(--ila-cookieb-accent);
    color: var(--ila-cookieb-hover-button-font);
}

.ila-cookieb__close-button {
    position: absolute;
    right: 0;
    top: 0;
    margin-top: calc(var(--ila-cookieb-padding-y) - 5px);
    margin-right: calc(var(--ila-cookieb-padding-x) - 5px);
    padding: 0;
    background: transparent;
    border: none;
    cursor: pointer;
    color: var(--ila-cookieb-font-white);
}

.ila-cookieb__close-button:hover,
.ila-cookieb__close-button:focus,
.ila-cookieb__close-button:active {
    transition: background-color 0.3s;
    background-color: var(--ila-cookieb-accent);
    color: var(--ila-cookieb-hover-button-font);
}

.ila-cookieb__button:hover,
.ila-cookieb__button:focus,
.ila-cookieb__button:active {
    background-color: var(--ila-cookieb-accent);
    color: var(--ila-cookieb-hover-button-font);
}

.ila-cookieb__close-icon {
    padding: var(--ila-cookieb-padding-y) var(--ila-cookieb-padding-x);
    font-size: 25px;
}

.ila-cookieb.ila-cookieb--closed {
    transition: opacity 0.25s ease-in-out, visibility 0.25s, order 1s;
    visibility: hidden;
    opacity: 0;
    order: 1;
    position: absolute;
}

@media (prefers-reduced-motion) {
    .ila-cookieb.ila-cookieb--closed {
        visibility: hidden;
        opacity: 0;
        order: 1;
        position: absolute;
    }
}

/* `About Cookies` slide out */

.ila-cookieb__slide_small {
    font-size: 0.8em;
    line-height: 1.2em;
}

.ila-cookieb__pointer_hover {
    cursor: pointer;
}

.ila-cookieb__small-font-link:hover,
.ila-cookieb__small-font-link:focus,
.ila-cookieb__small-font-link:active {
    color: var(--ila-cookieb-small-link-focus);
}

/* allow buttons to slide underneath text on thin screens */

@media (max-width: 1030px) {
    .ila-cookieb__actions {
        padding-top: .5em;
        padding-left: 1em;
        flex-direction: column;
        align-items: flex-start;
    }

    .ila-cookieb__button {
        margin: .5rem .5rem .5rem .5rem;
    }

    .ila-cookieb__content p {
        width: 100%;
    }
}

/* Make Slideout wider on thin screens */

@media (max-width: 1030px) {
    .ila-slideover--left .ila-slideover__slideover {
        right: 5% !important;
    }
}

/* UIUC Branding */

html body .ila-cookieb__cookieb {
    /* html body makes this style stronger, but still allows !important to override */
    color: var(--ila-cookieb-font-white);
    background-color: var(--ila-cookieb-main);
}

.ila-cookieb__cookieb a {
    color: var(--ila-cookieb-font-white);
}

/* Hide Cookie Banner when Printing */

@media print {
    .ila-cookieb_no-printing {
        display: none !important;
    }
}

.ila-cookieb__popup-info span {
    display: none;
}

.ila-cookieb__popup-info-link:hover,
.ila-cookieb__popup-info-link:focus,
.ila-cookieb__popup-info-link:active {
    color: var(--ila-cookieb-focused-link-color);
}

.ila-cookieb__popup-info-slideout-link:hover,
.ila-cookieb__popup-info-slideout-link:focus,
.ila-cookieb__popup-info-slideout-link:active {
    color: var(--ila-cookieb-slideout-focused-link-color);
}

.ila-cookieb__popup-info:hover span,
.ila-cookieb__popup-info:focus span,
.ila-cookieb__popup-info:active span {
    display: block;
    position: absolute;
    bottom: 2.5rem;
    left: 10rem;
    padding: 1rem;
    background-color: var(--ila-cookieb-main);
    color: var(--ila-cookieb-hover-text-font);
    border-style: solid;
    border-color: var(--ila-cookieb-accent);
}

@media (max-width: 1030px) {

    .ila-cookieb__popup-info:hover span,
    .ila-cookieb__popup-info:focus span,
    .ila-cookieb__popup-info:active span {
        bottom: 7rem;
    }
}

.ila-cookieb__popup-info-slideout span {
    display: none;
}

.ila-cookieb__popup-info-slideout:hover span,
.ila-cookieb__popup-info-slideout:focus span,
.ila-cookieb__popup-info-slideout:active span {
    display: block;
    position: absolute;
    bottom: auto;
    left: 10rem;
    padding: 1rem;
    background-color: var(--ila-cookieb-main);
    color: var(--ila-cookieb-hover-text-font);
    border-style: solid;
    border-color: var(--ila-cookieb-accent);
}

@media (max-width: 1030px) {

    .ila-cookieb__popup-info-slideout:hover span,
    .ila-cookieb__popup-info-slideout:focus span,
    .ila-cookieb__popup-info-slideout:active span {
        bottom: auto;
    }
}

.ila-cookieb-slideover__header {
    border-color: var(--ila-cookieb-line-color) !important;
}

/* Used to enable or disable scroll on the page */

.ila-cookieb-noscroll {
    overflow: hidden;
}

/* Used to enable or disable a modal background on the page  */

.ila-cookieb-modal {
    position: fixed;
    z-index: 2000;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    background-color: #24242496;
}
:root {
    /**** UIUC Colors ****/
    --ila-cookieb-main: #13294B;
    --ila-cookieb-accent: #FF5F05;
    --ila-cookieb-hover-button-font: #ffffff;
    --ila-cookieb-hover-text-font: #ffffff;
    --il-focused-link-color: #FF5F05;
    --ila-cookieb-line-color: #FF5F05;
    --ila-cookieb-focused-link-color: #FF5F05;
    --ila-cookieb-slideout-focused-link-color: #c84113;
    --ila-cookieb-link-color: #1D58A7;
}/* component styles */
:root {
  --ila-slideover-padding-x: 25px;
  --ila-slideover-padding-y: 5px;
}
.ila-body--has-dialog {
  overflow: hidden;
}
.ila-slideover {
  position: fixed;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
}

.ila-slideover--closed {
  opacity: 0;
  visibility: hidden;
  transition: opacity 250ms, visibility 250ms;
}

.ila-slideover--open {
  display: block;
  z-index: 30000; /* Some University site headers (or parts of headers) have z-index 10,000. Displaying under 10,000 can cause mixed content display. */
  opacity: 1;
  visibility: visible;
  transition: opacity 500ms, visibility 500ms;
}
.ila-slideover__overlay {
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  background-color: #24242496;
  cursor: pointer;
}

.ila-slideover__slideover {
  position: absolute;
  box-shadow: 0px 0px 17px 0px black;
  background: white;
  overflow-y: auto;
}

.ila-slideover--right .ila-slideover__slideover {
  top: 0;
  bottom: 0;
  right: 0;
  left: 70%;
}
.ila-slideover--left .ila-slideover__slideover {
  top: 0;
  bottom: 0;
  right: 70%;
  left: 0;
}

.ila-slideover__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: var(--ila-slideover-padding-y) var(--ila-slideover-padding-x);
  border-bottom: 2px solid var(--il-orange);
}

.ila-slideover__label {
  margin: 0;
  padding: .2em 0;
}

.ila-slideover__close-button {
  border: none;
  background: transparent;
  padding: 5px;
  cursor: pointer;
}
.ila-slideover__close-icon {
  font-size: 35px;
}
.ila-slideover__close-button:hover,
.ila-slideover__close-button:focus {
  transition: background-color 0.3s;
  background-color: var(--il-blue);
  color: white;
}

.ila-slideover__content {
  padding: var(--ila-slideover-padding-y) var(--ila-slideover-padding-x);
}