  html body {
  background-image: url('/media/fit-website/site-assets/images/paper-with-white-background-sm.jpg');
  font-size: 16px;
}
html h2 {
  font-size: 3em;
  line-height: 1.1em;
}
html h2.crimson {
  color: #770000;
  font-size: 1.35em;
  margin: 0 0 -0.75em !important;
}
html h3 {
  font-size: 1.3em;
}
html .left h2 {
  color: #770000;
}
html .left h3 {
  color: #000000;
}
html p a {
  color: #770000;
  font-weight: bold;
}
html p a::after {
  content: "\f061";
  font-family: Icons;
  margin-left: 0.5em;
}
html p a:hover {
  text-decoration: underline;
}
html p a:hover::after {
  margin-left: 0.7em;
  text-decoration: none !important;
  transition: all 0.2s;
}
.inverted {
  background: #242424;
  color: #ffffff;
}
.inverted a {
  color: #ffffff;
}
.inverted h3 {
  color: #ffffff;
}
.inverted .segment {
  color: #000000;
}
.inverted .segment a {
  color: #770000;
}
.segment {
  font-size: 1em !important;
  padding: 1.5em !important;
}
.ui.padding.divider {
  margin: 0 !important;
  padding: 3rem 0 !important;
}
.button.red {
  background: #770000 !important;
}
.button.red:hover {
  background: #990000 !important;
}
.button::after {
  content: "" !important;
}
.label::after {
  content: "" !important;
}
/*------------------------------------*\
        MAIN HEADER
\*------------------------------------*/
.text-image-split {
  position: relative;
}
.text-image-split .ui.grid + .grid {
  margin-top: -1rem !important;
}
.text-image-split .stackable.grid.column.text {
  background: url('/media/fit-website/site-assets/images/paper-with-white-background-sm.jpg');
  position: relative;
  padding: 2% 0;
  overflow: visible;
  z-index: 1;
}
.text-image-split .stackable.grid.column.text .section-content {
  float: right;
  padding: 3%;
  width: 100%;
}
.text-image-split .stackable.grid.column.text::before,
.text-image-split .stackable.grid.column.text::after {
  content: '';
  position: absolute;
  background: inherit;
  z-index: -1;
  top: 0;
  transform-origin: top right;
  transform: skewX(0deg);
  height: 100%;
  width: 100%;
}
.text-image-split .stackable.grid.column.text::after {
  bottom: 0;
  transform-origin: right bottom;
  transform: skewX(-5deg);
}
.text-image-split .column.image {
  max-height: 500px;
  padding: 0 !important;
}
.text-image-split .column.image img {
  margin: 0 !important;
  max-height: 500px;
  object-fit: cover !important;
  object-position: top;
  padding: 0 !important;
  width: 100% !important;
}
.text-image-split .column.image.homepage-image img:nth-child(n+2),
.text-image-split .column.image.stop-homepage-image img:nth-child(n+2) {
  display: none;
}
.text-image-split.inverted {
  background: #242424;
  color: #ffffff;
}
.text-image-split.inverted .stackable.grid.column.text {
  background: #242424;
}
.text-image-split .container {
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  z-index: 100;
}
.text-image-split .container .row {
  margin: 1.35em 0 0em;
}
.two-column-large-image .img-before {
  position: absolute;
  padding-right: 2rem;
  transition: 0.5s all;
}
.two-column-large-image .img-before:hover {
  opacity: 0;
}
.text-image-group .img-1 {
  float: right;
  margin-bottom: -3em;
  position: relative;
  z-index: 50;
}
.text-image-group .img-2 {
  float: left;
  margin-bottom: -3em;
  position: relative;
  z-index: 40;
}
.text-image-group .img-3 {
  float: right;
  margin-bottom: -3em;
  position: relative;
  z-index: 50;
}
.text-image-group .img-4 {
  float: left;
  margin-bottom: 3em;
  position: relative;
  z-index: 60;
}
/*------------------------------------*\
        PROGRAM SEARCH
\*------------------------------------*/
.program-search .column.left {
  padding-right: 3em !important;
}
.program-search .column.right input#st-program-search {
  border: 1px solid #cccccc;
  border-radius: 5px;
  font-size: 1.2em;
  padding: 1.5em;
  width: 80%;
}
.program-search .column.right button {
  background: none;
  margin-left: -4em;
  padding: 0;
}
.program-search .column.right button i.search.icon {
  color: #770000;
  font-size: 1.75em;
}
/*------------------------------------*\
        NEWS & EVENTS
\*------------------------------------*/
#news-feed,
#events-feed {
  margin-top: -1rem !important;
}
#news-feed h2,
#events-feed h2 {
  color: #fbc544;
}
#news-feed .news-story {
  margin-bottom: 1em;
  width: 100%;
}
#news-feed .news-story .img-link img {
  float: left;
  height: 100px;
  margin-right: 1.5em;
  object-fit: cover;
  width: 150px;
}
#news-feed .news-story .title {
  font-family: Bitter;
  font-weight: bold;
}
#events-feed ul {
  list-style: none;
  padding: 0;
}
#events-feed ul li {
  display: inline-block;
  margin-bottom: 1.4em;
}
#events-feed ul li .cal_date {
  float: left;
  font-weight: bold;
  font-family: Bitter;
  margin-right: 1em;
  text-transform: uppercase;
  text-align: center;
  width: 60px;
}
#events-feed ul li .cal_date .day {
  font-size: 1.5em;
}
#events-feed ul li .title {
  float: left;
  font-family: Bitter;
  font-weight: bold;
}
#events-feed a::after {
  content: '';
}
/*------------------------------------*\
        MEDIA QUERIES
\*------------------------------------*/
@media only screen and (max-width: 991px) {
  main {
    font-size: 1em !important;
  }
  main h2 {
    font-size: 2em;
  }
}
@media only screen and (max-width: 775px) {
  .text-image-split {
    position: relative;
  }
  .text-image-split .container {
    left: 0;
    position: relative;
    top: 0;
    transform: inherit;
    z-index: 100;
  }
  .text-image-split .container .column:nth-child(2) {
    display: none;
  }
  .text-image-split .section-content {
    float: none !important;
  }
  .button {
    margin: 0.5em 0 !important;
    width: 100%;
  }
  .text-image-group .img-1,
  .text-image-group .img-2,
  .text-image-group .img-3,
  .text-image-group .img-4 {
    display: inline-block;
    float: none;
    height: 150px;
    margin-bottom: 0;
    object-fit: cover;
    width: 48%;
  }
  footer {
    padding-top: 3em;
  }
}
@media only screen and (max-width: 756px) {
  h2 {
    font-size: 2.4em;
  }
  .full-width-image img {
    margin: -1em 0;
  }
}
