CodePen

HTML

            
              <!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>OPTIK</title>

<link href="css/style.css" rel="stylesheet" />
<link href="css/960_12_col.css" rel="stylesheet" />

</head>

<body>

<div class="bg"></div>

<div class="container_12">


  <div class="header containter_12">
  	<div class="top-nav">
			
			<h1><img src="http://s017.radikal.ru/i416/1212/9e/5180f8e9d5c1.png" alt="logotype"></h1>
			
			<nav>
				<ul>
					<li><a href="#">Home</a></li>
					<li><a href="#">About Us</a></li>
					<li><a href="#">Our Portfolio</a></li>
					<li><a href="#">Services</a></li>
					<li><a href="#">Contact Us</a></li>
				</ul>
			</nav>

		</div>
  </div>
  
  </body>
</html>
            
          
!
via HTML Inspector

CSS

            
              body { background: #0c1120; }
.container_12 {
  width: 960px;
  margin: 0 auto;
  background: #0c1120;
  overflow: hidden; // simple clear fix
}

h1 {display: inline-block; float: left; }

nav  { float: right; margin-right: 60px; padding-top: 10px; }

nav li {
  list-style: none;
  display: inline;
  text-transform: lowercase;
  padding-left: 50px;
}

nav li a { color: white; text-decoration: none; }
nav li a:hover, nav li a:focus { color: #f2cf67; }
            
          
!
? ?
? ?
Must be a valid URL.
+ add another resource
via CSS Lint

JS

            
              
            
          
!
Must be a valid URL.
+ add another resource
via JS Hint
Loading ..................