@charset "UTF-8";
/* CSS Document */
 body {
	 background-color:#333;
	 font-family:Roboto;
	 font-weight:400;
}
 ul.news {
	 list-style-type:none;
	 margin:0;
	 padding:0;
}
 ul.news li {
	 text-transform: uppercase;
	 font-size: 14px;
	 padding: 7px;
	 line-height: 20px;
	 letter-spacing: 1px;
	 display:inline-block;
}
 ul.news.li a {
	 text-decoration:none;
}
 ul.news li .news-img {
	 height: 65px !important;
	 width: 65px !important;
	 float: left;
	 overflow:hidden;
	 margin-right:10px;
}
 ul.news li .news-img > img {
	 display:block;
	 position:relative;
	 width:auto !important;
	 min-height: 100px !important;
	 min-width: 100% !important;
	 object-fit: cover;
	 position:relative;
	 top:-25%;
}
 .blue {
	 background-color: #214659;
}
 .blue .section, .darkgray .section, .gray .section, .link-maroon .section, .maroon .section {
	 color: #FFF;
}
 .smaller {
	 font-size: 12px !important;
	 line-height: 16px !important;
}
 #nav-collapse ul#main, #nav-wrapper, div.logo {
	 background-color: #560000;
}
 .department {
	 height:auto;
	 color:#fff65;
	 padding: 7px 10px 10px 60px;
	 background-color:rgba(51, 0, 0, 0.55);
}
 .department h2, .department h2 a {
	 color:#fff;
	 text-transform: none;
	 font-weight:normal;
}
 .department h2.smaller{
     display:none;
}
 .department a {
	 color:#fff;
}
 .department h3 {
	 float:right;
}
 .department h3 a {
	 width: auto;
	 text-align: right;
	 font-size: 30px;
	 background-color: rgba(255, 255, 255, 0.3);
	 padding: 10px;
	 font-weight: 100;
}
.socialmedial a {
    padding-right: 0.5em;
}
 .department ul {
	 float:right;
	 margin-right: 15px;
	 font-size:16px;
	 margin-bottom: 0;
}
 .department ul li {
	 float: left;
	 margin-left:30px;
}
 .secondary-heading-wrapper {
	 clear: both;
	 display: block;
	 min-height: 115px;
}
 .program-contact {
	 color: #fff;
	 font-family: Roboto;
	 font-weight: 400;
	 float: right;
	 text-align: right;
	 margin-right: 51px;
}
 .program-contact a {
	 color:#fff;
}
 h2.bigger.secondary-heading {
	 color:#fff;
	 font-family:Roboto;
	 font-weight: 100;
	 text-transform:none;
}
 .secondary-heading-wrapper .bigger.secondary-heading {
	 float: left;
}
 #maininside h2, #maininside h3 {
	 font-family: "Roboto",sans-serif;
	 font-weight: 400;
	 text-transform:none;
}
 #maininside h2{
	 font-size:150%;
	 line-height:150%;
}
 #maininside h3 {
	 font-size:130%;
	 line-height:130%;
}
 #maininside h4, #maininside h5, #maininside h6 {
	 font-size:125%;
	 line-height:125%;
	 font-weight: 100;
}
 #maininside h2 a, #maininside h3 a, #maininside h4 a, #maininside h5 a, #maininside h6 a {
	 font-family: "Roboto",sans-serif;
	 font-weight: 400;
	 text-transform:none;
}
 #tac-nav-wrapper {
	 background-color: #fff;
}
 .secondary-wrapper {
	 background-color:#fff;
	 margin: 10px auto 0 auto !important;
}
 .video {
	 background-color: black;
	 margin:auto 0;
	 width: 100%;
	 display:block;
	 height:20vh;
	 min-height:500px;
}
 .video iframe {
	 height:101%;
	 width:100%;
	 top: 0;
	 margin-top:-4px;
}
/*requirements table styles*/
 #scroll-table td.total-req {
	 border-left:1px dotted #999;
	 font-weight:bold;
}
 #scroll-table tr.total, td.total {
	 background-color:#DAD6CB !important;
	 font-weight:bold;
}
 #scroll-table tr.first-level {
	 background-color:#EEEDE7 !important;
	 border-bottom:1px solid #999 !important;
	 border-top:1px solid #999 !important;
}
 #scroll-table tr.first-level td {
	 border-bottom:1px solid #999 !important;
}
 #scroll-table tr.second-level {
	 background-color:#fbf9f3 !important;
}
 #scroll-table tr.second-level td:nth-child(2) {
	 border-left:1px dotted #999;
	 font-weight:bold;
}
 #scroll-table tr.third-level {
	 background-color: #FFF !important;
}
 #scroll-table tr.third-level td {
	 font-size:12px;
}
 #scroll-table .third-level > td:nth-child(3) {
	 border-left: 1px dotted #ddd;
	 font-weight: bold;
}
/*end requirements table styles*/
/*people listings*/
 div.person .col {
	 margin: 0 !important;
	 padding-bottom: 0;
	 padding-top: 0;
}
 div.person .col > h2 {
	 background-color: rgba(33, 70, 89, 0.35);
	 color: rgba(33, 70, 89) !important;
	 padding: 7px 12px !important;
	 margin:0 !important;
	 font-weight:400 !important;
}
 div.person .col h2 .person-name {
	 font-size: 1.2em;
}
 div.person .col > h2 a::after {
	 content: " »";
}
 div.person .col > h3, div.person .col > h4, div.person .col > h5, div.person .col > h6, div.person .col > p, div.person .col > ol, div.person .col > ul {
	 padding-left:12px;
}
 .span_8_of_12.person-bio > h3 {
	 font-weight: 400 !important;
}
 .span_3_of_12.person-contact.white {
	 padding-top: 0 !important;
}
/*end people listings*/
/*events list*/
 .event {
	 display: inline-block;
	 margin-bottom: 7px;
	 width: 100%;
	 -webkit-box-shadow: 5px 5px 10px 0px rgba(0,0,0,0.11);
	 -moz-box-shadow: 5px 5px 10px 0px rgba(0,0,0,0.11);
	 box-shadow: 5px 5px 10px 0px rgba(0,0,0,0.11);
	 border: 1px solid #F2F1ED;
	 box-sizing: border-box;
	 -moz-box-sizing: border-box;
	 background-color: #FFF;
	 color:#333;
}
 .event h2, .event h2 a {
	 color:#246181 !important;
}
 .event:nth-child(odd) {
	 background-color: #F2F1ED;
}
 .event-img {
	 max-width: 150px !important;
	 float: right;
	 padding-left:20px;
	 padding-bottom:20px;
}
 .span_3_of_12 .event-img {
	 float: none;
}
 .col.span_2_of_12.date-card {
	 padding: 5px 10%;
	 text-align: center;
	 width: 80% !important;
	 background-color: rgba(255,255,255,1);
	 border-bottom:1px solid #E0E0E0;
}
 .col.span_2_of_12.date-card .day-of-month {
	 font-weight:bold;
}
 .col.span_2_of_12.date-card .day-of-week {
}
 .col.span_12_of_12 .event .col.span_2_of_12.date-card {
	 text-align: center;
	 box-sizing: border-box;
	 -moz-box-sizing: border-box;
	 padding: 26px 10px;
	 border-radius:5px;
	 width:100%;
	 background-color:#660000;
	 color:#FFF;
}
 .col.span_12_of_12 .event .col.span_2_of_12.date-card .day-of-month {
	 text-transform: uppercase;
	 font-size: 20px;
	 float:none;
}
 .col.span_12_of_12 .event .col.span_2_of_12.date-card .day-of-week {
	 text-transform: uppercase;
	 font-weight: 400;
	 font-size: 28px;
	 display:block;
	 float:none;
}
 .col.span_12_of_12 .event .col.span_10_of_12.event-details {
	 width:77.16%;
}
 .col.span_10_of_12.event-details {
	 width:92%;
}
 .full-date, .location {
	 padding:0;
	 margin:0;
}
 p.event-description {
	 font-size: 14px !important;
	 line-height: 22px !important;
}
 .apply-flag {
	 position: fixed;
	 display:block;
	 z-index:10000;
	 width:120px;
	 bottom:8%;
	 right: 50px;
	 -webkit-transform: skewX(-25deg);
	 transform: skewX(-25deg);
}
 .apply-flag a {
	 color:#333333;
	 background-color: #FFA800;
	 text-decoration:none;
	 display:block;
	 font-family: roboto condensed;
	 font-weight: bold;
	 text-transform: uppercase;
	 font-size: 30px;
	 position:relative;
	 z-index: 100000 !important;
	 -webkit-box-shadow: 4px 4px 6px 1px rgba(0,0,0,0.2) ;
	 box-shadow: 4px 4px 6px 1px rgba(0,0,0,0.2) ;
	 transition: all .2s ease-in-out;
	 text-align:center;
	 padding: 20px 200px 20px 50px;
}
 .apply-flag a:hover {
	 padding-left: 40px;
	 margin-left: -10px;
}
 .apply-flag a span.apply-text {
	 -webkit-transform: skewX(25deg);
	 transform: skewX(25deg);
	 display:block;
}
 .wpcc-banner.wpcc-bottom {
	 left: 20% !important;
}

