src/wolnelektury/static/2022/styles/components/_support.scss

   1 $green: #96C13D;
   2 $teal: #007880;
   3 $darkteal: #083F4D;
   4
   5
   6 .c-support {
   7   display: flex;
   8   margin-top: 50px;
   9   background: $darkteal;
  10   border-radius: 15px;
  11   overflow: hidden;
  12   justify-content: center;
  13   align-items: center;
  14
  15   h2 {
  16     margin: 0 auto;
  17     font-style: italic;
  18     font-weight: 400;
  19     font-size: 34px;
  20     line-height: 47px;
  21     letter-spacing: -0.02em;
  22     color: #ffffff;
  23     span {
  24         color: $green;
  25     }
  26   }
  27
  28   div {
  29       display: flex;
  30       flex-direction: column;
  31       justify-content: space-between;
  32       padding: 20px 30px 30px;
  33       height: 280px;
  34   }
  35
  36   figure {
  37     margin: 0;
  38     font-size: 0;
  39     position: relative;
  40
  41     img {
  42         width: 270px;
  43     }
  44   }
  45
  46   a {
  47     width: 100%;
  48     font-weight: 600;
  49     font-size: 22px;
  50     line-height: 28px;
  51     color: $darkteal;
  52     display: flex;
  53     align-items: center;
  54     justify-content: center;
  55     text-align: center;
  56     padding: 12px 22px 14px 28px;
  57     background: $color-yellow;
  58     border-radius: 5px;
  59     transition: all $ease-dynamic 350ms;
  60
  61     &:hover {
  62       background: $green;
  63     }
  64   }
  65 }
  66
  67 .c-support__content {
  68   padding: 16px 32px 30px 32px;
  69 }