.block-media img,
.block-media video {
  width: 100%;
  height: auto;
}
.block-media iframe,
.block-media .overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.block-media .iframe-wrapper {
  position: relative;
  width: 100%;
}

.block-media.type-full .media {
  position: relative;
  min-height: 0vw;
  width: calc((100% - 20px) * 0.833333);
}
.block-media.type-full .media + .media {
  margin-top: calc(25px + 25 * ((100vw - 320px) / 1120));
}
.block-media.type-full .media a {
  display: block;
}
.block-media .align-center {
  margin: 0 auto;
}
.block-media .align-right {
  margin-left: auto;
}

.block-media.type-columns .wrapper {
  display: flex;
  padding: 0 10px;
}
.block-media.type-columns .media {
  flex: 1;
  padding: 0 10px;
}

.block-media.type-template .wrapper {
  display: flex;
  flex-wrap: wrap;
}
.block-media.type-template .wrapper .media:first-child {
  margin-right: 20px;
}
.editor-styles-wrapper .block-media.type-template .wrapper .media:first-child {
  margin-bottom: calc(25px + 25 * ((100vw - 320px) / 1120));
}
.block-media.type-template .wrapper .media:last-child {
  margin-left: auto;
}
.block-media.type-template .span-6 {
  min-height: 0vw;
  width: calc(258px + 449 * ((100vw - 320px) / 1120));
}
.block-media.type-template .span-4 {
  min-height: 0vw;
  width: calc(207px + 265 * ((100vw - 320px) / 1120));
}

@media (max-width: 821px){
  .block-media.type-template .wrapper .media:first-child {
    margin-bottom: calc(25px + 25 * ((100vw - 320px) / 1120));
  }
}

@media (max-width: 767.9px){
  .block-media.type-full .media {
    width: calc((100% - 10px) * 0.833333);
  }
  .block-media.type-columns .wrapper {
    padding: 0 5px;
  }
  .block-media.type-columns .image {
    padding: 0 5px;
  }
  .block-media.type-template .wrapper .media:first-child {
    margin-right: 0;
  }
}

@media (max-width: 575.9px){
  .block-media.type-full .media {
    width: 100%;
  }
}