/**
 * 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-column-division-videos .video-elements {
  display: grid;
  grid-template-columns: 1fr;
  gap: 3em; }
  @media (min-width: 981px) {
    .section-column-division-videos .video-elements {
      grid-template-columns: repeat(4, 1fr); } }
  .section-column-division-videos .video-elements .video-element {
    position: relative; }
    .section-column-division-videos .video-elements .video-element.is-playing .video-controls {
      opacity: 0;
      pointer-events: none; }
  .section-column-division-videos .video-elements video {
    width: 100%;
    min-height: 41.25rem;
    -o-object-fit: cover;
       object-fit: cover; }
  .section-column-division-videos .video-elements .video button.center {
    display: none !important; }
  .section-column-division-videos .video-elements .video-controls {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 0; }
    @media (max-width: 479px) {
      .section-column-division-videos .video-elements .video-controls {
        display: none; } }
    .section-column-division-videos .video-elements .video-controls:hover {
      cursor: pointer; }
      .section-column-division-videos .video-elements .video-controls:hover svg g path:nth-child(1) {
        display: none; }
      .section-column-division-videos .video-elements .video-controls:hover svg g path:nth-child(3) {
        opacity: 1; }

.section-column-division-videos .btn-content {
  margin-top: calc(35px + 1em); }

/*# sourceMappingURL=column-videos.css.map */