diff options
Diffstat (limited to 'static')
| -rw-r--r-- | static/css/index.css | 43 | ||||
| -rw-r--r-- | static/css/style.css | 4 |
2 files changed, 37 insertions, 10 deletions
diff --git a/static/css/index.css b/static/css/index.css index 3c8786d..e1213c2 100644 --- a/static/css/index.css +++ b/static/css/index.css @@ -8,33 +8,56 @@ } #site-title { + --color-blue: #0E26B1; + + display: flex; font-family: Montserrat-Light, sans-serif; - font-size: 17vw; + font-size: 14vw; font-weight: 100; width: 100%; margin: 0px auto; text-align: center; text-transform: uppercase; + background-color: var(--color-blue); + padding: 40px 10px; } @media screen and (min-width: 1100px) { #site-title { - font-size: 10rem; + font-size: 9.0rem; } } -@media screen and (max-width: 500px) { - #site-title { - font-size: 15vw; - } +#site-title div:nth-child(odd) { + transform: translateY(15%); +} + +#site-title div:nth-child(even) { + transform: translateY(-15%); } +#site-title:hover div { + transform: translateY(0); +} + +/* after hover to avoid transition on page load */ +#site-title div { + transition: transform .3s ease-in-out; +} + +/* #site-title::before { */ +/* content: ''; */ +/* height: 5px; */ +/* width: 100%; */ +/* background-color: var(--color-white); */ +/* } */ + /*****************************************************************************/ /* solgan */ .slogan { - margin: 50px auto; - padding: 30px 20px; + margin: 0 auto 50px auto; + padding: 50px 20px; background: black; color: red; text-transform: uppercase; @@ -42,13 +65,13 @@ font-weight: bold; font-style: italic; font-size: 2rem; - letter-spacing: 5px; + letter-spacing: 10px; } @media screen and (min-width: 600px) { .slogan { font-size: 2.3rem; - padding: 30px 70px; + padding: 50px 70px; } } diff --git a/static/css/style.css b/static/css/style.css index 0fda80b..b28af2a 100644 --- a/static/css/style.css +++ b/static/css/style.css @@ -8,6 +8,10 @@ --color-white: #eee; } +* { + box-sizing: border-box; +} + @font-face { font-family: OpenSans; font-weight: normal; |
