@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;1,300;1,400;1,500;1,600;1,700;1,800&display=swap');

/* @import url("https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300;0,400;0,600;0,800;1,400;1,600"); */

/* @import url("https://fonts.googleapis.com/css?family=Open+Sans:300,400,400italic,700"); */

/******************************************
  BHCC general styles
*******************************************/

* { 
  font-family: 'Open Sans', arial, sans-serif;
  -webkit-box-sizing: border-box; 
  box-sizing: border-box;
  text-underline-offset: 2px;  
}
html   { height: 100%; font-family: 'Open Sans', arial, sans-serif; }
html a { 
  color: #0047C7;    /* More accessible than #0066cc and #0050C9 */ 
  text-decoration: none;
  background-color: transparent;
}

a:hover {
    color: #0066cc;
    text-decoration: underline;
    text-underline-offset: 2px;
}
a:focus {
  color: #408;
  outline: 1px solid #ddd; 
  text-decoration: underline; 
  text-underline-position: under;
}

body    { 
  height: 100%; 
  overflow-x: hidden; 
  font-size: 18px; 
  margin:0; 
  line-height:1.8em; 
  word-break: break-word;
  background-color: #fff; 
  color:transparent;
}
#page {
  line-height:1.8em;  
  
}


@media (min-width: 1550px) {
  body { font-size: 18px; }
}
@media (min-width: 1550px) {
  body { font-size: 18px; }
}
@media (min-width: 1800px) {
  body { font-size: 18px; }
}
@media (min-width: 2100px) {
  body { font-size: 19px; }
}




/******************************************
  This code is to use flexbox to create 
     A sticky footer
*******************************************/
@media (min-width: 1023px) {
  body {
       display: -webkit-box;
	   display: -moz-box;
	   display: -ms-flexbox;
	   display: -webkit-flex;  
       display: flex;
       flex-direction: column;
  }
  #page { 
     -webkit-box-flex:  1;
     -webkit-flex:  1 0 auto;
     -ms-flex:  1 0 auto;
     flex: 1 0 auto; 
  }
  footer.footer, #footer-2022 {
     flex-shrink: 0; 
     margin-top: 0;
  }  
}


#page { 
  padding-bottom: 2em; 
  background-color: #ffffff; 
  top: 0;
  color: #000;
  word-break: normal;
}

@media only screen and (max-width: 767px) {
   #page { padding-bottom: 0; top:0}
  .mm-opened.mm-blocking #page {top:0;}
}


/*************************************************
    ACCESSIBILITY for screen readers 
  We use Bootstrap-style .sr-only .sr-only-focusable classes for accessibility links 
************************************************/
a.sr-only {
    border: 0;
    clip: rect(0,0,0,0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}
a.sr-only:focus {    outline:  transparent thin solid; }
a.sr-only-focusable {
    background-color:blue;
    font-weight:bold;
    color: #fff;
    padding: 6px;
    z-index: 100; 
    transition: top 1s ease-out, background 1s linear;
    max-width: 200px;
}
a.sr-only-focusable:hover { color:#fff; }

@media (max-width: 991px) {
  
    #skip-links { position: relative; }
   .sr-only-focusable:active, .sr-only-focusable:focus {
      position: absolute;
      top: 50px;
      width: auto;
      height: auto;
      margin: 0;
      overflow: visible;
      clip: auto;
      padding:5px;
      color: #fff;
     } 
}



p { margin:0 0 10px; }

b, strong {font-weight:700;}

main, article, aside, details, figcaption, figure, footer, header, hgroup, nav, section {  display: block;}
figure {margin:0;}

iframe {  border: 0;  max-width: 100%;}
img {  max-width: 100%;  height: auto !important;}

input { caret-color:#b60000;}
ul, ol { margin-top:0; margin-bottom: 10px; }
label  { max-width:100%; font-weight:normal;}

caption {color:#000;}
.text-50-percent-larger { font-size:120%; line-height:1.8em;}

/**********************************************
       HTML HEADERS 
***********************************************/
h1 {  font-size: 2em; margin-bottom: 10px; margin-top:20px; font-weight:normal; line-height:1.5em; }
h1.h2-style {  font-size: 2em;  color: #b60000; line-height: 1.6em; }
h2 {  font-size: 1.5em;  color: #b60000; line-height: 1.5em;  margin-bottom: 10px; margin-top: 0; font-weight:normal;
  	padding-top: 10px;
    padding-bottom: 10px; }
h3 {  font-size: 1.19em; margin-bottom: 10px;padding-top: 10px; line-height:1.5em;
    padding-bottom: 10px;}
h4 {  font-size: 1.12em;padding-top: 10px; line-height:1.5em;
    padding-bottom: 10px; }

@media (min-width: 768px) and (max-width: 991px) {
  h1 { margin-top: 15px; }
}

@media (max-width: 767px) {
  h1 {
     font-size: 1.7em;
     margin-top: 15px;
     line-height: 1.6em;
  }

  /* Department Pages:  Hide H1, but leave it visible for screen readers  */
  h1.banner-title {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0,0,0,0);
    border:0;
  } 
 
  h1.h2-style  { font-size: 1.5em; color: #b60000; }
  h2 { font-size: 1.4em; color: #b60000; }
  h3 { font-size: 1.12em; font-weight:600; }
  h3.top-title-for-nav { display:none; }
  h4 { font-size: 1em;  }
}

hr { display:block; margin:10px auto; border-style:solid; border-color: #bbb; }

/* This is to keep email links from overflowing */
a[href^="mailto:"] {    word-wrap: break-word; }


/******************************************
    BREADCRUMBS
******************************************/ 
.bread-crumbs { font-size:0.8em; text-align:left; line-height: 2rem; }
.bread-crumbs ol { list-style:none; padding:0; }
.bread-crumbs ol li { display:inline; }
.bread-crumbs ol li + li:before { content: "\00bb"; margin:0 3px 0 4px;color:#b60000; }
.bread-crumbs a {  color: #000; }

@media (max-width: 991px) {
  .bread-crumbs { position:relative; float:none; margin:0 15px; padding:0; }
}

@media (max-width: 767px) {
  .bread-crumbs { display: none; }
}

/******************************************
    STRUCTURE with BOOTSTRAP Overrides.
******************************************/
.flex-container {  display: flex;   flex-wrap: wrap; flex-direction: row; }
    
   

.container {  margin: 0 auto; padding-left:15px; padding-right:15px; }
.container:before, .container:after { display: table; content:" "; }
.row {  margin-right: 15px;  margin-left: 15px;}

@media (max-width: 450px) { 
   .container { padding-left:0; padding-right:0; }
}

@media (max-width: 768px){ 
  .left-left { display:none; }
}

@media (max-width: 1449px){
  .container {  width: 100%; }
}

/*   REVERSE RESPONSIVE */
@media (min-width: 1450px){
 
  .container {  width: 1400px; padding:0; margin:0 auto; }
  #main-content.col-sm-9 {    width: calc(100% - 300px);     margin: 0 auto;   }
  #main-content.col-sm-6 {    width: calc(100% - 600px);     margin: 0 auto;   }
}

@media (min-width: 1650px){
  .container {    width:90%; }
}
@media (min-width: 2200px){
  .container {    width:1900px; }
}

@media (max-width:450px) {
   .row {margin:0;} /* Get rid of negative margins in smartphone view  */ 
}

@media (min-width:768px) {
    .col-sm-3 { width:25%; float:left; position:relative; padding-right:15px; padding-left:15px; max-width:300px; }
    .col-sm-9 { width:75%; float:left; position:relative; padding-right:15px; padding-left:15px; }
}
@media (max-width:767px) {

  .col-sm-3, .col-sm-9 { 
      width:100%; 
      float:none; 
      position:relative; 
      padding-right:15px; 
      padding-left:15px; 
      max-width:unset; 
  }

}


.content-block { margin-bottom: 2em;  margin-top: 0; }
.content-block li { padding:3px 0; }
.content-item  { margin-bottom: 2em; }

@media (max-width: 991px) {  
  .content-block { margin-top: 4em; }
}

.content { min-height: 10em;}



/******************************************
     Desktop Header
*******************************************/

#desktop-header, #header { clear: both; }
#desktop-header { height:162px; }

#desktop-header .logo a img, #header .logo a img {
  padding: 1em;
  margin-left: -2em;
  border: none;
}

.logo { width:25%; float:left; padding:0 15px; }
.desktop-header-right { 
    height: 162px;
    width: 72%; 
    float:right; 
    padding:0 15px;
    position: relative;
}

/* Desktop Search */
#desktop-header-search { 
   width:400px; 
   padding:0 15px; 
   position: absolute;
   bottom: 20px;
   right: 0;

}
#desktop-header-search .input-group { width:90%; position:relative; display:table; border-collapse:separate; }
#desktop-header-search #searchInput { 
  display: table-cell; 
  position: relative;
  font-size:1em;
  letter-spacing: 1px;
  z-index: 2;
  float: left;
  width: 300px;
  margin: 0;
  height: 40px;
  padding: 6px 12px;
  line-height: 1.5em;
  color: #000;
  background-color: #fff;
  background-image: none;
  border: 1px solid #ccc;
  box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
  transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}
#desktop-header-search #searchInput:focus { 
  border-color: #66afe9; 
  outline:0;  
  box-shadow: inset 0 1px 1px rgba(0,0,0,.075), inset 0 0 4px rgba(102, 175, 233,.4); 
}
  
#dshig-input-group { position:relative; width: 1%; white-space:nowrap; vertical-align:middle; }

#btn-search-submit { 
  position:relative; 
  z-index:2; 
  margin-left: -1px; 
  padding: 0;
  color:#333; 
  background-color:#fff; 
  border: 1px solid #ccc;
  height: 40px;
  width: 40px;
}
#search-icon { padding:0; font-size:1.4em; color: #006070; }

@media (max-width: 991px) {
  #desktop-header, #header  {  display: none; }
  
}


/***********************************
      Column Reordering
*********************************/
/*
.left-left  { display: block; }
.right-left { display: none;  }

@media  (max-width: 767px) {
  .left-left  { display: block;  }
  .right-left { display: block;  }
}
*/

.nobullets { list-style: none; }

.sidebar-nav .navbar-header button { width: 2em; }

@media (max-width: 767px){
.visible-xs {
    display: block !important;
    float: left !important;
    width: calc(100% - 3em) !important;
    width: -webkit-calc(100% - 3em) !important;
    line-height: 1.5em;
  }
}


/******************************************
     HEADER - TOP RESOURCES
*******************************************/
#top-resources, .top-resources {  text-align: right;  padding-top: 5px; }
#top-resources ul, .top-resources ul {  list-style: outside none none; display: inline-block; padding:0; }
#top-resources ul li, .top-resources ul li {height: 1em; line-height: 1.5rem; float: left; padding: 0 4px;   margin: 5px 0 0;}
#top-resources ul li + li, .top-resources ul li + li { border-left: 1px solid #cdd5da;  }

@media (max-width: 1400px) {
  #top-resources, .top-resources  {  font-size: 0.9em; }
}
@media (max-width: 1100px) {
  #top-resources, .top-resources  {  font-size: 0.8em; }
}
@media (max-width: 991px) {
  #top-resources, .top-resources  {  display: none; }
}




/******************************************
    Mobile HEADER
*******************************************/
@media (min-width: 992px) {
    #mobile-and-tablet-header { display: none; }
}
@media (max-width: 991px) {
    #mobile-and-tablet-header {
      position: fixed;
      top:0;
      display: block;
      z-index: 1000; 
      background: #b60000;
      overflow: visible;
      font-size: 16px;
      font-weight: bold;
      color: #fff;
      line-height: 3em;
      -moz-box-sizing: border-box;
      box-sizing: border-box;
      width: 100%;
      padding: 0 50px;
      text-align: center;
      overflow: visible;
      border-bottom: 1px solid #fff;
      margin-top: 0;
      height: 50px;
    }
    #mobile-and-tablet-header li { list-style: none; }
  
  #mobile-and-tablet-header .menu-tab a {
    background: center center no-repeat transparent;
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABkAAAAZCAYAAADE6YVjAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAADhJREFUeNpi/P//PwOtARMDHQBdLGFBYtMq3BiHT3DRPU4YR4NrNAmPJuHRJDyahEeT8Ii3BCDAAF0WBj5Er5idAAAAAElFTkSuQmCC);
    display: block;
    width: 3em;
    height: 3em;
    position: absolute;
    left: 10px;
  }
  #mobile-and-tablet-header #hamburger {
    background: center center no-repeat transparent;
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABkAAAAZCAYAAADE6YVjAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAADhJREFUeNpi/P//PwOtARMDHQBdLGFBYtMq3BiHT3DRPU4YR4NrNAmPJuHRJDyahEeT8Ii3BCDAAF0WBj5Er5idAAAAAElFTkSuQmCC);
    display: block;
    width: 3em;
    height: 3em;
    position: absolute;
    left: 10px;
    cursor:pointer;
  }  
  
  
  
}


/******************************************
     Mobile Search
*******************************************/
#mobile-and-tablet-header .search {
  display: list-item;
  position: relative;
  height: 3em;
  padding-left: 1em;
  max-width: 1em;
}
#mobile-and-tablet-header .search i, #mobile-and-tablet-header .search span {
  margin-left: -28px;
  margin-top: -3px;
}
#mobile-and-tablet-header .search .fa, #mobile-and-tablet-header .search .far, #mobile-and-tablet-header .search .fal, #mobile-and-tablet-header .search .fas {
  font-size: 1.5em;
  margin-right: 1em;
  color: #ffffff;
}
#mobile-and-tablet-header #search {
  position: relative;
  float: left;
  width: 3em;
  height: 3em;
  margin-left: 10px;
}
#mobile-and-tablet-header #search-label {
  margin-left: -35px;
  margin-top: -42px;
  margin-bottom: 10px;
  padding: 0;
}
#mobile-and-tablet-header #label {
  width: 2.5em;
  height: 2em;
  position: relative;
  z-index: 20;
  left: -10px;
}
#mobile-and-tablet-header #label label {
  display: block;
  width: 60px;
  height: 40px;
  font-size: 0;
  color: transparent;
  text-indent: -9999px;
  cursor: pointer;
  top: -30px;
}
#mobile-and-tablet-header #mobile-search-input {
  position: absolute;
  top: -42px;
  left: 0;
  width: 300px;
  height: 2.5em;
  z-index: 5;
  overflow: hidden;
  padding-bottom: 10px;
  pointer-events: none;
  background: none ;

}
@media (max-width: 767px) {
  #mobile-and-tablet-header #mobile-search-input {    width: 235px;  }
}
@media (max-width: 350px) {
  #mobile-and-tablet-header #mobile-search-input {    width: 200px;  }
}

#mobile-and-tablet-header #mobile-search-input input {
  display: block;
  position: absolute;
  top: 0;
  opacity: 0;
  visibility: hidden;
 /* left: -652px; */
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0 10px;
  border: none;
  background-color: #eee;
  color: #5e5e5e;
  font-size: 18px;
  font-weight: normal;
  -webkit-appearance: none;
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  -ms-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-transition: left;
  -moz-transition: left;
  -ms-transition: left;
  -o-transition: left;
  transition: left;
  z-index: 6;
  line-height: 16px;
}
@media (max-width: 767px) {
  #mobile-and-tablet-header #mobile-search-input input { padding: 3px 15px 3px 5px; }
}
#mobile-and-tablet-header #mobile-search-input input:focus { outline: none; }
#mobile-and-tablet-header #mobile-search-input.focus { z-index: 20; pointer-events: all; }
#mobile-and-tablet-header #mobile-search-input.focus input {
  left: 0;
  opacity: 1;
  visibility: visible;
  -webkit-transition: left 0.3s;
  -moz-transition: left 0.3s;
  -ms-transition: left 0.3s;
  -o-transition: left 0.3s;
  transition: left 0.3s;
}

/******************************************
    Tablet name = "Bunker Hill Community College"
    Mobile name = "BHCC"
*******************************************/

.tablet-name { font-size: 2em; font-weight: normal; display: none; }

@media (min-width: 670px) and (max-width: 1022px) {
  .tablet-name   { display: block; margin-top: -1.5em; }
  .tablet-name a { text-decoration: none;  color: #fff; }
  .tablet-name a:hover { text-decoration: none; color: #fff; cursor: pointer; }
  .mobile-name { display: none; }
}

.navbar-toggle1 { cursor: pointer;}
.mobile-name {  font-size: 2em; font-weight: normal; }

@media (max-width: 669px) {
  .mobile-name { display: block; margin-top: -1.5em; }
  .mobile-name a { text-decoration: none; color: #fff; }
  .mobile-name a:hover { text-decoration: none; color: #fff; cursor: pointer; }
}


/********************************************
     INITATIVES NEWS RIGHT SIDE BAR
*********************************************/
#calendarNews .event {
  display:flex;
  clear: both;
  border: 1px solid #cdd5da;
  margin: 5px 0;
  overflow: hidden;
}
#calendarNews .event .dateArea {
  background-color: #fff;
  height: 80px;
  text-align: center;
  width: 50px;

}
#calendarNews .event .dateArea .month {
  color: #fff;
  font-size: 1.1em;
  font-weight: bold;
  background-color: #b60000;
  padding: 2px 0;
}
#calendarNews .event .dateArea .day {
  font-size: 1.6em;
  font-weight: bold;
  line-height: 2em;
}
#calendarNews .event .middle {
  position: relative;
  padding: 10px;
  text-align: left;
  width: calc(100% - 50px);
  border-left: 1px solid #cdd5da;
  
}

#calendarNews .event-title { margin-bottom:30px; }

#calendarNews .press-release,
#calendarNews .public-notice,
#calendarNews .web-story,
#calendarNews .news-brief,
#calendarNews .bhcc-spotlight,
#calendarNews .event-recap  {   text-align: left; width: 230px; line-height: 1.5em;}

#calendarNews .news-brief a,
#calendarNews .press-release a,
#calendarNews .public-notice a,
#calendarNews .web-story a,
#calendarNews .bhcc-spotlight a,
#calendarNews .event-recap a
{
  position: absolute;
  right: 0;
  bottom: 0;
  padding: 0 8px;
  font-size: 1em;
  color: #fff;
  font-weight: bold;
  width: 100%;
}


#calendarNews .press-release a {  background-color: #b60000; }
#calendarNews .web-story a     {  background-color: #888; }
#calendarNews .news-brief a    {  background-color: #585348; }
#calendarNews .public-notice a {  background-color: #069; }
#calendarNews .event-recap a {  background-color: #001e4d; }
#calendarNews .bhcc-spotlight a {  background-color: #006072; }

#calendarNews .fa, #calendarNews  .far, #calendarNews  .fal, #calendarNews  .fas,  #calendarNews  .fad {
    float: right;
    margin-top: 5px;
    font-size: 1em;
}


.btn-default h1, .btn-primary h1{ margin-bottom: 0; }

#calendarNews #display-selector .nav-justified .btn-primary h1,
#calendarNews #display-selector .nav-justified .btn-default h1 {
  margin-top: 4px !important;
}
#calendarNews #display-selector .btn-primary {
  background-color: #b60000 !important;
  max-height: 60px;
  color: #fff !important;
  border-color: #cdd5da !important;
  border-radius: 0 !important;
  margin-right: 2px;
}
#calendarNews #display-selector .btn-default {
  background-color: #333 !important;
  max-height: 60px;
  border-color: #cdd5da !important;
  color: #fff !important;
  border-radius: 0 !important;
  margin-left: 2px;
}
#calendarNews #display-selector .btn-primary:not(:focus) {
  background-color: #333 !important;
  z-index: 50;
}
#calendarNews #display-selector .btn-default:focus {
  background-color: #b60000 !important;
  color: #fff;
}
#calendarNews #display-selector li.active .btn-primary {
  background-color: #b60000 !important;
  color: #fff;
  z-index: 50;
}
@media (max-width: 767px) {
  #calendarNews .nav-justified > li {
     width: 49.5%;
     float: left !important;
  }
}



