source: PostgreSqlDotnetCore/wwwroot/css/style.css@ 72b1da2

main
Last change on this file since 72b1da2 was 2aea0fd, checked in by ElenaMoskova <elena.moskova99@…>, 4 months ago

init commit Elena

  • Property mode set to 100644
File size: 3.3 KB
Line 
1@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;700&family=Source+Sans+Pro&display=swap');
2
3body {
4 font-family: 'Manrope', sans-serif;
5}
6
7.btn {
8 color: #fff;
9 text-transform: uppercase;
10 padding: 20px 40px;
11 font-size: 1rem;
12 cursor: pointer;
13 display: flex;
14 align-items: center;
15 gap: 12px;
16}
17
18.btn-sm {
19 padding: 12px 24px;
20 font-size: 0.9rem;
21 color: #19456B;
22}
23
24.btn-primary {
25 background-color: #16C79A;
26 border-radius: 50px;
27}
28
29.btn-primary:hover {
30 background-color: #1AA17E;
31}
32
33.btn-outline {
34 border: 2px solid #19456B;
35 background-color: transparent;
36 border-radius: 50px;
37}
38
39.btn-outline:hover {
40 color: #11698E;
41 border-color: #11698E;
42}
43
44.container {
45 max-width: 1280px;
46 /*max-height: 680px;*/
47 margin: 0 auto;
48}
49
50.overtitle {
51 font-size: 16px;
52 line-height: 24px;
53 color: #19456B;
54 font-weight: 700;
55 text-transform: uppercase;
56 border-radius: 32px 32px 0px 0px;
57}
58
59.title {
60 font-size: 44px;
61 line-height: 56px;
62 font-weight: 700;
63 color: #19456B;
64}
65
66/* layout */
67
68#header-container { /*isso é um elemento*/
69 background-color: #F8F1F1;
70}
71
72.header { /*isso é uma classe*/
73 padding: 24px 72px;
74 color: #19456B;
75 display: flex;
76 justify-content: space-between;
77 align-items: center;
78}
79
80/* hero section */
81
82#hero-container {
83 background-color: #F8F1F1;
84 color: #19456B;
85 padding: 48px 72px;
86}
87
88.hero {
89 display: flex;
90 align-items: center;
91 gap: 32px;
92}
93
94.hero-text {
95 flex: 1;
96 display: flex;
97 flex-direction: column;
98 align-items: flex-start;
99 gap: 16px;
100 padding: 96px 0;
101}
102
103.hero-img {
104 flex: 1;
105 align-self: flex-end;
106}
107
108.hero-img {
109 display: flex;
110}
111
112.hero-img img {
113 max-width: 40%;
114 height: 100%;
115 margin-left: 720px;
116 margin-top: -570px;
117}
118
119.herotxt {
120 font-size: 56px;
121 line-height: 64px;
122 font-weight: 700;
123}
124
125.text-p {
126 font-size: 20px;
127 line-height: 28px;
128 max-width: 520px;
129 color:#11698E
130}
131
132/* services section */
133
134#services-container {
135 padding: 96px 72px;
136 background-color: #19456B;
137}
138
139.services-list {
140 display: flex;
141 gap: 32px;
142}
143
144.service-card {
145 background-color: #11698E;
146 border-radius: 40px;
147 color: #fff;
148}
149
150.service-card img {
151 width: 100%;
152}
153
154.service-text {
155 padding: 32px;
156}
157
158.service-text h3 {
159 font-size: 24px;
160 line-height: 32px;
161 font-weight: 700;
162}
163
164.service-text p {
165 font-size: 16px;
166 line-height: 24px;
167 font-weight: 400;
168}
169
170/* location section */
171
172#location-container {
173 background-color: #f5f3f4;
174}
175
176#location-container .location {
177 padding: 96px 72px 48px;
178}
179
180#location-container address {
181 display: flex;
182 align-items: center;
183 gap: 12px;
184}
185
186
187/* footer section */
188
189footer {
190 background-color: #11698e;
191 color: #fff;
192 gap: 10px;
193 padding: 48px 72px;
194 display: flex;
195 justify-content: space-between;
196 align-items: center;
197}
198
199.footer-logocopy {
200 display: flex;
201 flex-direction: column;
202 gap: 16px;
203}
204
205/* scroll section */
206
207::-webkit-scrollbar {
208 width: 12px;
209}
210
211::-webkit-scrollbar-track {
212 background: #19456B;
213}
214
215::-webkit-scrollbar-thumb {
216 background: #16C79A;
217 border-radius: 4px;
218}
219
220.footer-image {
221 position: absolute;
222 right: 0;
223 margin-top: -360px;
224}
Note: See TracBrowser for help on using the repository browser.