html,
body {
  /* This is necessary for footer */
  height: 100%;
}

body {
  /*padding-top: 50px;
  padding-bottom: 20px;*/
}

/* Wrapping element */
/* Set some basic padding to keep content from hitting the edges */
.body-content {
  padding-top: 24px;
  /*padding-left: 15px;
  padding-right: 15px;*/
}

/* #0033a1 blue */
/* Carousel */
.carousel-caption p {
  font-size: 20px;
  line-height: 1.4;
}

/* Make .svg files in the carousel display properly in older browsers */
.carousel-inner .item img[src$=".svg"] {
  width: 100%;
}

/* QR code generator */
#qrCode {
  margin: 15px;
}

/* Hide/rearrange for smaller screens */
@media screen and (max-width: 767px) {
  /* Hide captions */
  .carousel-caption {
    display: none;
  }
  /* Stack the story-list columns*/
  .story-list-column {
    flex: 1;
  }
}
.linked-table tbody tr {
  cursor: pointer;
}

.navbar {
  background: #0033a1; /* Old browsers */
  background: -moz-linear-gradient(left, #0033a1 0%, #009bdf 100%); /* FF3.6+ */
  background: -webkit-gradient(linear, left, right, color-stop(0%, #0033a1), color-stop(100%, #009bdf)); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(left, #0033a1 0%, #009bdf 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(left, #0033a1 0%, #009bdf 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(left, #0033a1 0%, #009bdf 100%); /* IE10+ */
  background: linear-gradient(left, #0033a1 0%, #009bdf 100%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#0033a1", endColorstr="#009bdf",GradientType=0 ); /* IE6-9 */
}

.navbar-brand {
  /* 
      Normally 30px high, with padding of 5 (x2), yielding 40px.
      Removed padding so we can increase image height from 30px.
      Image will be vertically centered.
  */
  padding-top: 0;
  padding-bottom: 0;
}

.navbar-brand img {
  height: 32px;
}

.navbar-title {
  /*color: rgba(255, 255, 255, 0.5);*/ /* Same as .nav-link */
  color: #fff; /* Same as .active > .nav-link  */
  text-transform: uppercase;
}

/*.navbar ul {
    list-style: none;
    padding: 0;
    margin: 0;
    background: transparent;
    overflow: hidden;
}

.navbar li a {
    float: left;
    line-height: 50px;
    padding: 0 20px;
    text-decoration: none;
    color: #ddd;
}

    .navbar li a:hover {
        background-color: #333;
        color: #fff;
    }*/
/*
* Landing page
*/
.landing-background {
  min-height: 100%;
  position: relative;
  background-image: url("/images/utr-cover.jpg");
  background-size: cover;
  background-position: center;
}

.landing-body {
  padding-bottom: 320px;
  color: white;
}
.landing-body a {
  color: #cdcdcd;
}

.landing-headline {
  text-align: center;
  padding-top: 8rem;
  color: white;
}
.landing-headline h1 {
  text-transform: uppercase;
  word-spacing: 0.25em;
}
.landing-headline .landing-headline-logo {
  margin-bottom: 3rem;
}
.landing-headline .landing-headline-logo img {
  color: white;
}
.landing-headline .landing-headline-link {
  margin-top: 2rem;
}
.landing-headline .landing-headline-link a {
  color: white;
}

.landing-background footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  /*height: 120px;*/
  /*line-height: 60px;*/ /* Vertically center the text there */
}

.landing-background footer .sponsors {
  height: 180px;
  background-color: rgba(0, 51, 161, 0.6);
  color: #ededed;
  text-align: center;
  padding-top: 1em;
}

.landing-background footer .contact {
  height: 140px;
  background-color: #fff;
  padding-top: 1em;
}

.layout {
  min-height: 100%;
  position: relative;
}

.layout .body-content {
  padding-bottom: 140px;
}

.layout footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  /*height: 120px;*/
  /*line-height: 60px;*/ /* Vertically center the text there */
}

.layout footer .contact {
  height: 140px;
  border-top: 1px solid #eee;
  background-color: #fff;
  padding-top: 1em;
}

.app-layout h1 {
  color: #009bdf;
  text-transform: uppercase;
  font-weight: 300;
  font-size: 52px;
}

.app-layout h2 {
  color: #0033a1;
  font-weight: 400;
  font-size: 34px;
}

.app-layout h3 {
  font-weight: 700;
  font-size: 20px;
}

a.navigation_back_link {
  color: #20cbd4;
  font-weight: 300;
  line-height: 50px;
  text-decoration: none;
}

.media .story-date {
  width: 5rem;
}

.media .story-date .sd-year {
  font-weight: 300;
}

.story-list {
  border-bottom: 1px #ededed solid;
}

.story-list-column {
  flex-direction: column;
  margin: 25px;
  flex: 1;
}

.story-list-row {
  display: flex;
  justify-content: space-between;
  flex-flow: wrap row;
  flex: 1;
}

.story-item {
  border-top: 1px #ededed solid;
  padding-top: 1rem;
  padding-bottom: 1rem;
}

.story-item > a:hover {
  text-decoration: none;
}

.story-item .story-actions i {
  margin-bottom: 8px;
}

.story-item .story-actions p.success {
  color: #20cbd4;
}

.story-item h5,
.story-item .story-date {
  color: #0033a1;
}

.story-item .media img {
  width: 96px;
  height: 96px;
}

.book-order-list {
  border-bottom: 1px #ededed solid;
}

.book-order-list-header a:hover {
  text-decoration: none;
}

.book-order-item {
  border-top: 1px #ededed solid;
  padding-top: 1rem;
  padding-bottom: 1rem;
}

.book-order-item .media a:hover {
  text-decoration: none;
}

.book-order-item h5 {
  color: #0033a1;
}

.book-order-item .media img {
  width: 96px;
  height: 96px;
}

.book-order-form {
  margin-bottom: 8px;
}

i.fa.circle-border {
  display: inline-block;
  border-radius: 60px;
  box-shadow: 0px 0px 2px #888;
  padding: 0.7em 0.8em;
}

i.fa.success {
  box-shadow: 0px 0px 0px #888;
  background-color: #20cbd4;
  color: #fff;
}

i.fa.disabled {
  opacity: 0.25;
  cursor: not-allowed;
}

i.fa.info {
  box-shadow: 0px 0px 0px #888;
  background-color: #009bdf;
  color: #fff;
}

.app-layout video {
  width: 100%;
}

.field-validation-error {
  color: #ff0000;
}

.favorite-icon {
  font-size: 45px;
}

.fas.favorite-icon {
  color: gold;
}

.far.favorite-icon {
  color: grey;
}

.max-w-130 {
  max-width: 130px;
}

#loader {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(255, 255, 255, 0.7);
  z-index: 9999;
  text-align: center;
  padding-top: 200px;
}