@font-face {
	font-family: 'MyriadProLight';
	src: url('myriadpro-light-webfont.eot');
	src: local('☺'), url('myriadpro-light-webfont.woff') format('woff'), url('myriadpro-light-webfont.ttf') format('truetype'), url('myriadpro-light-webfont.svg#webfontXZtbPJzP') format('svg');
	font-weight: normal;
	font-style: normal;
	letter-spacing: 0.05em;
}

* {	margin: 0; padding: 0; border: 0; outline: none }

html, body { min-height: 100%; height: auto !important; height: 100% }
body { font: 12px/18px "MyriadProLight", "Helvetica Neue", Helvetica, Arial, sans-serif !important; background: #1a1a1a; color: #fff; letter-spacing: 0.03em }
p, h2, ul, table { margin-bottom: 1em }
a:link, a:visited { text-decoration: none; color: #ccc }
a:hover, a:active { color: #fff }
ul { list-style: none }
h1, #print, h2#page { font: 20px/24px "MyriadProLight", "Myriad Pro Light", "Arial Narrow", sans-serif !important; text-transform: uppercase }
h2, h3, li.section-title, .bloglink { font: 14px/18px "MyriadProLight", "Myriad Pro Light", sans-serif !important; color: #fff !important }
h3 { margin-bottom: 0 }
table { border-collapse: collapse }
td { vertical-align: top }

#menu { width: 200px; overflow: auto; position: fixed; height: 100%; z-index: 4; background: #1a1a1a }
#menu .container { padding: 20px }
* html #menu { position: absolute }
#title { padding: 25px 0 8px 0; margin-bottom: 20px }
#title a { color: #fff }
#title a:hover { color: #39c }
#nav ul li.active a { color: #fff; cursor: default }

#copy { position: absolute; bottom: 20px; font: 9px "MyriadProLight", "Myriad Pro Light", "Arial Narrow", sans-serif !important; color: #999 }

#content { height: 100%; margin-left: 200px }
#content .container { width: 600px; padding: 98px 0 20px }
body.section3 #content .container, body.section4 #content .container { padding-top: 116px }
#content img { max-width: 720px;
-webkit-box-shadow: 0 12px 3px -10px rgba(0, 0, 0, 0.75);
   -moz-box-shadow: 0 12px 3px -10px rgba(0, 0, 0, 0.75);
		box-shadow: 0 12px 3px -10px rgba(0, 0, 0, 0.75); }

h2#page { display: block; width: 100%; position: fixed; background: #1a1a1a; padding: 45px 20px 8px 200px; z-index: 2 }
body.Welcome h2#page { display: none }

#title, h2#page { border-bottom: 1px solid #aaa }

#print { display: none }
body.CV #print { display: inline; margin-left: 50px }
body.CV #print:before { content: "\271F  "; font-size: 80% }

#num { color: #999; margin-left: 20px }
#img-container { display: block; margin-top: 20px }
.img-bot { margin-bottom: 1em; display: block }

.title { font-style: italic }
.hidden { display: none }
.indent { margin-left: 15px }
.shaun { margin-top: 50px }
.space { margin-top: 0.8em }
.nospace { margin-top: -0.8em }
.year { width: 50px; font-weight: bold }



@media print
{

* { background: #fff !important }
body { width: 100%; color: #333; background: #fff; font: 11pt/15pt "Helvetica Neue", Helvetica, Arial, sans-serif !important } 
a, h1, h2, h3 { color: #333 !important }
h2, h3 { font: 14pt/18pt "Adobe Garamond Pro", Garamond, Times, serif !important; margin-top: 0.2in; border-bottom: 1px solid #333 }

#title a:after { content: " / ginagrafos.com / 316.350.4771 / ggrafos@gmail.com"; text-transform: lowercase }

#menu { position: relative; width: auto !important; padding: 0; background: #fff; border: 0 }
#menu .container { width: auto; padding: 0 }
#content { width: auto !important; padding: 0 !important; margin: 0 !important }
#content .container { width: auto; padding: 0 }

#nav, #print, #page { display: none !important }

}