@media all and (max-width: 768px) {
    .wpcc-banner.wpcc-bottom {
	 bottom: 15% !important;
}
}
/* start news styles*/
#news{margin:3em;}
#news a{color:#660000 !important;}
#news a:hover{color:#560000 !important;}
#news a:visited{color:#333333 !important;}
#news p.date{font-style: italic;}
/* end news styles*/

/*Start CTA styling*/
 .cta{
	 background-image: url(https://asset.siu.edu/_assets/2015-primary/css/paw.png);
	 background-repeat: no-repeat;
	 background-position: 200px 100px;
	 padding-top: 2em;
}
 ul.no-bullet{
	 list-style-type: none;
	 padding: .25em 0 0 1em;
}
 ul.no-bullet li{
	 padding-left: 50px;
	 font-size:20px;
	 height: 40px;
	 margin-left: -.25em;
	 vertical-align: middle;
	 padding-top: .25em;
	 list-style: none;
}
 li.check {
	 background: url('https://asset.siu.edu/_assets/2015-primary/css/check-mark.png') no-repeat left top;
}
 li.dollar {
	 background: url('https://asset.siu.edu/_assets/2015-primary/css/dollar-sign.png') no-repeat left top;
}
 li.globe {
	 background: url('https://asset.siu.edu/_assets/2015-primary/css/globe.png') no-repeat left top;
}
 li.info {
	 background: url('https://asset.siu.edu/_assets/2015-primary/css/information.png') no-repeat left top;
}
 li.ticket {
	 background: url('https://asset.siu.edu/_assets/2015-primary/css/ticket-icon-cta.png') no-repeat left top;
}
 p.yellowbtn {
	 display: inline-block;
	 margin:-1em 1em 0 1em !important;
}
 p.yellowbtn a {
	 border: 1px solid #fa0;
	 padding:5px 10px !important;
	 text-decoration: none !important;
	 display: inline-block;
	 width:100px;
}
 p.yellowbtn a:hover{
	 text-decoration: underline;
	 background-color:#660000;
}
/*end CTA*/
 @media all and (max-width: 960px) {
	 .apply-flag {
		 position: fixed;
		 display:block;
		 z-index:10000;
		 width:100%;
		 bottom:0;
		 right: 0;
		 -webkit-transform: skewX(0);
		 transform: skewX(0);
	}
	 .apply-flag a {
		 padding: 15px 50px 20px 50px;
	}
	 .apply-flag a:hover {
		 padding-left: 50px;
		 margin-left: 0;
	}
	 .apply-flag a span.apply-text {
		 -webkit-transform: skewX(0);
		 transform: skewX(0);
		 display:block;
	}
}
 @media all and (min-width: 450px) {
	 #popout-nav {
		 top:80px;
	}
	 #maininside .span_3_of_12.person-contact.white > img {
		 float: left;
		 max-width: 200px !important;
		 padding-bottom: 20px;
		 padding-right: 20px;
	}
	 .department h2.smaller {
		 margin-right:15px;
	}
	 .department h3 a {
		 margin-right:15px;
	}
	 .secondary-wrapper .breadcrumbs ul {
		 margin-top: -10px !important;
		 padding-top: .25em !important;
	}
}
 @media all and (min-width: 769px) {
	/*.apply-flag {
		 top: 48vw;
	}
	 */
	 @keyframes zoomIn {
		 0% {
			 transform: scale(.75);
		}
		 100% {
			 transform: scale(1);
		}
	}
	 ul.main-four {
		/* This section calls the zoomIn animation we defined above */
		 animation: 500ms ease-out 0s 1 zoomIn;
	}
	 #popout-nav {
		 top: 75px;
	}
	 .department {
		 margin-top: auto;
		 height:auto;
		 display:inline-block;
		 float:none;
	}
	 .department h2 {
		 float: right;
		 margin-left: auto;
		 margin-right:15px;
		 margin-bottom:0;
		 text-align: right;
		 width: 90%;
		 text-transform:none;
		 color:#ffffff;
		 font-size: 32px;
	}
	 .department p {
		 float:right;
		 line-height:28px;
		 padding-top:7px;
		 text-align:right;
		 width:90%;
		 color:#ffffff;
		 margin-right:15px;
	}
	 .department p a {
		 color:#ffffff;
	}
	 .col.span_12_of_12 > p, .col.span_12_of_12 > ol, .col.span_12_of_12 > ul, .col.span_12_of_12 > table, .col.span_12_of_12 > form {
		 font-size:18px !important;
		 line-height:32px !important;
		 padding: 0 100px;
	}
	 .col.span_12_of_12 > ol, .col.span_12_of_12 > ul {
		 padding:0 15px;
	}
	 .col.span_12_of_12 > table {
		 width:85%;
	}
	 .legacy-sidebar.section.group.span_3_of_12 .col.span_12_of_12 p {
		 padding:0px;
	}
	 ul.main-four {
		 margin-right:0;
		 max-width:600px;
	}
	 ul.main-four li {
		 display:inline-block;
		 margin:7px 0 7px 7px;
	}
	 #maininside .span_3_of_12.person-contact.white > img {
		 float: none;
		 max-width: 100% !important;
		 width: 100% !important;
		 padding-bottom: 0;
		 padding-right: 0;
	}
	 .col.span_12_of_12 .event .col.span_2_of_12.date-card {
		 margin-top: 40px;
		 margin-left: 29px;
		 width:11.83% !important;
	}
	 .span_3_of_12 .col.span_2_of_12.date-card, .span_4_of_12 .col.span_2_of_12.date-card, .span_5_of_12 .col.span_2_of_12.date-card {
		 width:100%;
		 margin:0;
	}
}
 @media all and (min-width: 960px) {
	 #popout-nav {
		 top:141px;
	}
	 header.bannerinside.secondary nav {
		 height: 141px;
	}
	 .department.mod {
		 width: 96%;
		 position: relative;
	}
	 .department {
		/*width:auto;
		 */
		 padding: 20px 2% 18px;
		 position:absolute;
		 right:0;
	}
	 .static-photo, div.home-wrapper .slideshow {
		 margin-top:-10px;
	}
	 ul.main-four {
		 margin-top:0;
		 padding-top:138px;
	}
}
 @media all and (min-width: 1190px) {
	/*.apply-flag {
		 top: 41vw;
	}
	 */
	 .department h2 a {
		 font-size:32px;
	}
	 ul.main-four li a {
		 padding: 12px 20px;
		 font-size:24px;
	}
	 ul.main-four {
		 max-width:750px;
	}
}
/* Kelly adds 1-30-20 @media all and (max-width: 768px) {
	 .department {
		 margin-top: auto;
		 height:150px;
		 float:none;
	}
	 */
	 @media all and (max-width: 960px){
		 .department-inner {
			 margin-top:1em;
			 height:80px;
			 float:none;
		}
		 .program-contact{
			 clear:both;
		}
	}
	 @media all and (max-width:449px){
		 .department-inner h2.smaller {
			 display:none;
		}
	}
	 @media all and (max-width: 768px){
		 .department-inner p{
			 margin-top:.75em;
		}
	}
	/* makes video not have black box on sides when in mobile view */
	 @media all and (max-width:450px){
		 .video{
			 min-height:200px;
		}
	}
	 .video{
		 background-color:transparent !important;
	}
	/* -----this puts h2 and h3 on same line --------*/
	 .department-inner h2 {
		 display:inline;
		 float:right;
	}
	 .department-inner h3{
		 display:inline;
		 float:none;
	}
	 .department-inner{
		 text-align:right;
	}
	/*---------changes to h3 and program-contact--------*/
	 @media all and (min-width: 450px){
		 .department-inner p{
			 margin-right:15px;
		}
	}
	/*------fixes weird space to the right------------*/
	 @media all and (min-width: 769px) and (max-width:834px){
		 .department{
			 width:91% !important;
		}
	}
	/*-------gives top of video more margin ------------*/
	 @media all and (min-width:1100px){
		 .video iframe{
			 margin-top:0 !important;
		}
	}
	 .bannerinside.secondary .department .department-inner h2 {
		 padding-right: 15px;
	}
	 .bannerinside.secondary .department.mod .department-inner p.program-contact {
		 margin-right: 15px;
	}
	 @media(max-width: 960px) {
		 .bannerinside.secondary .department .department-inner ul.contact {
			 clear: both;
		}
	}
	 .bannerinside.secondary .department.mod .department-inner .program-heading h2.smaller {
		 display: none;
		 float:none;
	}
	 @media (max-width: 767px) {
		 .bannerinside.secondary .department.mod .department-inner .program-heading h2.smaller a, .bannerinside.secondary .department.mod .department-inner .program-heading h3 a {
			 font-size: 18px;
		}
		 .bannerinside.secondary .department.mod .department-inner .program-contact {
			 font-size: 16px;
		}
	}
	 @media (max-width: 449px) {
		 .bannerinside.secondary .department.mod .department-inner .program-heading h2.smaller {
			 display: none;
		}
		 .bannerinside.secondary .department.mod .department-inner .program-heading h3 a {
			 margin-right: 15px;
			 font-size:26px;
		}
	}
	/* -----kelly adds 5/2021-------*/
	 @media all and (max-width: 960px){
		 .department-inner h3{
			 display:inline-block;
		}
	}
	 @media all and (max-width: 768px){
		 .department {
			 padding: 7px 20px 120px 60px;
		}
	}
	 @media all and (max-width: 420px){
		 .department h3 a {
			 background-color:rgba(255, 255, 255, 0);
		}
	}
	 @media all and (max-width: 420px){
		 .bannerinside.secondary .department.mod .department-inner .program-heading h3 a{
			 margin-right: 0px;
			 font-size:26px;
		}
	}
	 @media all and (max-width: 420px){
		 .bannerinside.secondary .department.mod .department-inner p.program-contact{
			 margin-right: 0px;
		}
	}
	 @media all and (max-width: 420px){
		 .socialmedial {
			 display:block;
		}
	}
	 @media all and (max-width: 420px){
		 .socialmedial a{
			 font-size: 36px;
			 padding-left: .5em;
		}
	}
	 @media all and (max-width:420px){
		 .bar{
			 display:none;
		}
	}
	
		/*hiding images on pages*/
	 @media screen and (max-width:420px){
	    .nomobileimage{
			 display:none !important;
		}
	}

