@charset "UTF-8";
/*

NEW GENERAL STYLESHEET FOR RESPONSIVE TEMPLATES using Bootstrap v4.3.1

Adriana - updated 08-31-2020 -    updated for ASAE 10-29-30

*/
/* NEW - STANDARD ESHOW ELEMENTS

===========================================================================================================*/
body {
  font-family: var(--siteFont-main);
  font-size: 1.1rem;
  line-height: 1.65;
  font-weight: 400;
  color: var(--textColor);
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  background-color: var(--siteBkgColor);
  margin: 0;
  padding: 0;
}
p, ul {
  margin-top: 0;
  margin-bottom: 0;
  padding: .5rem 0 1rem;
}
ul {
  margin-left: 1.25rem;
}
a {
  color:  #4f42b4; 
  text-decoration: underline;
  font-weight: bold;
}
a:hover, a:focus {
  color: #f15b2b;
}
.pageTitle, h1, h2, h3, h4, h5, h6 {
  font-family: var(--siteFont-headings);
  margin-bottom: .5rem;
  line-height: 1.25;
  font-weight: bold;
}
.pageTitle, h1 {
  color: var(--secondaryColor);
  font-size: 1.6rem;
  font-weight: bold;
 text-transform: uppercase; 
  letter-spacing: normal;
  margin-top: .7rem;
  margin-bottom: 1.2rem;
	
}
h2 {
  font-size: 1.6rem;  
 color: var(--secondaryColor);
  margin-bottom: .5rem; margin-top:1.5rem;
}
#search_table h2 {
  margin-bottom: 0;
}
h3 {
  font-size: 1.4rem;
 color: var(--primaryColor);
  margin-top: 1.2rem;
}
h4 {
  font-size: 1.2rem;

}
h5 {
  font-size: 1.1rem;
  color: var(--primaryColor);
  margin-top: 1.5rem;
  margin-bottom: 0;
  padding-bottom: 0;
}
h6 {
  font-size: 1.3rem;
  color: var(--primaryColor);
}
.body-inner h3 {
  margin-bottom: 0;
}
hr {
  clear: left;
  margin-top: 1rem;
  display: block;
}
#accordion .card-header h4 {
  font-size: 1.4rem;
  color: var(--thirdColor);
  font-weight: 600;
  font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif"
}
/*to override programming's call of h6 color*/
h6.modal-title {
  color: inherit;
}
.strong, .bold, strong, b {
  font-weight: 600;
}
.em, .italic, em, i {
  font-style: italic;
}
/* ================= eShow TABLE COLOR styles ===================*/
.bgcolor1, .bdcolor1, /*.color1,*/ .tb-color1 { /* header row & font color */
  color: var(--primaryColor-text);
  background-color:  var(--secondaryColor);
  font-size: 1rem;
  font-weight: 600;
}
.bgcolor2, .bdcolor2, /*.color2,*/ .tb-color2 { /* 2nd row & font color */
  color: #050505;
  background-color: #eee;
  font-weight: 600;
}
.bgcolor3, .bdcolor3, .color3, .tb-color3 { /* 3nd row & font color */
  color: #050505;
  background-color: #eee;
}
.tb-colorLt { /* light row & font color */
  color: var(--textColor);
  background-color: #ebebeb;
}
.bgcolorSpecial, .tb-colorDefault {
  color: var(--textColor);
  background-color: #CCC;
}
.tb-text { /*--- Default text for all tables that use "tb-text" DO NOT CHANGE ----*/
  font-family: var(--siteFont-forms);
  /*font-size: 1.1rem;*/
  color: var(--textColor);
  text-align: left;
}
/*========== For eShow table GRIDS / LINES  ===================*/
/* Default grey COLOR for table lines - change only if needed*/
.border-table th, .border-table td, .line-table th, .line-table td {
  border-color: #dddddd !important;
}
/*=================== For CSS FORM BUTTON COLOR - change default color if requested  ========================*/
a.bttn-form-default, input.bttn-form-default, button.bttn-form-default, input[type="submit"], input[type="reset"], input[type="button"] {
  color: var(--primaryColor-text) !important;
  background-color: var(--thirdColor) !important;
  border: 2px solid rgba(222, 78, 65, .3) !important;
  font-weight: 600 !important;
  font-size: 16px !important;
}
a.bttn-form-default:hover, input.bttn-form-default:hover, button.bttn-form-default:hover {
  color: var(--fourthColor-text) !important;
  background-color: var(--fifthColor) !important;
  border: 1px solid transparent;
}
a.bttn-form-default:focus, input.bttn-form-default:focus, button.bttn-form-default:focus {
  border: 1px solid #000;
}
/*========== eShow CSS Tabs  =================== */
#eshowmenutab.menutab a.tab {
  color: var(--secondaryColor-text);
}
#eshowmenutab.menutab a.tab::before {
  background-color: var(--secondaryColor);
}
#eshowmenutab.menutab a.selected {
  color: var(--primaryColor-text);
}
#eshowmenutab.menutab a.selected::before {
  background-color: var(--primaryColor);
}
#eshowmenutab.menutab a.tab:hover:before {
  background-color: var(--primaryColor);
}
/* MOBILE APP WEBSITE MENU (original have not changed - needed or delete?? - possibly update)

===========================================================================================================*/
#mobile-menu > span {
  color: var(--primaryColor);
}
#mobile-menu > span:hover {
  color: var(--secondaryColor);
}
#toggle-view-menu > li {
  background-color: var(--primaryColor);
}
#toggle-view-menu li:hover {
  background-color: var(--secondaryColor);
}
#toggle-view-menu span {
  background-color: var(--primaryColor);
}
#toggle-view-menu li.active {
  background-color: var(--primaryColor);
}
#toggle-view-menu .menu-panel {
  background-color: var(--primaryColor);
}
/* BACK TO TOP

===========================================================================================================*/
#back-top a {
  background-color: var(--primaryColor);
}
#back-top a:hover {
  background-color: var(--thirdColor);
}
/*========== Site CUSTOM BUTTONS ===================*/
/* moved content from ASAE buttons.css to this section*/
a.button, .custom-button {
  margin: .2rem .4rem .2rem 0;
  text-align: center;
  text-decoration: none;
  hyphens: auto;
  word-wrap: break-word;
  display: inline-block;
  font-weight: 600;
  float: left;
  min-width: 160px;
  color: var(--primaryColor-text);
  background-color: var(--secondaryColor);
  font-size: 1.1rem;
  line-height: 1.2rem;
  font-family: var(--siteFont-nav);
  /*text-transform: uppercase;*/
  -webkit-border-radius: 3px;
  -moz-border-radius: 6px;
  border-radius: 3px;
  padding: .6rem 1rem .5rem;
  transition: background-color 0.45s ease-out, color 0.25s ease-out;
  transition: border-color 0.25s ease-out, color 0.25s ease-out;
}
.center .button {
  margin: 0.2rem auto;
    display: block;
    float: none;
    max-width: 275px;
}
a.button:hover, a.button:focus, .custom-button:hover, .custom-button:focus {
  background-color: var(--primaryColor);
  color: var(--primaryColor-text);
  text-decoration:underline;
}
.short {
  width: 31%;
}
.long {
  width: 45%;
}
/*Large devices (desktops, less than 1200px)*/
@media (max-width: 1199.98px) {
  .short {
    width: 50%;
  }
}
/*Medium devices (tablets, less than 992px)*/
@media (max-width: 991.98px) {
  .long, .short {
    width: 100%;
  }
}
/*========== MISC ===================*/
/*fix for Internet Explorer 10, SVG images with .img-fluid are disproportionately sized.*/
.img-svg {
  width: 100% \9;
}
#cookieBar {
  color: var(--fifthColor-text);
  background-color: var(--fifthColor);
}
#cookieBar p {
  max-width: 59vw;
  margin: 0 auto;
}
#cookieBar p a{ color:#ca4f07;  
}
#cookieBar #clickAgreeCookie {
  margin: auto !important;
  color: var(--fifthColor-text) !important;
  background-color: var(--fifthColor);
  font-weight: bold !important;
  min-width: 160px;
}
#cookieBar {padding: 1rem 3rem 2rem!important;}

