ba191a8276e84d0402b933de72546a4b6d7ca930
[wolnelektury.git] / src / wolnelektury / static / 2022 / styles / layout / _books.scss
1 .l-books__wrapper {
2   margin-top: 27px;
3   width: 100%;
4   background-color: #F2F2F2;
5   padding-top: 38px;
6   position: relative;
7   padding-bottom: 80px;
8
9   h2 {
10     font-weight: 600;
11     font-size: 31px;
12     line-height: 140%;
13     letter-spacing: -0.01em;
14     color: #474747;
15     margin-top: 0;
16   }
17 }
18
19 .l-books {
20   display: flex;
21   flex-wrap: wrap;
22   margin-top: 36px;
23 }
24
25 .l-books__item {
26   background: #FFFFFF;
27   border-radius: 9px;
28   padding: 21px;
29   box-shadow: 0px 4px 10px rgba(0, 0, 0, 0);
30
31   transition: all $ease-dynamic 350ms;
32
33   &:not(:last-child) {
34     margin-right: 20px;
35   }
36
37   &:hover {
38     box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.25);
39   }
40
41   &.l-books__item--link {
42     width: 212px;
43     height: 350px;
44
45     background-color: #007880;
46
47     font-weight: 600;
48     font-size: 21.5px;
49     line-height: 140%;
50     letter-spacing: -0.01em;
51     color: #FFFFFF;
52
53     display: flex;
54     flex-direction: column;
55     justify-content: space-between;
56
57     .icon-link {
58       margin-left: auto;
59       margin-right: 0;
60       &:hover {
61         text-decoration: none;
62       }
63     }
64
65     a {
66       &:hover {
67         color: white;
68       }
69     }
70   }
71
72   a {
73     &:hover {
74       text-decoration: underline;
75     }
76   }
77
78   h2 {
79     font-weight: normal;
80     font-size: 18px;
81     line-height: 150%;
82     color: #474747;
83     margin: 0;
84   }
85   h3 {
86     font-weight: normal;
87     font-size: 15px;
88     line-height: 160%;
89     color: #808080;
90     margin: 0;
91   }
92 }
93
94 .l-books__item__img {
95   margin: 0;
96   font-size: 0;
97   margin-bottom: 11px;
98
99   a {}
100   img {
101     max-width: 170px;
102   }
103 }