/* grid system */
/* break points */
/* fonts */
/* default */
/* button colors */
/* background colors */
/* font colors */
/*==========  calculate px --> em  ==========*/
/*==========  font-size function  ==========*/
/* grid system */
/* box sizing */
/* clearfix */
/* font size */
/* line height */
/* fonts */
.light, a.button, .primary, .secondary.green, .secondary.orange, .secondary.gray, h1, h2, h3, h4, h5, h6, #main-content #ws-pa #edu-il #blog-wrapper h1,
#main-content #ws-pa #edu-il #blog-wrapper h1 a,
#main-content #ws-pa #edu-il #blog-wrapper h1 a:hover,
#main-content #ws-pa #edu-il #blog-wrapper h1 a:focus, #main-content #ws-pa #edu-il #blog-wrapper h2,
#main-content #ws-pa #edu-il #blog-wrapper h2 a,
#main-content #ws-pa #edu-il #blog-wrapper h2 a:hover,
#main-content #ws-pa #edu-il #blog-wrapper h2 a:focus, #main-content #ws-pa #edu-il #blog-wrapper h3,
#main-content #ws-pa #edu-il #blog-wrapper h3 a,
#main-content #ws-pa #edu-il #blog-wrapper h3 a:hover,
#main-content #ws-pa #edu-il #blog-wrapper h3 a:focus, #main-content #ws-pa #edu-il #blog-wrapper h4,
#main-content #ws-pa #edu-il #blog-wrapper h4 a,
#main-content #ws-pa #edu-il #blog-wrapper h4 a:hover,
#main-content #ws-pa #edu-il #blog-wrapper h4 a:focus, #main-content #ws-pa #edu-il #blog-wrapper h5,
#main-content #ws-pa #edu-il #blog-wrapper h5 a,
#main-content #ws-pa #edu-il #blog-wrapper h5 a:hover,
#main-content #ws-pa #edu-il #blog-wrapper h5 a:focus, #main-content #ws-pa #edu-il #blog-wrapper h6,
#main-content #ws-pa #edu-il #blog-wrapper h6 a,
#main-content #ws-pa #edu-il #blog-wrapper h6 a:hover,
#main-content #ws-pa #edu-il #blog-wrapper h6 a:focus, footer p.copy, .content header div h3, .content aside ul li.title, #ws-pa-6039 .topic-title {
  font-weight: 300; }

.normal, p, dd, span, td, li, #main-content #ws-pa #edu-il #blog-wrapper #blog-content p,
#main-content #ws-pa #edu-il #blog-wrapper #blog-content span,
#main-content #ws-pa #edu-il #blog-wrapper ul,
#main-content #ws-pa #edu-il #blog-wrapper ul li, #main-content #ws-pa #edu-il #blog-wrapper a,
#main-content #ws-pa #edu-il #blog-wrapper a:hover, .primary-nav a.button, .primary-nav .primary, .primary-nav .secondary.green, .primary-nav .secondary.orange, .primary-nav .secondary.gray {
  font-weight: 400; }

.bold, nav a#menu, aside a#sub-menu, .sub-nav li a, .content article h2, .content article h3, .content article h4, .content article h5, .content article h6, p#menu-title {
  font-weight: 700; }

/* buttons */
a.button, .primary, .secondary.green, .secondary.orange, .secondary.gray {
  font-family: "Source Sans Pro", sans-serif;
  border: none;
  border: none;
  padding: 0.3125em 0.9375em;
  transition: opacity 0.25s ease-in-out;
  color: #ffffff;
  text-align: center;
  text-decoration: none; }
  a.button:hover, .primary:hover, .secondary.green:hover, .secondary.orange:hover, .secondary.gray:hover, a.button:focus, .primary:focus, .secondary.green:focus, .secondary.orange:focus, .secondary.gray:focus {
    opacity: 0.8;
    cursor: pointer; }

*,
*:after,
*:before {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }

ul, ol, dl, body {
  margin: 0;
  padding: 0; }

.grid {
  width: 100%;
  max-width: 77em;
  padding: 0 1em;
  margin: 0 auto; }
  .grid:before, .grid:after {
    content: "";
    display: table; }
  .grid:after {
    clear: both; }

.block-1 {
  float: left;
  margin-right: 1.25em;
  margin-bottom: 1.25em;
  margin-left: 1.25em;
  width: 11em; }

.block-2 {
  float: left;
  margin-right: 1.25em;
  margin-bottom: 1.25em;
  margin-left: 1.25em;
  width: 23.25em; }

.block-3 {
  float: left;
  margin-right: 1.25em;
  margin-bottom: 1.25em;
  margin-left: 1.25em;
  width: 35.5em; }

