html { height: 100%; background-color: black; color: white; font-family: Verdana, Helvetica, serif; } a { color: inherit; text-decoration: none; transition: all 0.1s ease-in-out; } a:hover { text-decoration: none; text-shadow: 3px 3px 10px #fff, -3px -3px 10px #fff; } #background-image { background-image: url("https://cdn.enp.one/img/backgrounds/cl-photo-boston.jpg"); background-position: center; background-repeat: no-repeat; background-size: cover; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; filter: blur(6px); -webkit-filter: blur(6px); position: fixed; height: 100%; width: 100%; top: 0; left: 0; right: 0; bottom: 0; z-index: 0; } #content { text-align: center; text-shadow: 3px 3px 5px #000, -3px -3px 5px #000; font-weight: bold; color: white; padding: 1em; /* width: 40em; */ max-width: 90%; background-color: rgba(255, 255, 255, 0.2); border-style: solid; border-width: 2px; border-color: rgba(255, 255, 255, 0); border-radius: 128px; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); position: absolute; top: 20%; left: 50%; transform: translate(-50%, 0); z-index: 10; } #logo { margin: auto; margin-top: -5em; max-width: 60%; width: 50%; display: block; border-style: solid; border-color: rgba(255, 255, 255, 0); border-radius: 50%; border-width: 5px; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); } #content p { margin: 2em; line-height: 1.5; } ul.buttons { list-style: none; padding-left: 0; margin-top: 3em; margin-bottom: 4em; font-size: 1.1em; } ul.buttons li { display: inline; line-height: 1; padding: 0.5em; margin-left: 0.5em; margin-right: 0.5em; text-transform: uppercase; } .button-youtube:hover { color: #ff0000; text-shadow: -3px -3px 5px #fff, -3px 3px 5px #fff, 3px -3px 5px #fff, 3px 3px 5px #fff, 0px 0px 7px #ff0000; } .button-instagram:hover { color: #c13584; text-shadow: -3px -3px 5px #fff, -3px 3px 5px #fff, 3px -3px 5px #fff, 3px 3px 5px #fff, 0px 0px 7px #5851db; } .button-twitter:hover { color: #1da1f2; text-shadow: -3px -3px 5px #fff, -3px 3px 5px #fff, 3px -3px 5px #fff, 3px 3px 5px #fff, 0px 0px 7px #f77737; } #background-info { text-align: right; font-size: 0.85em; padding: 0.75em; position: fixed; bottom: 0; right: 0; z-index: 5; } .footer { font-size: 0.9em; }