diff --git a/style.css b/style.css index 8b13789..5e36cb2 100644 --- a/style.css +++ b/style.css @@ -1 +1,43 @@ +body, html { + height: 100%; + margin: 0; + font-family: Arial, Helvetica, sans-serif; +} +* { + box-sizing: border-box; +} + +.bg-image { + /* The image used */ + background-image: url("/background.png"); + + /* Add the blur effect */ + filter: blur(8px); + -webkit-filter: blur(8px); + + /* Full height */ + height: 100%; + + /* Center and scale the image nicely */ + background-position: center; + background-repeat: no-repeat; + background-size: cover; +} + +/* Position text in the middle of the page/image */ +.bg-text { + background-color: rgb(0,0,0); /* Fallback color */ + background-color: rgba(0,0,0, 0.4); /* Black w/opacity/see-through */ + color: white; + font-weight: bold; + border: 3px solid #f1f1f1; + position: absolute; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + z-index: 2; + width: 80%; + padding: 20px; + text-align: center; +}