1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
|
:root{
/* Default values for most CSS fields.
Can be modified, but DO NOT DELETE ANY FIELD!
*/
--GENERAL-FONT-1: "Merriweather", "Helvetica Neue", Arial, sans-serif;
--GENERAL-FONT-2: "Fjalla One", "Helvetica Neue", Arial, sans-serif;
--GENERAL-FONT-3: "Anton", "Helvetica Neue", Arial, sans-serif;
--GENERAL-COLOR-1: rgb(64, 95, 240);
--GENERAL-COLOR-2: white;
--GENERAL-FONT-COLOR-1: black;
--GENERAL-FONT-COLOR-2: var(--GENERAL-COLOR-1);
--GENERAL-FONT-COLOR-3: var(--GENERAL-COLOR-2);
--GENERAL-FONT-COLOR-4: rgba(255, 255, 255, .7);
--GENERAL-LINK-COLOR-1: var(--GENERAL-COLOR-1);
--GENERAL-LINK-ACTIVE-COLOR-1: rgb(18, 56, 235);
--GENERAL-LINK-COLOR-2: rgba(64, 64, 64, .75);
--GENERAL-LINK-ACTIVE-COLOR-2: rgb(18, 56, 235);
--GENERAL-IMAGE-BORDER-RADIUS: 50%;
--GENERAL-BOX-SHADOW: 0px 3px 9px rgba(0, 0, 0, .05);
--HR-WIDTH: 20%;
--COPYRIGHT-FONT: Arial, sans-serif;
/* ! - Must be in "px", else need to change "calc" formula for "empty-padding" */
--HERO-IMAGE-MARGIN-BOTTOM: -50px;
--HERO-IMAGE-MARGIN-BOTTOM-SMALL: -75px;
--PROJECTBOX-IMAGE-WIDTH: 650px;
--PROJECTBOX-CAPTION-BACKGROUND-COLOR: rgba(64, 95, 240, .9);
--NAVBAR-HEIGHT: 50px; /* ! - Must correspond to the real navbar height! (Horrible hack) */
--NAVBAR-BACKGROUND-COLOR: rgba(255, 255, 255, .3);
}
/* HOME */
#home {
/* The following variables should not be changed (managed by code) */
--home-width: 50%;
--home-offset-h: 50%;
--home-offset-v: 50%;
}
/* ABOUT */
#about {
--about-bkg-color: var(--GENERAL-COLOR-1);
--about-bkg-opacity: 1.0;
--about-bkg-position: center center;
--about-bkg-size: cover;
--about-image-border-radius: var(--GENERAL-IMAGE-BORDER-RADIUS);
--about-title-color: var(--GENERAL-FONT-COLOR-1);
--about-title-bar-color: var(--GENERAL-COLOR-2);
--about-link-color: var(--GENERAL-LINK-COLOR-2);
--about-link-color-active: var(--GENERAL-FONT-COLOR-3);
/* The following variables should not be changed (managed by code) */
--about-bkg-width: 100%;
--about-bkg-margin-left: 0;
--about-bkg-margin-right: 0;
}
/* SERVICES */
#services {
--services-title-color: var(--GENERAL-FONT-COLOR-1);
--services-title-bar-color: var(--GENERAL-COLOR-1);
}
/* SKILLS */
#skills {
--skills-title-color: var(--GENERAL-FONT-COLOR-1);
--skills-title-bar-color: var(--GENERAL-COLOR-1);
}
/* CONTACT */
#contact {
--contact-title-color: var(--GENERAL-FONT-COLOR-3);
--contact-title-bar-color: var(--GENERAL-COLOR-1);
}
|
