Project

General

Profile

1
:root {
2
	--portal-main-color: #da65ab;
3
	--portal-main-contrast: white;
4
	--portal-dark-color: #4687e6;
5
	--openaire-main-color: #313179;
6

    
7
	--explore-portal-color: #d95f2d;
8
	--provide-portal-color: #37c7e9;
9
	--monitor-portal-color: #9abb55;
10
	--connect-portal-color: #ebb13e;
11
	--develop-portal-color: #da65ab;
12

    
13
	--explore-portal-lower-tone: #a0462c;
14
	--provide-portal-lower-tone: #3a8fa3;
15
	--monitor-portal-lower-tone: #b48536;
16
	--connect-portal-lower-tone: #7c9144;
17
	--develop-portal-lower-tone: #9f4e7e;
18
}
19

    
20
.custom-develop-li {
21
	background: var(--portal-main-color) !important;
22
}
23

    
24
.custom-footer {
25
	position: relative;
26
	bottom: 0;
27
	left: 0;
28
}
29

    
30
/* from library css */
31

    
32
.explore-heading-bullet::before {
33
	border-left-color: var(--explore-portal-color) !important;
34
}
35
.provide-heading-bullet::before {
36
	border-left-color: var(--provide-portal-color) !important;
37
}
38
.connect-heading-bullet::before {
39
	border-left-color: var(--connect-portal-color) !important;
40
}
41
.develop-heading-bullet::before {
42
	border-left-color: var(--develop-portal-color) !important;
43
}
44
.monitor-heading-bullet::before {
45
	border-left-color: var(--monitor-portal-color) !important;
46
}
47

    
48
.explore .uk-h4 {
49
	color: var(--explore-portal-color);
50
	font-weight: bold;
51
}
52

    
53
.explore .el-content {
54
	font-size: 18px;
55
}
56

    
57
.explore a {
58
	background-color: var(--explore-portal-color);
59
	color: #fff;
60
	font-weight: bold;
61
	border-color: var(--explore-portal-color);
62
}
63

    
64
.explore a:hover {
65
	background-color: var(--explore-portal-lower-tone);
66
	border-color: var(--explore-portal-lower-tone);
67
}
68
.provide .uk-h4 {
69
	color: var(--provide-portal-color);
70
	font-weight: bold;
71
}
72

    
73
.provide .el-content {
74
	font-size: 18px;
75
}
76

    
77
.provide a {
78
	background-color: var(--provide-portal-color);
79
	color: #fff;
80
	font-weight: bold;
81
	border-color: var(--provide-portal-color);
82
}
83

    
84
.provide a:hover {
85
	background-color: var(--provide-portal-lower-tone);
86
	border-color: var(--provide-portal-lower-tone);
87
}
88

    
89
.monitor .uk-h4 {
90
	color: var(--monitor-portal-color);
91
	font-weight: bold;
92
}
93

    
94
.monitor .el-content {
95
	font-size: 18px;
96
}
97

    
98
.monitor a {
99
	background-color: var(--monitor-portal-color);
100
	color: #fff;
101
	font-weight: bold;
102
	border-color: var(--monitor-portal-color);
103
}
104

    
105
.monitor a:hover {
106
	background-color: var(--monitor-portal-lower-tone);
107
	border-color: var(--monitor-portal-lower-tone);
108
}
109

    
110
.connect .uk-h4 {
111
	color: var(--connect-portal-color);
112
	font-weight: bold;
113
}
114

    
115
.connect .el-content {
116
	font-size: 18px;
117
}
118

    
119
.connect a {
120
	background-color: var(--connect-portal-color);
121
	color: #fff;
122
	font-weight: bold;
123
	border-color: var(--connect-portal-color);
124
}
125

    
126
.connect a:hover {
127
	background-color: var(--connect-portal-lower-tone);
128
	border-color: var(--connect-portal-lower-tone);
129
}
130

    
131
.develop .uk-h4 {
132
	color: var(--develop-portal-color);
133
	font-weight: bold;
134
}
135

    
136
.develop .el-content {
137
	font-size: 18px;
138
}
139

    
140
.develop a {
141
	background-color: var(--develop-portal-color);
142
	color: #fff;
143
	font-weight: bold;
144
	border-color: var(--develop-portal-color);
145
}
146

    
147
.develop a:hover {
148
	background-color: var(--develop-portal-lower-tone) !important;
149
	border-color: var(--develop-portal-lower-tone);
150
}
151
.portal-hr {
152
	border-bottom: 1px solid var(--portal-main-color) !important;
153
	padding: 5px 0px;
154
}
155

    
156
.tm-toolbar .uk-subnav-line li:hover,
157
.tm-toolbar .uk-subnav li:hover {
158
	background: var(--portal-main-color) !important;
159
}
160

    
161
.tm-toolbar .uk-subnav-line li a:hover,
162
.tm-toolbar .uk-subnav li a:hover,
163
.tm-toolbar .uk-subnav-line li:hover a,
164
.tm-toolbar .uk-subnav li:hover a {
165
	background: var(--portal-main-color) !important;
166
	color: white !important;
167
}
168

    
169
#footer\#9 a,
170
#footer\#11 a,
171
#footer\#13 a {
172
	color: #dedede;