/******************************************
     TWO COLUMN
*******************************************/
.two-main-content { width: 100%; margin-bottom: 1em; margin-top: 2em; text-align: left; }
.two-column-image { width: 100%; }

/******************************************
     THREE COLUMN
*******************************************/


.three-main-content { width:100%; margin-bottom:1em; margin-top:0; text-align:left;}
/*.three-main-content .content-block h3  { font-weight: 600; line-height:1.4em }*/
.three-main-content .content-block { margin-bottom: 2em; margin-top:0;}
.three-main-content .content-block li a { word-break:break-word; }
.content-block:empty {display:none;}

.three-main-content.feature-text .content-block p { font-size:1.1em; line-height:1.8em; }

@media (max-width: 767px) { 
  .three-main-content { margin-bottom: 0; }
  .three-main-content .content-block { margin-bottom: 0; }
  .content-block a { word-break: break-word;}
  .three-main-content ul { padding-left:20px; } 
  .three-main-content li > ul { padding-top:5px; }   
} 


/************************************
  ASIDES:   RIGHT HAND COLUMN (MAINLY) and left
************************************/

.three-right-content { margin-top:0;  }

@media (max-width: 767px)  { 
  .three-right-content { margin-top: 2em; }

}




.three-right-content hr, .three-left-content hr {
    margin: 10px auto;
    border: 0.5px solid #cdd5da;
}