.block-4 {
  float: left;
  margin-right: 1.25em;
  margin-bottom: 1.25em;
  margin-left: 1.25em;
  width: 47.75em; }

.block-5 {
  float: left;
  margin-right: 1.25em;
  margin-bottom: 1.25em;
  margin-left: 1.25em;
  width: 60em; }

.block-6 {
  float: left;
  margin-right: 1.25em;
  margin-bottom: 1.25em;
  margin-left: 1.25em;
  width: 72.25em; }

.grid .first {
  margin-left: 0 !important; }

.grid .last {
  margin-right: 0 !important; }

html {
  font-size: 16px;
  font-size: 1rem; }

p, dd, span, td, li {
  font-family: "Source Sans Pro", sans-serif;
  color: #575757;
  font-size: 16px;
  font-size: 1rem;
  line-height: 1.8em; }

h1, h2, h3, h4, h5, h6 {
  font-family: "Source Sans Pro", sans-serif;
  color: #575757;
  padding: 0;
  margin: 0.5em 0 1em 0; }

h1 {
  font-size: 32px;
  font-size: 2rem; }

h2 {
  font-size: 30px;
  font-size: 1.875rem; }

h3 {
  font-size: 24px;
  font-size: 1.5rem; }

h4 {
  font-size: 20px;
  font-size: 1.25rem; }

h5 {
  font-size: 18px;
  font-size: 1.125rem; }

h6 {
  font-size: 16px;
  font-size: 1rem; }

li {
  list-style-type: none;
  padding: 0;
  margin: 0 0 0 0;}

.content ul {
  margin-left: 1em; }
  .content ul li {
    list-style-type: disc; }

p {
  padding: 0;
  margin: 0 0 0 0; }

section {
  padding: 2em 0; }

a {
  color: #ca552d;
  text-decoration: none;
  margin: 0;
  font-family: "Source Sans Pro", sans-serif; }

/* override blog defualts */
#main-content #ws-pa #edu-il #blog-wrapper #blog-content p,
#main-content #ws-pa #edu-il #blog-wrapper #blog-content span,
#main-content #ws-pa #edu-il #blog-wrapper ul,
#main-content #ws-pa #edu-il #blog-wrapper ul li {
  font-family: "Source Sans Pro", sans-serif;
  color: #575757;
  font-size: 1rem;
  line-height: 1.8em; }

#main-content #ws-pa #edu-il #blog-wrapper a,
#main-content #ws-pa #edu-il #blog-wrapper a:hover {
  font-family: "Source Sans Pro", sans-serif;
  font-size: 16px;
  font-size: 1rem;
  line-height: 1.8em;
  color: #ca552d; }

#main-content #ws-pa #edu-il #blog-wrapper a:hover {
  text-decoration: underline; }

#main-content #ws-pa #edu-il #blog-wrapper h1,
#main-content #ws-pa #edu-il #blog-wrapper h1 a,
#main-content #ws-pa #edu-il #blog-wrapper h1 a:hover,
#main-content #ws-pa #edu-il #blog-wrapper h1 a:focus {
  font-size: 32px;
  font-size: 2rem;
  font-family: "Source Sans Pro", sans-serif;
  margin: 1em 0 0 0; }

#main-content #ws-pa #edu-il #blog-wrapper h2,
#main-content #ws-pa #edu-il #blog-wrapper h2 a,
#main-content #ws-pa #edu-il #blog-wrapper h2 a:hover,
#main-content #ws-pa #edu-il #blog-wrapper h2 a:focus {
  font-size: 30px;
  font-size: 1.875rem;
  font-family: "Source Sans Pro", sans-serif;
  margin: 1em 0 0 0; }

#main-content #ws-pa #edu-il #blog-wrapper h3,
#main-content #ws-pa #edu-il #blog-wrapper h3 a,
#main-content #ws-pa #edu-il #blog-wrapper h3 a:hover,
#main-content #ws-pa #edu-il #blog-wrapper h3 a:focus {
  font-size: 24px;
  font-size: 1.5rem;
  font-family: "Source Sans Pro", sans-serif;
  margin: 1em 0 0 0; }

#main-content #ws-pa #edu-il #blog-wrapper h4,
#main-content #ws-pa #edu-il #blog-wrapper h4 a,
#main-content #ws-pa #edu-il #blog-wrapper h4 a:hover,
#main-content #ws-pa #edu-il #blog-wrapper h4 a:focus {
  font-size: 20px;
  font-size: 1.25rem;
  font-family: "Source Sans Pro", sans-serif;
  margin: 1em 0 0 0; }

#main-content #ws-pa #edu-il #blog-wrapper h5,
#main-content #ws-pa #edu-il #blog-wrapper h5 a,
#main-content #ws-pa #edu-il #blog-wrapper h5 a:hover,
#main-content #ws-pa #edu-il #blog-wrapper h5 a:focus {
  font-size: 18px;
  font-size: 1.125rem;
  font-family: "Source Sans Pro", sans-serif;
  margin: 1em 0 0 0; }

