user.css (4132B) download
1body {
2 background-color: #BCCFB0;
3 color: #333333;
4 font-family: Roboto, sans-serif;
5 margin: 0;
6 padding: 0;
7}
8
9a {
10 color: white;
11 font-family: Roboto, sans-serif;
12}
13
14/*NAVBAR*/
15nav {
16 background-color: #333333;
17 width: 100%;
18 height: 15vw;
19 display: flex;
20 align-items: center;
21}
22
23nav ul {
24 margin: 0;
25 padding: 0;
26 width: 100%;
27 height: 15vw;
28 display: flex;
29 list-style-type: none;
30 align-items: center;
31}
32
33nav li {
34 font-weight: bold;
35 font-size: 4vw;
36 margin-right: 3vw;
37}
38
39nav ul li a {
40 color: #fff;
41 text-decoration: none;
42 padding: 0;
43}
44
45nav ul li a.active {
46 pointer-events: none;
47 color: gray;
48}
49
50nav ul li:first-child {
51 margin-right: auto;
52}
53
54.img-big-logo {
55 display: none;
56}
57
58.img-small-logo,
59.img-big-logo {
60 height: 15vw;
61 width: auto;
62 vertical-align: middle;
63}
64table {
65 border-collapse: collapse;
66 box-shadow: 0 0 10px #333333;
67 color: white;
68}
69
70th, td {
71 background-color: #333333;
72 padding: 8px;
73 text-align: left;
74 border-bottom: 1px solid #ddd;
75}
76
77th {
78 background-color: gray;
79 font-weight: bold;
80}
81
82tr:hover {
83 background-color: #444444;
84}
85
86.block1 {
87 display: flex;
88 width: 90vw;
89 height: auto;
90 margin: 5vw auto 5vw;
91 justify-content: space-between;
92 background-color: #BCCFB0;
93 color: white;
94 border-radius: 4px;
95}
96
97.container {
98 box-shadow: 0 0 10px rgba(51, 51, 51, 0.2);
99 margin: 20px auto;
100 max-width: 90vw;
101 text-align: center;
102}
103
104input[type="checkbox"] {
105 width: auto;
106 margin: 1vw 1vw;
107}
108.content {
109 font-size: 1.2vw;
110 height: auto;
111 width: auto;
112 align-items: center;
113 justify-content: center;
114}
115
116.form-group{
117 max-width: 90%;
118}
119
120.col-md-6{
121 width: 90vw;
122}
123
124.title {
125 margin-bottom: 30px;
126}
127
128.title h1 {
129 font-size: 8vw;
130 margin: 20px;
131}
132
133.title h4 {
134 font-size: 4vw;
135 margin: 10px;
136}
137
138.card {
139 border: none;
140 border-radius: 4px;
141 margin-bottom: 20px;
142}
143
144.card-header {
145 background-color: #333333;
146 color: white;
147 font-weight: bold;
148 font-size: 4vw;
149 padding: 10px;
150}
151
152.card-body {
153 padding: 20px;
154}
155
156.form-group {
157 margin-bottom: 20px;
158}
159
160label {
161 font-weight: bold;
162 font-size: 4vw;
163}
164
165input{
166 width: 85%;
167 padding: 10px;
168 font-size: 4vw;
169 border-radius: 4px;
170 border: 1px solid #ccc;
171}
172
173input[type="submit"] {
174 font-size: 4vw;
175 padding: 10px 20px;
176 background-color: #333333;
177 color: white;
178 border: none;
179 border-radius: 4px;
180 cursor: pointer;
181 margin: 1vw 1vw;
182}
183
184input[type="submit"]:hover {
185 background-color: #222222;
186}
187
188.row.justify-content-center {
189 text-align: center;
190}
191
192.row.justify-content-center > div {
193 display: inline-block;
194}
195
196.row.justify-content-center > div:not(:first-child) {
197 margin-left: 10px;
198}
199
200@media (min-width: 400px) {
201 /*NAVBAR*/
202 nav {
203 height: 60px;
204 }
205
206 nav ul {
207 height: 60px;
208 }
209
210 nav li {
211 font-size: 16px;
212 margin-right: 12px;
213 }
214 .img-small-logo,
215 .img-big-logo {
216 height: 60px;
217 }
218 .title h1 {
219 font-size: 32px;
220 margin: 20px;
221 }
222
223 .title h4 {
224 font-size: 16px;
225 margin: 10px;
226 }
227
228 .card-header {
229 font-size: 16px;
230 padding: 10px;
231 }
232
233 input {
234 font-size: 16px;
235 }
236
237 input[type="submit"] {
238 font-size: 16px;
239 padding: 10px 20px;
240 }
241}
242
243@media (min-width: 700px) {
244 .img-big-logo {
245 display: block;
246 }
247
248 .img-small-logo {
249 display: none;
250 }
251
252 nav ul li:first-child {
253 margin-right: 0;
254 }
255
256 nav ul li:nth-child(2) {
257 margin-right: auto;
258 }
259 .container {
260 max-width: 90vw;
261 }
262
263 .title h1 {
264 font-size: 50px;
265 }
266
267 .title h4 {
268 font-size: 20px;
269 }
270
271 .card-header {
272 font-size: 20px;
273 }
274
275 input {
276 font-size: 20px;
277 }
278
279 input[type="submit"] {
280 font-size: 20px;
281 padding: 10px 20px;
282 }
283 label{
284 font-size: 1.5vw;
285 }
286 .col-md-6{
287 width: 40vw;
288 }
289}