.novablocks-media {
margin-left: auto;
margin-right: auto; }
.novablocks-media > .wp-block-group__inner-container {
padding-top: 1px; }
.novablocks-media .wp-block-group__inner-container > .wp-block {
display: -webkit-box;
display: -ms-flexbox;
display: flex; }
.novablocks-media .wp-block-group__inner-container > .wp-block > * {
-webkit-box-flex: 1;
-ms-flex-positive: 1;
flex-grow: 1; }
.novablocks-media__layout {
margin-top: calc( -1 * var(--novablocks-media-gutter));
margin-left: calc( -1 * var(--novablocks-media-gutter));
pointer-events: none; }
.novablocks-media__layout > * {
padding-left: var(--novablocks-media-gutter);
margin-top: var(--novablocks-media-gutter);
pointer-events: auto; }
@media only screen and (min-width: 768px) {
.novablocks-media__layout {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-box-align: stretch;
-ms-flex-align: stretch;
align-items: stretch; }
.novablocks-media__layout .novablocks-media__aside {
-webkit-box-flex: 1;
-ms-flex: 1 1 calc( 100% - var(--novablocks-media-content-width, 50%));
flex: 1 1 calc( 100% - var(--novablocks-media-content-width, 50%)); }
.novablocks-media__layout .novablocks-media__content {
-webkit-box-flex: 1;
-ms-flex: 1 1 var(--novablocks-media-content-width, 50%);
flex: 1 1 var(--novablocks-media-content-width, 50%); } }
.novablocks-media,
.novablocks-media .novablocks-advanced-gallery,
.novablocks-media__layout,
.novablocks-media__aside,
.novablocks-media__content {
-webkit-transition: var(--novablocks-transition);
transition: var(--novablocks-transition);
-webkit-transition-property: padding, margin;
transition-property: padding, margin; }
.novablocks-media[class][class] {
--block-top-spacing: var(--novablocks-block-top-spacing);
--block-bottom-spacing: var(--novablocks-block-bottom-spacing);
--emphasis-top-spacing: var(--novablocks-emphasis-top-spacing);
--emphasis-bottom-spacing: var(--novablocks-emphasis-bottom-spacing); }
@media only screen and (min-width: 768px) {
.novablocks-media[class][class] {
margin-top: calc( var(--block-top-spacing, 0) * var(--novablocks-media-spacing));
margin-bottom: calc( var(--block-bottom-spacing, 0) * var(--novablocks-media-spacing));
padding-top: calc( -1 * var(--emphasis-top-spacing, 0) * var(--novablocks-media-spacing));
padding-bottom: calc( -1 * var(--emphasis-bottom-spacing, 0) * var(--novablocks-media-spacing)); }
.novablocks-media[class][class] .components-placeholder,
.novablocks-media[class][class] .novablocks-advanced-gallery {
margin-top: calc( var(--emphasis-top-spacing, 0) * var(--novablocks-media-spacing));
margin-bottom: calc( var(--emphasis-bottom-spacing, 0) * var(--novablocks-media-spacing)); }
.novablocks-media[class][class] .novablocks-media__content {
padding-top: calc( var(--emphasis-top-spacing, 0) * var(--novablocks-media-spacing));
padding-bottom: calc( var(--emphasis-bottom-spacing, 0) * var(--novablocks-media-spacing)); } }
@media not screen and (min-width: 768px) {
.novablocks-media[class][class] {
--novablocks-media-gutter: 0 !important;
--block-top-spacing: 1;
--block-bottom-spacing: 1;
--emphasis-top-spacing: 0;
--emphasis-bottom-spacing: 0; }
.novablocks-media[class][class] .novablocks-block,
.novablocks-media[class][class] .novablocks-media__content,
.novablocks-media[class][class] .novablocks-media__aside {
padding-top: calc( var(--novablocks-media-spacing) * 0.5);
padding-bottom: calc( var(--novablocks-media-spacing) * 0.5); } }
.novablocks-media .novablocks-block[class] {
background: -webkit-gradient(linear, left top, left bottom, from(var(--novablocks-media-background-direction)), color-stop(0, var(--novablocks-bg-color)), color-stop(var(--novablocks-bg-color)), to(transparent));
background: linear-gradient(var(--novablocks-media-background-direction), var(--novablocks-bg-color) 0, var(--novablocks-bg-color) calc(var(--emphasis-area) * 1%), transparent calc(var(--emphasis-area) * 1%));
background-size: 100% 100%; }
@media not screen and (min-width: 768px) {
.novablocks-media .novablocks-block[class] {
--emphasis-area: 100; } }
.novablocks-media.has-image-on-the-left {
--novablocks-media-background-direction: -90deg; }
.novablocks-media__content {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-flex: 1;
-ms-flex-positive: 1;
flex-grow: 1; }
.novablocks-media__content:before, .novablocks-media__content:after {
content: '';
display: block;
height: 0;
-webkit-box-flex: 0;
-ms-flex: 0 0 auto;
flex: 0 0 auto; }
.novablocks-u-valign-top .novablocks-media__content:before, .novablocks-u-valign-top .novablocks-media__content:after,
.novablocks-u-valign-center .novablocks-media__content:before,
.novablocks-u-valign-center .novablocks-media__content:after,
.novablocks-u-valign-bottom .novablocks-media__content:before,
.novablocks-u-valign-bottom .novablocks-media__content:after {
-webkit-box-flex: 1;
-ms-flex-positive: 1;
flex-grow: 1; }
.novablocks-u-valign-top .novablocks-media__content:before {
-webkit-box-flex: 0;
-ms-flex-positive: 0;
flex-grow: 0; }
.novablocks-u-valign-bottom .novablocks-media__content:after {
-webkit-box-flex: 0;
-ms-flex-positive: 0;
flex-grow: 0; }
.novablocks-media__inner-container {
-webkit-box-flex: 1;
-ms-flex-positive: 1;
flex-grow: 1; }
.novablocks-u-valign-top .novablocks-media__inner-container,
.novablocks-u-valign-center .novablocks-media__inner-container,
.novablocks-u-valign-bottom .novablocks-media__inner-container {
-webkit-box-flex: 0;
-ms-flex-positive: 0;
flex-grow: 0; }
.novablocks-media__inner-container.has-image-on-the-left {
--novablocks-media-background-direction: -90deg; }
.novablocks-media__inner-container > * {
width: 100%; }
.novablocks-media__inner-container {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
word-break: break-word; }
.novablocks-media__aside {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-item-align: stretch;
align-self: stretch;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
min-height: 400px; }
@media only screen and (min-width: 768px) {
.has-image-on-the-left .novablocks-media__aside {
-webkit-box-ordinal-group: 0;
-ms-flex-order: -1;
order: -1; } }
.novablocks-media__aside > .novablocks-advanced-gallery {
-webkit-box-flex: 1;
-ms-flex-positive: 1;
flex-grow: 1;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: stretch;
-ms-flex-align: stretch;
align-items: stretch; }
@media not screen and (min-width: 768px) {
.novablocks-media__aside > .novablocks-advanced-gallery {
margin-top: 0;
margin-bottom: 0; } }
.novablocks-media__aside > .block-editor-media-placeholder {
-webkit-box-flex: 1;
-ms-flex-positive: 1;
flex-grow: 1; }
.novablocks-media__aside .novablocks-advanced-gallery__grid {
-webkit-box-flex: 1;
-ms-flex-positive: 1;
flex-grow: 1; }
.novablocks-media__image:nth-child(n + 5) {
display: none; }