diff --git a/assets/css/style.css b/assets/css/style.css index 049d51c..a703e4f 100644 --- a/assets/css/style.css +++ b/assets/css/style.css @@ -1,6 +1,6 @@ @font-face{ - font-family: 'Mario Kart'; - src: url('../fonts/Mario-Kart-DS.ttf'); + font-family: 'FIANSO'; + src: url('../fonts/prstartk.ttf'); } body{ @@ -26,6 +26,98 @@ body{ .container{ max-width: 1140px; margin: auto; + position: absolute; + left: 0; + right: 0; + margin-left: auto; + margin-right: auto; +} + +.score{ + position: absolute; + right: 0px; + top: 0px; + text-align: right; + padding-top: 20px; + padding-right: 20px; +} + +.score h3{ + font-family: 'FIANSO'; + font-size: 32px; + color: #000; + margin: inherit; + padding-bottom: 8px; +} + +.score h5{ + font-family: 'FIANSO'; + font-size: 24px; + color: #000; + margin: inherit; +} + +.gameover{ + text-align: center; + position: absolute; + width: 100%; + height: 73%; + top: 0; + padding-top: 150px; + background: rgba(155, 0, 0, 0.85); + box-shadow: inset 0px 0px 60px 0px rgba(0,0,0,0.75); + +} + +.gameover h1{ + font-family: 'FIANSO'; + font-size: 64px; + color: #fff; + margin: inherit; + padding-bottom: 60px; + animation: pulse 3s infinite; +} + +@keyframes pulse{ + 0%{ + transform: scale(1); + } + 50%{ + transform: scale(1.15); + } + 100%{ + transform: scale(1); + } +} + +.gameover h4{ + font-family: 'FIANSO'; + font-size: 18px; + color: #fff; + margin: inherit; + padding-bottom: 100px; + opacity: 0.8; +} + +.gameover a{ + font-family: 'FIANSO'; + font-size: 18px; + color: #fff; + margin: inherit; + text-align: center; + border: solid 3px #fff; + border-radius: 6px; + padding: 12px 24px; + text-decoration: none; + transition: 0.3s; + position: relative; + z-index: 5; + +} + +.gameover a:hover{ + background: #fff; + color: #000; } .map{ @@ -34,6 +126,7 @@ body{ display: inline-block; padding-top: 7px; padding-bottom: 3px; + overflow: hidden; } .line{ diff --git a/assets/fonts/prstartk.ttf b/assets/fonts/prstartk.ttf new file mode 100644 index 0000000..6ce26eb Binary files /dev/null and b/assets/fonts/prstartk.ttf differ diff --git a/index.html b/index.html index fa0aee6..b8ae256 100644 --- a/index.html +++ b/index.html @@ -3,12 +3,6 @@