/* * DO NOT EDIT THIS FILE. * See the following change record for more information, * https://www.drupal.org/node/3084859 * @preserve */ /** * @file * Wide image component. */ [dir="ltr"] .wide-image { margin-left: 0 } [dir="rtl"] .wide-image { margin-right: 0 } [dir="ltr"] .wide-image { margin-right: 0 } [dir="rtl"] .wide-image { margin-left: 0 } .wide-image { margin-top: 0.5625rem; margin-bottom: 2.25rem } @media (min-width: 43.75rem) { [dir="ltr"] .wide-image { margin-left: -7.14286vw } [dir="rtl"] .wide-image { margin-right: -7.14286vw } .wide-image { width: calc(100vw - 2.25rem); margin-top: 2.25rem; margin-bottom: 4.5rem } } @media (min-width: 62.5rem) { [dir="ltr"] .wide-image { margin-left: calc(-7.14286vw - -1.07143px) } [dir="rtl"] .wide-image { margin-right: calc(-7.14286vw - -1.07143px) } .wide-image { width: calc(85.71429vw - 3.05357rem) } } @media (min-width: 75rem) { [dir="ltr"] .wide-image { margin-left: calc(-7.14286vw - -0.62946rem) } [dir="rtl"] .wide-image { margin-right: calc(-7.14286vw - -0.62946rem) } .wide-image { width: calc(85.71429vw - 9.80357rem) } } @media (min-width: 90rem) { [dir="ltr"] .wide-image { margin-left: -5.86607rem } [dir="rtl"] .wide-image { margin-right: -5.86607rem } .wide-image { width: 68.14286rem } } /* Ensure that image doesn't overlap sidebar. */ @media (min-width: 62.5rem) { .sidebar-grid .wide-image { width: calc(64.28571vw - 2.85268rem) } } @media (min-width: 75rem) { .sidebar-grid .wide-image { width: calc(64.28571vw - 7.91518rem) } } @media (min-width: 81.25rem) { .sidebar-grid .wide-image { width: calc(71.42857vw - 8.54464rem) } } @media (min-width: 90rem) { .sidebar-grid .wide-image { width: 56.41071rem } } /* Ensure that image doesn't overlap layout builder sections when editing layouts. */ [dir="ltr"] .layout-builder .wide-image { margin-left: 0 } [dir="rtl"] .layout-builder .wide-image { margin-right: 0 } [dir="ltr"] .layout-builder .wide-image { margin-right: 0 } [dir="rtl"] .layout-builder .wide-image { margin-left: 0 } .layout-builder .wide-image { max-width: 100%; }