#main-content #ws-pa #edu-il #blog-wrapper h6,
#main-content #ws-pa #edu-il #blog-wrapper h6 a,
#main-content #ws-pa #edu-il #blog-wrapper h6 a:hover,
#main-content #ws-pa #edu-il #blog-wrapper h6 a:focus {
  font-size: 16px;
  font-size: 1rem;
  font-family: "Source Sans Pro", sans-serif;
  margin: 1em 0 0 0; }

#ws-pa #edu-il #blog-wrapper {
  width: 100% !important; }

#main-content #ws-pa #edu-il #blog-wrapper #blog-content #blog-posts .blog-post-detail-wrapper .blog-post-meta .blog-post-date {
  border-right: none; }

#main-content #ws-pa #edu-il #blog-wrapper #blog-content #blog-posts .blog-post-detail-wrapper .blog-post-meta .blog-post-author {
  display: none; }

@media only screen and (max-width: 55em) {
  html {
    font-size: 14px;
    font-size: 0.875rem; } }
.primary-nav a.button, .primary-nav .primary, .primary-nav .secondary.green, .primary-nav .secondary.orange, .primary-nav .secondary.gray {
  color: #575757;
  background-color: #d6d5d0;
  font-size: 16px;
  font-size: 1rem;
  transition: background-color 0.25s ease-in-out;
  display: block; }
  .primary-nav a.button:hover, .primary-nav .primary:hover, .primary-nav .secondary.green:hover, .primary-nav .secondary.orange:hover, .primary-nav .secondary.gray:hover {
    background-color: #49589b;
    color: #ffffff; }

.primary-nav a.button.current, .primary-nav .current.primary, .primary-nav .current.secondary.green, .primary-nav .current.secondary.orange, .primary-nav .current.secondary.gray {
  color: #ffffff;
  background-color: #575757; }

.primary {
  background-color: #ca552d; }

.secondary.green {
  background-color: #cfc83e; }

.secondary.orange {
  background-color: #cf6f35; }

.secondary.gray {
  background-color: #d6d5d0; }

/* search button */
.color-bar button {
  font-family: "Source Sans Pro", sans-serif;
  border: 1px solid #d6d5d0;
  color: #575757;
  padding: 0.4em 1em;
  vertical-align: middle;
  margin-left: 0.5em;
  width: 6%; }

/*==========  sprites  ==========*/
span.sprites, a.sprites {
  display: block; }

.sprites {
  background: url(https://skins.webservices.illinois.edu/files/11060/sprites.png) no-repeat; }

.bx-wrapper .bx-next {
  background: url(https://skins.webservices.illinois.edu/files/11060/sprites.png) no-repeat -52px -326px;
  display: block; }

.bx-wrapper .bx-prev {
  background: url(https://skins.webservices.illinois.edu/files/11060/sprites.png) no-repeat -52px -352px;
  display: block; }

.bx-next {
  width: 25px;
    
  height: 23px;
    
  background-position: -5px -5px;  }

.bx-prev {
  width: 25px;
  height: 22px; 
  background-position: -5px -38px;  }

.coe-logo {
  width: 153px;
  height: 56px;
  background-position: -5px -70px; }

.eitp-logo {
  width: 153px;
  height:107px;
  background-position: -5px -136px; }

.full-logo {
  width: 149px;
  height: 104px;
  background-position: -5px -253px; }

.hamburger {
  width: 20px;
  height: 20px;
  background-position: -5px -367px; }

.imark-small {
  width: 30px;
  height: 43px;
  background-position: -5px -468px; }

.imark {
  width: 42px;
  height: 61px;
  background-position: -5px -397px; }

.search-icon {
  width: 15px;
  height: 15px;
  background-position: -5px -521px; }

span.hamburger {
  float: left;
  margin-right: 0.5em; }

@media only screen and (max-width: 30em) {
  .imark {
    width: 30px;
    height: 39px;
    background-position: 0 -326px; } }
/*==========  images  ==========*/
img {
  max-width: 100%; }

a.skip-nav {
  display: none; }

section#main-content {
  padding: 0;
  margin: 0; }

header {
  background-color: #f6f4ef;
  padding: 0 0 2em 0; }

h1.title {
  color: #ca552d;
  margin: 0 0 0.2em 0;
  float: left; }

.color-bar {
  padding: 0.3em 1em;
  margin: 0 0 2em 0;
  background-color: #ca552d;
  position: relative;
  text-align: center; }
  .color-bar a {
    background-color: #ca552d;
    position: absolute;
    right: 0;
    bottom: -30px;
    padding: 10px; }
  .color-bar #search-bar {
    padding: 0.7em 0; }
  .color-bar label {
    display: none; }
  .color-bar .search-bar {
    padding: 0.5em 1em;
    background-color: #f6f4ef;
    color: #575757;
    border: 1px solid #d6d5d0;
    width: 90%;
    margin: 0; }
  .color-bar .search-button {
    border: 1px solid #D6D5D0;
    color: #575757;
    font-family: "Source Sans Pro",sans-serif;
    margin-left: 0.5em;
    padding: 0.4em 1em;
    vertical-align: middle;
    width: 6%; }

@media only screen and (max-width: 55em) {
  .color-bar input {
    width: 81%; }

  .color-bar button {
    width: 15%; }

  h1.title {
    margin-left: 0.5em; } }
@media only screen and (max-width: 30em) {
  .color-bar input {
    width: 81%; }

  .color-bar button {
    width: 15%; } }
.logo-block, .nav-block {
  float: left; }

.logo-block {
  width: 15%;
  padding: 0 2em 0 0;
  min-width: 160px; }

.nav-block {
  width: 80%;
  width: 76%; }

.imark-block {
  width: 5%;
  float: right; }

p.full-logo a {
  display: block;
  width: 149px;
  height: 149px; }

p.imark {
  float: right;
  margin-top: 2.8em; }
  p.imark a {
    display: block;
    width: 42px;
    height: 55px; }

@media only screen and (max-width: 55em) {
  .imark-block {
    display: none; }

  .logo-block {
    display: none; }

  .nav-block {
    clear: both;
    width: 100%;
    margin-top: 1em; } }
@media only screen and (max-width: 30em) {
  h1 {
    font-size: 26px;
    font-size: 1.625rem; } }
/* slideshow */
.slideshow {
  border-top: 1px solid #d6d5d0;
  border-bottom: 1px solid #d6d5d0; }

/** RESET AND LAYOUT
===================================*/
.bx-wrapper {
  position: relative;
  margin: 0 auto 60px;
  padding: 0;
  *zoom: 1; }

.bx-wrapper img {
  max-width: 100%;
  display: block; }

/** THEME
===================================*/
.bx-wrapper .bx-viewport {
  /*	-moz-box-shadow: 0 0 5px #ccc;
  	-webkit-box-shadow: 0 0 5px #ccc;
  	box-shadow: 0 0 5px #ccc;
  	border:  5px solid #fff;
  	left: -5px;*/
  background: #fff;
  /*fix other elements on the page moving (on Chrome)*/
  -webkit-transform: translatez(0);
  -moz-transform: translatez(0);
  -ms-transform: translatez(0);
  -o-transform: translatez(0);
  transform: translatez(0); }

.bx-wrapper .bx-pager,
.bx-wrapper .bx-controls-auto {
  position: absolute;
  bottom: -30px;
  width: 100%; }

/* LOADER */
.bx-wrapper .bx-loading {
  min-height: 50px;
  background: url(images/bx_loader.gif) center center no-repeat #fff;
  height: 100%;
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2000; }

/* PAGER */
.bx-wrapper .bx-pager {
  text-align: center;
  font-size: .85em;
  font-family: Arial;
  font-weight: bold;
  color: #666;
  padding-top: 20px; }

.bx-wrapper .bx-pager .bx-pager-item,
.bx-wrapper .bx-controls-auto .bx-controls-auto-item {
  display: inline-block;
  *zoom: 1;
  *display: inline; }

.bx-wrapper .bx-pager.bx-default-pager a {
  background: #666;
  text-indent: -9999px;
  display: block;
  width: 10px;
  height: 10px;
  margin: 0 5px;
  outline: 0;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px; }

.bx-wrapper .bx-pager.bx-default-pager a:hover,
.bx-wrapper .bx-pager.bx-default-pager a.active {
  background: #000; }

/* DIRECTION CONTROLS (NEXT / PREV) */
.bx-wrapper .bx-prev {
  left: 0px;
  transition: opacity 0.25s ease-in-out; }

.bx-wrapper .bx-next {
  right: 0px;
  transition: opacity 0.25s ease-in-out; }

.bx-wrapper .bx-prev:hover {
  opacity: 0.8; }

.bx-wrapper .bx-next:hover {
  opacity: 0.8; }

.bx-wrapper .bx-controls-direction a {
  position: absolute;
  top: 50%;
  margin-top: -16px;
  outline: 0;
  /*width: 32px;
  height: 32px;*/
  text-indent: -9999px;
  z-index: 9999; }

.bx-wrapper .bx-controls-direction a.disabled {
  display: none; }

/* AUTO CONTROLS (START / STOP) */
.bx-wrapper .bx-controls-auto {
  text-align: center; }

.bx-wrapper .bx-controls-auto .bx-start {
  display: block;
  text-indent: -9999px;
  width: 10px;
  height: 11px;
  outline: 0;
  background: url(images/controls.png) -86px -11px no-repeat;
  margin: 0 3px; }

.bx-wrapper .bx-controls-auto .bx-start:hover,
.bx-wrapper .bx-controls-auto .bx-start.active {
  background-position: -86px 0; }

.bx-wrapper .bx-controls-auto .bx-stop {
  display: block;
  text-indent: -9999px;
  width: 9px;
  height: 11px;
  outline: 0;
  background: url(images/controls.png) -86px -44px no-repeat;
  margin: 0 3px; }

.bx-wrapper .bx-controls-auto .bx-stop:hover,
.bx-wrapper .bx-controls-auto .bx-stop.active {
  background-position: -86px -33px; }

/* PAGER WITH AUTO-CONTROLS HYBRID LAYOUT */
.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-pager {
  text-align: left;
  width: 80%; }

.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-controls-auto {
  right: 0;
  width: 35px; }

/* IMAGE CAPTIONS */
.bx-wrapper .bx-caption {
  position: absolute;
  bottom: 0;
  left: 0;
  background: #666 \9;
  background: rgba(80, 80, 80, 0.75);
  width: 100%; }

.bx-wrapper .bx-caption span {
  color: #fff;
  font-family: Arial;
  display: block;
  font-size: .85em;
  padding: 10px; }

section.eitp-background {
  background-color: #f6f4ef;
  padding: 0; }

.mission {
  padding: 2em 2em 2em 0; }

.history {
  padding: 2em 0 3em 2em;
  border-left: 1px solid #d6d5d0; }

.mission, .history {
  float: left;
  width: 50%; }

@media only screen and (max-width: 30em) {
  .mission, .history {
    float: none;
    width: 100%; }

  .history {
    border: none;
    padding-left: 0; } }
/* upcoming events */
.upcoming-events {
  background-color: #d6d5d0;
  padding: 2em 0; }
  .upcoming-events aside {
    padding-right: 1em;
    width: 30%;
    float: left; }
    .upcoming-events aside h2 {
      font-size: 35px;
      font-size: 2.1875rem;
      color: #ca552d; }
  .upcoming-events article {
    float: left;
    width: 70%;
    padding: 2em; }

@media only screen and (max-width: 55em) {
  .upcoming-events h2 {
    font-size: 30px;
    font-size: 1.875rem; } }
@media only screen and (max-width: 30em) {
  .upcoming-events aside, .upcoming-events article {
    float: none;
    width: 100%;
    padding: 0; }
  .upcoming-events h2 {
    font-size: 30px;
    font-size: 1.875rem; } }
/* news */
.news {
  background-color: #f6f4ef; }
  .news .news-wrap {
    float: left;
    margin-bottom: 2em;
    width: 100%; }

h2 a.button, h2 .primary, h2 .secondary.green, h2 .secondary.orange, h2 .secondary.gray {
  background-color: #d6d5d0;
  color: #575757;
  font-size: 16px;
  font-size: 1rem;
  float: right; }

/*===================================
=            news widget            =
===================================*/
#ws-pa-6096 {
  width: 100%; }
  #ws-pa-6096 #blog-wrapper .topic:last-child {
    margin-right: 0; }
  #ws-pa-6096 .topic {
    width: 18.4%;
    float: left;
    margin-right: 2%;
    background-color: #555555; }
  #ws-pa-6096 #blog-wrapper .topic:nth-child(5n+1) {
    background-color: #49bfcc; }
  #ws-pa-6096 #blog-wrapper .topic:nth-child(5n+2) {
    background-color: #40579f; }
  #ws-pa-6096 #blog-wrapper .topic:nth-child(5n+3) {
    background-color: #d3c928; }
  #ws-pa-6096 #blog-wrapper .topic:nth-child(5n+4) {
    background-color: #e75425; }
  #ws-pa-6096 #blog-wrapper .topic:nth-child(5n+5) {
    background-color: #efaf8e; }
  #ws-pa-6096 .topic-title, #ws-pa-6096 .topic-date {
    font-size: 0.9rem; }
  #ws-pa-6096 .topic-title {
    padding: 1.5em;
    height: 100%; }
  #ws-pa-6096 .topic-title a {
    color: #ffffff;
    line-height: 1.4em;
    height: 100%;
    display: block; }
  #ws-pa-6096 .topic-wrapper {
    position: relative;
    height: 12.5em; }
  #ws-pa-6096 .topic-date {
    padding: 1em 0.5em;
    background-color: #ffffff;
    color: #666666;
    font-weight: 700;
    text-align: center;
    position: absolute;
    bottom: 0;
    width: 100%; }

/*-----  End of news widget  ------*/
.recent-announcements #ws-pa-6096 .topic {
  width: 49%;
  margin-bottom: 1em; }
.recent-announcements #ws-pa-6096 #blog-wrapper .topic:nth-child(2n+0) {
  margin-right: 0; }
.recent-announcements #ws-pa-6096 #blog-wrapper .topic:nth-child(3n+3) {
  margin-right: 2%; }
.recent-announcements #ws-pa-6096 .topic-title {
  font-size: 0.75rem; }

@media only screen and (max-width: 55em) {
  #ws-pa-6096 .topic {
    width: 32%;
    margin-bottom: 1em; }
  #ws-pa-6096 #blog-wrapper .topic {
    margin-right: 2%; }
  #ws-pa-6096 #blog-wrapper .topic:nth-child(3n+3) {
    margin-right: 0; }
  #ws-pa-6096 .topic-title {
    font-size: 0.85rem; }

  .recent-announcements #ws-pa-6096 .topic {
    width: 100%;
    margin-bottom: 1em; }
  .recent-announcements #ws-pa-6096 .topic-title {
    font-size: 0.85rem; } }
