/* css reset */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent;
}
body {line-height: 1;}
ol, ul {list-style: none;}
table {border-collapse: collapse; border-spacing: 0;}
td, th {text-align: left; vertical-align: top}
header, section, article, aside, nav, footer {display: block;}

body {background: #c35326; color: #000; font-family: 'Crimson Text', serif; font-size: 20px; position: relative;}

#wedge {position: absolute; top: 0; left: 0; z-index: -1;}

a {color: #000;}
a:hover {color: #fff;}

p {margin: 0 0 1.4em;}
h1, h2, strong {color: #fff; font-weight: normal;}

header {padding-top: 34px;}
#logo {margin: 0 0 0 20px; display: block; width: 292px;}
nav {margin: 40px 0 0 180px; float: left;}
nav li {position: relative;}
nav a {color: #fff; text-decoration: none; display: block; margin: 0 0 .8em;}
#who nav #nv-who:before, #tenets nav #nv-tenets:before, #clients nav #nv-clients:before, #contact nav #nv-contact:before {content: ""; width: 12px; height: 22px; background: url(../img/bg-current.png)  no-repeat; position: absolute; top: -2px; left: -20px;}

section { float: left; width: calc(100% - 450px); margin: 30px 0 0 90px; line-height: 1.3; max-width: 800px;}
#clients section ul {width: 27%; margin-right: 5%; float: left;}
#clients section li {font-size: 16px; padding-left: 1em; text-indent: -1em;}

h1, h2, .intro {font-size: 30px; line-height: 1.2;}
.note {font-size: 14px; line-height: 1.1;}

#navtoggle {width: 30px; height: 11px; border: 3px solid #000; border-width: 3px 0; position: fixed; float: right; display: none; z-index: 2; top: 10px; right: 10px;}
#navtoggle:hover {cursor: pointer; border-color: #fff;}
#navtoggle:before {content: ""; width: 30px; height: 3px; position: absolute; top: 4px; left: 0; background: #000;}
#navtoggle:hover:before {background: #fff;}
#navtoggle:after {position: absolute; top: -22px; right: -2px; font-size: 12px; font-weight: bold; text-transform: uppercase; color: #000;}
#navtoggle:hover:after {color: #fff;}

@media only screen and (max-width : 980px) {
	#clients section ul {width: 45%; margin-right: 5%; float: left;}
}
@media only screen and (max-width : 900px) {
	section {clear: both; float: none; width: auto; margin: 30px 90px 0 180px; padding-top: 30px;}
}
@media only screen and (max-width : 600px) {
	#clients section ul {width: auto; margin-right: 0; float: none;}
}
@media only screen and (max-width : 500px) {
	#navtoggle {display: block;}
	nav ul {position: fixed; top: 0; right: -240px; left: auto; height: 100%; background: #000; width: 200px; padding: 40px 0 0 40px;}
	#logo {width: 275px; margin-top: 25px;}
	section {margin: 300px 20px 20px;}
}