/* Used for styles that are used all over the site */

/* Account Header */
.account-header .ng-icon {
  margin: 0 auto;
}
.account-header .account-circle {
  width: 30px;
}
.account-header .ng-icon .profile-abbreviation {
  top: 6px;
}
.account-header .icon-subtext {
  font-size: 9px !important;
  letter-spacing: 1.5px;
  margin-top: 6px;
}
.account-header .ng-nav-dropdown > li > a {
  padding: 12px 25px !important;
}
.ng-vertical-index {
  border-right: 4px solid #fc0;
}

/* Add to calendar component */
.add-to-calendar:hover {
  background-color: rgb(245, 245, 245);
}
.add-to-calendar__button {
  width: 175px;
}
.add-to-calendar__dropdown {
  width: 177px;
}
.add-to-calendar__item {
  font-size: 16px !important;
}

/* Hero Sub Nav Styles */
.hero-nav-panel {
  position: absolute !important;
  bottom: 0 !important;
  left: 0;
  right: 0;
  width: auto;
  font-size: 18px;
  font-weight: 300;
  margin: auto;
  height: auto;
  padding: 45px 45px 0 45px;
}
.hero-sub-nav {
  margin-left: 5px;
}
.hero-nav-child {
  display: inline-block;
  margin-bottom: 10px;
}
.hero-nav-child:not(:last-child) {
  margin-right: 60px;
}
.hero-nav.ng-contrast a {
  color: #fff;
}
.hero-nav-child a {
  border-bottom: none;
  letter-spacing: 2.2px;
  position: relative;
}
.hero-nav-child a:hover {
  border-color: #cca300;
}
.hero-nav-child a:hover:before,
.hero-nav-child.active a:before {
  -webkit-transform: scaleX(0.6);
  -moz-transform: scaleX(0.6);
  -ms-transform: scaleX(0.6);
  -o-transform: scaleX(0.6);
  transform: scaleX(0.6);
}
.hero-nav a:before {
  -webkit-transform: scaleX(0);
  -moz-transform: scaleX(0);
  -ms-transform: scaleX(0);
  -o-transform: scaleX(0);
  transform: scaleX(0);
  -webkit-transition: all 200ms ease-in-out 0s;
  -moz-transition: all 200ms ease-in-out 0s;
  -ms-transition: all 200ms ease-in-out 0s;
  -o-transition: all 200ms ease-in-out 0s;
  transition: all 200ms ease-in-out 0s;
  content: "";
  position: absolute;
  width: 100%;
  height: 2px;
  bottom: -11px;
  background-color: #fc0;
}

/* Horizontal Index */
.horizontal-index:after {
  content: "";
  display: block;
  width: 60px;
  height: 5px;
  background: #fc0;
  margin-left: auto;
  margin-right: auto;
}

/* Juicer Feed Overrides */
.juicer-feed.hide-load-more .juicer-button {
  display: none !important;
}

/* Photo Gallery Plugin */
.react-images__positioner
  .react-images__container--isModal
  .react-images__frame {
  min-height: 60vh;
}

@media screen and (max-width: 767px) {
  .react-images__positioner
    .react-images__container--isModal
    .react-images__frame {
    min-height: unset !important;
  }
  .react-images__container.react-images__container--isModal {
    overflow: scroll;
    max-height: 99vh;
  }
}

/* Promo Story Tease Plugin */
.ng-promo-story-teases-container {
  height: 300px;
}
@media (max-width: 812px) {
  .promo-tease-container {
    flex-direction: column;
  }
  /* Overrides for react photo gallery positioning */
  .react-images__positioner {
    bottom: unset !important;
  }
  .react-images__track {
    align-items: flex-start !important;
  }
  .photo-gallery-header {
    position: fixed;
    top: 0;
    z-index: 1000;
    left: 0;
    right: 0;
  }
}

/* Tease Component */
.reactTeaseContainer a.ng-color-white:hover {
  color: white;
}

/* General */
a.ng-contrast:hover {
  border-bottom: 1px solid #fc0;
  color: white;
  font-weight: bold;
}

/* Notification banner */
#messages {
  margin-bottom: 20px;
}