.block-system-branding-block { margin: 0.5rem auto; width: 8rem; @include media-tablet { float: left; margin: 0.5rem 2rem; width: auto; } } .site-logo img { display: block; max-width: 100%; width: 11rem; } #block-homepagehero { font-size: 1.8rem; line-height: 1.2; margin: auto; max-width: 30rem; padding: 3rem 1rem; text-align: center; @include media-tablet { } @include media-large { padding: 6rem 1rem; } @include media-wide { padding: 10rem 1rem; } img { max-width: 100%; } } #block-dcbschedule { overflow: hidden; position: relative; .field { box-sizing: border-box; padding: 2rem 2rem 2rem; position: relative; text-align: center; text-transform: uppercase; @include media-large { float: left; padding: 3rem 3rem 3rem; position: static; width: 33.333%; } @include media-wide { padding: 5rem 4rem 4rem; } &:before { bottom: 0; content: ''; left: 0; position: absolute; top: 0; width: 100%; z-index: -1; background-position: center; background-size: cover; @include media-large { width: 33.333%; } } &.field--name-field-cxo-text:before { background-image: url('../images/cxo.jpg'); @include media-large { left: 0; } } &.field--name-field-dev-text:before { background-image: url('../images/dev.jpg'); @include media-large { left: 33.333%; } } &.field--name-field-sprint-text:before { background-image: url('../images/sprint.jpg'); @include media-large { left: 66.666%; } } } p, h2 { margin: 0; } h2 { font-size: 5rem; font-weight: 700; line-height: 1; @include media-large { font-size: 3rem; } @include media-wide { font-size: 5rem; } } .schedule-day { font-size: 2.5rem; font-weight: bold; @include media-large { font-size: 2rem; } @include media-wide { font-size: 2.5rem; } } .schedule-location { font-size: 1.6rem; font-weight: 600; padding-top: 2rem; @include media-large { font-size: 1.2rem; } @include media-wide { font-size: 1.6rem; } } }