Personalize style.css

diff --git a/theme/css/style.css b/theme/css/style.css
index 305611d89e1e5319ed062fa54447e93f4fff4548..4ef2f09f63203d3f6a1bedf411916f8cb0abf7e7 100644 (file)
--- a/theme/css/style.css
+++ b/theme/css/style.css
@@ -99,16 +99,16 @@
 
 
 /* VARIABLES */
-:root {  --content-width: 900px;}
-:root {  --website-background: #424242;}
+:root {  --content-width: 950px;}
+:root {  --website-background: #020108;} /* (blue-0) */
 
-:root {  --colorblack: #000000;}
-:root {  --colordark: #666666;}
-:root {  --colorlight: #FFFFFF;}
+:root {  --colorblack: #020108;} /* blue-0 */
+:root {  --colordark: #030A01;}  /* green-0 */
+:root {  --colorlight: #B38E01;} /* yellow-2 */
 
-:root {  --color-01: #DBA901;} 
-:root {  --color-02: #B43104;}
-:root {  --color-gray-01: #E6E6E6;}
+:root {  --color-01: #48000B;} /* red-0 */
+:root {  --color-02: #114100;} /* green-1 */
+:root {  --color-gray-01: #0c0534;} /* blue-1 */
 
 :root {  --fontsize-s: 12px;}
 :root {  --fontsize-m: 16px;} /* Font Size Default */
@@ -136,6 +136,8 @@ header, main {background: var(--colorlight);}
 h1 {font-size: var(--fontsize-xxl); font-weight: 800;color: var(--colordark);margin-bottom: var(--space-below-01);}
 h2 {font-size: var(--fontsize-xl); font-weight: 800;color: var(--color-01);}
 h3 {font-size: var(--fontsize-l); font-weight: 700;}
+h4 {font-size: var(--fontsize-m)}
+h5 {font-size: var(--fontsize-s)}
 
 h2, h3, p, ul, ol, table {margin-bottom: var(--space-below-01);}
 
@@ -194,6 +196,7 @@ main .columns.cols-50-50 {grid-template-columns: 1fr 1fr;}
 main .columns.cols-33-66 {grid-template-columns: 1fr 2fr;}
 main .columns.cols-66-33 {grid-template-columns: 2fr 1fr;}
 main .columns.cols-33-33-33 {grid-template-columns: 1fr 1fr 1fr;}
+main .columns.cols-35-20-45 {grid-template-columns: 7fr 4fr 9fr;}
 
 main .background {padding: var(--space-below-01) var(--side-space-01);background:var(--color-gray-01);margin-bottom: var(--space-below-01);}
 main .background.bg-color-01 {background:var(--color-01);}
@@ -210,7 +213,7 @@ main .button a:hover {opacity: 0.5;}
 main .button.bg-color-01 a {background: var(--color-01);}
 main .button.bg-color-02 a {background: var(--color-02);}
 
-main code {font-family: courier 'Courier New', Courier, monospace;font-size: var(--fontsize-m);background: var(--color-gray-01);color: var(--colordark);}
+main code {font-family: courier 'Courier New', Courier, monospace;font-size: var(--fontsize-m);background: var(--color-gray-01);color: var(--colorlight);}
 
 main pre:has(code) {word-break: normal;word-wrap: normal;overflow: scroll;background: var(--color-gray-01);padding: var(--space-below-01) var(--space-below-01);border-radius: 10px;margin-bottom: var(--space-below-01);}
 
@@ -245,12 +248,6 @@ footer a:is(:hover, :focus) {text-decoration: none;}
 
     h1 {font-size: var(--fontsize-xl);}
 
-}
-
-@media screen and (max-width: 400px) {
- 
     main .columns {display: block;}
 
 }
-
-