/* Reset default browser CSS. Based on work by Eric Meyer: http://meyerweb.com/eric/tools/css/reset/index.html
-------------------------------------------------------------- */

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; vertical-align: baseline; background: transparent; }

body { line-height: 1; }

h1, h2, h3, h4, h5, h6 { font-weight: normal; clear: both; }

ol, ul { list-style: none; }

blockquote { quotes: none; }

blockquote:before, blockquote:after { content: ''; content: none; }

del { text-decoration: line-through; }

/* tables still need 'cellspacing="0"' in the markup */
table { border-collapse: collapse; border-spacing: 0; }

a img { border: none; }

/*
 *  GRID 960
 */
 
/* Containers
----------------------------------------------------------------------------------------------------*/
.container_12 { margin-left: auto; margin-right: auto; width: 960px; }

/* Grid >> Global
----------------------------------------------------------------------------------------------------*/
.g { display: inline; float: left; position: relative; margin-left: 10px; margin-right: 10px; }

/* Grid >> Children (Alpha ~ First, Omega ~ Last)
----------------------------------------------------------------------------------------------------*/
.alpha { margin-left: 0; }
.omega { margin-right: 0; }

/* Grid >> 12 Columns
----------------------------------------------------------------------------------------------------*/
.container_12 .c1 { width: 60px; }
.container_12 .c2 { width: 140px; }
.container_12 .c3 { width: 220px; }
.container_12 .c4 { width: 300px; }
.container_12 .c5 { width: 380px; }
.container_12 .c6 { width: 460px; }
.container_12 .c7 { width: 540px; }
.container_12 .c8 { width: 620px; }
.container_12 .c9 { width: 700px; }
.container_12 .c10 { width: 780px; }
.container_12 .c11 { width: 860px; }
.container_12 .c12 { width: 940px; }


/* Prefix Extra Space >> 12 Columns
----------------------------------------------------------------------------------------------------*/

.container_12 .prefix_1 { padding-left: 80px; }
.container_12 .prefix_2 { padding-left: 160px; }
.container_12 .prefix_3 { padding-left: 240px; }
.container_12 .prefix_4 { padding-left: 320px; }
.container_12 .prefix_5 { padding-left: 400px; }
.container_12 .prefix_6 { padding-left: 480px; }
.container_12 .prefix_7 { padding-left: 560px; }
.container_12 .prefix_8 { padding-left: 640px; }
.container_12 .prefix_9 { padding-left: 720px; }
.container_12 .prefix_10 { padding-left: 800px; }
.container_12 .prefix_11 { padding-left: 880px }

/* Suffix Extra Space >> 12 Columns
----------------------------------------------------------------------------------------------------*/

.container_12 .suffix_1 { padding-right: 80px; }
.container_12 .suffix_2 { padding-right: 160px; }
.container_12 .suffix_3 { padding-right: 240px; }
.container_12 .suffix_4 { padding-right: 320px; }
.container_12 .suffix_5 { padding-right: 400px; }
.container_12 .suffix_6 { padding-right: 480px; }
.container_12 .suffix_7 { padding-right: 560px; }
.container_12 .suffix_8 { padding-right: 640px; }
.container_12 .suffix_9 { padding-right: 720px; }
.container_12 .suffix_10 { padding-right: 800px; }
.container_12 .suffix_11 { padding-right: 880px; }

/* Push Space >> 12 Columns
----------------------------------------------------------------------------------------------------*/

.container_12 .p1 { left: 80px; }
.container_12 .p2 { left: 160px; }
.container_12 .p3 { left: 240px; }
.container_12 .p4 { left: 320px; }
.container_12 .p5 { left: 400px; }
.container_12 .p6 { left: 480px; }
.container_12 .p7 { left: 560px; }
.container_12 .p8 { left: 640px; }
.container_12 .p9 { left: 720px; }
.container_12 .p10 { left: 800px; }
.container_12 .p11 { left: 880px; }

/* Pull Space >> 12 Columns
----------------------------------------------------------------------------------------------------*/

.container_12 .pull_1 { left: -80px; }
.container_12 .pull_2 { left: -160px; }
.container_12 .pull_3 { left: -240px; }
.container_12 .pull_4 { left: -320px; }
.container_12 .pull_5 { left: -400px; }
.container_12 .pull_6 { left: -480px; }
.container_12 .pull_7 { left: -560px; }
.container_12 .pull_8 { left: -640px; }
.container_12 .pull_9 { left: -720px; }
.container_12 .pull_10 { left: -800px; }
.container_12 .pull_11 { left: -880px; }


