/**
 * Gutenberg Blocks Frontend Styles
 *
 * This file imports the less needed to style our own blocks in the frontend
 */
/* Micro ClearFix Mixin */
.wp-block-agncy-split {
  clear: both;
  color: #555;
  margin: 0 0 24px;
  display: grid;
  grid-template-columns: 50% 50%;
  grid-template-rows: auto;
  background: #f2f2f2;
  grid-template-areas: "image image" "body body";
}
.wp-block-agncy-split .split-content-image {
  grid-area: image;
  position: relative;
}
.wp-block-agncy-split .split-content-image .split-image {
  -o-object-fit: cover;
     object-fit: cover;
  display: block;
  width: 100%;
  height: 100%;
  margin: 0;
}
.wp-block-agncy-split .split-content-image .components-placeholder {
  -webkit-box-flex: 1;
      -ms-flex: 1 1 100%;
          flex: 1 1 100%;
  height: 100%;
}
.wp-block-agncy-split .split-content-body {
  grid-area: body;
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -ms-flex-line-pack: center;
      align-content: center;
  padding: 24px 16px;
}
.wp-block-agncy-split .split-content-heading {
  -webkit-box-flex: 1;
      -ms-flex: 1 1 100%;
          flex: 1 1 100%;
  position: relative;
  z-index: 1;
  width: 100%;
}
.wp-block-agncy-split .split-content-heading h2,
.wp-block-agncy-split .split-content-heading h3,
.wp-block-agncy-split .split-content-heading h4 {
  font-size: 40px;
  line-height: 1.2em;
  color: inherit;
}
.wp-block-agncy-split .split-content-text {
  -webkit-box-flex: 1;
      -ms-flex: 1 1 100%;
          flex: 1 1 100%;
  word-break: break-word;
  position: relative;
  z-index: 1;
  width: 100%;
}
@media (min-width: 768px) {
  .wp-block-agncy-split {
    margin-bottom: 27px;
  }
  .wp-block-agncy-split .split-content-body {
    padding: 6.75px 8px;
  }
  .wp-block-agncy-split .split-content-heading h2,
  .wp-block-agncy-split .split-content-heading h3,
  .wp-block-agncy-split .split-content-heading h4 {
    font-size: 44px;
    line-height: 1.22727273em;
  }
  .wp-block-agncy-split.alignwide .split-content-body,
  .wp-block-agncy-split.alignfull .split-content-body {
    padding: 27px 32px;
  }
}
@media (min-width: 992px) {
  .wp-block-agncy-split {
    grid-template-areas: "image body";
  }
  .wp-block-agncy-split.is-split-right {
    grid-template-areas: "body image";
  }
  .wp-block-agncy-split .split-content-body {
    padding: 6.75px 8px;
  }
  .wp-block-agncy-split .split-content-body:before,
  .wp-block-agncy-split .split-content-body:after {
    background-size: 33% auto;
  }
  .wp-block-agncy-split.alignwide .split-content-body,
  .wp-block-agncy-split.alignfull .split-content-body {
    padding: 27px 32px;
  }
  .wp-block-agncy-split.alignwide .split-content-heading h2,
  .wp-block-agncy-split.alignfull .split-content-heading h2,
  .wp-block-agncy-split.alignwide .split-content-heading h3,
  .wp-block-agncy-split.alignfull .split-content-heading h3,
  .wp-block-agncy-split.alignwide .split-content-heading h4,
  .wp-block-agncy-split.alignfull .split-content-heading h4 {
    font-size: 55px;
    line-height: 1.47272727em;
  }
}
@media (min-width: 1200px) {
  .wp-block-agncy-split .split-content-body {
    padding: 6.75px 8px;
  }
  .wp-block-agncy-split.alignwide .split-content-body,
  .wp-block-agncy-split.alignfull .split-content-body {
    padding: 54px 120px;
  }
}
.wp-block-agncy-image-background {
  background-position: center center;
  background-size: cover;
  position: relative;
  clear: both;
  margin-bottom: 24px;
  padding: 48px 16px;
  z-index: 0;
}
.wp-block-agncy-image-background .background-dim {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  z-index: -1;
}
@media (min-width: 768px) {
  .wp-block-agncy-image-background {
    padding: 54px 16px;
    margin-bottom: 27px;
  }
}
@media (min-width: 992px) {
}
@media (min-width: 1200px) {
}
/*.backgroundDim(@step) when (@step > 0) {
	.backgroundDim((@step - 1));
	@dim: @step * 10;

	&.has-background-dim-@{dim} {
		&:before {
			content: "";
			display: block;
			position: absolute;
			z-index: -1;
			top: 0;
			left: 0;
			right: 0;
			bottom: 0;
			background-color: fadeOut( @gray3, ( 100 - @step * 10 ) );
		}
	}
}*/
