body {
  background-color: #404040;
  padding-top: 30px;
}

.centered-header {
  text-align: center;
}

.centered-header h1 {
  font-family: courier new;
  font-size: 40px;
  margin-bottom: 0;
  margin-top: -10px;
}

/* For achor link position. */
h2,
h4 {
  position:relative;
}
h2 span,
h4 span {
  position:absolute; top:-75px;
}

.ui.items>.item {
  padding-bottom: 1em;
  padding-top: 0.3em;
  border-bottom: thin solid #ddd;
}

@media only screen and (max-width: 767px) {
  .centered-header h1 {
    margin-top: 20px;
  }
}

.centered-header h4 {
  font-family: courier new;
  margin-top: 0;
  margin-bottom: 20px;
}

.balloons-page {
  background-image: url("../images/paper.png");
  background-repeat: repeat;
}

.home-page {
  background-image: url("../images/ep_naturalblack.png");
  background-repeat: repeat;
}

#background-shade {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  min-height: 100%;
  background-color: #fff;
  opacity: 0.5;

  z-index: -1;
}

.logo {
  margin-right: 10px !important;
}

.ui.inverted.menu {
  background-color: #1c5894;
  /* background-color: #5192d2;*/
  /* a25151 */
}

.ui.menu .ui.dropdown .menu>.item {
  color: #fff !important;
  background-color: #1c5894 !important;
}

.ui.menu .ui.dropdown .menu>.item:hover {
  color: #fff !important;
  background-color: #5192d2 !important;
}

.main-container {
  margin-top: 8px;
  background-color: #fff;
  padding: 3em 4em;
}

@media only screen and (max-width: 767px) {
  .main-container {
    padding: 1em;
  }

  .ui.container {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}

.balloons-page .main-container {
  box-shadow: 0 10px 10px rgba(0,0,0,0.65);
}

.ui.text.container {
  /* Override .ui.text.container */
  max-width: 960px!important;
}

p.centered {
  text-align: center;
}

.image-tiles img {
  height: 105px;
}

.learn-more-container {
  margin-top: 20px;
}

/* Mobile */
@media only screen and (max-width: 767px) {
  [class*="mobile hidden"],
  [class*="tablet only"]:not(.mobile),
  [class*="computer only"]:not(.mobile),
  [class*="large screen only"]:not(.mobile),
  [class*="widescreen only"]:not(.mobile),
  [class*="or lower hidden"] {
    display: none !important;
  }
}

/* Tablet / iPad Portrait */
@media only screen and (min-width: 768px) and (max-width: 991px) {
  [class*="mobile only"]:not(.tablet),
  [class*="tablet hidden"],
  [class*="computer only"]:not(.tablet),
  [class*="large screen only"]:not(.tablet),
  [class*="widescreen only"]:not(.tablet),
  [class*="or lower hidden"]:not(.mobile) {
    display: none !important;
  }
}

/* Computer / Desktop / iPad Landscape */
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  [class*="mobile only"]:not(.computer),
  [class*="tablet only"]:not(.computer),
  [class*="computer hidden"],
  [class*="large screen only"]:not(.computer),
  [class*="widescreen only"]:not(.computer),
  [class*="or lower hidden"]:not(.tablet):not(.mobile) {
    display: none !important;
  }
}

/* Large Monitor */
@media only screen and (min-width: 1200px) and (max-width: 1919px) {
  [class*="mobile only"]:not([class*="large screen"]),
  [class*="tablet only"]:not([class*="large screen"]),
  [class*="computer only"]:not([class*="large screen"]),
  [class*="large screen hidden"],
  [class*="widescreen only"]:not([class*="large screen"]),
  [class*="or lower hidden"]:not(.computer):not(.tablet):not(.mobile) {
    display: none !important;
  }
}

/* Widescreen Monitor */
@media only screen and (min-width: 1920px) {
  [class*="mobile only"]:not([class*="widescreen"]),
  [class*="tablet only"]:not([class*="widescreen"]),
  [class*="computer only"]:not([class*="widescreen"]),
  [class*="large screen only"]:not([class*="widescreen"]),
  [class*="widescreen hidden"],
  [class*="widescreen or lower hidden"] {
    display: none !important;
  }
}