173
	line-height: 22px;
174
	padding: 2px 0;
175
}
176

    
177
#footer\#9 a:hover,
178
#footer\#11 a:hover,
179
#footer\#13 a:hover {
180
	color: rgba(255, 255, 255, 0.5);
181
}
182

    
183
@media all and (min-width: 640px) {
184
	#footer\#3 {
185
		margin-right: 280px;
186
	}
187
}
188

    
189
#footer\#7 a {
190
	color: rgba(255, 255, 255, 0.7) !important;
191
	text-align: left;
192
	font-size: 14px;
193
}
194

    
195
/* More custom css to match Graph styles */
196

    
197
.tm-header .uk-navbar-transparent {
198
	padding-top: unset;
199
}
200

    
201
.uk-navbar-nav > li > a {
202
	font-size: 14px;
203
}
204

    
205
#footer\#5 {
206
	line-height: 21px;
207
}
208

    
209
.footer-light-background {
210
	color: #000;
211
	background-color: #fff;
212
}
213

    
214
.footer-light-background a {
215
	color: #000;
216
	background-color: #fff;
217
}
218

    
219
.uk-grid-small {
220
	margin-left: -15px;
221
}
222

    
223
.uk-grid-small > * {
224
	padding-left: 15px;
225
}
226

    
227
.uk-icon-button {
228
	border-color: rgba(0, 0, 0, 0.5);
229
}
230

    
231
.newsletter .el-title {
232
	font-size: 18px;
233
}
234

    
235
.newsletter .uk-icon {
236
	padding: 0;
237
}
238

    
239
.uk-totop {
240
	color: #444 !important;
241
	background-color: unset;
242
}
243

    
244
.uk-totop:active,
245
.uk-totop:hover {
246
	color: #000 !important;
247
	background-color: unset;
248
}
249

    
250
#footer\#22 {
251
	font-size: 14px;
252
}
253

    
254
#footer\#22 a:hover {
255
	text-decoration: underline;
