@use "../abstracts/themes";

// Video Styles
div.layout-video {
  padding: 1.5em 0;
  text-align: center;

  p {
    font-size: 0.85em;
    letter-spacing: -0.005em;
    line-height: 1.5;
    margin: 1.25em 1em 0.5em 1em;

    @include themes.themed($color: "medium-light");

    a {
      font-weight: bold;
      letter-spacing: 0.001em;
    }
  }

  video {
    width: 100%;
    height: auto;
  }
}

// Responsive
@mixin responsive() {
  div.layout-video {
    padding: 1em 0;

    h1 {
      font-size: 1.6em;
      padding: 0 0.6em;
    }

    video {
      width: 100%;
      height: auto;
    }
  }
}