]>
Commit | Line | Data |
---|---|---|
48fb1d3b MT |
1 | body { |
2 | background-color: #eceff1; | |
3 | color: #263238; | |
4 | ||
5 | display: flex; | |
6 | min-height: 100vh; | |
7 | flex-direction: column; | |
8b920789 AM |
8 | } |
9 | ||
48fb1d3b MT |
10 | body, input { |
11 | font-family: "Ubuntu", sans-serif; | |
12 | font-size: 14px; | |
8b920789 AM |
13 | } |
14 | ||
48fb1d3b MT |
15 | .content { |
16 | flex: 1; | |
17 | } | |
18 | ||
19 | .box { | |
20 | margin: 272px 0 48px 0; | |
21 | padding: 0 30px 48px 30px; | |
22 | ||
8b920789 | 23 | position: relative; |
48fb1d3b MT |
24 | display: flex; |
25 | flex-direction: column; | |
26 | background-color: white; | |
27 | ||
28 | border: none; | |
29 | border-radius: 4px; | |
30 | box-shadow: | |
31 | 0 19px 38px 0 rgba(0, 0, 0, 0.3), | |
32 | 0 15px 12px 0 rgba(0, 0, 0, 0.22); | |
33 | } | |
34 | ||
35 | .box-header { | |
36 | display: flex; | |
37 | align-items: center; | |
38 | justify-content: center; | |
39 | min-height: 128px; | |
40 | } | |
41 | ||
42 | .box-header h1 { | |
43 | font-size: 40px; | |
44 | } | |
45 | ||
46 | @media (min-width: 1200px) { | |
47 | .box-header { | |
48 | min-height: none; | |
49 | } | |
50 | ||
51 | .box-header h1 { | |
52 | margin-top: 24px; | |
53 | margin-bottom: 20px; | |
54 | } | |
55 | } | |
56 | ||
57 | .box-block { | |
58 | padding: 24px 16px 24px 16px; | |
59 | margin: 0 -8px 40px -8px; | |
60 | ||
61 | text-align: center; | |
62 | background-color: #b71c1c; | |
63 | color: white; | |
64 | border-radius: 4px; | |
65 | } | |
66 | ||
67 | @media (min-width: 1200px) { | |
68 | .box-block { | |
69 | padding: 18px 16px 18px 16px; | |
70 | margin: 0 0 48px 0; | |
71 | } | |
72 | } | |
73 | ||
74 | .box-block h4 { | |
75 | font-size: 20px; | |
76 | } | |
77 | ||
78 | footer { | |
79 | height: 64px; | |
80 | background-color: rgba(84, 110, 122, 0.06); /* #546e7a */ | |
81 | } | |
82 | ||
83 | .footer { | |
84 | display: flex; | |
85 | align-items: center; | |
86 | } | |
87 | ||
88 | .footer .logo { | |
89 | width: 64px; | |
90 | height: 64px; | |
91 | padding: 8px; | |
92 | } | |
93 | ||
94 | .form-text { | |
95 | display: inline-block; | |
96 | height: 36px; | |
97 | ||
98 | color: #263238; | |
99 | background-color: rgba(38, 49, 56, 0,08); | |
100 | ||
101 | border: 0; | |
102 | border-radius: 2px; | |
103 | box-shadow: inset 0 -2px 0 0 #546e7a; | |
104 | } | |
105 | ||
106 | .form-text .error { | |
107 | box-shadow: 0 -2px 0 0 #ff3d00; | |
108 | } | |
109 | ||
110 | .form-submit { | |
111 | display: inline-block; | |
112 | ||
113 | font-weight: 500; | |
114 | text-transform: uppercase; | |
115 | ||
116 | height: 36px; | |
117 | padding: 0 16px 0 16px; | |
118 | margin: 0 8px 0 8px; | |
119 | ||
120 | color: #263238; | |
121 | background-color: white; | |
122 | ||
123 | border: none; | |
124 | border-radius: 2px; | |
125 | box-shadow: | |
126 | 0 2px 4px 0 rgba(0, 0, 0, 0.16), | |
127 | 0 1px 2px 0 rgba(0, 0, 0, 0.23); | |
128 | } | |
129 | ||
130 | .form-submit:hover { | |
131 | box-shadow: | |
132 | 0 3px 6px 0 rgba(0, 0, 0, 0.16), | |
133 | 0 3px 6px 0 rgba(0, 0, 0, 0.23); | |
134 | } | |
135 | ||
136 | .form-submit:active { | |
137 | background-color: black; | |
138 | opacity: 0.16; | |
139 | box-shadow: none; | |
140 | } | |
141 | ||
142 | .checkbox { | |
8b920789 | 143 | position: relative; |
48fb1d3b MT |
144 | display: block; |
145 | ||
146 | margin-top: 20px; | |
8b920789 AM |
147 | } |
148 | ||
48fb1d3b MT |
149 | .checkbox .form-checkbox { |
150 | position: absolute; | |
151 | margin-top: 1px; | |
152 | margin-left: -24px; | |
153 | ||
154 | width: 20px; | |
155 | height: 20px; | |
156 | ||
157 | background-color: rgba(38, 49, 56, 0.08); | |
158 | ||
159 | border: 2px solid #546e7a; | |
160 | border-radius: 2px; | |
161 | } |