.landing-right-boxed h3 {  color:#b60000; margin-top:-5px; font-weight:normal;} 

.three-right-boxed, .three-left-boxed {
    border: 1px solid #cdd5da;
    text-align: left;
    width: 100%;
    margin-bottom: 1em;
    padding: 1em;
    border-radius:8px;

}

.three-right-boxed p     { word-wrap: normal; }
.three-right-boxed p a   { word-wrap: break-word; }
.three-right-boxed p.event-title { word-wrap: break-word; }
.three-right-boxed div   { word-wrap: break-word; }
.three-right-boxed h2    { color: #b60000; padding:0; margin: 0; font-weight:normal; line-height: 1.5em; }
.three-right-boxed table { width:100%; }
.three-right-boxed td    { padding:0 3px; vertical-align:top; }
.three-right-boxed img   { border: none; display: block; text-align: center; margin-top:0; margin-bottom:10px; margin-left:auto;  margin-right:auto; }
.three-right-boxed ul    { list-style:disc; padding-left:20px; }
.three-right-boxed ul ul   { list-style:square; padding-left:20px; }
.three-right-boxed li    { padding:3px 0; }
.three-right-boxed li:marker { color:#aaa;}
.three-right-boxed li::marker { color:#aaa;}

.three-right-shaded, .three-left-shaded {
    border: 1px solid #cdd5da;
    text-align: left;
    width: 100%;
    margin-bottom: 1em;
    padding: 1em;
    background-color: #f4f4f4;
}
.three-right-shaded p  { word-wrap: break-word; }
.three-right-shaded h3, .three-right-shaded h2 { color: #000; margin-bottom: 10px; margin-top: 0;  font-weight:normal; }
.three-right-shaded td    { padding:0 3px; vertical-align:top; }
.three-right-shaded table { width:100%; }
.three-right-shaded ul { list-style:disc; padding-left:20px; }

.three-right-shaded li { padding:3px 0; }
.three-right-shaded li::marker { color: #aaa; }
.aside-no-border { border:0;background:none; width:100%; margin-bottom:2em; margin-top:2em; padding: 0; }

aside.left-aside h3, aside.left-aside h2 { margin-top: 0;  margin-bottom: 10px;  font-weight:normal;}  

@media  (max-width: 768px) {
  .three-right-boxed p     { font-size: 1.1em; }
  .three-right-boxed ul li { font-size: 1.1em; line-height: 1.6em; }
  .three-right-boxed h3, .three-right-boxed h2   { line-height: 1.6em; }   
} 
  
.aside-header { color: #b60000; margin:0; padding:0; font-weight:normal; line-height: 1.5em; } 

.three-right-shaded hr, .three-left-shaded hr {
    margin: 10px auto;
    border: 0.5px solid #cdd5da;
}

aside.no-style { border:0; }
aside.no-style img { width:100%; height:auto; margin:0; }
aside.no-style hr { display:none; }

/******************************************
     DEPARTMENT CALENDARS
*******************************************/
.calendar-by-keyword { 
 /*border:1px solid #cdd5da; */
  text-align:left;  
  width:100%;  
  margin-bottom:1em;  
  padding:2px 0;  
}

.calendar-by-keyword .aside-header   { color: #b60000; font-weight:normal; text-align:center; background-color:#fff; }
.calendar-by-keyword p.event-title {font-size:1em; word-wrap: break-word; padding:5px;}
.calendar-by-keyword hr { margin:10px auto; border:1px solid #cdd5da; }

.left-event { clear:both; margin:5px 0;  border:1px solid #cdd5da; overflow:hidden; position:relative; background-color:#fff; }

.left-event .left-dateArea {
  background-color: #fff;
  height: 100%;
  min-height: 65px;
  text-align: center;
  width: 60px;
  float: left;
  border-right: 1px solid #cdd5da;
}

.left-event .left-dateArea .left-month {
  color: #fff;
  font-size: 1.1em;
  font-weight: normal;
  background-color: #b60000;
  padding: 2px 0;

}
.left-event .left-dateArea .left-day {  font-size:30px;  font-weight:700;  line-height:1.5em; color:#606060; }
.left-event .left-middle { line-height;1.5em; padding:5px; text-align:left;  border-left:1px solid #cdd5da;   box-sizing:border-box; margin-left:59px;  margin-right: 0; }
.left-event .left-middle p.event-title { margin: 0; padding:5px;}

@media (min-width: 768px) and (max-width: 1022px) {
  .left-event .left-dateArea             { width: 40px;  border-right: 0;  }
  .left-event .left-dateArea .left-month { font-size: .9em;  }
  .left-event .left-dateArea .left-day   { border-right: 1px solid #cdd5da;  border-bottom: 0;  }
  .left-event .left-middle               { margin-left: 39px; }
  .left-event .left-middle p.event-title { margin: 0; padding:0;}  
}


.view-full-box { text-align:center; font-weight:normal; background-color:transparent; }
.view-full-cal { text-align:center; font-weight:normal; }
.view-full-cal:after {
  content:"\f0a9";
  font-family: 'Font Awesome 6 Pro', fontawesome;
  line-height:1;
  display:inline-block;
  color: #b60000;
  position: relative;
  top: 2px;
  margin-left: 5px;
  font-size: 16px;
}

.calendar-by-keyword-main-content    { float: left; margin-top: 2em;   width: 220px;  }
.calendar-by-keyword-main-content h3 { color: #b60000; margin: -5px 0 5px 0; font-weight:normal }
.calendar-by-keyword-main-content p  { font-size: 0.9em; word-wrap: break-word; }


@media (max-width: 767px) {
  .section-links-desktop { display: block; }
}


/******************************************
     STUDENT CENTRAL SPECIFIC
*******************************************/
.student-central-feature { 
  float: left; 
  width: calc( 33.33% - 5px ); 
  height: auto; 
  margin: 5px 5px 0 0;
  padding: 5px;
  border: 1px solid #fff;
  border-radius:10px;
}

.student-central-feature-50 {
  float: left; 
  width: calc( 50% - 5px ); 
  height: auto; 
  margin: 5px 5px 0 0;
  padding: 15px;
  border: 1px solid #cdd5da;  
}

.student-central-feature:hover, .student-central-feature-50:hover { border:1px solid #aaa; }
.scf-header                    { text-align:center; text-decoration:none; height:3em; }
.student-central-feature-article-content { margin-top: 15px; }
ul.student-central-service-list { list-style-type:circle; margin-left: -15px; }
ul.student-central-service-list li { padding-top:5px; font-size: 1.1em; }
.SCentralFeatureImg { text-align:center;  }

@media (min-width: 1400px) {
  .student-central-feature {   height:500px;  }
}
@media (min-width: 1800px) {
  .student-central-feature {   height:600px;  }
}
@media screen and (max-width: 991px) {
  .student-central-feature {  
    width: calc( 50% - 5px ); 
    height: auto; 
    float: left; 
  } 
  .scf-header { font-size:18px; }
  .student-central-feature ul, .student-central-feature-50 ul { font-size:1em; list-style-type: disc; }
}

@media (max-width: 767px) {
  .student-central-feature,  .student-central-feature-50 {  width:100%; height:auto; float:none; margin:0 0 15px 0; }
  .scf-header { font-size: 24px; } 
}


/******************************************
  Notice and Contact
*******************************************/
.notice-container {
    display: flex;
    flex-flow: row wrap;
    justify-content: space-between;
}

.notice-info-box {
    width: 66%;
    border: 1px solid #cdd5da;
    padding-bottom: 10px;
    display: flex;
    flex-direction: row;
}

.notice-info-box-icon {
    font-size: 3.5em;
    color: #b60000;
    padding: 0 15px;
}

.notice-info-box-text{
  padding: 15px;
  overflow-y: auto;
}

.notice-contact-box {
    width: 33.4%;
    border: 1px solid #cdd5da;
    padding: 10px;
    word-wrap: break-word;
}


@media (max-width: 991px) {

  .notice-container {
      flex-flow: column wrap;
      align-content: flex-start;
  }

  .notice-info-box {
      width: 100%;
      margin-bottom: 15px;
  }

  .notice-contact-box  {
        width: 100%;
        margin-top: 10px;
        margin-bottom: 15px;
   }

}



/******************************************
  Notice and Contact
*******************************************/

 .notice-article { margin:15px 0 10px 0; display:flex; flex-wrap:wrap; justify-content:space-between;}
 .notice-student-central { margin:0; border: 1px solid #cdd5da;
                          padding-bottom:10px;} 
 .notice-student-central-glyph { font-size:3.5em;color:#b60000;float:left;margin:20px;height:100%;min-width:80px;width:80px;}
 .notice-student-central-text { margin:20px;padding-bottom:10px; overflow-y:auto;}
 .notice-student-central-contact-info { width:30%; border: 1px solid #cdd5da; padding:10px; word-break:break-word;}
 .notice-student-central-contact-info h3 { text-align:left; margin:0; font-weight:normal;}
 .notice-student-central-contact-info hr { color:#aaa;}  
 .notice-student-central-contact-info p { font-size:14px;}
  
 @media (min-width:768px) and (max-width:991px) {
    .notice-article {margin-top:40px; }
    .notice-student-central-glyph {width:60px; min-width:60px; height:auto;}
    .notice-student-central-text { margin:20px; padding-bottom:10px; overflow-y:auto;}   
  }
  
 @media (max-width:767px)  {
    
    .notice-article { margin-top:15px; display:inline-block; padding:0; }
    .notice-student-central { width:100%; padding:0; float:none; }
    .notice-student-central-glyph { font-size:3em; color:#b60000; float:left; margin:15px 0 0 15px; height:auto;  min-width:unset; width:unset;  }
    .notice-student-central-text { margin:5px; overflow-y:unset; padding: 10px; }
   .notice-student-central-text h2 { margin:0; }
   .notice-student-central-contact-info  { width:100%; margin-top:10px; float:none; }
  
  }


/******************************************
     NOTICE
*******************************************/

.notice-box { 
   /* width: calc(75% - 20px);  */
    color:#b60000;
    position:relative; 
    border:3px solid #b60000;  
    margin:0 0 20px 0;  
    padding:15px; 
    float:none; 
    box-sizing:border-box; 
    clear: both;
} 
.notice-box h1 {margin:20px 0;}
.notice-box h2 {margin:0;}
.notice-box h3 {margin:0;}
.notice-box p, .notice-box div, .notice-box u, .notice-box li { color: #b60000; }
.notice-box a { word-break:break-word; } 
.notice-box table { color: #b60000; }
.notice-box table.notice-table caption {text-align:center !important; color:#b60000 !important; font-weight:600;}
.notice-box table tr { background-color:#fff; }
.notice-box table th { padding:5px;}
.notice-box table td { background-color:#fff; height:1em; padding:5px; }
.notice-box-large { border: 2px solid #b60000; padding: 0 15px;margin-bottom:15px; }
.notice-box-large a { word-break:break-word; }  

@media (max-width: 1022px) and (min-width: 768px) {
  
  .notice-box a { word-break:break-all; }  
  .notice-box-large { margin-top: 4em;  }  
}

@media (max-width: 767px) {
  .notice-box { width:100%; float:none; margin:0 auto; border:2px solid #b60000;}
  .notice-box a { word-break:break-all; }
  .notice-box-large { width:100%; float:none; margin:0 auto; border:2px solid #b60000;}  
}  




/******************************************
     FLEX - mobile
*******************************************/

@media (max-width: 767px) {
  .container-flex {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-flow: row wrap;
    -moz-flex-flow: row wrap;
    -ms-flex-flow: row wrap;
    flex-flow: row wrap;
  }

  .five-flex  {  width: 100%;  -webkit-order: 5;  order: 5;  }
  .four-flex  {  width: 100%;  -webkit-order: 4;  order: 4;  }
  .three-flex {  width: 100%;  -webkit-order: 3;  order: 3;  }
  .two-flex   {  width: 100%;  -webkit-order: 1;  order: 1;  }
  .one-flex   {  width: 100%;  -webkit-order: 2;  order: 2;  }
 
}

/******************************************
     SUBMIT CONCERN BUTTON (Dean of Students)
*******************************************/
.submit-concern {
  display: block;
  text-align: center;
  background: #b60000;
  color: #ffffff;
  font-size: 1.5em;
  padding: 5px;
  text-decoration: none;
  width: 80%;
  margin: auto;
  border: 0;
}
@media (max-width: 991px) and (min-width: 768px) {
  .submit-concern {
    font-size: 1.2em;
  }
}


/******************************************
 Art Gallery
*******************************************/
.exhibit-container {

    display: flex;
    flex-flow: row wrap;
    justify-content: space-between;

}
.exhibit-container a:hover { text-decoration: none;}

.art-content-item { 
  width: 33%;
  padding: 10px;
}
.art-content-item img {
  width:100% !important; 
  height:auto !important;
}

.featureContainer {
  display: flex;
	flex-wrap: wrap;
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	-webkit-flex-flow: row wrap;
	flex-flow: row wrap;
  justify-content:center;
 /* justify-content:space-between;*/
  padding: 10px;

}
.featureItem {
  align-items: flex-start;
  max-width: 300px;
  margin: 0;
  padding:5px;
}

  .featureimg img {
      width: 100% !important;
  }

@media only screen and (max-width: 767px)  {
  .featureItem { max-width: 100%; }
  .featureimg img {   width: 100% !important; }
  .art-content-item {  width: 100%;  }

}

/******************************************
 Blog Article
*******************************************/

.postTitle {
  letter-spacing: .08334rem;
  line-height: 1rem;
  margin-top: 6px;
  margin-bottom: 6px;
}
.postContainer {
    border-bottom: 1px solid #eaeaea;
    padding: 10px;
    overflow: auto;
    max-width: 800px;
}
.postimg{
  height: 200px;
  overflow: hidden;
}
.postimg img {
  width: 100%;
  margin: 0 auto;
}


.postDetail {
  padding-bottom: 10px;
}
.postMeta{
  margin-top: 10px;
  text-transform: capitalize;
  float: right;
}
.postMeta span {
  letter-spacing: .08334rem;
  margin-top: 10px;
  font-size: 0.7em;
  margin-bottom: 15px;
  line-height: 100%;
  text-transform: capitalize;


}
.postReadMoreLink {
  float: right;
  border-radius: 3px;
  border: 1px solid #d1d1d1;
  padding:10px;
}
.postReadMoreLink:hover {
   background-color: #b60000;
}
.postReadMoreLink a {
  text-align: center;
  padding: 10px;
  text-decoration: none;
  color: #686868;
}
.postReadMoreLink a:hover{
  color: #fff;
  background-color: #b60000;
}
.postCatalog-Container {justify-content:center;}
.postCatalog-Container img {width: 100% !important;height: auto;}
.postCatalog-content-sameheight {
	display: flex;
	flex-wrap: wrap;
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	-webkit-flex-flow: row wrap;
	flex-flow: row wrap;
}
.postCatalog-middle-content { order: 2; width: 40%; padding: 2%;}
.postCatalog-aside-1        { order: 1;width: 30%;padding: 2%;}
.postCatalog-aside-2        { order: 3; width: 30%; padding: 2%;}
.postCatalog-aside img      { width: 100% !important;height: auto;}


/***********************************/
/*      FOOTER 2022                   */
/***********************************/
#footer-2022 {
  background-color : #0c203b;
  color:#fff;
  padding: 2em;
  margin-top:0;
  line-height:1.8em;
}
#footer-2022 #footer-logo-image {width:300px; height:auto;margin-left:1em; max-width:100%;}
#footer-2022 a { color:#fff; text-decoration:none; font-weight: 400; border-bottom:1px solid transparent; }
#footer-2022 li.footer-list-item a:hover { border-bottom:1px solid #e7d780; }
#footer-2022 h2 { font-size: 1.2em; color:#fff; line-height: 1.5em;margin: 1em 0 5px 0; font-weight: 400; padding:0; }
#footer-2022 ul { list-style: none; padding-left:0; margin-top:0; }
#footer-2022 .footer-column { float:left; width:33%;padding:1em; }
#footer-2022 #footer-social-bar {  margin:0; text-align:center; clear:both; width:100%;}
#footer-2022 a.footer-social-link { margin-right:10px; text-decoration:none; }
#footer-2022 .copyright-line {  clear:both; text-align:center; margin:1em; }
#footer-2022 a.campus-info h2, #footer-2022 a.campus-info li { border-bottom:1px solid transparent; width:fit-content; }

#footer-2022 a.t4Edit-page {
    text-decoration: none;
    cursor: text;
}
#footer-2022 a.t4Edit-page:hover { color:white;text-decoration: none; } 

@media (max-width:1200px) {
   #footer-2022 .footer-column { 
      float:left; 
      width:50%;
      padding:1em; 
   }
}

@media (max-width:991px) {
  #footer-2022 { padding: 1em; }
  
  #footer-2022 div#footer-logo {
    margin: 2em auto;
  }
 #footer-2022 .footer-column {   
     float:none;   
     width:100%;  
     padding:0 1em; 
 }
}



/******************************************
     OLD FOOTER
*******************************************/
/*
.footer {
   background-color: #efefef;
   color: #000;
   padding-bottom: 30px;
   padding-left: 15px;
   padding-top: 20px;
   position: relative;
   width: 100%;
   overflow: visible;
   border-top: 1px solid #fff; 
}
.footer-social-link {  color: #b60000;}
.footer-social-link:hover { text-shadow: 2px 2px 0 #333; }
.footer .row {  margin-top: 0;}
.footer .linkscol { width:25%; float:left; padding-right:15px; padding-left:15px; line-height:1.8em; }
.footer .linkscol h2 { color: #b60000;  text-align: left; }
.footer-col      { margin: 0;  padding: 0; }
.footer-col-item   { font-size: 1.2em;  list-style: outside none none;  text-align: left; }
.footer-col-item a { color: #333; }
.footer .social-bar       { text-align: center;  padding: 20px 0; width:100%; clear:both; }
.footer .social-bar .fa-youtube-square:before {
    content: "\f431";
}
.social-bar a             { margin: 10px 7px;  display:inline-block; }
.social-bar img           { border: none; }
.social-bar img:hover     { box-shadow:1px 1px 1px #888; }
.footer .footer-link-bar  { width: 100%; text-align: center; margin-left: -1.5em; padding-right:0; }
.footer .footer-link-bar ul      {  display: inline-block; list-style-type: none; padding-left:0; }
.footer .footer-link-bar ul li   {  display: inline-block; text-align: center;  padding: 0.5em; }
.footer .footer-link-bar ul li a {  color: #000; }
.footer .contact {  text-align: center; width:100%;clear:both; }
.footer .contact ul { list-style: none; padding-left: 0; }
.footer .contact ul li {  display: inline-block;}
.footer .contact a   { color: #333;}
.footer .copyright    {  text-align: center; width:100%; clear:both;}
.footer .copyright ul { list-style: none;  text-align: center;  padding-left: 2em;}
.footer .copyright a {  color: #000; }

@media (max-width: 1200px) {
  .footer .linkscol { padding-left:5px; padding-right:5px; }
  .footer-col-item   { font-size: 1.1em;  }
}

@media (max-width: 991px) {
  .footer .linkscol { width:50%; margin-bottom: 30px;}
}

@media (max-width: 767px) {
  .footer .linkscol h2 {    font-size: 1.4em;  }
  .footer .contact ul li {  display: block; }
  .footer .copyright ul {  margin-right: 2.5em; }
}


@media (min-width: 350px) and (max-width: 767px) {
  .footer .linkscol:nth-of-type(2n-1) {
    clear: both;
  }
}
@media (max-width: 400px) {
  .footer .linkscol { width: 100%; }
}

*/




/******************************************
     Desktop Menu
     NAVIGATION on the desktop
*******************************************/
#main-nav {
  background-color: #b60000;
  border: 0;
  border-radius: 0;
  display: block;
  margin-top:0;
  margin-bottom:0;  
  border-bottom: 0px solid #fff;
  padding-bottom: 0;
  z-index: 9998 !important;
  position: relative;
  min-height: 55px;
  clear: both;
}
#main-nav:before { display: table; content: " "; }

#navbar {
   display: block !important;
   height: auto !important;
   padding-bottom: 0;
   padding-left: 15px;
   padding-right: 15px;    
   margin-left: 0;
   margin-right: 0;  
   overflow: visible !important;
   width: auto;
   border-top: 0;
   -webkit-box-shadow: none;
   box-shadow: none;
  
}
#navbar:before { display: table; content: " "; }

#main-nav .megamenu-navbar      { width: 100%; list-style:none; margin:0; padding-left:0; clear:both;}

#main-nav .megamenu-navbar:before { display: table;  content: " "; }
#main-nav .megamenu-navbar:after {  clear:both; }

#main-nav .megamenu-toplink   { 
    position: relative;
    display:block;
    text-align: center; 
    width: 16.66666667%; 
    padding-left: 0;
    padding-right: 0;  
    float: left;
   
}
#main-nav .megamenu-toplink a { 
    position: relative;
    display:block;  
    padding-left:15px; 
    padding-right:15px; 
    padding-top:15px; 
    padding-bottom:15px;  
    color: #fff;  
    font-weight: normal;  
    font-size: 1.4em;  
    text-shadow: 1px 1px 1px #888; 
    letter-spacing: 1px;
    line-height: 1em;
    text-decoration: none;
}
#main-nav .megamenu-toplink a:hover, #main-nav .megamenu-toplink a:visited { background-color: #b60000; text-decoration: none; }

@media (max-width: 1200px) {
  #main-nav .megamenu-toplink a { padding-left: 0;  padding-right: 0; }
  
}
@media (max-width: 991px) {
  #main-nav {  display: none; }
}


/* For Dept Nav's with top title like /academics/academicresources/  */
.top-title-for-nav {margin-bottom:-15px; }
@media (min-width: 992px) {
    .top-title-for-nav { margin-top:0px; margin-bottom:0px; }
}

/******************************************
    STICKY HEADER
*******************************************/
.sticky { position:fixed !important; top:0; z-index: 9998 !important; width: 100%; text-align:center; }
.menu-padding { padding-top: 50px; }

/******************************************
      MEGA MENU - TOP BAR MENU
*******************************************/
.findvisible { position:absolute; top:150px; height:10px; width:10px; background-color:transparent; }

.dropdown-main   { display:none;  text-decoration:none; margin-left:15px; margin-right: 15px; padding-top:1em;  padding-bottom:1em;}

.linklist {
  width: 100%;
  padding-left: 7em !important;
  padding-right: 15px;
  margin-top: 0;
  margin-bottom: 0; 
  column-count: 3;
  -moz-column-count: 3;
  -webkit-column-count: 3;
  column-gap: 2em;
  -moz-column-gap: 2em;
  -webkit-column-gap: 2em;
  min-height: 10rem;
}
.linklist li   { font-size: 1.2em;  line-height: 1.5em;  list-style: outside none none; }
.linklist li a { display: inline-block;  color: #fff !important;  font-weight: normal; padding:3px; }
.linklist li .currentsection { padding:3px; font-weight:bold;}

#workforce-dropdown .linklist li a { padding: 5px; }
#initiatives-dropdown .linklist li a   { padding: 5px; }

#dropdowns {
  background-color: rgba(0, 0, 0, 0.85);
  width: 100%;
  overflow: hidden;
  white-space: normal;
  color: #fff;
  display: block;
  position: absolute;
  left: 0;
  right: 0;
  text-align: left;
  z-index: 999;
}


/******************************************
      SIDE BAR MENU
*******************************************/

@media (min-width: 992px) {
  .sidebar-nav {
    position: relative;
    float: none;
    margin-top: 0;
    margin-bottom: 1em;
    padding-bottom: 0;
    border-radius: 0;
    background: #ececec;
    -webkit-box-shadow: none;
    box-shadow: none;
  }
}


@media (max-width: 767px) {
   div#left-column, div#dept-left-column { width:100%;   max-width: unset; }
}

.sidebar-nav .navbar .sidebar-navbar-collapse > ul            { opacity: 0; transition: opacity 250ms; }
.sidebar-nav .navbar .sidebar-navbar-collapse > ul.navbar-nav { opacity: 1; padding-left:0; list-style:none; }

.sidebar-nav .navbar span.currentsection {display:none;}
.sidebar-nav .navbar ul {  float: none;  margin: 0; }

.sidebar-nav .navbar .multilevel-linkul-0 { margin-left: 5px; }
.sidebar-nav .navbar .multilevel-linkul-1 { margin-left: 3px; margin-bottom:5px; border-left:1px solid #bbb; box-shadow:-2px 2px 2px #ccc;}
.sidebar-nav .navbar .multilevel-linkul-2 { margin-left: 0; margin-bottom:5px;  border-left:1px solid #bbb;box-shadow:-2px 2px 2px #ccc;}
.sidebar-nav .navbar .multilevel-linkul-3 { margin-left: 0; margin-bottom:5px; border-left:1px solid #bbb;box-shadow:-2px 2px 2px #ccc;}



.sidebar-nav .navbar ul .dropdown-menu li {
  background-color: #f0f0f0;
  position: relative;
  display: block;
  text-align: left;
  width: 100%;
  border-right: none;
  border-left: none;
  border-top: 1px solid #fff;
  border-bottom: 1px solid #999;
  padding:0 0 0 5px;
}

.sidebar-nav .navbar ul .dropdown-menu li a {
  color: #000 !important;
  font-weight: normal;
  position: static;
  margin: 0;
  padding: 15px 15px;
  white-space: normal !important;
}
.sidebar-nav .navbar ul .dropdown-toggle {
  background-color: #ececec;
  color: #000;
  display: inline-block;
  width: 40px;
  vertical-align: bottom;
  text-align: center;
  line-height: 1.2em;
  min-height: 50px;
}


.sidebar-nav .navbar ul .before-dropdown {
  display: inline-block;
  width: calc(100% - 40px);
  vertical-align: bottom;
  color: #000 !important;
}
.sidebar-nav .navbar ul .dropdown .fa-chevron-right,
.sidebar-nav .navbar ul .dropdown .fa-chevron-down  {  float: right;}

.sidebar-nav .navbar ul .dropdown .dropdown-menu    { 
    display:none;
    top:100%;
    left:0;
    z-index: 1000;
    min-width:10px;
    font-size: 1em;
    width:100%;
    position:relative; 
    padding:0;
    background-color:#eaeaea;
    border-left:1px solid #bbb;
    border-top:1px solid #fff;
    text-align:left;
    list-style:none;
    border-radius: 4px;
    box-shadow: 0 6px 12px rgba(0,0,0,.175);
}

.dropdown-menu > l1 > a {clear:both;}




.sidebar-nav .navbar ul .dropdown .fa-chevron-right { display: inline-block; width:18px;}
.sidebar-nav .navbar ul .dropdown .fa-chevron-down  { display: none; }
.sidebar-nav .navbar ul .dropdown.open .fa-chevron-right { display: none; }
.sidebar-nav .navbar ul .dropdown.open .fa-chevron-down  { display: inline-block; }

.sidebar-nav .navbar ul li {
  float: none;
  display: block;
  border-bottom: 1px solid #bbb;
  border-top: 1px solid #fff;  
  color: #000;
  background-color: #eeeeee;
  font-size: 1em;
  font-weight: normal;
  text-align: left;
  padding: 0;
  position: relative;
  line-height: 25px;
}
.sidebar-item {
  float: none;
  display: block;
  border-bottom: 1px solid #bbb;
  border-top: 1px solid #fff;  
  color: #000;
  background-color: #ececec;
  font-size: 1em;
  font-weight: normal;
  text-align: left;
  padding: 0;
  position: relative;
}
.sidebar-nav .navbar ul li a { padding: 15px !important; color: #000; display:block; line-height:1.5em;}
.sidebar-nav .navbar ul li a:hover { color: #000; background-color: #fff; text-decoration: none;}

.sidebar-nav .navbar ul li.active a { background-color: #f8f8f8; text-shadow:0 0 3px #ffffe8; color:#000; background-color: #e7e7e7; text-shadow: 0 0 3px #ffffe8; }

/*. Keyboard accessiblity */
.sidebar-nav .navbar ul li a:focus {
  color: #000;
  background-color: #fff;
  outline: thin solid blue;
}


.sidebar-nav .navbar .navbar-collapse { padding: 0; max-height: none; }
.sidebar-nav .navbar-default { margin-bottom: 0; z-index: 51; min-height:unset; }
.navbar-header { display: none;}


@media (min-width: 992px) {
  .sidebar-nav .navbar-toggle1 { display: none; }
}


@media (max-width: 767px) {
  .sidebar-nav .navbar ul .dropdown-toggle { min-height: 40px; }
  .sidebar-nav .navbar-header {
    display: block;
    font-weight: bold;
    background-color: #ececec;
    z-index: 9998;
    position: relative;
    width: 100%;
  }

  .sidebar-nav .navbar-header .navbar-brand { 
     color: #333; 
     display: flex !important; 
     align-items: center; 
     height: unset;
     padding: 10px;
  }

  .sidebar-nav .navbar-header button { margin-top:10px; margin-left:10px; background-color:#ececec; color:#000; border:none;  padding:0;  }
  
  .navbar-default .navbar-nav ul .dropdown-menu>li>a { color:#000 !important; }

}

@media (max-width: 450px) {
   .sidebar-nav .navbar-header .navbar-brand { font-size: 1em;  }
}

.clicked { margin-top: 1em; }





/******************************************
     MOBILE MENU 
*******************************************/

#mm-blocker { border-left:1px solid #cdd5da; }

#menu .mm-navbar-top-1 {  min-height: 3em !important;  position: absolute !important;}

#menu .mm-navbar-top-2 {
  margin-top: 10px;
  background-color: #ececec;
  height: auto;
  max-width: 100%;
  overflow: hidden !important;
  position: absolute !important;
}


#menu .mm-navbar-top-2 .mm-breadcrumbs span:last-of-type { 
  background-color: #b60000; 
  color: #fff;
  overflow: hidden;
  text-overflow: ellipsis;
}

.mm-panel ul {  position: relative !important;  z-index: 10000;}

.mm-listview li {  color: #333;  font-weight: normal;  text-align: left;}

.mm-listview > li, .mm-listview > li .mm-next, .mm-listview > li .mm-next:before, .mm-listview > li:after {
  color: #333 !important;
  font-weight: normal !important;
  text-align: left;
  border-left: 1px solid #e0e0e0;
}

.mm-menu .mm-listview > li .mm-arrow:after, .mm-menu .mm-listview > li .mm-next:after {
  border-color: rgba(0, 0, 0, 0.3) !important;
}

.mm-menu .mm-listview > li .mm-arrow:after, .mm-menu .mm-listview > li .mm-next:after {
  border-color: #fff !important;
  text-align: left;
  border-left: none;
  color: #333 !important;
}

.mm-listview > li .mm-arrow:before { color: #333 !important; }

.mm-listview {  border-color: #fff;  text-align: left; font-size:1em;}
.mm-listview > li:not(.mm-divider):after {  border-color: #fff !important;  text-align: left;}

.mm-navbar .mm-listview .mm-next {  color: #333 !important; }

.mm-menu .mm-btn:after, .mm-menu .mm-btn:before {  color: #fff !important;  text-align: left;}
.mm-selected {  background-color: #ececec !important;}

.mm-menu .mm-listview > li .mm-arrow:after, .mm-menu .mm-listview > li .mm-next:after {
  border-color: rgba(0, 0, 0, 0.5) !important;
  width: 10px;
  height: 10px;
}

#menu .mm-navbar-top-2 a:before {
  display: inline-block !important;
  content: "\f0c9";
  margin-right: 12px !important;
  font-family: 'Font Awesome 6 Pro', fontawesome;
  color: #333;
  font-weight:600;
}

#menu .mm-navbar-top-1 { border-bottom: 3px solid #b60000 !important;  min-height: 50px !important; background-color:#b60000;}


.mm-navbar-top-1 { padding-left: 17px !important; }

#menu .mm-title { text-align: left !important; color:#fff !important; font-size: 1.5em; }
#menu .mm-close { text-align:center; color:#fff !important; font-size: 1.5em; } 

#menu .mm-navbar-top-2 a {
  font-size: 1em;
  background-color: transparent;
  color: #333;
  padding-left: 17px !important;
  text-decoration: none  !important;
  z-index: 10000 !important;
  overflow: hidden;
  text-overflow: ellipsis;
}

.mm-prev { display: none !important; }

#menu .mm-navbar-top-2 span {  color: #fff;  font-weight: normal; }
#menu .mm-navbar-top-2 a.no-chevron        {  padding-bottom: 0px !important; }
#menu .mm-navbar-top-2 a.no-chevron:before {  content: "\f053";}

#menu .mobile-breadcrumb-block {   display:block !important; padding:7px 3px; }
#menu .mobile-breadcrumb-block a:before { color: #333; }

#menu .main-menu-link-block.mobile-breadcrumb-block .mobile-breadcrumb-link { color:#000 !important;}
#menu a.parent-link {  background-color: #b60000; color: #fff; }
#menu a.parent-link:before {  color: #fff; }
#menu .mobile-breadcrumb-block.parent-link-block   {  background-color: #b60000; }
#menu .mobile-breadcrumb-block.parent-link-block a {  color: #fff; line-height: 1.2em; }
#menu .mobile-breadcrumb-block.parent-link-block a:before {    color: #fff; content: "\f053"}

#menu a.mobile-breadcrumb-parent {
    background-color: #b60000 !important;
    color: #fff !important;
    padding-left: 0px !important;
    font-size: 18px !important;
}
#menu a.mobile-breadcrumb-parent:before { color: #fff !important; }

#menu a.mobile-breadcrumb-back {     
  width: 40px;
  display: inline-block !important;
  text-overflow:clip;


}
#menu a.mobile-breadcrumb-back:before { 
}

#menu a.mobile-breadcrumb-link {     
  width: calc(100% - 50px);
  display: inline-block !important;
  padding-left: 5px !important;
  line-height: 1.2em;
  color: #0050C9;
}
#menu a.mobile-breadcrumb-link:before { 
     content: " " !important; 
     display:none !important;
}
.mm-listview .mm-next.mm-fullsubopen { width: 50px; }


/* This is for the Quick Links on the mobile menu */
.mobile-quick-links div {
    margin-left: 1.5em;
    margin-bottom: 5px;
    font-style: italic;
    border-bottom: none !important;
}

a.mqls { display:block; padding:5px 0; font-size:18px; }

/******************************************
    MOBILE MENU SEARCH
*******************************************/
.search-nav        { max-width: 230px; border-bottom-width: 0 !important;  border-bottom: none;  border-top: none;  margin-top: 1.5em;}
.search-nav button { max-width: 3em;  margin-left: 18em;  margin-top: -4em; color: black; background-color:white; border-color:#ccc; padding:6px 12px; vertical-align:middle; }
.search-nav input  { margin-left: 1.5em;  border-bottom: none;  border-top: none;}

@media (max-width: 375px) {
  .search-nav .form-control { width: 175px; }
  .search-nav button { margin-left: 200px; }
}


#menu span.mm-separator { display: none !important; padding:0 !important; }

/******************************************
    MOBILE MENU HAMBURGER
*******************************************/
#menu:not(.mm-menu) { display: none; }

#menu { background-color: #ececec;  }
@media (min-width: 1023px) {
    #menu { display: none; }
}

/******************************************
     MOBILE MENU HAMBURGER BREADCRUMBS
*******************************************/
.mm-breadcrumbs span,.mm-breadcrumbs a {  text-align: left !important;  display: block !important; }
span .mm-breadcrumbs {  overflow: hidden;  float: left;}
.mm-breadcrumbs span {  padding-left: 17px !important; }
.mm-navbar .mm-breadcrumbs { padding: 0 !important; }


/*********************************************
      MOBILE MENU      SOCIAL 
***********************************************/
.social-nav { border-bottom-width: 0; }
.social-nav .social-icons {  margin-left: 0.5em;  border-bottom-width: 0; display:flex; flex-wrap:wrap; justify-content:center; }
.social-nav .social-icons img { border: none; }
.social-nav .social-icons i { color:#b60000; margin:10px;}

/*  Hamburger Menu adjustment */
@media (max-width: 1022px) {
  .social-nav .social-icons img {margin:5px;}
}

.nav-spacer {  margin-top: 1.5em;  border-bottom: none;  border-top: none;}


/*********************************************
         MOBILE MENU BOTTOM LINK AREA
***********************************************/
li.mobile-quick-links,
li.remove-search-border,
li.remove-social-border {  margin-top: 1.5em;}

li.mobile-quick-links:after,
li.remove-search-border:after,
li.remove-social-border:after {  border: 0; border-color:transparent}


/******************************************
     GREY ACCORDION
*******************************************/
.grey-accordion { margin-bottom: 25px; clear:both}
.grey-accordion .panel { margin-bottom: 0.5em; border-radius: 5px; }
.grey-accordion .panel-heading {
  min-height: 55px;
  cursor: pointer;
  background: #ececec;
  color: #b60000;
  display: flex;
  align-items: center;
  text-decoration: none;
}
.grey-accordion .panel-heading .panel-title {
  padding-top:10px;
  padding-bottom:10px;
  padding-right:12px;
  padding-left:5px;
  margin-top:0;
  margin-bottom:0;
  color: #b60000;
  font-weight: normal;
  text-decoration: none;
  font-size: 1.2em;
}
.grey-accordion ul {
   line-height: 2em;
   list-style-type: disc;
}
.grey-accordion ul a { display:inline-block; text-decoration:none; }
.grey-accordion ul a:hover { color: #000; text-decoration:underline; }
.grey-accordion li::marker { color: #aaa; }
.grey-accordion .panel-heading.collapsed a, .grey-accordion .panel-heading.collapsed .panel-title { color: #333;  text-decoration: none;}
.grey-accordion .panel-heading:hover a, .grey-accordion .panel-heading:hover .panel-title  { text-decoration: underline;  color: #b60000; }

.grey-accordion .panel-heading .accordion-icon:before {
    transform: rotate(90deg);
    transition: all .2s ease-in-out; 
  
}
.grey-accordion .panel-heading.open .accordion-icon:before {
    transform: rotate(180deg);
    transition: all .2s ease-in-out; 
  
}

.grey-accordion .collapse       { text-decoration: none; }
.grey-accordion .collapse .in   { padding: 10px; }
.grey-accordion .panel-collapse { padding: 10px;}
.grey-accordion .panel-collapse table { width:100%; }
.grey-accordion .panel-collapse td { border:1px solid #cdd5da; vertical-align:top; padding:5px;line-height:1.5em;  }
.grey-accordion .panel-collapse td a { word-break: break-word; }

@media (max-width: 767px) {
   .grey-accordion ul a { display:block; text-decoration:underline; }
   .grey-accordion .panel-collapse .text-table td {  padding:0 0 0 40% !important;   }
   .grey-accordion .panel-collapse .text-table td:before {  top:unset; width:40%;   }
}

.grey-accordion .panel-heading.accordion-toggle:before {

  float: left;
  color: #b60000;
  margin: 0 10px;
}

@media (max-width: 767px) {
  .grey-accordion .panel-heading .panel-title { font-size: 1.1em; }
  .grey-accordion .panel-collapse td a {word-break:break-word;}
}
@media (max-width: 450px) {
  .grey-accordion .panel-heading .panel-title { height:auto;font-size: 1.1em; }
  .grey-accordion .panel-collapse a {word-break: break-word; }
  .grey-accordion .panel-collapse a.btn-red-arrow-right,   .grey-accordion .panel-collapse p.btn-red-arrow-right a { display:block; }  
}

@media (max-width: 380px) {
  .grey-accordion .panel-heading    { height:auto; padding: 5px; }
  .grey-accordion .panel-heading .panel-title { font-size: 1.1em; vertical-align: middle; font-size: 1em;}
   
}




/******************************************
     WHITE ACCORDION
*******************************************/
.white-accordion { margin-top: 0; margin-bottom:25px; }
.white-accordion .panel{
  border-radius: 0;
  box-shadow: none;
  border: 1px solid transparent;
  margin: 0 25px 0 0;
  background-color:#fff;

}

.white-accordion .panel-heading {
  padding: 0;
  border-radius: 0;
  color: #f0f0f0;
  background-color: #fff;
  border: 1px solid transparent;
}

.white-accordion .panel-title { font-size: 1.1em; margin:0; padding:0; }
.white-accordion .panel-title > a {
  width:100%;
  display: block;
  padding: 10px 30px 10px 5px;
  text-decoration: none;
  color: #000;
  font-weight: bold;
  white-space: normal;
  line-height:1.6em;
  position: relative;
}

.white-accordion .panel-title > a:focus { text-decoration:underline;}

.white-accordion .panel-title > a.collapsed { font-weight:normal; }


.white-accordion .more-less { float: right; color: #b60000; }
.white-accordion .panel-collapse { padding: 0; margin-left: 5px; display:none; }
.white-accordion .panel-collapse.in { display:block; }
.white-accordion .panel-body { background-color: #f0f0f0; line-height: 2em; border:1px solid #cdd5da; margin-right:0; padding:10px 15px;}

.white-accordion .panel-default > .panel-heading + .panel-collapse > .panel-body {
    border-top-color: #cdd5da;
}
.white-accordion .panel-body td, .white-accordion .panel-body th {
    vertical-align:top;
}

.panel-heading .accordion-toggle:after {
    width: 1%;
    content: "\2212";
    color: #b60000;
    padding-left: 5px;
    position: absolute;
    right: 0;
    top: 10px;
    font-size: 2em;
    font-weight: 600;
    transform: rotate(180deg);
    transition: all .2s ease-in-out;
}

.panel-heading .accordion-toggle.collapsed:after {  
     width: 1%;  
    content: "\2b"; 
    transform: rotate(90deg);
    transition: all .2s ease-in-out;
    top: 0;
    right: 10px;
}

h1 + .white-accordion { margin-top:10px; }
.panel-heading-open { background-color: #ececec !important; }

@media  (max-width: 767px) {
  
  .white-accordion .panel { margin-bottom: 20px; margin-right:0; }  
  .white-accordion .panel-title > a { font-weight: bold; padding:0 25px 0 0; margin-right: 0; width:auto; }
  .white-accordion .panel-collapse { padding: 0; margin-left: 0; }
  .white-accordion .panel-body { 
      padding:10px; 
      background-color:#fff; 
      margin-right:10px; 
      border:0; 
      border-top:0;
      line-height: 1.6em;
   }
  .white-accordion .panel-body td, .white-accordion .panel-body th {
       padding:0;   margin-right:5px; font-size:0.9em;
   }  


}


/******************************************
     PUBLIC SAFETY EMERGENCY ACCORDION
*******************************************/
#emergency-accordion .emergency-icon {
  position: absolute;
  height: 75px;
  width: 75px;
  left:10px;
  margin-right: 3em;
  margin-top: 0;
  float: left;
  border: none;
  clear: both;
  z-index: 9;
}
#emergency-accordion .panel {  border-radius: 0;  box-sizing: border-box; margin-bottom:15px;}
#emergency-accordion .panel-title a { margin-left: 1em;  font-weight: normal;}
#emergency-accordion .panel-heading { cursor: pointer;  position: relative;  background: #ececec;}
#emergency-accordion .panel-heading h3 {
  color: #b60000;
  font-weight: 400;
  font-size:1.4em;
  text-decoration: none;
  position: relative;
  display: inline-block;
  margin-left: 5em;
}
#emergency-accordion .panel-heading a:hover { text-decoration: none;  color: #b60000; }
#emergency-accordion .collapsed {  color: #333;  text-decoration: none; }
#emergency-accordion .collapsed:hover {  text-decoration: none;}
#emergency-accordion .collapse { text-decoration: none; position: absolute; float: none;}
#emergency-accordion .collapse .in {  padding: 15px;  float: none;}
#emergency-accordion .panel-collapse {  position: relative;  padding: 20px 15px 0 15px;}
#emergency-accordion .panel-collapse:first-child {  padding-top: 15px !important;}
#emergency-accordion .panel-collapse:last-child  {  padding-bottom: 15px !important;}
#emergency-accordion .panel-collapse h5 {  font-weight: normal; }
#emergency-accordion .panel-collapse h5 .collapsing {  margin-left: -10em;}

@media (max-width: 767px) {
    #emergency-accordion .panel-title a { margin-left: 2em; }
    #emergency-accordion .panel-heading h3 { font-size: 1em; }
}
/******************************************
     CLICK TO EXPAND - LEARNING COMMUNITIES
*******************************************/

.click-to-expand .showhide-hidden                 { width: 100%;  border-top: 1px solid #999;  overflow:hidden;  display:block;}
.click-to-expand .showhide-hidden .left-image     { width:20%;  float:left; }
.click-to-expand .showhide-hidden .left-image img { width:100%;  height:auto;  padding:0.5em 0;  border:none; }
.click-to-expand .showhide-hidden .right-text     { width: 75%;  float: left; }
.click-to-expand .showhide-hidden .right-text h3  { margin-top:5em;  text-align:left;  font-weight:600;  margin-left:1em;  font-size:1em; }
.click-to-expand .showhide-hidden .expander       { width:5%; float:left;  margin-top:5px;  cursor:pointer; }
.click-to-expand .showhide-hidden .expander .fa-plus,
.click-to-expand .showhide-hidden .expander .fa-minus {
  background-color: #b60000;
  color: #fff;
  height: 20px;
  width: 20px;
  padding: 3px;
  float: right;
}

.click-to-expand .showhide-visible                 { display:none; width:100%; border-top:1px solid #999; overflow:hidden; }
.click-to-expand .showhide-visible .left-image     { width: 25%; float: left; }
.click-to-expand .showhide-visible .left-image img {
  width: 100%;
  height: auto;
  padding-top: 0.5em;
  padding-bottom: 0.5em;
  margin-top: 2em;
  border: none;
}
.click-to-expand .showhide-visible .right-text    { width:70%; float:left;  padding: 10px; }
.click-to-expand .showhide-visible .right-text h3 { margin-top:2em;  font-weight:600;  font-size:1em; }
.click-to-expand .showhide-visible .expander      { width:4%;  float:left;  margin-top:5px;  cursor:pointer; }
.click-to-expand .showhide-visible .expander .fa-plus, 
.click-to-expand .showhide-visible .expander .fa-minus {
  background-color: #b60000;
  padding: 0;
  color: #fff;
  height: 20px;
  width: 20px;
  padding: 3px;
  float: right;
  margin-right: -0.28em;
}

.click-to-expand .active { display: none; }
.click-to-expand .open   { display: block; }


@media (max-width: 1022px) {
    .click-to-expand .showhide-visible .right-text    { width: 70%;  padding:5px; } 
    .click-to-expand .showhide-hidden  .right-text h3 { margin-top:4em; font-size:1em; }
    .click-to-expand .showhide-visible .expander .fa-plus, 
    .click-to-expand .showhide-visible .expander .fa-minus {  margin-right: -0.25em;  }
}




/******************************************
     CAMPUS MAPS
*******************************************/
.campus-maps              { width: 100%; margin-top: 1em; margin-bottom: 1em; }
.campus-maps .map         { margin-bottom: 1em; }
.campus-maps .map iframe  { width: 100%;  height: 400px; }
.campus-maps .map-address { margin-bottom: 1em; }

/******************************************
     College Catalog table of contents
*******************************************/

  td.catalog-indent {padding-left:15px;}

/******************************************
     INNER SLIDER   Including the 350x250 news story slider
*******************************************/

/* Hide images at first */
p.slideshow-container-350-250 img {display:none;}


.inner-slider #slides,
.inner-slider #slides2,
.inner-slider #slides3 { display: none; margin-bottom:1em; }

.inner-slider .slidesjs-navigation { margin-top: 3px; }
.inner-slider #slides .slidesjs-navigation,
.inner-slider #slides2 .slidesjs-navigation {
  margin-top: 5px;
}
.inner-slider a.slidesjs-next,
.inner-slider a.slidesjs-previous,
.inner-slider a.slidesjs-play,
.inner-slider a.slidesjs-stop {
  background-image: url('/media/05-admin/responsivesiteassets/images/btns-next-prev.png');
  background-repeat: no-repeat;
  display: block;
  width: 12px;
  height: 18px;
  overflow: hidden;
  text-indent: -9999px;
  float: left;
  margin-right: 5px;
}
.inner-slider a.slidesjs-next           { background-position: -12px 0;  margin-right: 10px; }
.inner-slider a:hover.slidesjs-next     { background-position: -12px -18px; }
.inner-slider a.slidesjs-previous       { background-position: 0 0; }
.inner-slider a:hover.slidesjs-previous { background-position: 0 -18px; }
.inner-slider a.slidesjs-play           { background-position: -25px 0;  width: 15px; }
.inner-slider a:hover.slidesjs-play     { background-position: -25px -18px; }
.inner-slider a.slidesjs-stop           { background-position: -41px 0;  width: 18px; }
.inner-slider a:hover.slidesjs-stop     { background-position: -41px -18px; }

.inner-slider #slides a:link,
.inner-slider #slides a:visited,
.inner-slider #slides2 a:link,
.inner-slider #slides2 a:visited { color: #333;}

.inner-slider .slidesjs-pagination {
  margin: 6px 0 0;
  float: right;
  list-style: none;
}
.inner-slider .slidesjs-pagination li {
  float: left;
  margin: 0 1px;
}
.inner-slider .slidesjs-pagination li a {
  display: block;
  width: 13px;
  height: 0;
  padding-top: 13px;
  background-image: url('/media/05-admin/responsivesiteassets/images/pagination.png');
  background-position: 0 0;
  float: left;
  overflow: hidden;
}
.inner-slider .slidesjs-pagination li a.active,
.inner-slider .slidesjs-pagination li a:hover.active {
  background-position: 0 -13px;
}
.inner-slider .slidesjs-pagination li a:hover {
  background-position: 0 -26px;
}
.inner-slider a:link,  .inner-slider a:visited { color: #333; }
.inner-slider a:hover, .inner-slider a:active  { color: #9e2020; }
.inner-slider .navbar    { overflow: hidden; }
.inner-slider .fa-pause  { padding-top: 4px; }
/* .inner-slider .col-sm-12 { padding: 0; }  */

.wrap-div-topSpacer {  width: 0px;  height: 80px;  float: left; }
.wrap-div       {  float:left;  clear:both;  margin: 10px;  width:50%; }
.wrap-div-right {  float:right;  width:45%; }

@media (max-width: 450px) {
  .wrap-div-right { width: 95%; }
}

.news-slider { width: 100%; }


/******************************************
     PROGRAM TABLE
*******************************************/
@media screen and (min-width: 768px) {
   .program-table table {width:100%;}
}
.program-table table .new-section { background-color: #ececec; }
.program-table table .top-row     { background-color: #ececec; }
.program-table table .top-row th  { border: 1px solid #333; padding: 0.5em; }
.program-table table tr           { border: 1px solid #333; height: 40px; }
.program-table table td           { border: 1px solid #333; padding: 5px; }
.program-table .boldCapsGrid      { font-weight:700; }

@media screen and (max-width: 767px) {
  
  /* These rules on boldCapsGrid cells are to fix the look on mobile */
  .program-table table.responsive tr td.boldCapsGrid { padding-left:0; text-align:center; background-color:#eaeaea}
  .program-table table.responsive tr td.boldCapsGrid:before { display:none; }
  
  .program-table table.responsive,
  .program-table table.responsive thead,
  .program-table table.responsive tbody,
  .program-table table.responsive th,
  .program-table table.responsive td,
  .program-table table.responsive tr {
    display: block;
  }
  .program-table table.responsive thead tr {
    position: absolute;
    top: -9999px;
    left: -9999px;
    background-color: #ececec;
  }
  .program-table table.responsive tr {
    border: 1px solid #bbb;
    margin-bottom: 10px;
    height: auto;
  }
  .program-table table.responsive td {
    border: none;
    border-bottom: 1px solid #333;
    position: relative;
    padding-left: 45%;
  }
  .program-table table.responsive td:before {
    position: absolute;
    top: 6px;
    left: 6px;
    width: 44%;
    padding-right: 12px;
    text-align: left;
    word-wrap: break-word;
    font-weight: bold;
  }
  .program-table table.responsive tr:first-child {
    position: absolute;
    top: -9999px;
    left: -9999px;
  }
  .program-table table.responsive td:before {
    content: attr(data-content);
    height: 50px;
  }
  .program-table table.responsive td.small-padding  {    padding-top: 5px; padding-bottom: 5px;   min-height: 31px;  }
  .program-table table.responsive td.medium-padding {    padding-top: 15px; padding-bottom: 15px;   }
  .program-table table.responsive td.large-padding  {    padding-top: 25px; padding-bottom: 25px;   }
 
  .program-table .middle-header {
    width: 100% !important;
    margin-left: -35%;
    border: none !important;
    font-weight: bold;
  }
  .program-table .bottom-header {
    width: 100% !important;
    margin-left: -43.5%;
    margin-right: -10px;
    border-bottom: none;
    font-weight: bold;
    border: none !important;
    overflow: hidden;
  }
 
  
  .program-table table.responsive tr:last-child td:before { display:none; }
  .program-table table.responsive tr:last-child td.tdno1  { display:none; }  
  .program-table table.responsive tr:last-child td.tdno2  { display:none; } 
  .program-table table.responsive tr:last-child td.tdno4  { display:none; }   
  
}

/*** This is for the Last Modified Date line between the Program of Study grid and the Associated Text  **/
.program-of-study-last-modified-date {
    font-style: italic;
    padding-left: 0;
    padding-top: 5px;
    padding-bottom: 0;
  
}

/* Program of Study text beneath grid */ 
#icon-key {
   border: 1px solid #cdd5da;
   padding:5px;
   margin:0 0 5px 10px;
   width:35%;
   max-width:300px;
   float:right;

}
#icon-key #icon-key-header {
     text-align:center;
     margin:0;
     padding:0;
     line-height:1.5em;
}

#icon-key p     { padding: 5px; margin: 0; }
#icon-key .far, #icon-key .fa, #icon-key .fal { color: #b60000; text-align:center; font-weight:normal; }


.program-of-study-subheader  { display:inline-block; display:none; margin:2px 0; }
.program-of-study-degree     { float:left; }
.program-of-study-department { float:left; }

.program-of-study-disclaimer { display:inline-block; border:1px solid #b60000;
  								padding:4px;margin:2px 0 10px 0; color: #b60000;}
.program-of-study-disclaimer:empty {display:none;}
.program-of-study-disclaimer a {color:#b60000; text-decoration:underline;}


.course-description h3 { font-weight: bold; }
.course-description p  { margin-bottom: 1em;}



/******************************************
   PROGRAM OF STUDIES SEARCH
*******************************************/
.programs-of-study .program-search {  
  width:100%;  
  height: 40px;  
  margin-top:0.5em;  
  border: 1px solid #ccc;
  padding: 1px 10px;
}

.programs-of-study .program-tabs {  margin-top: 1em;  background-color: #fff; }
.programs-of-study .program-tabs .nav-tabs {
    border-bottom:0;
    display:flex;
}
.programs-of-study .program-tabs .nav-tabs li {
  background-color: #ececec;
  text-align: center;
  width: 31%;
  margin-left: 4px;
  font-weight: bold;
  color: #333;
  font-size: 1.2em;
  cursor:pointer;
}
.programs-of-study .program-tabs .nav-tabs li a { padding:10px;}
.programs-of-study .program-tabs .nav-tabs .active {  background-color:#555;  color:#fff; }
.programs-of-study .program-tabs .nav-tabs .active a {  background-color:#555;  color:#fff; }
.programs-of-study .course-list    { width: 100%;}
.programs-of-study .course-list h2 { font-weight: bold; }
.programs-of-study .course-list hr { display:block; margin:0.5em auto 1em auto; border-top:1px dotted #333;}

.programs-of-study .programs-list-box    { 
   display:flex;  
   flex-wrap:wrap;
   list-style:none;  
   margin-left:-2em;  
   width:100%;  
}
.programs-of-study .programs-list-box li {
  /* float: left; */
   background-color: #efefef;
   border: 1px solid #cdd5da;
   width: 32%;
   margin: 0.5em 0 5px 5px;
  /* height: 150px; */
   position:relative;
   padding:10px;
}

.programs-of-study .programs-list-box li .programtitlesort    { font-weight:600;  font-size:1em;  margin:0; line-height:1.2em; padding:0; }
.programs-of-study .degreetype     { display:inline-block; }
.programs-of-study .degreetype-text     { margin-left:5px; margin-right:10px; }
.programs-of-study .degreetype .fal     { color: #b60000; }
.programs-of-study .programs-list-box li .pos-icon  { color:#b60000; margin:0 5px 0 0; display:inline;}



@media (max-width: 1200px) {
  .programs-of-study .program-tabs .nav-tabs li { font-size: 1.2em; min-height: 4em; }
  .programs-of-study .program-tabs .nav-tabs .active a { min-height: 4em;  }
}
@media (max-width: 991px) {
   .programs-of-study .programs-list-box li.selectprogram {  width: 48%;  }
}
@media screen and (max-width: 767px) {
   .programs-of-study .program-tabs .nav-tabs li {    font-size: 1.2em;  }
   .programs-of-study .programs-list-box li.selectprogram {  width: 48%;  }
   .programs-of-study .programs-list-box li .pos-icon  {  padding: 11px; }
}

@media screen and (max-width: 500px) {
  .programs-of-study .program-tabs .nav-tabs li        { height:80px; font-size:14px; }
  .programs-of-study .program-tabs .nav-tabs li a      { padding:5px; font-size:14px; }
  .programs-of-study .program-tabs .nav-tabs .active a { height:100%; }
  .programs-of-study .programs-list-box li .pos-icon  {  padding: 3px; margin:0 10px;}  
}

@media screen and (max-width: 450px) {
  .programs-of-study .programs-list-box li {    width: 100% !important; height:auto; min-height:70px; background-color:#f4f4f4;  }
  .additional-info { margin-top:10px; box-shadow:unset;  -webkit-box-shadow:unset; -moz-box-shadow:unset; border-radius:unset;}
}


/****************************************************
       Selective programs/Gainful employment
*******************************************************/
.sptooltip {
    background-color: #ffffff;
    border: 1px solid #888;
    box-shadow: 2px 2px 2px #999999;
    color: #0050C9;
    text-align:center;
    display: none;
    font-size: 1em;
    margin-left: 40px;
    margin-top: 12px;
    padding: 5px;
    position: absolute;
    width: 206px;
    z-index:99;
}

.sptooltip-gainful   {  margin-left: 130px; margin-top: 12px; }
.sptooltip-selective {  margin-left: 30px;  margin-top: 12px; }

.pos-icon:hover + div.sptooltip {  display:block;  cursor:pointer;  }
.sptooltip:hover { display:block; text-decoration:underline; }

@media( max-width:500px ) {
  .sptooltip { min-width:240px; width:90%; padding:10px;  }
  .sptooltip-gainful {  margin-left: 130px; margin-top: 12px;}
  .sptooltip-selective {  margin-left: 30px; margin-top: 12px;} 
}


/******************************************
     NEWS ITEM
*******************************************/
.news-item-title { color:#b60000; padding:0 1em 0 0; margin:0 0 1em 0; }  

.news-item {
  width: 100%;
  min-height:120px;
  border: 2px solid #D3D3D3;
  position: relative;
  display: inline-block;
}
.news-item .news-item-date {
  width: 15%;
  height: 100%;
  position: absolute;
  background-color: #ececec;
  text-align: center;
  float: left;
}
.news-item .news-item-date .news-item-month, .news-item .news-item-date .news-item-year {
  margin-top: 0;
  padding-top: 1em;
  font-size: 1.2em;
}
.news-item .news-item-date .news-item-day {
  margin-bottom: -0.5em;
  margin-top: 0;
  font-weight: normal;
  font-size: 26px;
  color:#b60000;
}
.news-item .news-item-body {
  width: 84%;
  height: 100%;
  position: relative;
  float: right;
  margin-left: 6.5em;
  margin-bottom: 2em;
  padding: 5px 15px 10px 5px;
  min-height: 70px;
  background-color:#ffffff;
}

a.news-item-title-link:hover {
    text-decoration-color: #fff;
}

@media (max-width: 525px) {
 .news-item-title {
    font-size:1.1em;
    font-weight:600;
    color: #444;
    padding: 0;
    margin: 0 0 1em 0; 
    line-height: 1.4em;
  } 
  
  .news-item .news-item-date .news-item-day {font-size: 24px; margin-top:0;}
  .news-item .news-item-date .news-item-month, .news-item .news-item-date .news-item-year {
       margin-top: 0;
       padding-top: 1em;
  }
}
@media (max-width: 1022px) and (min-width: 992px) {
  .news-item .news-item-body {
    margin-left: 5.5em;
  }
}
@media (max-width: 991px) {
  .news-item .news-item-body {
    margin-left: 5em;
  }
}
@media (max-width: 767px) and (min-width: 736px) {
  .news-item .news-item-body {
    margin-left: 9em;
  }
}
@media (max-width: 735px) {
  .news-item .news-item-body {
    margin-left: 7.5em;
  }
}
@media (max-width: 450px) {
  .news-item .news-item-body {
    margin-left: 5em;
  }
}
@media (max-width: 420px) {
  .news-item .news-item-body {
    margin-left: 5.5em;

  }
}
@media (max-width: 330px) {
  .news-item .news-item-body {
    margin-left: 4.8em;
  }
}


.press-release, .news-brief, .public-notice, .web-story, .event-recap, .bhcc-spotlight {
  text-align: left;
  position: absolute;
  right: 0;
  bottom: 0;
  padding: 0 8px;
  margin-top: 0.5em;
  color: #fff;
  font-weight: bold;
  width: 230px;  
 
}


.press-release {  background-color: #b60000; }
.news-brief    {  background-color: #585348; }
.web-story     {  background-color: #888;    }
.public-notice {  background-color: #069;    }
.event-recap   {  background-color: #001e4d; }
.bhcc-spotlight {  background-color: #006071; }

.news-item .press-release a, .news-item .web-story a, .news-item .public-notice a, .news-item .news-brief a, .bhcc-spotlight a, .news-item .event-recap a {
  color: #fff;
}
.news-item .press-release span, .news-item .web-story span, .news-item .public-notice span, .news-item .news-brief span, .news-item .bhcc-spotlight span, .news-item .event-recap span {
  float: right;
  padding: 0;
  margin-top: 0.5em;
}



@media (max-width: 1200px) {
  .news-item .press-release a, .news-item .web-story a,.news-item .public-notice a, .news-item .news-brief a, .news-item .bhcc-spotlight a, .news-item .event-recap a {
    font-size: 0.9em;
  }
}
@media (max-width: 1022px) {
  .news-item .press-release a, .news-item .web-story a,.news-item .public-notice a, .news-item .news-brief a, .news-item .bhcc-spotlight a, .news-item .event-recap a {
    font-size: 0.9em;
  }
}


/****************************************
   Right Column Grey Aside
****************************************/
.three-right-shaded-news              { text-align:left; margin:0 0 30px 0; padding:1px 1em; background-color:#f4f4f4; }
.three-right-shaded-news-header       { margin:10px 0; text-align:center; color:#b60000; }
/*.three-right-shaded-news h2           { margin:10px 0; text-align:center; color:#b60000; }
.three-right-shaded-news h3           { text-align:center; margin-top:20px; font-weight:normal; color:#b60000; }*/
.three-right-shaded-news hr           { /*border-color: #ccc; border-style:dashed;*/border: 0.5px dashed #999 !important;}
.three-right-shaded-news .news-source { text-align: right; font-weight: bold; font-style: italic;}
.three-right-shaded-news .news-link   { text-align: center; }


/****************************************
   Left Column Grey Aside - large negative margin-top
****************************************/
.three-left-shaded { background-color: #f0f0f0; padding: 10px; margin-top: -30rem; }

@media (max-width: 767px) {
  .three-left-shaded {  margin-top: 4rem; margin-bottom: 4rem;  }
}


/******************************************
  LHC - LEFT COLUMN CONTENT.  
      For Content Types use "resp/lhs" layout
      In Page Layouts it goes in the "left-left" div
*******************************************/
.landing-left-boxed {
  border: 1px solid #cdd5da;
  text-align: left;
  width: 100%;
  margin-bottom: 1em;
  margin-top: 20px;
  padding: 1em;
  box-shadow: 0 2px 2px 0 #888;
}

.landing-left-boxed p  { font-size:14px; }
.landing-left-boxed h3 { color: #b60000; font-weight:normal; margin: 0 auto;}

@media (max-width: 450px) {
  .landing-left-boxed {  width: 100%; }
}








/*********************************************
               Staff Bios
***********************************************/
.staffBioWrapper {
    background-color: #f0f0f0;
    border: 1px solid #cdd5da;
    padding: 10px 10px 0 10px;
    margin-bottom: 10px;
}
.staffBioImage { float: left; margin: 0 15px 10px 0; }
.staffBioImage img { width:200px !important; max-width:200px !important; height:auto !important; }
.staffBioImage:empty {margin:0;}
.staffBioName > h3 {    padding: 0; margin-top:0; }
.staffBioName > h2 {    padding: 0; margin-top:0; color:#000;font-size:1.3em;}
.viewhide { padding-top: 5px; cursor:pointer; }
.viewhide .readMoreView { font-size:14px; }

.limitFullChar.hiddenPortion.active { display: inline !important; }
.hiddenPortion {   display:none; transition: all 1s ease-out;}
.rest-of-bio-wrapper { padding:5px 10px 0 10px;}


/*  For pages like bhcc.edu/alliedhealth/courses/  */
@media (max-width: 767px) {
    ul.course-desc-link-list {margin-top:40px;}
    ul.course-desc-link-list li {padding-bottom:10px; font-size: 18px;}
}



/************************************
        BHCC in the news
***************************************/
.in-the-news-block {
    width: 100%;
    border: 1px solid #cdd5da;
    margin-bottom: 0.5em;
    padding: 0 20px 15px;
    box-shadow: 2px 2px 2px #ccc;
}

.in-the-news-block:hover { box-shadow: 2px 2px 2px #888; }
.in-the-news-block h3 { margin:0 0 10px 0;}
.in-the-news-block .outlet-name {
    float: right;
    margin-top: -1em;
    font-style: italic;
    color: #333;
}

@media (max-width: 767px) {
  .in-the-news-aggr  { margin-top: 3em;}
  .in-the-news-block { width:100%;  border:1px solid #cdd5da; margin-bottom:0.5em; padding:5px 20px; } 
  .in-the-news-block h3 { margin:0 0 10px 0;}
  .in-the-news-block .outlet-name {margin-top: 1.5em;}
}




/*******************************************
   BHCC ALERT for every page
******************************************/
.bhccalert {
    background-image: url('/media/05-admin/styleassets/cssimages/alerticon4.png');
    background-position: left center;
    background-repeat: no-repeat;
    font-size: 1.2em;
    font-weight: bold;
    padding: 10px 0 10px 25px;
    position: relative;
    top: 9px;
}

/*******************************************
    BHCC ALERT for the PUBLIC SAFETY PAGE
******************************************/
div.alert-article-wrapper { border: 1px solid #cdd5da; padding:10px; box-shadow: 0 2px 2px 0 #888; }

h1.alert-article-title {
    color: #b60000; 
    font-size:2em;
    margin:20px 5px 10px 5px;
    font-weight:normal;
    text-align:center;
}  
div.alert-article-text { color:#b60000; font-weight:700; padding:8px; text-align:left; }
div.no-alerts-at-this-time { font-size:1.5em;    font-weight:700;    color: #b60000; }

@media (max-width: 767px) {
   div.alert-article-wrapper { margin-top:2em; }
   h1.alert-article-title { font-size: 20px; margin:0; }
   div.no-alerts-at-this-time {  margin-top:2em;  } 
}

/*******************************************
		GENERAL HTML TABLE
*******************************************/
.content-block td {
    border: 2px solid #fff;
    min-height: 35px;
    padding: 7px 10px;
    /*background-color: #eaeaea*/
  
}

.content-block th {
   padding: 7px 10px;
}

/*  T4 WYSIWYG BUG: The bottom border is invisible at 1px, so it needs 2px */
.content-block table {
     border: 1px solid #e8e8e8; 
     /*border-bottom: 2px solid #eaeaea;*/ 
     width: 100%;
     margin-bottom: 20px;
     color:#000;
}


.content-block tr:nth-of-type(odd)  { background-color: #f4f4f4; } 
.content-block tr:nth-of-type(even) { background-color: #fff; }

@media (min-width:768px) and (max-width:1023px) {
   .content-block td, .content-block th { 
     padding:1px;
   }
}


/*******************************************
		TRANSPARENT HTML TABLE nocolor for positioning only
*******************************************/
.content-block table.nocolor  {	background-color: transparent; border:none; height:unset; color:#000;}
.content-block table.nocolor tr { background-color: transparent; border:none; height:unset; }
.content-block table.nocolor tr:hover {	background-color: transparent; border:none; }   
.content-block table.nocolor tr td    {	background-color: transparent; border:none; padding:2px; height:unset; vertical-align:top;}

/* ?  */
table.novalue tr td   { background-color: #fff}
table.novalue tr:hover{ background-color: #eaeaea}


/********************************************************************
        Gallery Images -  Library Archives Gallery
*********************************************************************/
.galleryThumb {height:125px; width:125px; overflow:hidden;}
.galleryThumb img { max-width: 150%; }

.galleryThumbWrapper {
    background-color: #ffffff;
    border: 1px solid #dddddd;
    margin-bottom: 20px;
    padding: 5px 5px 15px;
    width: 140px;
    float: left;
    margin: 5px
}

.galleryThumbWrapper img {  max-width: 150%;  height: 140px;}

.galleryThumbCaption {   padding: 2px 0; text-align: left; line-height: 1em; }  

/*Athletics News*/
.athletic-news {
    background-color: #eaeaea;
    border: 1px solid #ccc;
    display: block;
    list-style: outside none none;
    min-height: 25px;
    padding: 5px;
}

.athletic-news li {
    border-bottom: 1px solid #ccc;
    min-height: 25px;
    padding: 5px;
    list-style: none;
}


/*****************************************
  POSSIBLY OBSELETE
   
*****************************************/

.slideTwo p, .slideTwo h2 {
    color: #fff;
    padding: 15px;
    text-align: center;

}
.slideTwo p.agmoreDetails { text-align: right; }

/*************************************************
    pdfjumpto, a right arrow in a circle link
***************************************************/

.pdfjumpto a { font-weight: bold; display:inline-block; vertical-align:top; }

.pdfjumpto span.fa {  
  line-height:1;
  display:inline;
  color: #b60000;
  position: relative;
  top: 2px;
  margin-left: 5px;
  font-weight:normal;

}

.pdfjumpto span.fa:hover { color: #0050c9;}

/*************************************************
    LINK-BACK and LINK-FORWARD (like pdfjumpto)
***************************************************/
p.link-back a:before, div.link-back a:before, a.link-back:before, span.link-back a:before {
  content:"\f0a8";
  font-family: 'Font Awesome 6 Pro', fontawesome;
  line-height:1;
  display:inline-block;
  color: #b60000;
  position: relative;
  top: 1px;
  margin-right: 5px;
  font-weight:normal;
  font-size:1em;  
}

p.link-forward a:after, div.link-forward a:after, a.link-forward:after, span.link-forward a:after {
  content:"\f0a9";
  font-family: 'Font Awesome 6 Pro', fontawesome;
  line-height:1;
  display:inline-block;
  color: #b60000;
  position: relative;
  top: 1px;
  margin-left: 5px;
  font-weight:normal;
  font-size:1em;  
}

.nav-overview {
  text-transform: uppercase;
}




/*****************************************************************
      THE RED BUTTON WITH THE ARROW (LITTLE VERSION)
****************************************************************/
.btn-100-red-arrow-right {
    width: 150px;
    background-color: #b60000;
    padding: 2px 30px 2px 10px;
    font-size: 14px;
    text-decoration: none;
    text-align: left;
    display: block;
    font-weight: bold;
    color: #fff ;
    border-top: 2px solid #ff4447;
    border-bottom: 2px solid #852224;
    border-left: 2px solid #852224;
    border-right: 2px solid #ff4447;
    background-image: url('/media/05-admin/styleassets/cssimages/btn_bg_go_small.png');
    background-position: 118px -59px;
    background-repeat: no-repeat;
}
a.btn-100-red-arrow-right:hover, span.btn-100-red-arrow-right a:hover {
    color: #fff;
    text-decoration: none;
    box-shadow: 1px 1px 1px #888; 
}

.red-text { color:#b60000 !important; }

/*****************************************************************
      Override Bootstrap defaults for hover and focus
***************************************************************/
div a.btn-100-red-arrow-right:visited, div a.btn-100-red-arrow-right:focus, div a.btn-100-red-arrow-right:hover,
div span.btn-100-red-arrow-right a:visited, div span.btn-100-red-arrow-right a:focus, div span.btn-100-red-arrow-right a:hover {
    color: #fff;
    text-decoration: none;
}

/*****************************************************************
      THE RED BUTTON WITH THE ARROW  - medium size
****************************************************************/
div a.btn-200-red-arrow-right, div span.btn-200-red-arrow-right a, p.btn-200-red-arrow-right a, td.btn-200-red-arrow-right a {
    min-width: 100px;
    background-color: #b60000;
    font-size: 16px;
    text-decoration: none;
    display: inline;
    font-weight: bold;
    text-shadow: 1px -1px 1px #404040;
    color: #fff;
    border-top: 1px solid #ff4447;
    border-bottom: 1px solid #952224;
    border-left: 1px solid #952224;
    border-right: 1px solid #ff4447;
    background-image: url('/media/05-admin/styleassets/cssimages/btn_bg_go.png');
    background-position: bottom 2px right 6px;
    background-repeat: no-repeat;
    padding: 3px 40px 3px 10px;
    line-height:1.5em;
}


a.btn-200-red-arrow-right:hover, span.btn-200-red-arrow-right a:hover,  p.btn-200-red-arrow-right a:hover {
    color: #fff;
    background-color: #b60000;
    text-decoration: none;
    box-shadow: 1px 1px 1px #888;  
}

/*****************************************************************
      THE RED BUTTON WITH THE ARROW  - any size
****************************************************************/
div a.btn-red-arrow-right, div span.btn-red-arrow-right a, p.btn-red-arrow-right a,  td.btn-red-arrow-right a, input.btn-red-arrow-right {
    background-color: #b60000;
    text-decoration: none;
    display: inline-block;
    font-weight: bold;
    color: #fff;
    background-image: url('/media/05-admin/styleassets/cssimages/btn_bg_go.png');
    background-position: bottom 10px right 10px;
    background-repeat: no-repeat;
    padding: 5px 40px 5px 20px;
    line-height:1.5em;
    border:1px solid #888;
    text-shadow: none;
}
@media (max-width:450px) {
   p.btn-red-arrow-right,  td.btn-red-arrow-right, div.btn-red-arrow-right { 
      text-align:center;
  }
  
  div a.btn-red-arrow-right, div span.btn-red-arrow-right a, p.btn-red-arrow-right a,  td.btn-red-arrow-right a, input.btn-red-arrow-right {
      font-size: 1em;
      padding:5px 40px 5px 20px;
  }
}

a.btn-red-arrow-right:hover, span.btn-red-arrow-right a:hover,  p.btn-red-arrow-right a:hover,
td.btn-red-arrow-right a:hover, input.btn-red-arrow-right:hover {
    color: #b60000 !important;
    text-decoration: none;
    box-shadow: 1px 1px 1px #888; 
    background-color: #fff;
    border:1px solid #b60000;
    text-shadow: none;
}


/*****************************************************************
      RED BUTTON WITH THE ARROW  - Light
****************************************************************/
div a.btn-red-light, div span.btn-red-light a, p.btn-red-light a,  td.btn-red-light a, input.btn-red-light {
    background-color: #b60000;
    text-decoration: none;
    display: inline-block;
    font-weight: normal;
    color: #fff;
    padding: 5px 10px;
    line-height:22px;
    border-radius:8px;
    border:1px solid #888;
}
@media (max-width:400px) {
  div a.btn-red-light, div span.btn-red-light a, p.btn-red-light a,  td.btn-red-light a, input.btn-red-light {
      font-size: 1em;
  }
}

a.btn-red-light:hover, span.btn-red-light a:hover,  p.btn-red-light a:hover,
td.btn-red-light a:hover, input.btn-red-light:hover {
    color: #b60000;
    text-decoration: none;
    box-shadow: 1px 1px 1px #888; 
    background-color: #ececec;
    border:1px solid #800;
}

/*****************************************************************
      Bland RED BUTTON
****************************************************************/
div a.btn-red, div span.btn-red a, div.btn-red {
    min-width: 160px;
    background-color: #b60000;
    text-decoration: none;
    display: block;
    font-weight: bold;
  /*  text-shadow: 1px -1px 1px #000000; */
    color: #fff;
    border-top: 2px solid #ff4447;
    border-bottom: 2px solid #852224;
    border-left: 2px solid #852224;
    border-right: 2px solid #ff4447;
    padding: 10px 30px 10px 10px;
    cursor:pointer;
}

/*****************************************************************
      RED BUTTON 2022
****************************************************************/
a.button-red, .button-red-container a, p.button-red a, p.button-red-no-link, div a.btn-red-arrow-right, div span.btn-red-arrow-right a, p.btn-red-arrow-right a, td.btn-red-arrow-right a, input.btn-red-arrow-right, .fake-button-red {
    border: 1px solid rgba(182,0,0,0.5);
    color: white;
    font-size: 1em;
    font-weight: 500;
    background-color: #b60000;
    border-radius: 25px;
    padding: 5px 15px;
    text-align: center;
    display: inline-block;
    text-transform: none;
    text-shadow: none !important;
    text-decoration-color: #b60000;
    width: fit-content;
    line-height: 1.5em;
}

div a.btn-red-arrow-right, div span.btn-red-arrow-right a, p.btn-red-arrow-right a, td.btn-red-arrow-right a, input.btn-red-arrow-right {
    padding: 5px 3em 5px 2em;  
}

aside div a.btn-red-arrow-right, aside div span.btn-red-arrow-right a, aside p.btn-red-arrow-right a,
aside td.btn-red-arrow-right a, aside input.btn-red-arrow-right {
    padding: 5px 2em 5px 1em; 

}


@media(max-width:767px) {
  
  
  div a.btn-red-arrow-right, div span.btn-red-arrow-right a, p.btn-red-arrow-right a, td.btn-red-arrow-right a, input.btn-red-arrow-right {
      padding: 5px 2em 5px 1em;  
      font-size:1em;
  } 
  
}


/************************************************************************
    Button Resembling Main Menu Bar  
************************************************************************/
p.button-resembling-main-menu a, a.button-resembling-main-menu, span.button-resembling-main-menu, td.button-resembling-main-menu a {
    padding: 8px;  
    background-color: #b60000; 
    display: block; 
    color: #fff; 
    text-decoration: none;
    text-align: center; 
    margin: 20px auto;
    line-height: 1.5em;
    border-radius:4px;
    width: fit-content;
}

.button-resembling-main-menu a:hover, a.button-resembling-main-menu:hover  {
    box-shadow: 1px 1px 1px #000; 
    color: #fff; 
    text-decoration: none;  
    background-color: #b60000; 
}


.greyBackground           { background-color:#ececec;  padding:5px; }
.greyBackground a p       { padding: 10px;  border-bottom:1px solid #C9CFD6; }
.greyBackground a p:hover { background-color:#C9CFD6;  padding:12px }

/*  ?  Button Focus */
button.pull-left, button.pull-left span.fa:focus { outline: none; }

/*Program Heading*/
.program-heading { margin-bottom: 0.5em;   }
ul.degree-program-list { list-style-type:disc; }
ul.degree-program-list li a { display:inline-block; width:100%; padding:5px 0;}

/***************************************************
      Safari MegaMenu Hack
****************************************************/
@media screen and (min-color-index:0) and (-webkit-min-device-pixel-ratio:0) { 
    .safari_only {  min-height: 10em;    }
}


/*************************************************


****************************************************/
a .active-crumb {
    background-color: #b60000 !important;
    height: 40px !important;
    margin: -1.2em 0 0 -1em !important;
    padding-left: 1em !important;
    padding-top: 0.4em !important;
    width: 110% !important;
}

#menu #alertwrapper{ padding: 0 0 5px 1em !important; }

li #alertwrapper {
    margin-top: -3em !important;
    float: right !important;
    margin-right: -2.5em !important;
}

li #alertwrapper a {
    color: #fff !important;
    font-size: 1em !important;
    background-image: url('/media/05-admin/styleassets/cssimages/alerticonwhite.png') !important;
    padding: 35px 0 0 0 !important;
    background-position: center !important;
  
  
}
/*Bootstrap Over-ride dropdowns mobile*/
@media (max-width: 767px){
	.dropdown-menu .active a,
	.dropdown-menu .active a:focus,
	.dropdown-menu .active a:hover {
		background-color: #e7e7e7;
	}
}

.parentlink   { margin-top: -0.7em; }
.parentlink a { font-size: 1.2em; }
.parentlink a span { margin-right: 1em; }

/********************************************
      COPYRIGHT edit shortcut
********************************************/
a.t4Edit-page { text-decoration: none; }

.dropdown-menu .active a { background-color:#ececec; }



/*********************************************************************************
                     Responsive table types styles  
************************************************************************************/
table.responsive tr td,
table.numbers-table tr td,
table.text-table tr td,
table.evenly-split-table tr td,
table.large-responsive tr td {
  	border: 1px solid #c8c8c8;
    height:auto;
}
table.responsive tr td a,
table.numbers-table tr td a,
table.text-table tr td a,
table.evenly-split-table tr td a,
table.large-responsive tr td a{
   word-break:break-word;
}

table.responsive tr:hover, table.numbers-table tr:hover,
table.text-table tr:hover, table.evenly-split-table tr:hover, table.large-responsive tr:hover {
    background-color: #fff;
    outline: 1px solid #ddd;
}

table.responsive thead tr:first-child td,
table.numbers-table thead tr:first-child td,
table.text-table thead tr:first-child td,
table.evenly-split-table thead tr:first-child td,
table.large-responsive thead tr:first-child td,
table.responsive tr:first-child th,
table.numbers-table tr:first-child th,
table.text-table tr:first-child th,
table.evenly-split-table tr:first-child th,
table.large-responsive thead tr:first-child th {
  	border: 1px solid #ddd;
    background-color: #ececec;
    font-weight:700;
    text-shadow:none;
    padding:10px 1px 10px 5px;
    line-height:1.5em;
}

/*  Program of Studies table adjustments */
.program-table table.responsive tr td {
  	border: 1px solid #888;
    background-color: #fff;
    height:auto;
}

table.large-responsive.language-institute { font-size:0.9em; }

/**************************************
  Main Contents Event Listings
***************************************/
table.main-content-events-table th { font-weight:700; border-bottom:4px solid #eaeaea; padding:5px; }
table.main-content-events-table td.main-content-events-title { width:40%; }
tr.main-content-events-row    { background-color:#fff !important; }
tr.main-content-events-row td { background-color:transparent; border-left:0;border-right:0;border-top:0; border-bottom:4px solid #eaeaea; padding:5px; }
th.main-events-content-time { min-width:80px; }
table.main-content-events-table a[href=""] {
      display: none;
}


@media screen and (max-width: 1022px) {
  table.main-content-events-table { width: 100%;}

  table.responsive, table.responsive thead, table.responsive tbody,
  table.numbers-table, table.numbers-table thead, table.numbers-table tbody,  
  table.text-table, table.text-table thead, table.text-table tbody,
  table.evenly-split-table, table.evenly-split-table thead, table.evenly-split-table tbody {
      display: block;
  }

  table.responsive caption, table.numbers-table caption,
  table.text-table caption, table.evenly-split-table caption {
      width: 100%;
      text-align: center; 
  }
  
  table.responsive tr, table.numbers-table tr,
  table.text-table tr, table.evenly-split-table tr, table.main-content-events-table tr {
      display: block;
      border: 0;
      padding-bottom: 15px;
      height: auto;
      border-bottom: 4px solid #ddd;
  }

  table.responsive tr th, table.numbers-table tr th,
  table.text-table tr th, table.evenly-split-table tr th {
      display: block;
      height: auto;
      font-weight: normal;
  }
  table.responsive tr td, table.numbers-table tr td,
  table.text-table tr td, table.evenly-split-table tr td, table.main-content-events-table td {
      display: block;
      height: auto;
      border: none;
      position: relative;
      background-color: #fff;
      word-wrap:break-word; 
  } 
  
  table.responsive tr td.tdno0, table.numbers-table tr td.tdno0,
  table.text-table tr td.tdno0, table.evenly-split-table tr td.tdno0, table.main-content-events-table td.tdno0  {
      font-weight:600;
  } 
  
  table.responsive tr td:before, table.numbers-table tr td:before,
  table.text-table tr td:before, table.evenly-split-table tr td:before, table.main-content-events-table td:before {
      content: attr(data-content);
      height: auto;
      position: absolute;
      top: 6px;
      left: 6px;
      text-align: left; 
      padding-right: 10px;    
  }   
  
 table.responsive tr:first-child,
 table.numbers-table tr:first-child,  
 table.text-table tr:first-child,  
 table.evenly-split-table tr:first-child, table.main-content-events-table tr:first-child  {
      position: absolute;
      top: -9999px;
      left: -9999px;
      font-weight:normal;
      background-color: #ececec;    
  }
  
  table.responsive td.small-padding, table.numbers-table td.small-padding,
  table.text-table td.small-padding, table.evenly-split-table td.small-padding, table.main-content-events-table td.small-padding {
    /*  min-height: 16px; */
  }
  table.responsive td.medium-padding, table.numbers-table td.medium-padding,
  table.text-table td.medium-padding, table.evenly-split-table td.medium-padding {
      padding-top: 10px;
      padding-bottom: 20px;
      min-height: 30px;    
  }
  
  .medium-padding:before { padding-top: 4px; }
  
  table.responsive td.large-padding, table.numbers-table td.large-padding,
  table.text-table td.large-padding, table.evenly-split-table td.large-padding {
      padding-top: 25px;
      padding-bottom: 25px;
      min-height: 55px;
  } 
  
  
    
  /*************************************************** 
    STYLE for generic .responsive table

  **********************************************************/
  table.responsive tr td        { padding-left: 50%; }
  table.responsive tr td:before { width: 50%; }  
  
  /*************************************************** 
  TABLE FOR FACULTY DIRECTORIES AND WAIVERS
      Hesders are 25% width in mobile format  Content is TEXT
  **********************************************************/
  table.text-table tr td        { padding-left: 25%; }
  table.text-table tr td:before { width: 25%; }
  table.text-table tr td:nth-child(2n) {  background-color: #fff; }    
  
  /***************************************************
  TABLE FOR TUITION & FEES (Prices, numbers)
      Headers are 80% width in mobile format
      Headers are big, but content is all prices and small
  **********************************************************/
  table.numbers-table tr td          { padding-left: 80%; word-wrap:normal; }
  table.numbers-table tr td:before   { width: 80%; }
  table.numbers-table tr td:nth-child(2n) {  background-color: #f0f0f0; }
  
   /*************************************************** 
    TABLE with text in headers and data rows
   **********************************************************/  
  table.evenly-split-table tr td        { padding-left: 52%; }
  table.evenly-split-table tr td:before { width: 48%; }  
  table.evenly-split-table tr td:nth-child(2n) {  background-color: #f0f0f0; }  

  /*************************************************** 
    TABLE Admissions Info session, Transfer, Advising and LifeMap events
   **********************************************************/  
  table.main-content-events-table tr td        { padding-left: 52%; }
  table.main-content-events-table tr td:before { width: 48%; }  
  table.main-content-events-table tr td:nth-child(2n) {  background-color: #fff; } 
  table.main-content-events-table td.tdno0 {padding-left:0;}  
  table.main-content-events-table td.tdno0:before { content:" "; width:0; }  
  table.main-content-events-table td.main-content-events-title { width:100%; }
  table.main-content-events-table td.main-content-events-register {padding-left:0; text-align:center;}
  table.main-content-events-table td.main-content-events-register:before { content:" "; width:0;}
  
   /***************************************************
   programs of study tables  Defined in main.css
   **********************************************************/ 
  .program-table table.responsive tr td { border: none; }
  
  
}   /* END @media screen and (max-width: 767px)  */


@media screen and (max-width: 1500px) {

  table.large-responsive, table.large-responsive thead, table.large-responsive tbody {
      display: block;
  }

  table.large-responsive caption {
      width: 100%;
      text-align: center; 
  }
  
  table.large-responsive tr {
      display: block;
      border: 0;
      margin-bottom: 10px;
      height: auto;
  }

  table.large-responsive th {
      display: block;
      height: auto;
      font-weight: normal;
  }
  table.large-responsive td {
      display: block;
      height: auto;
      border: none;
      position: relative;
      background-color: #f8f8fb;
      word-wrap:break-word; 
  } 
  
  table.large-responsive td.tdno0  {
      font-weight:normal;
  } 
  
  table.large-responsive td:before {
      content: attr(data-content);
      height: auto;
      position: absolute;
      top: 6px;
      left: 6px;
      text-align: left; 
      padding-right: 10px;    
  }   
  
 table.large-responsive tr:first-child  {
      position: absolute;
      top: -9999px;
      left: -9999px;
      font-weight:normal;
      background-color: #ececec;    
  }
  
  table.large-responsive td.small-padding {

      min-height: 16px;
  }
  table.large-responsive td.medium-padding {
      padding-top: 10px;
      padding-bottom: 20px;
      min-height: 30px;    
  }
  
  .medium-padding:before { padding-top: 4px; }
  
  table.large-responsive td.large-padding {
      padding-top: 25px;
      padding-bottom: 25px;
      min-height: 55px;
  } 
  
  table.large-responsive tr td        { padding-left: 30% !important; }
  table.large-responsive tr td:before { width: 30%; }
  table.large-responsive.language-institute tr td        { padding-left: 70%; }
  table.large-responsive.language-institute tr td:before { width: 70%; }  
  table.large-responsive tr td:nth-child(2n) {  background-color: #f0f0f0; } 
  
}

/************************************************************************
      See this on Academics->Divisions 
**********************************************************************/
.division-block { clear: both; min-height: 130px;margin-bottom:20px;overflow: hidden;}
.division-block h2 {margin-bottom: 10px; }
.division-block img { width: 300px; height:auto; }
.division-block .division-text {}
.division-block .division-image {float:left; margin-right:20px;}

@media (max-width: 1200px) and (min-width: 768px){
 .division-block { overflow:auto;margin-bottom:0;} 
 .division-block .division-text { width:50%; float:left;}
 .division-block .division-image {width:40%; float:left; margin-right:20px;}  
 .division-block img { margin:0 auto; width:100%; }  
} 

@media (max-width: 767px) {
 .division-block {margin-top:20px;} 
 .division-block .division-text { width:100%; float:none;}
 .division-block .division-image {width:100%; float:none;} 
 .division-block img { margin:0 auto; width:100%; } 
  
}  



/***************************************************
     ADMITTED STUDENTS CHECKLIST (also international admitted)
*****************************************************/
ul.check-list { list-style-type:none; }
ul.check-list li {margin-bottom: 10px;}
ul.check-list>li:before {
  font-family: 'Font Awesome 6 Pro' !important;;
  content: '\f0c8';
  color: #000;
  font-size: 20px;
  font-weight: normal;
  margin-top: 4px;
  margin-right: 14px;
}
ul.check-list li ul  { list-style-type:none; }
ul.check-list li ul li {padding-left: 1em;text-indent: -.7em;}
ul.check-list li ul li:before { 
  content: "• ";
  color: #b60000;  
  font-family: 'Font Awesome 6 Pro' !important;
  font-size:20px;
  margin-left: -5px;
  margin-right: 5px;  
}


/*******************************************************************
   Arrow Box header:  Solid box with right arrow
     If font-size: 40px and padding: 10px,  :before and :after border-width: 36 and margin-top: -36
     If font-size: 32px and padding: 10px,  :before and :after border-width: 28 and margin-top: -28   
     If font-size: 24px and padding: 10px,  :before and :after border-width: 22 and margin-top: -22 
     If font-size: 22px and padding: 6px,   :before and :after border-width: 18 and margin-top: -18  
******************************************************************/

    /****************  LARGE SIZED  ****************/
    .arrow-box-large {   
        font-size: 40px;
        padding: 10px 30px;
        min-width: 320px;
        display: inline-block;
        letter-spacing: 2px;
        border-right: 0;
        border-left: 1px solid #888; 
        border-top: 1px solid #ccc;
        border-bottom: 1px solid #ccc;
        color: #fff; 
        text-shadow: 1px 1px 1px #000; 
        background-color: #b60000; 
        position: relative;
    }
    .arrow-box-large:after, h2.arrow-box-large:before {
        left: 100%; top: 50%; border: solid transparent; content: " ";
        height: 0; width: 0; position: absolute; pointer-events: none;
    }
    .arrow-box-large:after  { border-width: 40px; border-color: rgba(182, 0, 0, 0);
        border-left-color: #b60000; margin-top: -40px; 
    }
    .arrow-box-large:before { border-width: 32px; border-color: rgba(0, 0, 0, 0);
        border-left-color: #000000; margin-top: -32px;
    }

    /****************  MEDIUM SIZED  ****************/
    .arrow-box-medium {   
        font-size: 24px;
        padding: 10px 20px;
        width: 130px;
        letter-spacing: 2px;
        border-right: 0; 
        border-left: 1px solid #888;
        border-top: 1px solid #ccc; 
        border-bottom: 1px solid #ccc;
        color: #fff; 
        text-shadow: 1px 1px 1px #000; 
        background-color: #b60000; 
        position: relative;
    }
    .arrow-box-medium:after, h2.arrow-box-large:before {
        left: 100%; top: 50%; border: solid transparent; content: " ";
        height: 0; width: 0; position: absolute; pointer-events: none;
    }
    .arrow-box-medium:after  { border-width: 22px; border-color: rgba(182, 0, 0, 0);
        border-left-color: #b60000; margin-top: -22px;
    }
    .arrow-box-medium:before { border-width: 22px; border-color: rgba(0, 0, 0, 0); 
        border-left-color: #000000; margin-top: -22px; 
    }


     /***************  SMALL SIZED  ***************/
    .arrow-box-small {   
        font-size: 18px;
        padding: 10px;
        width: 80px;
        letter-spacing: 2px;
        border-right: 0; border-left: 1px solid #888; 
        border-top: 1px solid #ccc; border-bottom: 1px solid #ccc;
        color: #fff; text-shadow: 1px 1px 1px #000; 
        background-color: #b60000; 
        position: relative;
    }
    .arrow-box-small:after, h2.arrow-box-large:before {
        left: 100%; top: 50%; border: solid transparent; content: " ";
        height: 0; width: 0; position: absolute; pointer-events: none;
    }
    .arrow-box-small:after  { border-width: 19px; border-color: rgba(182, 0, 0, 0);
        border-left-color: #b60000; margin-top: -19px;
    }
    .arrow-box-small:before { border-width: 19px; border-color: rgba(0, 0, 0, 0);
        border-left-color: #000000; margin-top: -19px;
    }

@media (max-width:450px) {

    .arrow-box-large {   
        font-size: 24px;
        padding: 10px 20px;
        min-width: 200px;
        letter-spacing: 2px;
        border-right: 0; 
        border-left: 1px solid #888;
        border-top: 1px solid #ccc; 
        border-bottom: 1px solid #ccc;
        color: #fff; 
        text-shadow: 1px 1px 1px #000; 
        background-color: #b60000; 
        position: relative;
    }   

    .arrow-box-large:after  { border-width: 26px; border-color: rgba(182, 0, 0, 0);
        border-left-color: #b60000; margin-top: -26px; 
    }
    .arrow-box-large:before { border-width: 22px; border-color: rgba(0, 0, 0, 0);
        border-left-color: #000000; margin-top: -22px;
    }

    ul.check-list {padding-left: 10px; }
    ul.check-list li ul {padding-left: 10px; }
    ul.check-list li ul li {padding-top: 10px; }
    ul.check-list li ul li:before { content: "• ";color: #b60000;  font-family: 'Font Awesome 6 Pro' !important; }
}

@media print {
   h1.zzz {margin:0;padding:0;font-size:16px;}
   .arrow-box-large { background-color:#b60000 !important;border:0;}
   .arrow-box-large:before, .arrow-box-large:after {border:0;}
   .arrow-box-medium { background-color:#b60000 !important;border:0;}
   .arrow-box-medium:before, .arrow-box-medium:after {border:0;}
   .arrow-box-small { background-color:#b60000 !important;border:0;}
   .arrow-box-small:before, .arrow-box-small:after {border:0;}
}





/* -------------Begin --- Shuttle Style-----------*/

/*  Container */

.text-center { text-align: center; }
.text-right  { text-align: right; }
.table-text  { width: 100%;	height: auto;}

.shuttle-content {
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-flow: row wrap;
  	width: 100%;
}

#H-Building .shuttle-content { flex-direction:column; }

.Shuttle-flex-item1 img {
	width: 100% !important;
	height: auto !important ;
}
.Shuttle-flex-item1 {
  width: 100%;
  height: auto;
  margin-top: 0;
}
.Shuttle-flex-item {
  width: 75%;
  height: auto;
  margin-top: 10px;
  text-align: left;
}
.Shuttle-flex-track {
  width: 25%;
  text-align: left;
  height: auto;
  font-size:90%;
}
/* Two div table */
.Shuttle-flex-table-Left {
  width: 50%;
  height: auto;
}

.Shuttle-flex-table-right {
  width: 50%;
  height: auto;
}
/* ---END --Two div table */
/* Three div table */
.Shuttle-flex-left {
  width: 33.33%;
  height: auto;
}
.Shuttle-flex-middle {
  width: 33.33%;
  height: auto;
}
.Shuttle-flex-right {
  width: 33.33%;
  height: auto;
}
/* ---END --Three div table */
.shuttle-links {
    font-weight: 800;
    overflow: hidden;
    color: #b60000;
    letter-spacing: 0.15em;
    text-align: left;
  	float: right;
}
.shuttle-links a {
	text-decoration:none;
	color: #b60000;
}
.shuttle-links a:hover {
	text-decoration:none;
	color: #008fbe;
}

/* TABLES *****/
.shuttle-table {
  border-collapse: collapse;
  border: 1px solid #fff;
  border-bottom: 2px solid #001e4d;

}
.shuttle-table th {
  background:#001e4d;
  color:#fff;

}
.shuttle-table tr:nth-child(even) {
  background: #eee;
}
.shuttle-table tr:hover { 
  background: #b60000;
  color: #FFF;
}


/*  Shuttle Color */

/* shuttle BG Colors --- BEGIN */

.shuttle-bg-btnColor {
	text-align:center;
	color:#333;
	text-decoration:none;
	text-decoration-color: -moz-use-text-color;
	text-decoration-line: none;
	text-decoration-style: solid;
	border-color: #e8e8e8;
    border-top-color: rgb(232,232,232);
    border-right-color: rgb(232,232,232);
    border-bottom-color: rgb(232,232,232);
    border-left-color: rgb(232,232,232);
}
.shuttle-bg-btnColor:hover {
	color:#b60000;
    background-color: #e8e8e8;
    border-color: #e8e8e8;	
}
.shuttle-bg-blue   { background-color: #004163; color: #FFF; }
.shuttle-bg-red    { background-color: #dd2b19; color: #FFF; }
.shuttle-text-blue { color: #004163; }
.shuttle-text-red  { color: #dd2b19; }
.shuttle-bg-white  { color: #000; border: solid #D8D8D8; border-width: 1px; }

#banner .shuttle-content {
    color:#b60000;
    font-weight: bold;
    font-size: font-size:0.9em;
    letter-spacing: 2px;
    border-top:1px solid #b60000;
    border-bottom:1px solid #b60000;
    border-left: 0;
    border-right: 0;  
    padding: 0px 10px;
    display: block;
    text-align: center;
    margin-bottom:2px;
}

.shuttle-content .header3 { font-size:0.9em; letter-spacing:2px; font-weight:600; margin-top:10px; margin-bottom:0;  }

.shuttle-content hr { margin:0; }

#H-Building { padding-top:5px;  margin-top: 0;}
#H-Building p { font-size:0.9em;}


#intro ol {font-size:0.9em; }
#intro ol li {font-size:0.8em; line-height:13px; }

@media print and (max-width: 2000px) and (min-width: 1px) {
  #page { page-break-after: avoid;}
  #H-Building p { font-size:0.8em; line-height:15px;}
   html, body {
      margin: 0 !important; 
      padding: 0 !important;
      overflow: hidden;
        height: 99%;
        page-break-after: avoid;
        page-break-before: avoid;
    }
}


.Shuttle-flex-track { font-size:1em;}

/* shuttle BG Colors --- END */
/* Media Queries */
@media (max-width:1330px) {
}

@media (max-width:990px) {
	.shuttle-content .header2 {	font-size: 180%;	}
	.Shuttle-flex-item      { width: 100%;	}
  	.Shuttle-flex-item1 img { margin: 0;}
	.Shuttle-flex-track     { width: 100%;	}
}

@media (max-width:767px) {

     #banner .shuttle-content {letter-spacing:0;}
  
	.shuttle-content .header2 {	font-size: 140%;	}
	.shuttle-content .header3 {	font-size: 0.9em; letter-spacing:0; margin-top:10px;	font-weight:600; text-align: center;}
	.Shuttle-flex-item1 {	  width: 100%;	  height: auto;  	}
    .shuttle-links { text-align: center;}	
  
    .Shuttle-flex-item1 img { margin: 0; }
 	.Shuttle-flex-item      { width: 100%;  height: auto; line-height: 20px	}
	.Shuttle-flex-track     { width: 100%; 	padding: 0 0 5px 0;	}
	 
    /* Two div table */
	.Shuttle-flex-table-Left  { width: 100%; height: auto; }
	.Shuttle-flex-table-right {	width: 100%; height: auto; }
	
     /* Three div table */
	.Shuttle-flex-left        { width: 100%; height: auto; }
	.Shuttle-flex-middle      {	width: 100%; height: auto; }
	.Shuttle-flex-right       { width: 100%; height: auto; }
}

@media print {
  .shuttle-table tr:nth-child(even) {
      background: #eee !important;
      -webkit-print-color-adjust: exact;
    }
  
  .shuttle-links {
      color: #b60000 !important;
      text-align: right;
      -webkit-print-color-adjust: exact;
    }
}
/* Media Queries ---END*/

/* Shuttle Style ----END*/


/* -------------Begin --- News Brief-----------*/
.news-header2 {    padding-left: 15px;  }
.VMoreContainer {
	display: flex; 
	text-decoration: none; 
	color:#001e4d;
	width: 97%;
  	padding: 0 5px;
}
.vMoreHeader { padding: 10px; }
.vMoreImage { width: 70%}
.vMoreImage img{ width: 100%;padding: 10px;}
.vMoreContent { width: 100%;}
.vMoreContent a { text-decoration: none; font-weight: bold; color:#001e4d ; }
.vMoreContent a p {padding: 5px 0;}
.vMoreContent a span { color:#b60000; }
.VMoreContainer h3 {margin-top: 7px;}
.text-center {	text-align: center;}
.text-right {	text-align: right;}
.news-content {
	width:100%;
	display: block;
	 margin-right: 20px;
    margin-bottom: 20px;
    padding-right: 15px;
    padding-left: 15px;

}
.news-content-article {
    display: block;
    float: left;
    width: 350px;
    height: auto;
    margin-right: 20px;
    margin-bottom: 20px;
    overflow:hidden;
}
.news-content-article img {
	width:100%;
	height:auto;
}
.news-content-article iframe {
	width:100%;
	height:400px;
}
.news-content-article .fab, .news-content-article .fal,  .news-content-article .far, .news-content-article .fas, .news-content-article .fa {
	padding:10px;
	font-size: 2.0em;
	color:#848d91;
}
.news-content-article a { color:#0066cc;}
.news-content-article a:hover {	color:#008fbe;}

/* Twitter */

.news-Twitter-box {
	text-align:left;
	margin-top:10px;
	padding-top:5px;
}

.BHCCnews-content-sameheight { 
	display: flex;
	flex-wrap: wrap;
    padding-left: 15px;
    justify-content:center;
}

/* MagBHCC BG Colors --- BEGIN */

.main-box-title-color {
    background: #ffffff;
    color: #232323;
    display: inline-block;
    width: 100%;
}
.news-viewMore-bg-Color {background: #f9f9f9;}
.news-viewMore-bd-Color {border-left: 10px solid #b60000;}
.news-bg-Color {	background: #f9f9f9;  }
.main-box-inside {    padding: 20px 20px 0;  }

.news-bd-color {
	border-top: 2px solid #008fbe;
	border-right:1px solid #EAEAEA;
	border-bottom :1px solid #EAEAEA;
	border-left:1px solid #EAEAEA;
}

.news-text-color-grey {	color:#aeaeae;}

.summary {
	margin-top:10px;
	padding-top:5px;
}

/* Media Queries */
@media (max-width:1330px) {
   .news-content-article { width: 45%; }
}

@media (max-width:990px) {
   .news-content-article { width: 100%; }
}

@media (max-width:767px) {
	.news-content-article {	width: 100%;  }
  	.VMoreContainer {width: 100%;flex-wrap:wrap;}
    .vMoreContent {width: 100%; padding: 10px;}
	.vMoreImage {width: 100%;}
}

/*  END -----News Brief Style ----------*/

/*-------------------------------------------

    	Culinary Art Menu 
------------------------------------------*/
.tasting-menu {
    padding: 20px 18px 40px;
    margin: 0 auto;
	text-align: center;
	width: 90%;
} 

/*-------------------------------------------

    	Responsive Slider Style
------------------------------------------*/

/*
 * Responsive Slider Style
 * https://www.bhcc.edu
 * Contributing author: Uju Makhene
 *
 */


/* ====================================================================================================================
 * BASE STYLES
 * ====================================================================================================================*/
#slider-container {
  margin: 0 auto 15px;
  position: relative;
  display: block;
  text-align:center;
}

#slider-container img {  max-width: 100%; }


/* Next & previous buttons */
.next-button, .prev-button  {
  position: absolute;
  cursor: pointer;
  width: auto;
  padding: 5px 15px;
  border-radius:50%;
  top: 50%;
  transform: translateY(-50%);
}
.prev-button { left: 0;background-color: rgba(0,0,0,0.2);}
.next-button { right: 0;background-color: rgba(0,0,0,0.2);}

/* On hover, add a black background color with a little bit see-through */
.prev-button:hover, .next-button:hover {
    background-color: rgba(0,0,0,0.6);
}

#slider-container a:link,
#slider-container a:visited { color: #fff; text-decoration: none; }

#slider-container a:hover,
#slider-container a:active { color: #fff; text-decoration: none; }

@media(max-width:991px) {
  #slider-container span {
      font-size:1.5em;
      background-color: rgba(0,0,0,0);
    
  }
  .prev-button { left: 0;}
  .next-button { right: 0;}
}



/******************************************************************
     MANDATORY HEALTH INFO SESSIONS CALENDARS
     bhcc.edu/admissions/info/mandatoryhealthinformationsessions/ 
********************************************************************/
div.health-program-container table.health-program-application-dates {border:0;}
div.health-program-container table.health-program-application-dates tr:nth-of-type(odd)  {background-color:#ffffff;} 
div.health-program-container table.health-program-application-dates tr:nth-of-type(even) {background-color:#ffffff;} 
div.health-program-container table.health-program-application-dates td { height:15px;padding:0 5px;  }
div.health-program-container table.health-program-application-dates td:empty { display:none; }
div.health-program-container a:hover {text-decoration:none;}
h3.health-program-application-dates-header {margin:0 0 5px 0;}
@media screen and (max-width:767px) {
     table.health-program-info-sessions caption {width:100%;min-width:300px;text-align:left;}
}


/******************************************************************
    INPAGE ANCHORS
This is to adjust inpage link targets to account for the fixed header  
/******************************************************************/
.header-with-anchor { position:relative; clear:both;  display:block; }
.inpage-link-target { position:absolute; left:0; top:-100px; }
.header-with-anchor.ma-code-of-conduct a { position:absolute; left:0; top:-100px; }

@media (max-width:767px) {
   .inpage-link-target { position:absolute; left:0; top:-70px; }
   .header-with-anchor.ma-code-of-conduct a { position:absolute; left:0; top:-70px; }
}

/******************************************************************
      STUDENT HANDBOOK
   Each page in the online Student Handbook has a Table of Content
     that links to sections on the page
   Because of our fixed header, in-page anchors need a top offset

    https://stackoverflow.com/questions/10732690/offsetting-an-html-anchor-to-adjust-for-fixed-header
********************************************************************/
div.student-handbook-section-header:after {clear:both; content: "";display: table;}


.student-handbook-section-image {float:left; width:280px; padding:0; margin:0 0 20px 0;}
.student-handbook-section-image img {width:280px; height:auto; float:left;}
.student-handbook-section-toc {float: left; padding: 0 30px; margin-top:0; line-height: 1.7em; width: calc(99% - 280px); }
.student-handbook-section-toc h2 {margin-top:0; padding-top:0;}
.student-handbook-section-toc ul {list-style-type:disc;}
.student-handbook-section-toc:after {clear:both;}

.back-to-ma-code-div {width:auto; float:right;margin-top:-25px; margin-left:10px;}

.student-handbook-glossary dd {margin-left:30px;}


@media (max-width:1022px) {
   
   .student-handbook-section-toc {width: calc(99% - 280px); line-height:1.4em;}
   .student-handbook-section-toc ul {margin-left: -30px;}
}
@media (max-width:767px) {
   .student-handbook-section-h1 {display:none;}  
     .student-handbook-section-header {margin-top:10px;}
}

@media (max-width:500px) {
   .student-handbook-section-h1 {display:none;}
   .student-handbook-section-header {margin-top:10px;}
   .student-handbook-section-image {width:100%; text-align:center; float:none;}
   .student-handbook-section-image img {margin:0 auto 20px auto; float:none;}
   .student-handbook-section-toc { width:100%; line-height:1.6em; padding:0;}
   .student-handbook-section-toc ul {margin-left: -30px; } 
   .student-handbook-section-toc li a { display:block; padding:3px 0;}
   .student-handbook-section-toc li a:hover { color:#b60000; }
  
  .header-with-anchor {width:100%;float:none;}
  .back-to-top-div {width:100%; float:none;margin-top:5px;text-align:right;}
  .back-to-ma-code-div {width:100%; float:none;margin-top:5px;text-align:right;}

}  
  
.register-button-container { margin-left: 180px;}

@media (max-width:500px) {
     .register-button-container { margin-left: 0;}
}



/**********************************************************
         MINI SESSIONS - 2 parallel tables in desktop 
*************************************************************/
.complete-it { clear:both; font-weight:600; font-size:1.05em; 
                       letter-spacing:2px; text-align:center; }

.header-mini-sessions {  font-weight:600;  font-size:22px;  text-align:center;
                                        clear:both;  margin-top:0; }
h3.mini-sessions-semester {clear:both; text-align:center; margin:20px 0 0 0;}
table.mini-sessions {  width: 48%;   float:left;   border:1px solid #b60000; border-bottom:2px solid #b60000;margin:5px;}

/*
caption {
    padding-top: 8px;
    padding-bottom: 8px;
    color: #fff;
    text-align: left;
    background-color: #b60000;
}
table.mini-sessions caption {  
  text-align: left;
  font-weight: normal;
  font-size: 1.2em;
  padding: 10px; }
*/


table.mini-sessions th { vertical-align:top; background-color:#ececec; text-align:center; 
                                     border: 2px solid #c8c8c8; }
table.mini-sessions td { vertical-align:top;  text-align:left; }
table-mini-sessions tr:nth-child(even) { background-color:#f0f0f0; }
table-mini-sessions tr:nth-child(odd)   { background-color:#ffffff; }
.mini-sessions-alt {
    border: 1px solid #b60000 !important;
    border-bottom: 2px solid #b60000 !important;
}

@media(max-width:400px) {
  table.mini-sessions { width:100%; float:none; margin:10px; }
  table.mini-sessions tr td:nth-of-type(2) { width: 100px; }
}

@media only screen and (max-width: 760px) {
  table.mini-sessions { width:100%; float:none; margin:10px; }
  table.mini-sessions tr td:nth-of-type(2) { width: 100px; }
}

/**********************************************************
     EXAVAULT UPLOADER CONTAINER - Student Central (Financial Aid Upload, Scholarship  Application Upload
*************************************************************/
.exavault-iframe-container {
    border: 1px solid #000;
    background-color: #fff;
    text-align: center;   
    padding: 3px;
    overflow:auto;
}
@media(max-width:600px) { 
  .exavault-iframe-container { width:100%; }
}
@media(max-width:400px) {  
  .exavault-iframe-container { width:100%; max-width:380px; overflow:auto; }
}

/**********************************************************
                 ToTop jquery plugin  
*************************************************************/
 
#to-top {  
         width:50px;
         height: 50px;
         position: fixed;
         right: 25px !important;
         bottom: 30px;
         background-color: rgba(100, 100, 100, 0.6);
         color: #fff; 
         font-size:36px;
         line-height: 48px;
         text-align: center;
         border-radius: 50%;
         font-weight: 200;
         border: 1px solid #bbb;
         z-index :999; 
         opacity: 1;
         cursor: pointer;        
}
#to-top span { font-weight:100; color:white; }

#to-top:hover {  background-color: rgba(122, 0, 3, 0.8); }
/***********************************
      Profile Style
*********************************/
.profile-item {
     display: inline-block;
      position: relative;
      float: left;
      text-align: center;
      width: 33.33%;
      padding: 1px;
  }

.profile-item .profile-item-images {
    position: relative;
    overflow: hidden;
    display: block;
    background-color: #f0efec;

}
.profile-item img {
  	width:100% !important;
    max-width: 100%;
    height: auto;
    -ms-interpolation-mode: bicubic;
    display: inline-block;
    vertical-align: middle;
}
.profile-item .profile-item-text {
    display: block;
    /* padding-top: 2rem; */
  
}

.colour-primary {
    color: #0c203b;
    font-weight: bolder;
    font-size: 110%;

}
.profile-item .profile-item-text p { font-size: 0.9em; }

.profile-item .profile-item-social {
    display: block;
    list-style: none;
    padding-top: 1rem;
    padding-bottom: 1rem;
    margin: 0;
}

.profile-item .profile-document { margin-bottom:50px; }

@media (max-width:767px) {

  .profile-item	{ width: 100%; 	float:none;  }
     .profile-item img { width:100%;height:auto; max-width:100%; }      
}

@media (min-width:768px) and (max-width:960px) {

	.profile-item	{ width: 33%;  }
}

.speakerSeries       { display:flex; flex-flow: row; }
.speakerSeries > div { padding: 10px; }
.speakerSeries img   { min-width: 150px; }


@media (max-width:767px) {
   .speakerSeries {  flex-flow: column; }

}


/***********************************************************
    THIS is for blurbs like learn and earn boxes
*************************************************************/
.le-article { display:flex; flex-direction:column; flex:33.33%; max-width:33.33%; margin:10px 0; padding:10px; border:1px solid transparent; } 
.le-article:hover { border:1px solid #aaa;  }
.le-title { margin:5px 0; font-weight: bold; font-size: 24px; }
.le-figure { margin-bottom:10px; }
.le-image { width:100%; max-width:100%;  }
.le-description { flex: 1 0 auto; font-size:1.1em;}
.bottom-link-box { font-size:1em; }


@media(max-width:991px) and (min-width:768px) { 
     .le-article { flex:calc(50% - 20px); max-width:50%; } 
     .le-title { text-align:center; font-size:22px; }
     .le-figure { text-align:center;}
     .le-description { padding:0; }
     .bottom-link-box { text-align:left; }
     .bottom-link-box .pdfjumpto:after {display:block;}
}
  
@media(max-width:767px) {
     .le-article { flex:100%; max-width:100%; }
     .le-title { text-align:center; font-size:24px; }
     .le-figure { text-align:center;}
     .le-image { margin:0 auto; width:100%; max-width:100%; height:auto; } 
     .le-description { padding:5px 0 0 0; min-height:20px; margin:0; width:100%; text-align:center;  }       
     .bottom-link-box {font-size:20px; text-align:center; letter-spacing:0;}
     .bottom-link-box .pdfjumpto:after {display:inline-block; font-size:1.1em;}
}
@media(max-width:350px) {
    
     .le-title { text-align:center; font-size:24px; }
     .le-figure { text-align:center;}
     .le-image { margin:0 auto; max-width:100%; width:100%; height:auto; }  
     .le-description { padding:5px 0 0 0; min-height:20px; margin:0 auto;  width:100%;}   
      .bottom-link-box {font-size:20px; text-align:center; letter-spacing:0;}
}  



/***********************************************************
    THIS is for blurbs 
*************************************************************/
.blurb-flex-full-width .bffw-img { width: 100%;}

.blurb-flex-one-half { width: calc(50% - 2px); margin:1px; padding:10px; max-width:600px; border: 1px solid #ddd; }
.blurb-flex-one-half:hover { background-color:#eaeaea; }

.bfoh-figure { width:100%; margin:0; text-align:center; }
.bfoh-image  { width:100%; min-width:100%; }
.bfoh-link   { font-size:1.5em; text-align:center; padding:15px; }
.bfoh-link a { color:#b60000; }

@media (min-width: 768px) and (max-width: 1022px) {
   .blurb-flex-one-half { width: 50%; margin:0; padding:10px; }
}

@media screen and (max-width:767px) {
   .blurb-flex-one-half { width: 100%; margin:0; padding:10px; }
}


/*    QLESS     */
#qless-full-width h3.queue-name {display:none;}
#qless-full-width #qless-info { width:100%;border-bottom:1px solid #bbb;  }   
#qless-full-width table.queue-info-table {width:100%;}  
#qless-full-width .qless-open .qless-color-flag {text-align:center;font-weight:700; background-color:#cfc;border:1px solid #bbb;}
#qless-full-width .qless-open .qless-info  td {background-color:#fff; color:#000;vertical-align:top; text-align:left;   }   
#qless-full-width .qless-closed .qless-color-flag {width:200px; text-align:center;font-weight:700; background-color:#fcc;border:1px solid #bbb;}
#qless-full-width .qless-closed .qless-info  td { background-color:#ddd; color:transparent; }       
#qless-full-width .qless-updated { display:none; text-align:center;font-style:italic; }

#queue-info-rhc {width:100%;margin:0 auto;}
#queue-info-rhc h3 {display:none;}
#queue-info-rhc span {display:block;}
#queue-info-rhc .qless-open .qless-color-flag {background-color:#cfc;text-align:center;}
#queue-info-rhc .qless-closed .qless-color-flag {background-color:#fcc;}
#queue-info-rhc .qless-updated { text-align:center;font-style:italic; }


/***********************************************************
    ELEVATE - CORPORATE AND COMMUNITY EDUCATION ONLINE CATALOG
*************************************************************/
.ce-courses { width:100%;}
.ce-course-container { width: 100%; border-bottom: 1px solid #bbb; clear: both; margin: 0 0 25px 0; }
.ce-course-container h2 { color: #b60003; }
.ce-course-header { margin-bottom:0;}
.ce-course-desc { 
    clear: both;
    padding: 5px;
    margin-top: 5px;    
    margin-bottom: 5px;
    border: unset;
    float: left;
    width:100%;
}

.ce-course-title { width:100%; float:left; }
.ce-course-code { clear:both; margin:0; float:left; }
.ce-course-fee { }
.ce-course-link { float: right; text-align: center; margin: 15px 0; width: 190px; }
.ce-pcf { padding:5px; font-weight:700; }
.ce-tutorials-table { width:100%;}


table.ce-tutorials-table tr th { 
  vertical-align:bottom; 
  background-color:#fff !important; 
  border:0 !important; 
  padding:5px 1px; 
  text-decoration-line:underline;  
  text-align:left;
  word-break: keep-all;
}
table.ce-tutorials-table tr td { vertical-align:top; border:0; text-align:left;   }
table.ce-tutorials-table tr td:first-child {  background-color:#fff; font-weight:normal;}

.ce-cat-daterange-date { white-space: pre-wrap; text-align:center; display:inline; float:left; }

#cce-course-select-label { font-weight:700; }
#cce-course-select { padding:5px; width:500px; font-size:18px; }

.ce-col-dates.cce-all .ce-cat-daterange-date, .ce-col-ed .ce-cat-daterange-date { display:inline; }

.cce-catalog-text { width: 50%; float: left; padding: 15px;  }
.cce-catalog-text h3 { line-height:1.6em; } 

@media (min-width:992px) {
  
  table.ce-tutorials-table tr { background-color:transparent;border:0; }
  table.ce-tutorials-table td  { padding:3px; background-color: #fff !important;  font-weight:normal !important;}
  .ce-col-section { min-width:70px; word-break: break-word; }
  .ce-col-sd { min-width:70px; }
  .ce-col-meets {  text-align:center; min-width:70px; }
  .ce-col-times {  text-align:center; min-width:70px; }  
  .ce-col-places-left { min-width:50px; text-align:center; }  
  .ce-col-link   { min-width:100px; text-align:center; } 
  
}


@media (max-width:991px) {
  
   h2.ce-course-header { font-size:18px; line-height:1.6em;}
   table.ce-tutorials-table td.ce-col-section { border-top:1px solid #ccc; border-bottom:1px solid #888;}
  .ce-course-title { margin:0 0 10px 0; float:none; display:block; width:100%; text-align:left; font-size:24px; }
  .ce-course-code  { margin:0; width:50%; color:#000; font-size:16px; }
  .ce-course-fee   { margin:0; width:50%; text-align:right; font-size:16px; color:#000; }
  .ce-course-desc  { margin:0; float:none; display:block; width:100%; }
  .ce-course-link  { clear:both; float:none; margin:20px auto; position:unset; width:100%; }
 
  table.ce-tutorials-table tr { 
      border:0;
      padding:0;
      display: block;
      margin-bottom: 10px;
      height: auto;
  }  
  table.ce-tutorials-table thead tr:first-child  {
      position: absolute;
      top: -9999px;
      left: -9999px;
      font-weight:normal;
      background-color: #fff;    
  }
    
 table.ce-tutorials-table tbody tr:first-child  {
      position: unset;
      top: unset;
      left: unset;
      font-weight:normal;
      background-color: #fff;    
  }  

   table.ce-tutorials-table tr th,
   table.ce-tutorials-table tr:first-child th { 
         display:block;
         vertical-align:unset; 
         padding-top:3px;
         padding-bottom:3px; 
         text-align:left;
  }
  
   table.ce-tutorials-table tr td { 
       vertical-align:unset; 
       padding-top:3px;
       padding-bottom:3px;
       text-align:left;
       background-color: #fff !important;
       padding-left: 50%;
       position: relative;
       display:block;
     
   }
  table.ce-tutorials-table td:nth-child(2n) { background-color: #fff; }
  table.ce-tutorials-table tr td:first-child {  font-weight:700;}
  
  table.ce-tutorials-table tr td:before { 
      width:50%;
      content: attr(data-content);
      height: auto;
      position: absolute;
      top: 3px;
      left: 6px;
      text-align: left; 
      padding-right: 10px;    
  } 
  
  
  .ce-cat-daterange-date {display:inline-block; float:none;}

  #cce-course-select-label { font-weight:700; font-size:14px; }  
  #cce-course-select { padding:5px; width:100%; max-width:500px; font-size:14px;  } 

 .cce-catalog-text { width: 100%; padding: 15px;  }
}

/***** EXAVAULT UPLOADER WIDGET   ******/

#widget-container-wrap { width: 100%; padding:10px; border:3px double #ccc; margin-top:15px;margin-bottom:30px; }
#widget-container-wrap button { padding:5px 20px; }
#ev-widget-form { margin:0;padding:0; font-family:'Open Sans',arial;}

.close-x { color: #b60000; }
.in-target-upload-btns { margin:10px; }
.progress-meter-behind { width: 49%; }
.queued-file { width: auto;}

button#ok-upload { background-color:#b60000; color:#fff; }
button#ok-upload:hover {background-color:#b60000;color:#fff; box-shadow:1px 1px 2px #888; }
#widget-container-wrap .add-files { padding:5px 20px; }
#widget-drop-files {border:2px dashed #888; height:100%;}
#widget-drop-files:hover {border-color:#b60000;}
  #ev-widget-form label {letter-spacing:1px;}
#ev-widget-form input, #ev-widget-form textarea { border: 1px solid #888;letter-spacing:1px; font-weight:normal;color:#000; }
#ev-widget-form input:focus, #ev-widget-form textarea:focus {
     border:1px solid #b60000;
}
  input#success-upload-ok { padding:0 50px; text-transform:uppercase; font-size:16px;}

.upload-queue {height: 100%;}



/**********************************************************
                Virtual Fair
*************************************************************/

.vcfair_container{
  display: flex;
  margin-bottom: 15px;
  border-bottom: 1px solid #d3d3d3;
}
.vcfair_container_inner{
  display: flex;
  flex-flow: row wrap;
  padding: 0;
  margin: 0;
}
.vcfair_item_content{
  width: 100%;
  display: flex;
  flex-flow: row wrap;
}
.vcfair_item_CompanyLogo{
  width:15%;
  display: flex;
  align-items: center;
  padding-right: 15px;
}
.vcfair_item_CompanyInfo {
  width:80%;
}
.vcfair_item_content,.vcfair_item_link{
   margin: 10px;
}

/* Medium screens */
@media all and (max-width: 768px) {
    .vcfair_item_content, .vcfair_item_CompanyInfo { width: 100%;}
  .vcfair_item_CompanyLogo{
    width:20%;}
}
@media all and (min-width: 768px) and (max-width: 1022px){
  .vcfair_item_content{ width: 100%;}
  
}

/**********************************************************
              Announcement
*************************************************************/
.announcement-container {
    background-color: #fff;
    padding: 1em;
    display: flex;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    border: 1px solid #d4d4d4;
    margin: 0;
}
.announcement-content {
  padding:10px;
}
.announcement-content h2 {
    margin: 0;
    letter-spacing:4px;
    color:#b60000;
    font-size:2em;
    font-weight:600;

}
.announcement-icons {
    font-size: 3em;
    text-align: center;
    padding: 15px;
    color: #b60000;
    float:left;
    height:100%;
    margin-right:15px;   
}

.announcement-main-body { padding:1em; font-size:larger; line-height:1.8em; }

@media (max-width:787px) {
  
   .announcement-main-body { padding:0; font-size:1em; line-height:1.8em; }  
  .announcement-container { padding:0; border:0  }
  .announcement-container h2 { letter-spacing:unset;}  
  .announcement-icons {
     height:50px; 
     float:none;
     display:none;
 }
  
  
}



/**********************************************************
               COVID -19 Resources
*************************************************************/


.BHCC_box-container {
  display: flex;
  flex-flow: row wrap;
  padding: 0;
  margin: 0;
  list-style: none;
}
.BHCC_box-item {
  padding: 15px;
  text-align: center;
  width:46%;
  margin: 0 10px 10px 10px;
  border: 1px solid #d4d4d4;
}
.BHCC_box-item a{
  text-decoration: none;
  color: #000;
}
.BHCC_box-item span{
  color: #b60000;
  font-size: 2.5em;
}
.box-desc {color: #686868;
    font-size: 14px;
}

.BHCC_box-item.aide {
  padding: 15px;
  text-align: center;
  width:30%;
  margin: 0 10px 10px 10px;
  border: 1px solid #fff;
}


.BHCC_box-item-image-container img { 
    width:auto !important; 
    height:40px !important;
}

@media (max-width:991px) {
  .BHCC_box-item.aide {
       width:46%;
  }
}

/* Medium screens */
@media  (max-width: 768px) {
  
    .BHCC_box-item, .BHCC_box-item.aide {
        width: 100%; 
        margin:10px 0;
    }
    .box-desc {display:none;}
}
@media (max-width: 768px) {
  
    .BHCC_box-item, .BHCC_box-item.aide {
        width: 100%;
        margin:10px 0;
    }
    .box-desc {display: none;}
  }


/**********************************************************
              Basic Need Assistance 
*************************************************************/

.BHCC_box_bs-container {
  display: flex;
  flex-flow: row wrap;
  justify-content: center;
  padding: 0;
  margin: 0;
  list-style: none;
  width:100%;
}

.BHCC_box_bs-item {
    padding: 0;
    margin: 0;
    text-align: center;
    width: 33.33%;
    background-color:#fff;  
}

.BHCC_box_bs-item-inner {
    height: 100%;
    padding:  2em;
    margin: 10px 5px;
    border: 1px solid #ededed;
    background-color:#ededed;  
}
.BHCC_box_bs-item h2 { margin-bottom:0;}

.BHCC_box_bs-item a {
  text-decoration: none;
  color: #000;
}
.BHCC_box_bs-item span{
  color: #b60000;
  font-size: 5em;
}
.box-desc {color: #000;
    font-size: 1em;
}

/* Medium screens */
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .BHCC_box_bs-item{ width: 50%;margin:0x; }  
}
@media all and (min-width: 768px) and (max-width: 1024px) {
  .BHCC_box_bs-item{width: 50%;margin:0;}  
}

/* Phone screens */
@media (max-width: 767px) {
    .BHCC_box_bs-item { width: 100%; margin: 0;}
    .box-desc {display:none;}
}


/**********************************************************
              Report Bias Incident and Stop the Hate
*************************************************************/
.flexiconblurb3-item {
    padding: 10px;
    margin: 0;
    width: 33.33%;
    background-color:#FFF;
}
.flexiconblurb3-inner {
    border: 1px solid #cdd5da;
    background-color: #ededed;
    margin: 0;
    height: 100%;
    padding: 25px;
}

.flexiconblurb3-item span {
    color: #b60000;
    font-size: 5em;
    margin: 15px auto;
    display: block;
    text-align: center;
}
.flexiconblurb3-title {
    text-align: center;
}
/* Medium screens */
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .flexiconblurb3-item { width: 50; margin:0; }  
}
@media all and (min-width: 768px) and (max-width: 1024px) {
  .flexiconblurb3-item { width: 50% ;margin:0; }  
}


/* Small screens */
@media (max-width: 767px) {
    .flexiconblurb3-item { width: 100%; margin:0; }
    .flexiconblurb3-inner { padding:1px; }
}

/******************************************
  Responsive Accordion Style
*******************************************/

/* Accordion */
.resp_accordion, .resp_accordion * {
    box-sizing:border-box;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
}

.resp_accordion {
    overflow:hidden;
    box-shadow:0px 1px 3px rgba(0,0,0,0.25);
    border: 1px solid rgba(182,0,0,0.3);
    border-radius:3px;
    background:#fff;
    margin: 15px 0;
}

/* Section Title */
.section-title {
    background:#fff;
    display:inline-block;
    border-bottom:1px solid #b60000;
    width:100%;
    padding:15px;
    transition:all linear 0.15s;
    color:#333;
    font-size:18px;
    text-decoration: none;
}



.section-title.active,
.section-title:hover {
    background:#b60000;
    color: #fff;
}

.section:last-child .section-title {
    border-bottom:none;
}

.section-title:after {
/* Unicode character for "plus" sign (+) */
    content: '\02795';
    font-size: 1.1em;
    color: #fff;
    float: right;
    margin-left: 5px;
}

.section-title.active:after {
/* Unicode character for "minus" sign (-) */
    content: "\2796";
}

/* Section Content */
.section-content {
    display:none;
    padding:20px;
}


.resp_accordion-grey { border:1px solid #ddd; }

.resp_accordion-grey .section-title {   
    background:#ececec;
    border-bottom:1px solid transparent;
  
}

.resp_accordion-grey .section-title.active, .resp_accordion-grey .section-title:hover { 
  color:#000; 
  font-weight:600;

}

.resp_accordion-grey .section-title:after {
     font-size: 1em;
}

/******************************************
  Social Media Icon styles
*******************************************/
.red_icon_social_media i, .red_icon_social_media span { color:#b60000; }
.red_icon_social_media i:hover, .red_icon_social_media span:hover { color:#0c203b; }
#bhcc-social-official i, #bhcc-social-official span   { color:#b60000; }
#bhcc-social-official i:hover, #bhcc-social-official span:hover   { color:#0c203b; }
/******************************************
  Table Style
*******************************************/
  .resp_table > tbody { border: 1px solid #eaeaea;}
  .resp_table > tbody > tr > td {padding: 5px; border-bottom: 1px solid #eaeaea;}
  .resp_table > thead {color:#fff;}
  .resp_table > thead >tr >th {padding:10px 5px;background-color: #b60000;}


/*******************
  TRANSLATION component style ?
*********************/

@media (min-width:992px) {
   #mobile-menu-extras { 

     position:absolute;
     left: -9999px;         
   }          
}

#top-resources-list li { line-height:1.5em; border-left:0 !important;border-right:1px solid #aab; } 
#top-resources-list li:last-of-type { border-right:0 !important; }
#translate-options li { line-height:1.5em; border-left:0 !important;border-right:1px solid #aab; } 

#translate-options li:last-of-type { border-right:0 !important; }


/*******************
  UNIBUDDY
*********************/
iframe#unibuddy-chat-bubble-iframe {
    bottom: 100px;
}


.full-width-banner { width:100%; }
.full-width-banner img { width:100%; }



/******************************
  JS ACCORDION
**********************************/
.accordion-tab { margin-bottom:0.5em; }

a.accordion-tab-header { 
    padding:0; 
    display:flex;
    align-items:center;   
    color: black;  
    text-decoration:none; 
    background-color: #ececec;
    border-radius:4px;
} 
.blue-accordion .accordion-tab-header  {background-color: #ececec;}
.red-accordion .accordion-tab-header  {background-color: #ececec;}

.accordion-tab-header .accordion-icon {
  display:flex; 
  font-size:1.5em; 
  margin-right:5px; 
  padding: 0.8rem 1.2rem; 
  color:#b60000;
  font-weight:600;
  transform: rotate(90deg);
  transition: all .2s ease-in-out;
}

.accordion-tab-header.open .accordion-icon {
  transform: rotate(180deg);
  transition: all .2s ease-in-out;  
}


a.accordion-tab-header:hover {  color:#b60000; }

.accordion-tab-title  { 
  color:black; 
  font-size:2rem;  
  font-weight:400;
  margin:5px 0;  
}
.accordion-tab-title:hover  { 
    color:#b60000;
}
.accordion-tab-content { 
  background-color: white;
  color:#000;  
  overflow: hidden; 
  display:none;
  padding:10px;
} 

.accordion-opener, .grey-accordion-opener, .js-accordion-opener {
   line-height:1.5em; text-align:right; cursor:pointer; color:#b60000; font-weight:600; padding:0;
}

/******************************************
     FAQ ACCORDION - plain accordion
*******************************************/
.accordion-tab.plain-accordion { margin-bottom:10px;}
.plain-accordion  .accordion-tab-header { 
    padding: 0 1.1em; 
    display:flex; 
    justify-content:space-between;   
    color: black; 
    text-decoration:none;
    background-color: white; 
    border-radius:0;
    border:0;
    order:1;
} 
.plain-accordion .accordion-tab-header.open .accordion-tab-title { font-weight:600; }

.plain-accordion .accordion-tab-header:after {
    content: '\2b';
    font-family: "Font Awesome 6 Pro";
    font-size: 1.5em;
    color: #b60000;
    float: right;
    font-weight:600;  
}
.plain-accordion .accordion-tab-header.open:after {
    content: '\f068';
}
.plain-accordion .accordion-tab-header span {
     display:none;
}
.plain-accordion .accordion-tab-header h3:hover { color:#b60000;  }
.plain-accordion .accordion-tab-header:hover {  outline:1px solid #999;}
.plain-accordion .accordion-tab-header:focus {  outline:1px solid #999; text-decoration:underline;text-decoration-color:#000;}
.plain-accordion .accordion-tab-header:active {  color:#b60000; outline:1px solid #ccc;}
.plain-accordion .accordion-tab-title  { 
  color:black; 
  font-size:1.2em;  
  font-weight:400;
  margin:5px 0;
  line-height:1.5em;
  text-transform:unset;
  letter-spacing:unset;
  width:100%;
}
.plain-accordion .accordion-tab-content { 
  background-color: #ececec;
  border:1px solid #cdd5da;
  color:#000;  
  overflow: hidden; 
  display:none;
  padding: 10px 15px;
  font-size:1.1em;
} 


/**************************************
    BOTH
************************************/

/*
.accordion-tab.red-accordion .accordion-tab-header:before,
.accordion-tab.blue-accordion .accordion-tab-header:before { 
    content: '\f0da';
    font-family: "Font Awesome 6 Pro";
    font-size: 1.4em;
    margin-left: 5px;
    padding: 0.8rem 1.2rem;
    color: #b60000;
    font-weight: 600;
 }
.accordion-tab.red-accordion .accordion-tab-header.open:before,
.accordion-tab.blue-accordion .accordion-tab-header.open:before { 
    content: '\f0d7';
}

*/
.accordion-tab-title { font-size:1.2em; }


.accordion-tab.red-accordion .accordion-tab-header.open .accordion-tab-title,
.accordion-tab.blue-accordion .accordion-tab-header.open .accordion-tab-title { color:#b60000; }

.accordion-tab-content { 
  background-color: white;
  color:#000;  
  overflow: hidden; 
  display:none;
  padding: 10px;
} 
.accordion-tab.red-accordion .accordion-tab-content,
.accordion-tab.blue-accordion .accordion-tab-content { border:1px solid#ddd; }

@media (min-width:767px) {
  .accordion-tab-title { font-size:1em; }
}
















