.mediaBox {
  border: 2px outset rgba(4, 0, 2, 0.6); }
  .mediaBox iframe {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%; }

.slateForm {
  background-color: #ddd;
  display: block;
  padding: 20px;
  position: relative;
  width: 30%; }
  .slateForm button {
    color: #fff;
    padding: 20px 32px;
    margin: 1vw auto;
    border: 2px solid white;
    display: block;
    position: relative;
    background-color: rgba(5, 119, 65, 0.95);
    letter-spacing: .08em;
    width: auto;
    float: right; }
    .slateForm button:hover {
      background-color: #61b853;
      background-image: radial-gradient(50% 129%, rgba(97, 184, 83, 0) 29%, rgba(97, 184, 83, 0.22) 50%, rgba(0, 0, 0, 0.2) 100%);
      box-shadow: inset 0 1px 1px 0 rgba(0, 0, 0, 0.24);
      text-decoration: none;
      cursor: pointer;
      text-shadow: 1px 2px 2px black; }
  @media all and (max-width: 500px) {
    .slateForm {
      /* Mobile Device ONLY  */
      margin: 0 auto 20px;
      position: relative;
      width: 95%; 
      min-height: 600px;} }
  @media all and (min-width: 501px) {
    .slateForm.left {
      position: absolute;
      left: 12vw;
      top: 2vw; }
    .slateForm.center {
      width: 80%;
      margin: 0 auto 2vw;
      max-width: 1000px; }
    .slateForm.right {
      right: 12vw;
      top: 2vw;
      position: absolute; } }

.textSection {
  padding: 1vw 0; }
  .textSection.slate.gradient-bottom::before {
    background-image: none;
    background-color: rgba(0, 0, 0, 0.65); }
  .textSection.slate .sectionHeading {
    font: normal 400 72px/58px "Knockout 47 A", "Knockout 47 B";
    text-transform: none;
    margin-bottom: 0; }
  @media all and (min-width: 501px) {
    .textSection.slate {
      display: block; }
      .textSection.slate .sectionHeading.left {
        width: 50%;
        padding: 1vw 5vw 1vw 10vw;
        text-align: left; }
      .textSection.slate .sectionHeading.center {
        width: 100%;
        padding: 1vw 5vw 2vw 5vw;
        text-align: center; }
      .textSection.slate .sectionHeading.right {
        width: 50%;
        padding: 1vw 10vw 1vw 5vw;
        text-align: left;
        margin-left: auto; }
      .textSection.slate .sectionDescription.left {
        width: 50%;
        padding: 1vw 5vw 1vw 10vw;
        text-align: left; }
      .textSection.slate .sectionDescription.center {
        width: 100%;
        padding: 1vw 5vw 1vw 5vw;
        text-align: center;
        margin: 0 auto;
        max-width: 1400px; }
      .textSection.slate .sectionDescription.right {
        width: 50%;
        padding: 1vw 10vw 1vw 5vw;
        text-align: left;
        margin-left: auto; }
      .textSection.slate .sectionDescription p {
        font-size: 1.16em !important; } }

.storySection {
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
  position: relative;
  padding: 4vw;
  width: 100%; }
  .storySection .sectionDescription {
    font-size: 18px;
    line-height: 29px;
    position: relative;
    padding: 2em;
    width: 100%; }
    @media (min-width: 501px) {
      .storySection .sectionDescription {
        width: 50%; } }
    .storySection .sectionDescription p {
      margin: 0 0 1em 0;
      color: #ffffff; }
  .storySection.right .sectionDescription {
    margin-left: 0; }
    @media (min-width: 501px) {
      .storySection.right .sectionDescription {
        margin-left: 50%; } }
  .storySection.testimonial:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.3); }
  .storySection.testimonial .sectionDescription {
    text-shadow: 1.2px 4px 4px rgba(0, 0, 0, 0.94);
    font-style: italic; }
  .storySection.story .sectionDescription {
    background-color: rgba(0, 0, 0, 0.6); }
    .storySection.story .sectionDescription a.button {
      padding: .5rem 1rem;
      font-size: 1.25rem;
      line-height: 1.5;
      background-color: #000;
      border-radius: .3rem;
      border: 1px solid #51a744;
      border-radius: 0;
      color: #fff;
      text-decoration: none; }
      .storySection.story .sectionDescription a.button:hover {
        color: #51a744; }
  .storySection.video {
    padding: 0; }
    .storySection.video .video-full {
      position: relative;
      padding-bottom: 56.25%;
      /* 16:9 */
      padding-top: 25px;
      height: 0; }
      .storySection.video .video-full iframe {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%; }