html * {
  font-family: "Noto Sans", "Noto Sans SC", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
}

code,
kbd,
pre,
samp,
pre a {
  font-family: "Noto Sans Mono", "Noto Sans SC", SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
}

.site-banner {
  font-weight: 300;
  line-height: 1.15;
  min-height: 44px;
}

.site-banner .close {
  font-size: 1rem;
}

html {
  position: relative;
  min-height: 100%;
}

main {
  padding-bottom: 80px;
}

footer.footer {
  position: absolute;
  bottom: 0;
  z-index: 999;
}

.main-jumbotron {
  /* background-image: url("images/noaaweather.jpg");
  background-size: cover; */
  background-image: url("http://www.weather.gov/source/translate/frontpage/css/images/nceiimage-min.png");
  background-size: cover;
  padding-bottom: 4rem;
}

#logo-banner {
  background-image: url("http://www.weather.gov/images/translate/feedback/translate_graphic_ENG.png");
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  height: 30svh;
  min-height: 200px;
}

#logo-banner-widescreen {
  background-image: url("http://www.weather.gov/images/translate/feedback/translate_graphic_widescreen_ENG.png");
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  height: 30svh;
  min-height: 200px;
}

#translate-nav-dropdown {
  max-height: none;
}

.translate-nav-item {
  min-width: 30px;
}

/* Zones Map implementation */
.map {
  height: 400px;
  width: 100%;
}

/* Deals with the alert banners that pop up when an office has an active alert */
.alert-dismissible .close.hazards {
  padding: .75rem 1rem;
}

.alert-dismissible .close.hazards.dd-alerts {
  padding: .75rem 13px;
  right: 103px;
}

.alert-dismissible .close.hazards.map-alerts {
  padding: .75rem 13px;
  right: 50px;
}

.grouped-hazard-title {
  padding-right: 8rem;
}

.hazard-title {
  padding-right: 5rem;
}

.alert-list-items {
  display: inline-block;
}

.fa-hand-point-down {
  color: #ffde34;
}


#rating-label {
  font-size: 12px;
}

#rating-label.fixed-width {
  /* added to prevent label from wrapping single CHI char */
  min-width: 85px;
}

.rating-btn {
  height: 38px;
}

.rating-btn.rating-up {
  border-top-left-radius: 50%;
  border-bottom-left-radius: 50%;
  /* Visually align middle of up hand with middle of down hand */
  svg {
    position: relative;
    top: -0.125em;
  }
}

.rating-btn.rating-down {
  border-top-right-radius: 50%;
  border-bottom-right-radius: 50%;
}

/* NOAA Colors */

.bg-dark-blue {
  background-color: #0058a6;
}

.bg-light-blue {
  background-color: #00a3e3;
}

.text-dark-blue {
  color: #0058a6;
}

.text-light-blue {
  color: #00a3e3;
}

/* Custom Colors */

.bg-jumbotron {
  background-color: #e9ecef;
}

.bs-body-color {
  background-color: #dee2e6;
}

.display-5 {
	font-size: 2.5rem;
	font-weight: 300;
	line-height: 1.2;
}

.display-6 {
	font-size: 1.5rem;
	font-weight: 300;
	line-height: 1.2;
}

/* @media (min-width: 576px) {
  .jumbotron {
    padding: 3rem 2rem;
  }
} */

.mobile-title {
  font-weight: 400;
}

.mobile-descrition {
  font-weight: 300;
  line-height: 1.15;
}

.dropdown-menu {
  max-height: 40vh;
  overflow-y: auto;
}

#prototype {
  font-size: 0.9rem;
}

.language-specific {
  display: none;
}

.badge {
  display: inline-block;
}

.sticky-top {
  z-index: 999;
}

#btn-back-to-top {
  height: 0px;
  bottom: 0px;
  opacity: 0;
  position: absolute;
  width: 100%;
  background-color: #f8f9fa;
  svg {
    padding: 4px 0px;
  }
  transition-duration: .3s;
  transition-property: all;
  transition-timing-function: ease-in-out;
}

.back-to-top-visible {
  cursor: pointer;
  opacity: 1 !important;
  height: 25px !important;
  bottom: -25px !important;
}

#version-selector-title {
  font-size: .875rem;
}

#version-div {
  display: none;
}

.page-btn {
  width: 40px;
  justify-content: center;
}

/* for CMS overrides */
.footer-legal {
  display: none;
}

.header {
  display: none;
}

/* timestamp coloring */
.timestamps {
  font-size: 0.75rem;
}

button.product-id .timestamps {
  color: #6c757d;
}

button.product-id.active .timestamps {
  color: #fff;
}

button.product-id:not(.active) .timestamps.recent {
  color: #28a745;
}

.zones-map {
  display: none;
}

#zones-reset-div {
  top: 4.5em !important;
  left: .5em;
}

.zones-map .ol-touch .ol-overlaycontainer-stopevent {
  font-size: 1.25rem !important;
}

/* ol-touch not working with chrome browser on ios unless you include the important flag */
.zones-map .ol-touch .ol-control button {
  font-size: inherit !important;
}

/* language selector carousel */
.carousel-item-next.carousel-vertical-item:not(.carousel-item-left),
.active.carousel-vertical-item.carousel-item-right {
  transform: translateY(100%);
}

.carousel-item-prev.carousel-vertical-item:not(.carousel-item-right),
.active.carousel-vertical-item.carousel-item-left {
  transform: translateY(-100%);
}

#language-selector-carousel .carousel-inner {
  width: 80px;
}