@randstad-design/orbit-multitheme/dist/assets/theme-spherion/bundles/banners.css

multitheme Front-end code based on Randstad Human Forward components

.banner__content {
  padding-bottom: 50px;
  padding-top: 50px;
  width: 100%; }

.banner__text-container {
  padding-top: 15px;
  padding-bottom: 50px;
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  -webkit-column-gap: calc((2/28) * 100%);
  -moz-column-gap: calc((2/28) * 100%);
  column-gap: calc((2/28) * 100%); }

.banner .content-block__title {
  font-family: Montserrat-ExtraBold, arial, sans-serif;
  font-size: 32px;
  text-transform: uppercase;
  line-height: 40px; }
  @media (min-width: 941px) {
    .banner .content-block__title {
      font-family: Montserrat-ExtraBold, arial, sans-serif;
      font-size: 40px;
      text-transform: uppercase;
      line-height: 45px; } }

.banner .content-block__title-s {
  font-family: Montserrat-SemiBold, arial, sans-serif;
  font-size: 26px;
  text-transform: none;
  line-height: 30px; }
  @media (min-width: 941px) {
    .banner .content-block__title-s {
      font-family: Montserrat-SemiBold, arial, sans-serif;
      font-size: 40px;
      text-transform: none;
      line-height: 45px; } }

@media (max-width: 940px) {
  .banner .content-block__description {
    margin-top: 10px; }
  .banner__media {
    margin-left: -50px;
    margin-right: -50px; }
    .banner__media img {
      height: 200px;
      -o-object-fit: cover;
      object-fit: cover;
      width: 100%; }
    .banner__media + .banner__content {
      padding-top: 30px; }
  .banner__media:not(.media-block--half-width):not(.media-block--full-width):not(.media-block--boxed-large) img {
    height: 300px;
    margin: 0 auto;
    max-height: 100%; }
  .banner__media:not(.media-block--half-width):not(.media-block--full-width):not(.media-block--boxed-large):not(.media-block--boxed) {
    margin: 0 auto; }
  .banner .media-block--boxed {
    margin: 0;
    height: 300px; }
  .banner__wrapper {
    padding-top: 50px; } }

@media (max-width: 500px) {
  .banner__media {
    margin-left: -25px;
    margin-right: -25px; } }

@media (min-width: 941px) {
  .banner {
    overflow: hidden;
    position: relative; }
    .banner__wrapper {
      display: -webkit-box;
      display: -webkit-flex;
      display: -ms-flexbox;
      display: flex;
      min-height: 470px; }
    .banner__content {
      -webkit-align-self: center;
      -ms-flex-item-align: center;
      align-self: center;
      padding-bottom: 80px;
      padding-top: 80px;
      position: relative;
      width: calc((23/58) * 100%); }
      .banner__content--s {
        margin-left: calc(((3 + (1 * 2)) /58) * 100%);
        width: calc((23/58) * 100%); }
      .banner__content--full-width {
        width: 100%; }
    .banner__text-container {
      padding-top: 130px;
      padding-bottom: 130px;
      -webkit-box-flex: 0;
      -webkit-flex: 0 0 calc((28/58) * 100%);
      -ms-flex: 0 0 calc((28/58) * 100%);
      flex: 0 0 calc((28/58) * 100%);
      width: 100%;
      display: grid;
      grid-template-columns: repeat(6, minmax(0, 1fr));
      -webkit-column-gap: calc((2/58) * 100%);
      -moz-column-gap: calc((2/58) * 100%);
      column-gap: calc((2/58) * 100%); }
    .banner__text-container--s {
      padding-bottom: 100px;
      padding-top: 100px; }
    .banner .content-block__title {
      overflow-wrap: normal; }
    .banner__media {
      -webkit-box-ordinal-group: 2;
      -webkit-order: 1;
      -ms-flex-order: 1;
      order: 1;
      right: 0; }
    .banner .media-block--boxed {
      -webkit-align-self: center;
      -ms-flex-item-align: center;
      align-self: center;
      max-width: calc((28/58) * 100%);
      height: 400px; }
    .banner--alternative .banner__text-container {
      -webkit-box-flex: 0;
      -webkit-flex: 0 0 calc((28/58) * 100%);
      -ms-flex: 0 0 calc((28/58) * 100%);
      flex: 0 0 calc((28/58) * 100%);
      margin-left: auto; }
    .banner--alternative .banner__content {
      margin-left: auto;
      -webkit-box-ordinal-group: 2;
      -webkit-order: 1;
      -ms-flex-order: 1;
      order: 1; }
    .banner--alternative .banner__content--s {
      margin-left: auto;
      margin-right: calc((3/58) * 100%);
      padding-left: 0;
      padding-right: calc(2 / 58 * 100%); }
    .banner--alternative .banner__media {
      margin-left: 0; }
    .banner--alternative .media-block--half-width {
      left: 0; }
    .banner--alternative img {
      right: 0; } }

/*# sourceMappingURL=banners.css.map */