/*hiding breadcrumbs, phone number,social icons and reducing padding on mobile*/

@media screen and (max-width:770px){
.secondary-wrapper .breadcrumbs{
    display:none;
}
}
@media screen and (max-width:770px){
.program-contact{
    display:none;
}
} 
@media screen and (max-width:770px){
.department.mod{
    padding-bottom:.5em;
}
}

 @media all and (max-width: 770px) {
	 #maininside .span_12_of_12 h2.page-title.bigger {
		 padding-top: 0.5em;
	}
}

@media all and (max-width: 770px) {
 .secondary-wrapper {
	 margin: 0px auto 0 auto !important;
}
}
@media all and (max-width: 500px) {
#maininside .span_12_of_12 h2.page-title.bigger {
    font-size:30px !important;
}
}
.video.flex-banner  iframe.vimeo {
    height: 100%;
}
 
 .quickest-links {
  list-style: none !important;
  display: flex;
  justify-content: center;
  padding: 1em 1.5em !important;
  background-color: #f3f3f3;
}

.quickest-links a {
  text-decoration: none !important;
}

.quickest-links > li:first-child {
  font-weight: bolder;
  margin-right: 0.75em;
}
.quickest-links :not(:last-child) a:after {
  content: "\002F";
  padding-left: 0.5em;
  padding-right: 0.5em;
  cursor: none;
  font-weight: bolder;
}

@media (max-width: 40em) {
  .quickest-links {
    display: flex;
    flex-direction: column;
  }

  .quickest-links :not(:last-child) a:after {
    content: "";
  }
}