layout.css in Drupal 10

Base Layout.

File

core/themes/olivero/css/layout/layout.css

/*
 * DO NOT EDIT THIS FILE.
 * See the following change record for more information,
 * https://www.drupal.org/node/3084859
 * @preserve
 */

/**
 * @file
 * Base Layout.
 */

/*
 * Media query breakpoints.
 * Processed by postcss/postcss-custom-media.
 */

/* Navigation related breakpoints */

/* Grid related breakpoints */

/* Grid shifts from 6 to 14 columns. */

/* Width of the entire grid maxes out. */

.container {
  width: 100%;
  max-width: var(--max-width);
  padding-left: var(--container-padding);
  padding-right: var(--container-padding)

  /* This fixes an issue where if the toolbar is open in vertical mode, and
   * the mobile navigation is open, the "close" button gets pushed outside of
   * the viewport. */
}

body.is-fixed .container {
    width: calc(100% - var(--drupal-displace-offset-left, 0px) - var(--drupal-displace-offset-right, 0px))
}

.page-wrapper {
  max-width: var(--max-bg-color);
  background: var(--color--white);
}

/**
 * Creates stacking context ensuring that child elements can never appear in
 * front of mobile navigation.
 */

.layout-main-wrapper {
  position: relative;
  z-index: 1;
}

/* Contains the social sidebar, and the primary content area. */

@media (min-width: 75rem) {

.layout-main {
    display: flex;
    flex-direction: row-reverse;
    flex-wrap: wrap
}
  }

@media (min-width: 75rem) {

[dir="ltr"] .main-content {
    margin-right: auto
  }

[dir="rtl"] .main-content {
    margin-left: auto
  }

.main-content {
    width: calc(100% - var(--content-left))
}
  }

.main-content__container {
  padding-top: var(--sp3)
}

@media (min-width: 43.75rem) {

.main-content__container {
    padding-top: var(--sp5)
}
  }