@media only screen and (max-width: 30em) {
  #ws-pa-6096 .topic {
    width: 49%; }
  #ws-pa-6096 #blog-wrapper .topic:nth-child(2n+0) {
    margin-right: 0; }
  #ws-pa-6096 #blog-wrapper .topic:nth-child(3n+3) {
    margin-right: 2%; }
  #ws-pa-6096 .topic-title {
    font-size: 0.85rem; } }
/* footer */
footer {
  height: 100px; 
  background-color: #f6f4ef;}
  footer p.copy {
    background-color: #f6f4ef;
    font-size: 14px;
    width: 40%;
    padding: 1.5em 0;
    line-height: 1.5em; }
  footer p {
    background-color: #f6f4ef;
    width: 5.438em;
    height: 100%;
    margin: 0;
    width: 8%; }
    footer p span {
      margin: 1em auto 0 auto; }
  footer .footer-eitp, footer .footer-coe, footer p, footer .button {
    float: left; }
  footer .primary.button {
    background-color: #ca552d;
    line-height: 2.4em;
    font-size: 25px;
    font-size: 1.5625rem;
    width: 15%; }
  footer .button {
    height: 100%;
    background-color: #cf6f35;
    width: 5%;
    min-width: 31px; }
    footer .button span {
      margin-top: 1.4em; }
    footer .button span.fa {
      font-size: 40px;
      margin-top: 0.5em;
      color: white; }

.footer-eitp, .footer-coe {
  height: 100%;
  }

@media only screen and (max-width: 55em) {
  .footer-eitp, .footer-coe {
    width: 50%;
    text-align: center; }
    .footer-eitp span.sprites, .footer-coe span.sprites {
      margin: 0 auto; }

  footer p.copy {
    width: 40%;
    font-size: 20px;
    line-height: 1.4em;
    padding: 1.5em 1em; }

  footer p {
    width: 10%; }

  footer span {
    margin: 0 auto; }

  footer .primary.button {
    width: 24%;
    font-size: 30px;
    font-size: 1.875rem; }

  footer .button {
    width: 8%; } }
@media only screen and (max-width: 30em) {
  .footer-eitp, .footer-coe {
    width: 15%;
    text-align: center; }
    .footer-eitp span.sprites, .footer-coe span.sprites {
      margin: 0 auto; }

  footer p.copy {
    width: 80%;
    font-size: 12px;
    font-size: 0.75rem; }

  footer p {
    width: 20%; }

  footer p span {
    margin-left: auto; }

  footer .primary.button {
    clear: left;
    width: 100%;
    font-size: 40px;
    font-size: 2.5rem; }

  footer .button {
    width: 100%; }
    footer .button span {
      margin-top: 2em; } }
/* global navigation */
.primary-nav li {
  float: left;
  padding: 0 0.5em 0.5em 0;
  width: 25%; }
  .primary-nav li .button {
    width: 100%; }

nav a#menu {
  display: none;
  text-transform: uppercase;
  line-height: 1.6em; }

