diff --git a/src/index.html b/src/index.html
index 643a2eb..e9a3264 100644
--- a/src/index.html
+++ b/src/index.html
@@ -12,6 +12,8 @@
+
-
+
Curriculum Vitae
diff --git a/src/static/css/index.css b/src/static/css/index.css
index 4f60722..e14f934 100644
--- a/src/static/css/index.css
+++ b/src/static/css/index.css
@@ -1,49 +1,10 @@
-h1 {
- /* color: #8bc34a; */
- font-size: 3.375rem;
- line-height: 4rem;
- font-weight: 300;
- margin: 12px;
-}
-h1 strong {
- font-weight: 600;
-}
-h1 img {
- height: 4rem;
- vertical-align: middle;
- border: 5px solid white;
- border-radius: 50%;
-}
-
.biglinks a {
width: min(20rem, 100%);
}
-a {
- display: inline-block;
-
- line-height: 24px;
- padding: 12px 24px;
- margin: 12px;
-
- color: #f4f4f4;
- background: #262626; /* Gray 90 */
- text-decoration: none;
-
- border: 2px solid transparent;
-}
-a>.svg {
+.biglinks a>.svg {
width: 64px;
margin-top: 12px;
margin-bottom: 32px;
display: block;
}
-a:hover {
- background: #333333; /* Gray 90 Hover */
-}
-a:active {
- background: #525252; /* Gray 70 */
-}
-a:focus {
- border: 2px solid white;
-}
diff --git a/src/static/css/main.css b/src/static/css/main.css
index 70b6139..b657d86 100644
--- a/src/static/css/main.css
+++ b/src/static/css/main.css
@@ -2,13 +2,110 @@ html {
color: #ffffff;
font-family: Inter V, sans-serif;
background: #161616; /* Gray 100 */
- padding: 24px;
}
*, *::before, *::after {
box-sizing: border-box;
}
+body {
+ font-size: 1rem;
+ line-height: 1.375rem;
+ font-weight: 400;
+ margin: 24px;
+}
+body > div {
+ margin: 24px;
+}
+body > .content {
+ text-align: justify;
+}
+
.svg {
filter: invert(100%);
}
+
+h1,h2,h3,h4,h5,h6 {
+ margin: 0;
+}
+h1 {
+ /* color: #8bc34a; */
+ font-size: 3.375rem;
+ line-height: 4rem;
+ font-weight: 300;
+ margin: 24px;
+}
+h1 strong {
+ font-weight: 600;
+}
+h1 img {
+ height: 4rem;
+ vertical-align: middle;
+ border: 5px solid white;
+ border-radius: 50%;
+}
+h2 {
+ font-size: 2.625rem;
+ line-height: 3.125rem;
+ font-weight: 300;
+}
+h3 {
+ font-size: 2rem;
+ line-height: 2.5rem;
+ font-weight: 400;
+}
+h4 {
+ font-size: 1.75rem;
+ line-height: 2.25rem;
+ font-weight: 400;
+}
+h5 {
+ font-size: 1.25rem;
+ line-height: 1.75rem;
+ font-weight: 400;
+}
+h6 {
+ font-size: 1rem;
+ line-height: 1.375rem;
+ font-weight: 600;
+}
+
+nav {
+ margin: 12px;
+}
+a {
+ display: inline-block;
+
+ line-height: 24px;
+ padding: 12px 24px;
+ margin: 12px;
+
+ color: #f4f4f4;
+ background: #262626; /* Gray 90 */
+ text-decoration: none;
+
+ border: 2px solid transparent;
+}
+a:hover {
+ background: #333333; /* Gray 90 Hover */
+}
+a:active {
+ background: #525252; /* Gray 70 */
+}
+a:focus {
+ border: 2px solid white;
+}
+
+ul {
+ list-style-type: square;
+ padding-left: 24px;
+ margin: 12px 0;
+}
+ul li {
+ margin-bottom: .25rem;
+}
+
+sup {
+ vertical-align: top;
+ line-height: 1em;
+}