X-Git-Url: https://git.mdrn.pl/wolnelektury.git/blobdiff_plain/eb2eb95bfbfe8c777c4192ea434a0e999edf3a51..8db46b44b9824b66f10c1b8030b1bdb5a5cc9795:/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 4f0ce2b15..76ff590a6 100644 --- a/src/wolnelektury/static/2022/styles/components/_support.scss +++ b/src/wolnelektury/static/2022/styles/components/_support.scss @@ -1,53 +1,69 @@ +$green: #96C13D; +$teal: #007880; +$darkteal: #083F4D; + + .c-support { display: flex; margin-top: 50px; - background: #FFF1BF url(../images/bg.png) top center no-repeat; + background: $darkteal; border-radius: 15px; overflow: hidden; justify-content: center; align-items: center; h2 { - padding-left: 44px; - padding-right: 20px; margin: 0 auto; font-style: italic; - font-weight: 300; - font-size: 48px; - line-height: 72px; + font-weight: 400; + font-size: 34px; + line-height: 47px; letter-spacing: -0.02em; - color: #333333; + color: #ffffff; + span { + color: $green; + } } + div { + display: flex; + flex-direction: column; + justify-content: space-between; + padding: 20px 30px 30px; + height: 280px; + } + figure { margin: 0; font-size: 0; position: relative; + + img { + width: 270px; + } } a { - bottom: 34px; - left: 0; right: 0; width: 100%; - margin: 0 auto; - max-width: 343px; - position: absolute; font-weight: 600; font-size: 22px; line-height: 28px; - color: #333333; + color: $darkteal; display: flex; align-items: center; justify-content: center; text-align: center; padding: 12px 22px 14px 28px; - background: #FFF1BF; - box-shadow: 0 0 6px rgba(0, 0, 0, 0.5); + background: $color-yellow; border-radius: 5px; transition: all $ease-dynamic 350ms; &:hover { - background: $color-yellow; + background: $green; } } } + +.c-support__content { + padding: 16px 32px 30px 32px; +}