/* subpage navigation */
aside a#sub-menu {
  display: none;
  line-height: 1.6em;
  color: #ffffff;
  background-color: #cfc83e;
  font-size: 14px;
  font-size: 0.875rem; }

.sub-nav {
  border-top: 2px solid #ca552d;
  padding-top: 1em; }
  .sub-nav li a {
    color: #575757;
    padding: 1em;
    font-size: 12px;
    font-size: 0.75rem;
    display: block;
    line-height: 1.6em;
    transition: background-color 0.25s ease-in-out; }
    .sub-nav li a:hover, .sub-nav li a:focus {
      background-color: #d6d5d0; }

@media only screen and (max-width: 30em) {
  .sub-nav {
    padding-bottom: 1em;
    display: none; }

  aside a#sub-menu {
    display: block;
    width: 100%;
    position: relative;
    padding: 0.5em; } }
@media only screen and (max-width: 55em) {
  .primary-nav li {
    width: 100%;
    float: none;
    padding: 0;
    border-bottom: 1px solid #999999; }

  nav ul {
    display: none;
    height: auto;
    border-top: 1px solid #999999; }

  nav a#menu {
    display: block;
    background-color: #d6d5d0;
    width: 100%;
    position: relative;
    color: #575757;
    padding: 0.5em;
    text-decoration: none; } }
/* page introduction */
.page-intro {
  border-top: 1px solid #d6d5d0;
  border-bottom: 1px solid #d6d5d0; }
  .page-intro aside {
    padding-right: 1em;
    width: 30%;
    float: left; }
  .page-intro article {
    float: left;
    width: 70%;
    padding: 1em 2em; }

.page-intro.resources-page aside {
  width: 20%; }
.page-intro.resources-page article {
  width: 80%; }
  .page-intro.resources-page article p {
    float: left;
    width: 70%;
    padding: 0 5% 0 0; }

.dropdown-wrap {
  float: left;
  width: 30%;
  position: relative; }
  .dropdown-wrap li a {
    font-size: 14px;
    font-size: 0.875rem; }

/* main content of page */
.content {
  background-color: #f6f4ef; }
  .content .sub-nav li {
    list-style-type: none; }
  .content header {
    background-color: #ca552d;
    position: relative;
    float: left;
    padding: 0;
    width: 100%;
    margin-bottom: 2em; }
    .content header img {
      float: left;
      width: 65%; }
    .content header div {
      float: left;
      width: 35%;
      position: absolute;
      bottom: 0;
      right: 0; }
      .content header div h3 {
        color: #ffffff;
        font-size: 18px;
        font-size: 1.125rem;
        padding: 1em;
        margin: 0; }
  .content aside {
    padding-right: 1em;
    width: 30%;
    float: left; }
    .content aside ul li.title {
      font-family: "Source Sans Pro", sans-serif;
      margin-top: 1em; }
  .content article.full {
    width: 100%; }
  .content article {
    float: left;
    width: 70%;
    padding: 0 2em; }
    .content article h2, .content article h3, .content article h4, .content article h5, .content article h6 {
      color: #ca552d;
      margin-bottom: 0; }
    .content article ul {
      margin-left: 1.25em; }
      .content article ul li {
        list-style-type: disc; }
    .content article ol {
      margin-left: 1.25em; }
      .content article ol li {
        list-style-type: decimal; }
    .content article table {
      border-collapse: collapse;
      border: 1px solid #999999;
      width: 100%; }
      .content article table td, .content article table th {
        padding: 1.25em;
        border: 1px solid #999999; }
      .content article table th {
        font-family: "Source Sans Pro", sans-serif; }
      .content article table tr {
        border-bottom: 1px solid #999999; }

.gsc-above-wrapper-area, .gsc-resultsHeader, .gcsc-branding {
  display: none !important; }

.content.resources-page {
  background-color: #d6d5d0; }

#ws-pa #edu-il #blog-wrapper #blog-content #blog-functions {
  display: none; }

.blog-post-list-row.blog-post-header-row.blog-posts-wrapper-items, div.blog-post-view-total {
  display: none; }

#blog-footer {
  display: none; }

.content #ws-pa #edu-il #blog-wrapper #blog-content.blog-content-full-width #blog-posts .blog-post-list-row .blog-post-title {
  width: 75%; }

.content #ws-pa #edu-il #blog-wrapper #blog-content #blog-posts .blog-post-list-row .blog-post-date {
  width: 25%;
  font-size: 1.3rem;
  line-height: 6px;
  margin: 1em 0 0 0; }

@media only screen and (max-width: 30em) {
  .content #ws-pa #edu-il #blog-wrapper #blog-content.blog-content-full-width #blog-posts .blog-post-list-row .blog-post-title {
    width: 50%; }

  .content #ws-pa #edu-il #blog-wrapper #blog-content #blog-posts .blog-post-list-row .blog-post-date {
    width: 50%; }

  .content aside, .content article, .page-intro aside, .page-intro article {
    float: none;
    width: 100%;
    padding: 0; } }
