X-Git-Url: https://git.mdrn.pl/wolnelektury.git/blobdiff_plain/f0d9161da1b3fe4d3a528f95df30e26d221f73d4..f1cc3d495b3df83b3e745575c2ff3bdf4942b2fe:/src/wolnelektury/static/2022/styles/components/_support.scss diff --git a/src/wolnelektury/static/2022/styles/components/_support.scss b/src/wolnelektury/static/2022/styles/components/_support.scss index 76ff590a6..413269849 100644 --- a/src/wolnelektury/static/2022/styles/components/_support.scss +++ b/src/wolnelektury/static/2022/styles/components/_support.scss @@ -5,21 +5,27 @@ $darkteal: #083F4D; .c-support { display: flex; + flex-direction: column-reverse; margin-top: 50px; background: $darkteal; border-radius: 15px; overflow: hidden; justify-content: center; - align-items: center; + align-items: stretch; + @include rwd($break-flow) { + flex-direction: row; + } + h2 { - margin: 0 auto; + margin: 0 auto 35px; font-style: italic; font-weight: 400; font-size: 34px; line-height: 47px; letter-spacing: -0.02em; color: #ffffff; + span { color: $green; } @@ -30,17 +36,19 @@ $darkteal: #083F4D; flex-direction: column; justify-content: space-between; padding: 20px 30px 30px; - height: 280px; } - figure { - margin: 0; - font-size: 0; - position: relative; + .bg { + flex-basis: 193px; + flex-grow: 0; + flex-shrink: 0; + background-image: url('/static/2022/images/dziecko.jpeg'); + background-size: cover; + background-position: 50% 20%; - img { - width: 270px; - } + @include rwd($break-flow) { + flex-basis: 270px; + } } a {