256
}
257

    
258
/* more styles from graph - styles.css file */
259

    
260
/* You can add global styles to this file, and also import other style files */
261
/* @import "assets/common-assets/common/theme.css";
262
@import "assets/common-assets/common/custom.css";
263
@import "assets/common-assets/library.css"; */
264

    
265
:root {
266
	--portal-main-color: #ee2540;
267
	--portal-main-contrast: white;
268
	--portal-dark-color: #e63946;
269
	--explore-color: #d95f2d;
270
	--explore-dark-color: #a0462c;
271
}
272

    
273
.graphApp {
274
	background-color: #fafafa;
275
	color: #1a1a1a;
276

    
277
	min-height: calc(100vh - 100px);
278
	line-height: 25px;
279
	letter-spacing: 0.16px;
280
	font-size: 16px;
281
	/* font-family: 'Open Sans', sans-serif; */
282
}
283

    
284
.panel {
285
	border-radius: 15px;
286
	background-color: #fde8ea;
287
	color: #292929;
288
	font-size: 14px;
289
	padding: 20px;
290
}
291

    
292
.image-front-topbar {
293
	margin-top: -100px;
294
	padding-top: 100px;
295
}
296

    
297
/* main {
298
	min-height: calc(100vh - 100px);
299
	line-height: 25px;
300
	letter-spacing: 0.16px;
301
	font-size: 16px;
302
	font-family: 'Open Sans', sans-serif;
303
} */
304

    
305
.uk-text-large {
306
	font-size: 18px;
307
}
308

    
309
.uk-text-small {
310
	font-size: 14px;
311
	line-height: 20px;
312
	letter-spacing: 0;
313
}
314
/* Unordered list*/
315
ul.portal-circle {
316
	list-style: none;
317
	padding-left: 30px;
318
}
319

    
320
ul.portal-circle li {
321
	margin: 0 0 15px 0;
322
	position: relative;
323
}
324

    
325
ul.portal-circle.small li {
326
	margin: 0 0 5px 0;
327
	position: relative;
328
}
329

    
330
ul.portal-circle li:before {
331
	content: '';
332
	border: 5px var(--portal-main-color) solid !important;
333
	border-radius: 50px;
334
	line-height: 30px;
335
	margin-left: -20px;
336
	position: absolute;
337
	top: 10px;
338
}
339

    
340
ul.uk-text-small.portal-circle li:before {
341
	top: 6px;
342
}
343

    
344
.footer,
345
.footer .uk-section-primary {
346
	background-color: #ffffff;
347
	color: #000000 !important;
348
	font-family: 'Open Sans', sans-serif !important;
349
	font-size: 14px !important;
350
	font-weight: 400 !important;
351
}
352

    
353
.footer svg .stroke_line {
354
	stroke: #000000 !important;
355
}
356

    
357
.footer svg .fill_text {
358
	fill: #000000 !important;
359
}
360

    
361
.footer .uk-h6:not(.ignoreFooter),
362
.footer .uk-h5:not(.ignoreFooter),
363
.footer .uk-h4:not(.ignoreFooter),
364
.footer .uk-h3:not(.ignoreFooter),
365
.footer .uk-h2:not(.ignoreFooter),
366
.footer .uk-h1:not(.ignoreFooter) {
367
	color: #000000 !important;
368
}
369

    
370
.footer .uk-link:not(.ignoreFooter),
371
.footer a:not(.uk-button):not(.uk-button-text):not(.ignoreFooter) {
372
	color: #000000 !important;
373
	font-family: 'Open Sans', sans-serif !important;
374
	font-size: 14px !important;
375
}
376

    
377
.footer .uk-icon-button {
378
	border-color: rgba(0, 0, 0, 0.5);
379
}
380

    
381
.footer .uk-totop {
382
	background-color: #ffffff;
383
}
384

    
385
.footer .uk-totop svg {
386
	color: rgba(0, 0, 0, 0.5);
387
}
388

    
389
.footer .uk-totop:hover svg {
390
	color: black;
391
}
392

    
393
.footer .uk-link:not(.ignoreFooter):hover,
394
.footer a:not(.uk-button):not(.uk-button-text):not(.ignoreFooter):hover {
395
	color: #000000 !important;
396
}
397

    
398
.footer .uk-label:not(.ignoreFooter) a {
399
	border-color: #000000;
400
	border-bottom: 1px solid;
401
}
402

    
403
.footer .uk-label:not(.ignoreFooter) a:hover {
404
	border-color: rgba(0, 0, 0, 0.5);
405
}
406

    
407
.footer .uk-button:not(.ignoreFooter) {
408
	background-color: #ffffff !important;
409
	color: black !important;
410
	border-color: #ffffff !important;
411
	border-style: solid !important;
412
	border-width: 1px !important;
413
}
414

    
415
.footer .uk-button:not(.ignoreFooter):hover {
416
	background-color: #eeeeee !important;
417
	/*color: var(--portal-main-color) !important;*/
418
	color: black !important;
419
	border-color: #eeeeee !important;
420
}
421

    
422
.numbers-background {
423
	background: transparent url('/assets/graph-assets/home/5.svg') repeat-x center
424
		bottom;
425
}
426

    
427
.number {
428
	color: #1a1a1a;
429
}
430

    
431
a.number:hover,
432
a.number:focus,
433
a.number:active {
434
	color: #4687e6;
435
}
436

    
437
.uk-card {
438
	border-radius: 36px;
439
}
(11-11/20)