/*========================================
=            resources widget            =
========================================*/
#ws-pa-6039 #blog-wrapper .topic:nth-child(4n+4) {
  margin-right: 0; }
#ws-pa-6039 .topic {
  width: 23.5%;
  float: left;
  margin-right: 2%;
  background-color: #f6f4ef;
  padding: 3em 1.5em 1.5em 1.5em;
  margin-bottom: 2%;
  position: relative; }
#ws-pa-6039 .topic-title {
  line-height: 1.4em;
  margin-bottom: 0.7em; }
#ws-pa-6039 .topic-summary p {
  font-size: 13px;
  font-size: 0.8125rem;
  line-height: 1.2em; }
#ws-pa-6039 .topic-wrapper {
  height: 10em; }
#ws-pa-6039 .topic-title > a {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  padding: 1.5em 0 0 1.5em; }

#resources-dropdown {
  position: absolute;
  top: 31px;
  z-index: 50; }
  #resources-dropdown #ws-pa-6039 .topic {
    width: 100%;
    margin: 0;
    padding: 0; }
  #resources-dropdown #ws-pa-6039 .topic-title {
    margin-bottom: 0; }
    #resources-dropdown #ws-pa-6039 .topic-title a {
      font-size: 14px;
      font-size: 0.875rem;
      display: block;
      padding: 0.5em 1em;
      transition: background-color 0.25s ease-in-out;
      position: static; }
      #resources-dropdown #ws-pa-6039 .topic-title a:hover {
        background-color: #d6d5d0; }
  #resources-dropdown #ws-pa-6039 .topic-wrapper {
    height: auto; }

