-
-
Save ajzyn/f4e7b9c82718344cdfae0b985962112d to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| *{ | |
| margin:0; | |
| padding: 0; | |
| font-family: 'Lato', sans-serif; | |
| } | |
| .menu-list{ | |
| position: fixed; | |
| background-color: rgba(47, 46, 46, 1); | |
| width: 100%; | |
| z-index: 1; | |
| list-style: none; | |
| display: flex; | |
| justify-content: center; | |
| align-items: center; | |
| } | |
| .menu-list li{ | |
| padding: 20px 30px; | |
| } | |
| .menu-list a{ | |
| color:lightgray; | |
| text-decoration: none; | |
| text-transform: uppercase; | |
| font-size: 18px; | |
| transition: color 1s ease; | |
| } | |
| .menu-list li:hover a{ | |
| color:white; | |
| } | |
| .menu-list li:hover { | |
| border-bottom:2px solid white; | |
| padding: 20px 30px 18px 30px; | |
| cursor: pointer; | |
| box-sizing: border-box; | |
| } | |
| .help{ | |
| width: 100%; | |
| height: 100vh; | |
| background: url('http://www.mothlab.net/wp-content/uploads/2013/12/Bonny-Clyde-e1390905628227.jpg') no-repeat; | |
| background-attachment: fixed; | |
| background-size: cover; | |
| z-index: -1; | |
| position: absolute; | |
| top: 0; | |
| left: 0; | |
| } | |
| .header-logo{ | |
| padding-top:20%; | |
| text-align: center; | |
| color:lightgray; | |
| font-weight: 700; | |
| font-size: 48px; | |
| text-shadow: 2px 2px 2px gray; | |
| } | |
| footer{ | |
| align-self: flex-end; | |
| } | |
| .tw{ | |
| width: 30px; | |
| height: 30px; | |
| border-radius: 50%; | |
| background: white; | |
| text-align: center; | |
| line-height: 180%; | |
| } | |
| .yt{ | |
| width: 30px; | |
| height: 30px; | |
| border-radius: 50%; | |
| background: white; | |
| text-align: center; | |
| line-height: 180%; | |
| } | |
| .fb{ | |
| width: 30px; | |
| height: 30px; | |
| border-radius: 50%; | |
| background: white; | |
| text-align: center; | |
| line-height: 180%; | |
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!doctype html> | |
| <html> | |
| <head> | |
| <title>Page Title</title> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="initial-scale=1.0"> | |
| <link rel="stylesheet" href="style.css"> | |
| <link rel="stylesheet" href="css/fontello.css"> | |
| <link href="https://fonts.googleapis.com/css?family=Lato:400,700" rel="stylesheet"> </head> | |
| <body> | |
| <div class="rectengle"> | |
| <header> | |
| <nav> | |
| <ul class="menu-list"> | |
| <li><a href='#'>Home</a></li> | |
| <li><a href='#'>O nas</a></li> | |
| <li><a href='#'>Projekty</a></li> | |
| <li><a href='#'>Źródła</a></li> | |
| <li><a href='#'>Kontakt</a></li> | |
| </ul> | |
| </nav> | |
| <div class="header-logo"> | |
| <i class="icon-heart-filled"></i> | |
| <h1 class="header-logo-p">Bonnie & Clyde</h1> | |
| </div> | |
| <footer> | |
| <div class="socials"> | |
| <div class="fb"><i class="icon-facebook-squared"></i></div> | |
| <div class="tw"><i class="icon-twitter"></i></div> | |
| <div class="yt"><i class="icon-youtube"></i></div> | |
| </div> | |
| </footer> | |
| </header> | |
| <div class="help"></div> | |
| <div style="height:1000px;"></div> | |
| </div> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment