Text overlay toggler and table of contents
[wolnelektury.git] / src / wolnelektury / static / 2022 / styles / components / _support.scss
1 .c-support {
2   display: flex;
3   margin-top: 50px;
4   background: #FFF1BF url(../images/bg.png) top center no-repeat;
5   border-radius: 15px;
6   overflow: hidden;
7   justify-content: center;
8   align-items: center;
9
10   h2 {
11     padding-left: 44px;
12     padding-right: 20px;
13     margin: 0 auto;
14     font-style: italic;
15     font-weight: 300;
16     font-size: 48px;
17     line-height: 72px;
18     letter-spacing: -0.02em;
19     color: #333333;
20   }
21
22   figure {
23     margin: 0;
24     font-size: 0;
25     position: relative;
26   }
27
28   a {
29     bottom: 34px;
30     left: 0; right: 0;
31     width: 100%;
32     margin: 0 auto;
33     max-width: 343px;
34     position: absolute;
35     font-weight: 600;
36     font-size: 22px;
37     line-height: 28px;
38     color: #333333;
39     display: flex;
40     align-items: center;
41     justify-content: center;
42     text-align: center;
43     padding: 12px 22px 14px 28px;
44     background: #FFF1BF;
45     box-shadow: 0 0 6px rgba(0, 0, 0, 0.5);
46     border-radius: 5px;
47     transition: all $ease-dynamic 350ms;
48
49     &:hover {
50       background: $color-yellow;
51     }
52   }
53 }