/*-----  End of resources widget  ------*/
p#menu-title {
  background-color: #d6d5d0;
  font-size: 12px;
  font-size: 0.75rem;
  text-align: left;
  margin: 0;
  width: 100%;
  padding: 0.25em 20% 0.25em 0.5em;
  position: relative; }
  p#menu-title:hover {
    cursor: pointer; }
  p#menu-title span.arrow-wrap {
    position: absolute;
    top: 0;
    right: 0;
    height: 100%;
    background-color: #ca552d;
    width: 15%; }
    p#menu-title span.arrow-wrap span.arrow {
      height: 0;
      width: 0;
      display: block;
      border-left: 10px solid transparent;
      border-right: 10px solid transparent;
      border-top: 10px solid #ffffff;
      position: absolute;
      top: 50%;
      left: 50%;
      margin-top: -5px;
      margin-left: -9px; }

@media only screen and (max-width: 51em) {
  .page-intro.resources-page article p {
    width: 100%;
    padding: 0; }
  .page-intro.resources-page article .dropdown-wrap {
    width: 100%;
    float: right;
    clear: both; }

  #resources-dropdown #ws-pa-6039 .topic-title a {
    font-size: 100%; }

  p#menu-title {
    font-size: 100%; }
    p#menu-title span.arrow-wrap span.arrow {
      border-left: 7px solid transparent;
      border-right: 7px solid transparent;
      border-top: 7px solid #ffffff;
      margin-top: -3px;
      margin-left: -7px; }

  #ws-pa-6039 #blog-wrapper .topic:nth-child(3n+3) {
    margin-right: 0; }
  #ws-pa-6039 #blog-wrapper .topic:nth-child(4n+4) {
    margin-right: 2%; }
  #ws-pa-6039 .topic {
    width: 32%; }
  #ws-pa-6039 .topic-summary p {
    font-size: 13px;
    font-size: 0.8125rem; } }