#admin-page-content ol li {  padding-left: .3rem;}

/*========== for VEM poster gallery page  - adriana added 12-6-20  =================== */
#vem_gallery_body #room_bg_image {
  position: fixed;
  width: 100%;
  height: 105%;
  /*height: auto;*/
}
/* BASIC MEDIA QUERIES - Bootsrap 4

===========================================================================================================*/
/* Max container widths:

** Extra large devices (large desktops, 1200px and up) - .col-xl = 1140px 

** Large devices (desktops, 992px and up) - .col-lg- = 960px 

** Medium devices (tablets, 768px and up) - .col-md- = 720px  

** Small devices (landscape phones, 576px and up) - .col-sm- = 540px 

** Extra small devices (portrait phones, less than 576px) .col-  = None (auto) 

*/
/*Extra small devices (portrait phones, less than 576px)

No media query since this is the default in Bootstrap*/
/*Small devices (landscape phones, 576px and up)*/
@media (min-width: 576px) {}
/*Medium devices (tablets, 768px and up)*/
@media (min-width: 768px) {}
/*Large devices (desktops, 992px and up)*/
@media (min-width: 992px) {}
/*Extra large devices (large desktops, 1200px and up)*/
@media (min-width: 1200px) {}
/******/
/*Extra small devices (portrait phones, less than 576px)*/
@media (max-width: 575.98px) {}
/*Small devices (landscape phones, less than 768px)*/
@media (max-width: 767.98px) {}
/*Medium devices (tablets, less than 992px)*/
@media (max-width: 991.98px) {}
/*Large devices (desktops, less than 1200px)*/
@media (max-width: 1199.98px) {}
/*Extra large devices (large desktops)

No media query since the extra-large breakpoint has no upper bound on its width*/