diff --git a/www/css/main.css b/www/css/main.css index 212fc9c..3d850b4 100644 --- a/www/css/main.css +++ b/www/css/main.css @@ -90,9 +90,16 @@ textarea { :root { --jason-bg-color: #F2EDEA; + --jason-accent-color: #302B44; + --jason-hover-bg-color: #913A50; + --jason-hover-fg-color: #FFFFFF; --flo-bg-color: #601F22; } +body { + overflow-x: hidden; +} + div { box-sizing: border-box; overflow: hidden; @@ -121,7 +128,7 @@ div { height: 0; } -.splash-container { +.col-container { height: 100%; width: 100%; padding: 1rem; @@ -129,20 +136,6 @@ div { .splash img { width: 100%; height: 100%; border-radius: 1rem; object-fit: cover; } -/* .banner { - position: relative; - width: 100%; - height: 100%; - margin: auto 0 auto 0; - /* top: 50%; */ - /* -ms-transform: translateY(-50%); - transform: translateY(-50%); - text-align: center; - -webkit-transition: all 0.5s ease; - -moz-transition: all 0.5s ease; - transition: all 0.5s ease; -} */ - .banner { flex: 0 0 100%; text-align: center; @@ -152,7 +145,6 @@ div { .links { height: 0; - /* flex: 0 0 100%; */ } .links ul { @@ -164,16 +156,38 @@ div { .links li a { display: block; - background-color: #FF0000; height: 3rem; line-height: 3rem; margin-bottom: 0.5rem; border-radius: 1rem; text-align: center; + text-decoration: none; } .splash.jason, .main.jason { background-color: var(--jason-bg-color); + font-family: 'Raleway', sans-serif; +} + +.jason h1 { + font-family: 'Cinzel', serif; + font-weight: 400; + word-spacing: -0.15em; +} + +.jason h1 a { + text-decoration: none; + color: var(--jason-accent-color); +} + +.links.jason li a { + background-color: var(--jason-accent-color); + color: var(--jason-bg-color); +} + +.links.jason li a:hover { + background-color: var(--jason-hover-bg-color); + color: var(--jason-hover-fg-color); } .splash.flo, .main.flo { diff --git a/www/index.html b/www/index.html index abfc292..152e1f8 100644 --- a/www/index.html +++ b/www/index.html @@ -14,6 +14,9 @@ + + + @@ -21,12 +24,12 @@
-
+