@media only screen and (max-width: 30em) {
  .page-intro.resources-page aside {
    width: 100%; }
  .page-intro.resources-page article {
    width: 100%; }
    .page-intro.resources-page article p {
      width: 100%;
      padding: 0; }
    .page-intro.resources-page article .dropdown-wrap {
      width: 100%;
      float: right; }

  p#menu-title {
    text-align: left; }
    p#menu-title span.arrow-wrap span.arrow {
      border-left: 7px solid transparent;
      border-right: 7px solid transparent;
      border-top: 7px solid #ffffff;
      margin-top: -3px;
      margin-left: -7px; }

  #ws-pa-6039 #blog-wrapper .topic:nth-child(3n+3) {
    margin-right: 2%; }
  #ws-pa-6039 #blog-wrapper .topic:nth-child(4n+4) {
    margin-right: 2%; }
  #ws-pa-6039 #blog-wrapper .topic:nth-child(2n+0) {
    margin-right: 0; }
  #ws-pa-6039 .topic {
    width: 49%; }
  #ws-pa-6039 .topic-summary p {
    font-size: 13px;
    font-size: 0.8125rem; } }
/* searches */
#div.blog-search {
  display: none; }

.collapsible {
  background-color: #eee;
  color: #444;
  cursor: pointer;
  padding: 18px;
  width: 100%;
  border: none;
  text-align: left;
  outline: none;
  font-size: 15px;
}

/* Add a background color to the button if it is clicked on (add the .active class with JS), and when you move the mouse over it (hover) */
.active, .collapsible:hover {
  background-color: #ccc;
}