diff options
Diffstat (limited to '_assets/css/main.scss')
-rw-r--r-- | _assets/css/main.scss | 53 |
1 files changed, 45 insertions, 8 deletions
diff --git a/_assets/css/main.scss b/_assets/css/main.scss index ef6ce31..6bce5bf 100644 --- a/_assets/css/main.scss +++ b/_assets/css/main.scss @@ -14,7 +14,7 @@ body { width: 100%; max-width: 840px; margin: 10px auto 50px; - padding: 20px 20px 10px; + padding: 20px 20px; background-color: white; } @@ -30,7 +30,7 @@ body { width: 20%; float: left; vertical-align: top; - margin-right: 10px; + background-color: #F5F5F5; } .side .picture { @@ -39,6 +39,10 @@ body { height: auto; } +.side-content { + padding: 2px; +} + nav ul { list-style-type: none; padding: 0; @@ -49,13 +53,16 @@ nav li:before { content: "— "; } -.content { +.content-wrapper { width: 100%; padding-left: 20%; text-align: justify; + background-color: #F5F5F5; } -.content-wrapper { +.content-subwrapper { padding-left: 10px; + background-color: white; + overflow: auto; } footer { @@ -64,16 +71,18 @@ footer { } footer p { - font-size: 12px; + font-size: 10px; + margin-bottom: 0; + padding-bottom: 0; } -@media (max-width: 600px) { +@media print, (max-width: 600px) { .side { position: static; width: 100%; float: none; - padding-left: 10px; margin-bottom: 20px; + background-color: #FAFAFA; } .side .picture, .side-content { display: inline-block; @@ -84,8 +93,9 @@ footer p { } .side-content { margin-top: 10px; + padding: 0; } -.content { +.content-wrapper, .content-subwrapper { padding-left: 0; } } @@ -109,6 +119,10 @@ hr { line-height: 1; border: none; border-top: 1px solid black; + margin-left: 10px; +} +.content-wrapper hr { + margin-left: 0; } blockquote { @@ -123,6 +137,7 @@ blockquote { width: 100%; height: 0; padding-bottom: 56%; + margin: 40px 0 10px; } .video_wrapper iframe { @@ -136,13 +151,35 @@ blockquote { } .content img { + display: block; + margin-left: auto; + margin-right: auto; max-height: 300px; } +.content .hi { + max-width: 95%; + max-height: none; +} + +.content .aside { + float: right; + margin: 5px 10px; + margin-right: 0; +} .content .gallery img { display: inline-block; + margin-left: default; + margin-right: default; max-height: 250px; } +@media (max-width: 600px) { +.content .aside { + margin: 5px auto; + float: none; +} +} + a, a:visited, a:hover, a:active { color: #2E9AFE; text-decoration: none; |