/*
$unit: percentage(66 / $fullwidth);
$gutter: percentage(24 / $fullwidth);
*/
/*! layout elements
--------------------------------*/
/*-- Homepage/landing page styles
--------------------------------*/
#shim {
  height: 0 !important; }

#primary {
  padding-bottom: 0; }
  #primary p:last-of-type {
    margin-bottom: 0; }

#hero {
  position: fixed;
  z-index: 0; }

#branding {
  position: fixed;
  width: 100%;
  background: none; }
  #branding:not(.fixed):before {
    display: none; }
  #branding.fixed {
    background-image: url("../images/bg-header.jpg");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center top; }

#navmain ul li.mi-home {
  display: none; }

#sidebar {
  background-color: #003b4c;
  background-image: -moz-linear-gradient(180deg, rgba(0, 59, 76, 0), #003b4c), url("../images/bg-devils-berm.jpg"), url("../images/bg-eggshell.jpg");
  background-image: -o-linear-gradient(180deg, rgba(0, 59, 76, 0), #003b4c), url("../images/bg-devils-berm.jpg"), url("../images/bg-eggshell.jpg");
  background-image: -webkit-linear-gradient(180deg, rgba(0, 59, 76, 0), #003b4c), url("../images/bg-devils-berm.jpg"), url("../images/bg-eggshell.jpg");
  background-image: -ms-linear-gradient(180deg, rgba(0, 59, 76, 0), #003b4c), url("../images/bg-devils-berm.jpg"), url("../images/bg-eggshell.jpg");
  background-image: linear-gradient(180deg, rgba(0, 59, 76, 0), #003b4c), url("../images/bg-devils-berm.jpg"), url("../images/bg-eggshell.jpg");
  background-repeat: repeat, no-repeat, repeat;
  background-position: center bottom, center top, left top;
  background-size: auto, cover, auto;
  background-blend-mode: multiply,multiply, normal;
  -webkit-text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.2);
  -moz-text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.2);
  text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.2); }
  #sidebar .widget {
    margin-bottom: 2rem; }
    #sidebar .widget p {
      -webkit-text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.6);
      -moz-text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.6);
      text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.6); }

/*-- Landing-page specific styles
--------------------------------*/
body.page-template-page-landing #hero {
  height: 50vh; }
  body.page-template-page-landing #hero h1.hero-title {
    font-size: 300%; }

body.page-template-page-landing #main {
  margin-top: 50vh; }

body.page-template-page-home #hero {
  height: 90vh; }

body.page-template-page-home #main {
  margin-top: 90vh; }

.fallfest-banner {
  background-size: cover;
  background-repeat: no-repeat;
  background-image: url(https://ambcknox.org/site/wp-content/uploads/2020/10/Lamberson_BakerCreek_2-scaled.jpg);
  background-position: center;
  padding: 4rem 0; }
  .fallfest-banner a {
    display: block; }
  .fallfest-banner img {
    width: 100%;
    max-width: 800px; }
  .fallfest-banner:before {
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    content: '';
    text-indent: 1111%;
    white-space: nowrap;
    overflow: hidden;
    opacity: 0.85;
    background-color: #003c4d; }

@media screen and (orientation: landscape) and (max-height: 500px) {
  body.page-template-page-home #hero h1.hero-title {
    font-size: 325%; } }

@media screen and (orientation: landscape) and (min-height: 501px) and (max-height: 800px) {
  body.page-template-page-home #hero h1.hero-title {
    font-size: 500%; } }

@media screen and (max-width: 540px) {
  #hero {
    height: 90vh; }
    #hero h1.hero-title {
      font-size: 375%; }
  body.page-template-page-home #main {
    margin-top: 90vh; }
  body.page-template-page-landing #hero h1.hero-title {
    font-size: 250%; }
  #sidebar {
    padding-top: 5rem; }
    #sidebar .widget {
      margin-bottom: 1.2rem; } }

@media screen and (min-width: 541px) {
  body.page-template-page-home #hero h1.hero-title {
    font-size: 10vw; } }

@media screen and (min-width: 769px) {
  body.page-template-page-home #hero h1.hero-title {
    font-size: 8vw; }
  body.page-template-page-landing #hero h1.hero-title {
    font-size: 350%; } }

@media screen and (min-width: 971px) {
  #content .hentry {
    font-size: 112%;
    margin: 0 6.25%; } }
