diff --git a/public/css/styles.css b/public/css/styles.css index 8820107..9856211 100644 --- a/public/css/styles.css +++ b/public/css/styles.css @@ -200,6 +200,15 @@ body { body div.page-contents table th, body div.page-contents table td { font-size: 20px; } } +@media (min-width: 694px) { + body div.page-contents div.description { + margin-top: auto; } + body div.page-contents div.description div.articles a { + width: 45%; + margin-left: 5%; } + body div.page-contents div.description div.articles a:nth-child(2n+1) { + margin-left: 0%; } } + @media (min-width: 1100px) { body div.page-contents { top: 0%; @@ -222,16 +231,13 @@ body { body div.page-contents nav.mobile-shortcuts { display: none; } } -@media (min-width: 694px) { - body div.page-contents div.description { - margin-top: auto; } - body div.page-contents div.description div.articles a { - width: 45%; - margin-left: 5%; } } - @media (min-width: 1333px) { body div.page-contents div.description { margin-top: auto; } body div.page-contents div.description div.articles a { width: 30%; - margin-left: 3%; } } + margin-left: 3%; } + body div.page-contents div.description div.articles a:nth-child(2n+1) { + margin-left: 3%; } + body div.page-contents div.description div.articles a:nth-child(3n+1) { + margin-left: 0%; } } diff --git a/public/css/styles.scss b/public/css/styles.scss index 9026426..945b634 100644 --- a/public/css/styles.scss +++ b/public/css/styles.scss @@ -327,6 +327,25 @@ body { } } } +@media (min-width: 694px) { + body { + div.page-contents { + div.description { + margin-top: auto; + + div.articles { + a { + &:nth-child(2n+1) { + margin-left: 0%; + } + width: 45%; + margin-left: 5%; + } + } + } + } + } +} @media (min-width: 1100px) { body { @@ -366,22 +385,6 @@ body { } } -@media (min-width: 694px) { - body { - div.page-contents { - div.description { - margin-top: auto; - - div.articles { - a { - width: 45%; - margin-left: 5%; - } - } - } - } - } -} @media (min-width: 1333px) { body { div.page-contents { @@ -390,6 +393,12 @@ body { div.articles { a { + &:nth-child(2n+1) { + margin-left: 3%; + } + &:nth-child(3n+1) { + margin-left: 0%; + } width: 30%; margin-left: 3%; }