Skip to content

Instantly share code, notes, and snippets.

@JulianNorton
Forked from benschac/gist:5112793
Created March 8, 2013 00:57
Show Gist options
  • Save JulianNorton/5113371 to your computer and use it in GitHub Desktop.
Save JulianNorton/5113371 to your computer and use it in GitHub Desktop.
@font-face {
font-family: 'Lincoln';
src:url('AbrahamLincoln.ttf');
font-weight: normal;
font-style: normal;
}
@font-face{
font-family: 'LincolnBold'
src:url('AbrahamLincoln.ttf');
font-weight: bold;
font-style: normal;
}
@font-face {
font-family: 'Lincoln';
src:url('AbrahamLincoln.ttf');
font-weight: normal;
font-style: italic;
}
body {
background: #FFF;
font: 15px "Lincoln";
}
#wrap {
margin: 0 auto;
width: 960px;
padding: 0;
}
#main {
position: relative;
width: 100%;
height: 130px;
}
#logo img {
position: absolute;
top: 8px;
left: 390px;
width: 200px;
height: 200px;
}
#logo img:hover {
opacity: .70;
}
#navigation {
width: 100%;
height: 20px;
background-color: #ffffff;
margin: -40px 0 20px 0;
padding-top: 10px;
text-transform: uppercase;
padding: 40px;
text-decoration: none;
}
#navigation ul li {
display: inline-block;
padding: 40px;
font-size: 20px;
margin: 0 auto
}
#navigation a {
text-decoration: none;
}
#navigation a:hover, :active, :visited {
color: #000000;
text-decoration: none;
}
.btn {
width: 300px;
height: 50px;
background-color: rgba(124, 122, 116, .5);
-webkit-border-radius:10px;
-moz-border-radius:10px;
border-radius:10px
-webkit-text-shadow: 1px 2px 3px #000;
-moz-text-shadow: 1px 2px 3px #000;
text-shadow: 1px 2px 3px #000;
-webkit-box-shadow: 4px 4px 5px #282b1f;
-moz-box-shadow: 4px 4px 5px #282b1f;
box-shadow: 4px 4px 5px #282b1f;
}
<DOCTYPE html>
<html lang="en">
<head>
<title> Benjamin Schachter</title>
<meta charset="UTF-8">
<link rel="stylesheet" href="stylesheet.css">
<!--[if lt IE 9]
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
</head>
<body>
<div id="wrap">
<section id= "main">
<header id="intro-bar">
<a href="#" id="logo"><img src="http://i.imgur.com/qo9plVy.png"></a>
</header>
</section> <!--End main-->
<nav id="navigation">
<ul id="nav-ul">
<li class="nav-li"><a href="#">Home</a</li>
<li class="nav-li"><a href="#">About</a></li>
<li class="nav-li"><a href="">Coding Background</a></li>
<li class="nav-li"><a href="#">Contact</a></li>
</ul>
</nav><!--End Navigation-->
<section>
<header>
<h1>I'm Benjamin, and I'm learning to Code</h1>
</header>
<article>
<header>
<h1> I'm new to this, but I'm eager to learn!</h1>
</header>
<p>For the last few weeks I've been agressively learning about web developement andt how to write clean code.</p>
<button class="btn feat"> Contact Me!</button>
<aside> Hopefully this will continue to get better!</aside>
</article>
<footer>
<h3> Benjamin Schachter</h3>
<p>&copy Benjamin Schachter 2013 all rights reserved</p>
</footer>
</section>
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment