/**
 * The base file that should be imported by every file.
 * There should be no CSS generation in this or from imported scss files at all!
 */
/**
 * Library
 */
/**
 * Variables and functions
 */
.section-content-video .container {
  display: flex;
  gap: 50px;
  flex-direction: column; }
  .section-content-video .container > .video-box {
    display: none; }
  .section-content-video .container .text .video-box {
    margin-bottom: 30px; }
  @media (min-width: 981px) {
    .section-content-video .container {
      flex-direction: row; }
      .section-content-video .container .text {
        width: 32%; } }
    @media (min-width: 981px) and (min-width: 1500px) {
      .section-content-video .container .text {
        width: 24%; } }
  @media (min-width: 981px) {
        .section-content-video .container .text .video-box {
          display: none; }
      .section-content-video .container > .video-box {
        flex-grow: 1;
        display: block; } }
  @media (min-width: 1200px) {
    .section-content-video .container {
      gap: 75px; } }
  @media (min-width: 1500px) {
    .section-content-video .container {
      gap: 150px; } }

.section-content-video .video {
  position: relative;
  padding-top: 78%;
  height: auto;
  min-height: auto;
  border-radius: 5px;
  overflow: hidden; }
  .section-content-video .video > .img, .section-content-video .video img, .section-content-video .video video, .section-content-video .video iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover; }
  @media (min-width: 981px) {
    .section-content-video .video {
      padding-top: 58%; } }
  .section-content-video .video a {
    display: block; }
  .section-content-video .video .play {
    position: absolute;
    pointer-events: none;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    height: 60px;
    width: 60px;
    border-radius: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--white);
    font-size: 25px;
    z-index: 1; }
    .section-content-video .video .play span {
      position: relative;
      left: 2px; }

.section-content-video .btn-content {
  margin-top: 60px; }
  @media (min-width: 480px) {
    .section-content-video .btn-content {
      max-width: 260px; } }
  .section-content-video .btn-content .btn {
    display: block; }

.section-content-video.video-first .video-box {
  order: 1; }

.section-content-video.video-first .text {
  order: 2; }

.section-content-video.blue .btn-content .btn {
  background: var(--light-sand);
  color: var(--dark-blue); }
  .section-content-video.blue .btn-content .btn:hover, .section-content-video.blue .btn-content .btn:focus {
    background: #d5ba8b; }

/*# sourceMappingURL=content-video.css.map */