diff --git a/index.html b/index.html
index f05fbb0..22a186b 100644
--- a/index.html
+++ b/index.html
@@ -20,7 +20,7 @@
-
+
@@ -44,7 +44,6 @@
-
Special
Issue 13
diff --git a/stylesheet.css b/stylesheet.css
index 7fd4cd5..515ff64 100644
--- a/stylesheet.css
+++ b/stylesheet.css
@@ -35,9 +35,10 @@ div#wrapping{
/* SECTION: SPECIAL ISSUES */
section#issues{
- display: flex;
- flex-direction: row;
- flex-wrap: wrap;
+ display: grid;
+ grid-template-columns: repeat(3, calc(33.3% - 42px));
+ grid-template-rows: repeat(3, 1fr);
+ grid-auto-flow: column;
font-size: 14px;
line-height: 20px;
}
@@ -133,6 +134,12 @@ section#info.endpoint{
font-family: monospace;
font-size: 14px;
line-height: 1.9;
+}
+section#intro.endpoint{
+ margin-bottom: 100px;
+}
+section#info.endpoint{
+ margin-top: 100px;
}
section#intro h1,
section#info h1{
@@ -173,32 +180,36 @@ section#info.endpoint{
/* GENERAL ELEMENTS */
section#issues .issue{
- flex: 3 3 auto;
- display: inline-block;
- width: calc(33.3% - 42px);
- vertical-align: top;
- margin: 0 0 80px;
+ margin: 0;
padding: 2em 15px;
color: rgb(40,40,40);
}
section#issues .issue[data-cycle='1']{
margin-top:0 !important;
+ grid-column: 1;
}
section#issues .issue[data-cycle='2']{
margin-top: 200px !important;
+ grid-column: 2;
}
section#issues .issue[data-cycle='3']{
margin-top: 400px !important;
+ grid-column: 3;
}
-section#issues .issue[data-cycle='4']{
+section#issues .issue[data-cycle='6']{
margin-top: 400px !important;
+ grid-column: 1;
}
section#issues .issue[data-cycle='5']{
margin-top: 200px !important;
+ grid-column: 2;
}
-section#issues .issue[data-cycle='6']{
+section#issues .issue[data-cycle='4']{
margin-top: 0 !important;
+ grid-column: 3;
}
+
+
section#issues .issue-title,
section#issues .issue-nr{
font-size: 275%;