/* http://perishablepress.com/press/2008/02/05/lessons-learned-concerning-the-clearfix-css-hack */
.clearfix:after { clear: both; content: ' '; display: block; font-size: 0; line-height: 0; visibility: hidden; width: 0; height: 0; }

.clearfix {	display: inline-block; }

* html .clearfix { height: 1%; }

.clearfix { display: block; }


/*  Sticky footer, courtesy of http://ryanfait.com/  */
* { margin: 0; }
HTML, BODY { height: 100%; }
#wrapper { min-height: 100%; height: auto !important; height: 100%; margin: 0 auto -280px; }
#footer, .push { height: 280px; clear: both; }

/*
 *  BEGIN Greg Kuwaye Design
 */

BODY { margin: 0 auto; padding: 0; color: #333; background: #0e0e0e url(img/gkd_bgsm.jpg) center top no-repeat; font-size: 62.5%; font-family: 'Lucida Grande', 'Lucida Sans Unicode', Arial, sans-serif; }
BODY.home { background: #0e0e0e url(img/gkd_bg.jpg) center top no-repeat; }

/*  T Y P O G R A P H Y  */

#header { height: auto; }
	.page-home #header { height: 450px; }
#header A, #header_sm A { outline: none; }

STRONG { font-weight: bold; }
EM { font-style: italic; }

#homebigtext { color: #000; font-family: 'proxima-nova-1', 'proxima-nova-2', 'Lucida Grande', 'Lucida Sans Unicode', Arial, sans-serif; }
.bigtext { text-align: center; height: 102px; font-size: 38px; letter-spacing: -0.01em; line-height: 1.3em; margin-bottom: 30px; padding-top: 8px; }

H1, H2, H3, H4 { font-weight: bold; font-family: 'proxima-nova-1', 'proxima-nova-2', 'Lucida Grande', 'Lucida Sans Unicode', Arial, sans-serif; color: #fff; }

/* H1.entry-title, H2, H3, H4, .cufon */
.cufon { font-family: 'proxima-nova-1', 'proxima-nova-2', 'Lucida Grande', 'Lucida Sans Unicode', Arial, sans-serif; }

#site-title { float: left; margin-bottom: 18px; }
#site-title A, #site-title SPAN { display: block; position: relative; margin-top: -13px; width: 182px; height: 36px; background: url(img/gkd_sprites.png) -100px 13px no-repeat }
#site-title B { display: none }

/* Give 36px bottom margin between SPAN.h1 and the content */
SPAN.h1 { margin-bottom: 36px; }

H1 { font-size: 36px; line-height: 1.25em; margin-bottom: 18px; letter-spacing: -0.01em; }
H2 { font-size: 24px; line-height: 32px; margin-bottom: 18px; letter-spacing: -0.01em; font-weight: normal; }
H3 { font-size: 18px; line-height: 18px; margin-bottom: 18px; letter-spacing: -0.01em; font-weight: normal; margin-top: 9px; }
H4 { font-size: 14px; line-height: 18px; letter-spacing: -0.01em; }

	H1.dark, H2.dark, H3.dark, H4.dark { color: #a8aeb2; }

H1 B, H2 B, H3 B, H4 B { font-weight: normal !important; } /* B tag = nonbold, for effect */

H1 A:hover { color: #ecec00; }

.title-sublevel-1 { font-weight: normal !important; color: #a8aeb2; }

A { outline: none; }
A:link, A:visited { color: #ecec00 !important; text-decoration: none; }
P, DL { font-size: 12px; letter-spacing: 0; color: #d7dadc; }
.entry-content UL { font-size: 12px; margin-left: 1em; }
.entry-content UL LI { list-style: square; margin-left: 1em; }
P, UL, UL, DL { line-height: 20px; margin-bottom: 1.5em; }

ACRONYM { border-bottom: 1px dotted #666; cursor: default; }

/*  S T R U C T U R E  */

.homeitem { height: 120px; background: #5dc9d9 }

.clearleft { clear: left }
.clearright { clear: right }
.clearboth { clear: both }

#topbar { padding: 25px 0 0; }
#bottombar { padding: 13px 0 0; }

#menu-gkd { float: right; position: relative; margin-right: -20px; }
#menu-gkd LI { float: left }
#menu-gkd LI A { display: block; background-image: url(img/gkd_sprites.png); background-repeat: none; height: 21px; padding: 0 20px; }
#menu-gkd LI B { display: none; }

/* Portfolio */
#menu-gkd #menu-item-13 A { width: 68px; background-position: 20px -100px; }
#menu-gkd #menu-item-13 A:hover, #menu-gkd #menu-item-13.current-menu-item A, #menu-gkd #menu-item-13.current-page-ancestor A, #menu-gkd #menu-item-13.current_page_parent A { background-position: 20px -130px; }

/* About */
#menu-gkd #menu-item-4 A { width: 51px; background-position: -80px -100px; }
#menu-gkd #menu-item-4 A:hover, #menu-gkd #menu-item-4.current-menu-item A, #menu-gkd #menu-item-4.current-page-ancestor A, #menu-gkd #menu-item-4.current_page_parent A { background-position: -80px -130px; }

/* Services */
#menu-gkd #menu-item-406 A { width: 69px; background-position: 20px -180px; }
#menu-gkd #menu-item-406 A:hover, #menu-gkd #menu-item-406.current-menu-item A, #menu-gkd #menu-item-406.current-page-ancestor A, #menu-gkd #menu-item-406.current_page_parent A { background-position: 20px -210px; }

/* Testimonials - FUTURE */
/*#menu-gkd #menu-item-12 A { width: 100px; background-position: -160px -100px; }
#menu-gkd #menu-item-12 A:hover, #menu-gkd #menu-item-12.current-menu-item A { background-position: -160px -130px; }*/

/* Archives */
#menu-gkd #menu-item-12 A { width: 72px; background-position: -410px -100px; }
#menu-gkd #menu-item-12 A:hover, #menu-gkd #menu-item-12.current-menu-item A, #menu-gkd #menu-item-12.current-page-ancestor A, #menu-gkd #menu-item-12.current_page_parent A { background-position: -410px -130px; }

/* Contact */
#menu-gkd #menu-item-11 A { width: 63px; background-position: -290px -100px; }
#menu-gkd #menu-item-11 A:hover, #menu-gkd #menu-item-11.current-menu-item A, #menu-gkd #menu-item-11.current-page-ancestor A, #menu-gkd #menu-item-11.current_page_parent A { background-position: -290px -130px; }

/* Give all .pagecontent an extra 18px */
.pagecontent { padding-bottom: 18px; }

#content { color: #ededed; padding: 18px 0 36px; clear: both; }
	/* Extra top padding to home #content */
	.home #content { padding-top: 27px; }
#content .entry-title a:link, #content .entry-title a:visited { color: #f0f0f0 !important; }
#content .entry-title a:hover { color: #ecec00 !important; }
	
/*  Home page  */
.home_portfolio { height: 140px; padding: 10px 0 0; margin-top: -9px; background: url(img/gkd_home_port.png) 0 0 no-repeat;  }

#featured { background: #202020 url(img/gkd_dl.png) bottom left repeat-x; }
.featured_info { padding: 36px 0 9px; color: #fff; display: none }

/*A.fnamelink { font-weight: normal !important; }*/
.pitem { height: 140px; background-color: #474747; }
.pitem A { width: 300px; display: block; overflow: hidden; }

/* Logo link/image */
#topbar A { display: block; width: 90px; height: 90px; }

/*  Selectbar, for portfolio items  */

.selectbar { background: #474747; height: 10px; position: relative; float: left; clear: left; margin-top: 0px; /* why? */ }
.selectbar .lt, .selectbar .rt { position: relative; width: 0; height: 0; border-style: solid; border-width: 5px 3px; }
.selectbar .lt { float: left; border-color: transparent transparent #202020 #202020; }
.selectbar .rt { float: right; border-color: #202020 #202020 transparent transparent; }

/* Sliding portfolio bar */

#pslide-wrapper { height: 150px; overflow: hidden; position: relative; /* position: relative essential for IE */ }
#pslide-wrapper-inner { height: 140px; width: 5000px; position: relative; }

#pslide-wrapper IMG { display: block; /* default is inline; fixes pixel gap below images */}

.scroll { display:block;width:20px;height:140px; background-image: url(/wp-content/themes/gkd/img/gkd_port_lr.png); background-repeat: no-repeat; float: left; position: absolute; }

#scroll_left { background-position: 0 50px; margin-left: -20px; }
	#scroll_left:hover { background-position: 0 -50px; }
	#scroll_left.disabled, #scroll_left.disabled:hover { background-position: 0 -150px; cursor: default; }
	
#scroll_right { background-position: -43px 50px; margin-left: 960px }
	#scroll_right:hover { background-position: -43px -50px; }
	#scroll_right.disabled, #scroll_right.disabled:hover { background-position: -43px -150px; cursor: default; }

/* See full portfolio link */	
#see-full { margin-top: 36px; padding-top: 10px; margin-bottom: -100%; z-index: 10; text-align: right; }

/*  Portfolio Pagination  */

.pitem-pagination { position: relative; margin-top: 15px; font-weight: 100; }
.pitem-pagination LI { float: left; font-size: 18px; letter-spacing: -0.01em; }
.pitem-pagination LI.prev { padding-right: 16px; border-right: 1px solid #444; text-transform: uppercase; }
.pitem-pagination LI.next { padding-left: 16px; text-transform: uppercase; }
.pitem-pagination LI.total { float: right; }
.pitem-pagination LI SPAN { color: #898e91; }

/* Widgets */

.widget-container { margin-bottom: 18px; }

/* PORTFOLIO ITEM - Thumb Mask */

#thumb-mask { overflow: hidden; /* Add top margin to align with top of H1 */ margin-top: 8px; margin-bottom: 36px; position: relative; }
#thumb-mask img { position: relative; }
#thumb-mask.thumb-offset-1 img { left: -80px; }
#thumb-mask.thumb-offset-2 img { left: -160px; }
#thumb-mask.thumb-offset-3 img { left: -240px; }
#thumb-mask.thumb-offset-4 img { left: -320px; }
#thumb-mask.thumb-offset-5 img { left: -480px; }
#thumb-mask.thumb-offset-6 img { left: -560px; }
#thumb-mask.thumb-offset-7 img { left: -640px; }
#thumb-mask.thumb-offset-8 img { left: -720px; }
#thumb-mask.thumb-offset-9 img { left: -800px; }
#thumb-mask.thumb-offset-10 img { left: -880px; }

/* Portfolio page > items */

.g.portfolio { margin-top: 10px; margin-bottom: 10px; }
.g.portfolio A { display: block; width: 300px; overflow: hidden; }
.g.portfolio IMG { display: block; /* default is inline, fix extra pixels at bottom */ }

/*  Portfolio page > mask  */

.portfolio .mask { display: table; width: 300px; height: 140px; background: url(img/gkd_000_60.png) repeat; position: absolute; cursor: pointer; }
.portfolio .mask DIV { display: table-cell; vertical-align: middle; #position: absolute; #top: 50%; /* IE hacks */ }
.portfolio .mask DIV P { font-size: 16px; font-weight: bold; color: #fff; text-align: center; text-decoration: none; padding: 0 18px; margin-bottom: 0; }
/* -0.5em top margin pulls text up near center in IE; not a great solution */
.portfolio .mask DIV P SPAN { #display: block; #position: relative; #margin-top: -0.5em; }

#project_snapshots { border-top: 1px dashed #666; margin-top: 17px; padding: 18px 0; }

/*  Contact Page > Form  */

.wpcf7-form { }
.wpcf7-form INPUT[type=text], .wpcf7-form TEXTAREA { width: 400px; padding: 5px; border: 2px solid #aaa; margin-top: 4px; background: #edf0f1; }
.wpcf7-form SELECT { padding: 5px; width: 400px; border: 2px solid #aaa; margin-top: 4px; background: #edf0f1; }
.wpcf7-form TEXTAREA { font: 13px Arial, Helvetica, sans-serif; }


/** Blog */
.entry-meta, .entry-utility { font-size: 12px; line-height: 18px; }


/*  F O O T E R  */
#footer { background: url(img/gkd_fbg.jpg) top center no-repeat; }
	#footer P { color: #f0f0f0; }
#colophon { padding-top: 27px; }

/*  Useful global classes  */

.ntm { margin-top: 0 !important; }
.nrm { margin-right: 0 !important; }
.nbm { margin-bottom: 0 !important; }
.nlm { margin-left: 0 !important; }
.ntp { padding-top: 0 !important; }
.nrp { padding-right: 0 !important; }
.nbp { padding-bottom: 0 !important; }
.nlp { padding-left: 0 !important; }