/***** Header (in /includes/nav.php) *****/

/* same as teal to place nav menu at top. */
#pageTop {
  /* equivalent of d-flex */
  display: -ms-flexbox !important;
  display: flex !important;
  /* equivalent of flex-column-reverse */
  -ms-flex-direction: column-reverse !important;
  flex-direction: column-reverse !important;
}

/* Make top nav sticky. This requires moving .pageTopContainer
   down the page so it isn't covered (in both desktop and mobile). */
#main-nav-row {
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  z-index: 1030;
}

.pageTopContainer {
    position: relative;
    top: 30px;
}

@media only screen and (min-width: 992px) {
  .pageTopContainer {
      top: 60px;
  }
}

.headerImg {
  min-height: 300px;
}

/* Make the image bigger on the home page. */
body.home .headerImg {
    min-height: 360px;
}

/* remove the blue stripe above main on mobile. */
@media only screen and (max-width: 768px) {
  main {
    margin-top: 0;
  }
}

.pageTopContainer {
    max-width: 95%;
}

/* A glow around the IACR logo */
img#logo {
  border-radius:50%;
  box-shadow: 0px 0px 20px 0px rgba(255,255,255,.8);
}

.headerImg {
  max-height: 300px;
  background-image: url("../images/banners/grayHive.jpg");
  background-size: cover;
}

.headerGradient {
  background: linear-gradient(rgba(32,92,128,.9),rgba(65,64,128,.3));
}

.headerTitle, .headerInfo {
  color: #102a83;
  padding: 10px;
  border-radius: 20px;
  border: 2px solid #102a83;
  background-color: rgba(255,255,255,.8);
}
.headerInfoTop, .headerInfoBottom {
    font-size: 1.5rem;
}

#main-nav-row {
    background-color: #194687;
}

div.dropdown-menu {
  color: #FEFDFB;
  background-color: #194687;
}


/***** Main Content: general styling *****/
body {
  background-color: rgba(156, 188, 235, .4);
}

.indPageTitle, .dateTitle, .subSubtitle {
  color: #636C9C;
}

a {
  color: #A12643;
}

a:hover {
  color: #5C809F;
}

.pageSubtitle {
  color: #205C80;
}

/* NOTE: custom button colors typically derived from the two most common colors in a given theme */
.customBtn-warm {
  background-color: rgba(212, 68, 111, 0.4);
}

.customBtn-cool {
  background-color: rgba(38, 109, 211, 0.4);
}

code {
  color: #2261BA;
}

.customCard {
  border: 1px solid #9CBCEB;
}

.customCardHeader {
  background-color: #266DD3;
  color: #F3F3FB;
}

.customAlert-warm {
  background-color: rgba(212, 68, 111, 0.1);
  border-color: rgba(212, 68, 111, 0.3);
}

.customAlert-cool {
  background-color: rgba(99, 108, 156, 0.2);
  border-color: rgba(99, 108, 156, 0.5);
}

.customCardFooter {
  /* NOTE: typically this is a more transparent version of the card header bg color */
    background-color: rgba(156, 188, 235, .2);
}

.icon {
  filter: brightness(0) invert(21%) sepia(15%) saturate(6432%) hue-rotate(196deg) brightness(96%) contrast(93%);
}


/**** Program specific colors ********/

div.trackMenu a.nav-link {
   background-color: #f8f8f8 !important;
}
div.trackMenu .nav-link.active {
  background-color: rgba(177, 181, 231, 0.3);
  color: #0F773C;
}
div.sessionList div.session {
  background-color: rgba(177, 181, 231, 0.3);
}