body {
  background-color: #EFEFEF;
  background-image: url('img/bg_tile.jpg');

  font-family: "Source Sans Pro", sans-serif;
}

* {
  margin: 0;
}
html, body {
  height: 100%;
}

a:link, a:visited {
  text-decoration: none;
}
a:hover, a:active {
  text-decoration: underline;
}

#content-wrapper {
  min-height: 100%;
  margin: 0 auto -145px; /* the bottom margin is the negative value of the footer's height */
}
#kallio-main-footer, .push {
  height: 145px; /* .push must be the same height as .footer */
}

#kallio-main-container {
  margin-bottom: 2rem;
}


.kallio-header {
  line-height: 1;
}

.kallio-header-logo {
  font-family: 'Orbitron', sans-serif;
  font-size: 2.25rem;
}

.kallio-header-logo:hover {
  text-decoration: none;
}

.kallio-site-h1 {
  font-family: 'Orbitron', sans-serif;
  font-size: 2.25rem;
}

.kallio-main-nav .active {
  text-decoration: underline;
}

.kallio-main-nav .dropdown-item.active,
.kallio-main-nav .dropdown-item:active {
  background-color: initial;
}


.nav-scroller {
  position: relative;
  z-index: 2;
  height: 2.75rem;
  overflow-y: hidden;
}

.nav-scroller .nav {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
  padding-bottom: 1rem;
  margin-top: -1px;
  overflow-x: auto;
  text-align: center;
  white-space: nowrap;
  -webkit-overflow-scrolling: touch;
  
}

.nav-scroller .nav-link {
  padding-top: .75rem;
  padding-bottom: .75rem;
  font-size: .875rem;
}


.h-250 {
  height: 250px;
}
@media (min-width: 768px) {
  .h-md-250 {
    height: 250px;
  }
}


.border-top {
  border-top: 1px solid #e5e5e5;
}
.border-bottom {
  border-bottom: 1px solid #e5e5e5;
}


/*
 * kallio posts
 */
.kallio-post {
  margin-bottom: 4rem;
}
.kallio-post-title {
  margin-bottom: .25rem;
  font-size: 2.25rem;
  font-style: italic;
}
.kallio-post-meta {
  margin-bottom: 1.25rem;
  color: #999;
}

/*
 * Footer
 */
.kallio-footer {
  padding: 2.5rem 0;
  color: #9299a0;
  text-align: center;
  background-color: #f9f9f9;
  margin-top: 2rem;

  -webkit-box-shadow: 0rem .4rem 1.5rem 0rem rgba(0, 0, 0, .4);
  -moz-box-shadow: 0rem .4rem 1.5rem 0rem rgba(0, 0, 0, .4);
  box-shadow: 0rem .4rem 1.5rem 0rem rgba(0, 0, 0, .4);
}
.kallio-footer p:last-child {
  margin-bottom: 0;
}

.sidebar-card,
.aphorism-highlight,
.aphorism-cards .card {
  -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, .3), inset 0 1px 1px rgba(255, 255, 255, .4);
  -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, .3), inset 0 1px 1px rgba(255, 255, 255, .4);
  box-shadow: 0 1px 3px rgba(0, 0, 0, .3), inset 0 1px 1px rgba(255, 255, 255, .4);
}
.aphorism-cards .card {
  height: 100%;
}

.aphorism-cards .aphorism-div {
  padding: .25rem; /* Make sure this matches with the - on the wrapper aphorism-cards */
}
.aphorism-cards {
  margin: -.25rem; /* Make sure this matches with the + on the individual cards */
}

.aphorism-highlight p,
.aphorism-cards .card .card-text,
.aphorism-cards .card .card-title {
  text-align: center;
}

.card .card-text {
  color: #fff;
  text-decoration: none;
}
.card .card-title,
.card .card-title a {
  color: #cccccc;
}

.card.bg-warning .card-text,
.card.bg-light .card-text {
  color: #212529;
}

.card.bg-warning .card-title,
.card.bg-warning .card-title a,
.card.bg-light .card-title,
.card.bg-light .card-title a {
  color: #6c757d;
}


.category-cards .card-image {
  min-height: 7rem;
}

.card img {
  width: 100%;
  height: auto;
}
.card-image {
  position: relative;
  vertical-align: middle;
  text-align: center;
}

.card-image,
.card-image:hover {
  color:#f9f9f9;
}

.card-badge.bg-warning, .card-badge.bg-info, .card-badge.bg-light {
  color: #212529;
}



.card-image:hover > .overlay {
  width:100%;
  height:100%;
  position:absolute;
  background-color:#000;
  opacity:0.17;
}

.card-image .image-text {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  max-width:100%;
}

.card-image .image-text .text-main {
  font-size: 4.5rem;
  line-height:4.5rem;
  mix-blend-mode: difference;
  text-shadow: 2px 2px .6rem #000000, 0 0 .2rem #000000;
  font-family: 'Orbitron', sans-serif;
  text-transform: uppercase;
}

.card .card-badge {
  font-size: 1rem;
  
  -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, .3), inset 0 1px 1px rgba(255, 255, 255, .4);
  -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, .3), inset 0 1px 1px rgba(255, 255, 255, .4);
  box-shadow: 0 1px 3px rgba(0, 0, 0, .3), inset 0 1px 1px rgba(255, 255, 255, .4);
}

.no-underline {
  text-decoration: none !important;
}

.page-load-status {
  display: none;
  margin: 1rem auto;
  text-align: center;
}

.page-load-status .loader {
  margin: 1rem auto;
  text-align: center;
}

.loader {
  border: .4rem solid #303538;
  border-top: .4rem solid #1072F8;

  border-radius: 50%;
  width: 2.5rem;
  height: 2.5rem;
  animation: spin 1s linear infinite;
}

.loader > .sr-only {
  display: none;
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

.separator-icon {
  display: block;
  font-size: 2rem;
  text-align: center;
  margin: 1rem auto;
  color: #9299a0;
}