@import "styles/reset.css";
@import "styles/typography.css";
@import "styles/forms.css";
@import "styles/ie.css";
@import "styles/thickbox.css";

/* Colors:

Dark Brown: rgb(70,50,40);
Brown:		rgb(100,80,70);
Light Tan	rgb(240,220,200);
Tan			rgb(230,210,180);

quiet		rgb(170,150,135);

Yellow		rgb(220,160,75);
Red			rgb(220,100,75);
*/

/* Fancypants fonts courtesy of Kernest
------------------------------------------------------------------------------------------------- */
/* SIL Open Font License (http://scripts.sil.org/cms/scripts/page.php?site_id=nrsi&item_id=OFL) */
@font-face { font-family: 'Chunk'; src: url('../fonts/chunk.eot'); src: local(''), url('../fonts/chunk.woff') format('woff'), url('../fonts/chunk.otf') format('opentype'), url('http://kernest.com/embed/chunk'); }

/* Site
-------------------------------------------------------------- */
* {z-index: 100;}

body		{ margin: 0; text-align: center; color: rgb(100,80,70); background: rgb(230,210,180) url(../images/ui/bk-light.jpg) center top;}  
#wrapper	{ background: url(../images/ui/bk-port.jpg) center 0px fixed no-repeat; margin: 0; padding: 0; text-align: left; }

.header,
#navigation,
#intro,
#work,
.footer,
.section	{ margin: 0 auto; text-align: left; width: 940px; clear: both; }
.last		{ margin-right: 0; }

#intro,
#work,
#contact	{ padding: 5em 0 2em; border-bottom: 5px solid rgba(170,150,135,.125);}

/* Typography
------------------------------------------------------------------------------------------------- */
h1,h2,h3,h4,h5,h6,
.nav-main,
.button,
.details b			{ font-family: 'chunk', georgia, 'times new roman', times, serif; color: rgb(170,150,135); letter-spacing: .08em; }
.meta,
.credits 			{ font-size: .875em; font-style: italic; font-weight: normal; color: rgb(170,150,135); }

h2	{ color: rgba(170,150,135,.1); text-transform: uppercase; font-size: 16em; position: fixed; top: 50px; z-index: -1; text-align: center; width: 100%;}
h3	{ font-size: 3em; margin-bottom: .5em;}

/* Links
------------------------------------------------------------------------------------------------- */
a, a:visited		{ color: rgb(220,100,75); }
a:hover, a:active	{ color: rgb(220,160,75); }
#footer a, 
#footer a:visited	{ color: rgb(220,160,75); }
#footer a:hover, 
#footer a:active	{ color: rgb(220,100,75); }

a.admin-link		{ height: 16px; width: 16px; font-size:10px;  }
a.admin-link:hover	{  }

a.button				{ background-color: rgb(230,210,180); background-color: rgba(170,150,135,.25); color: rgb(170,150,135); display: block; font-size: .875em; padding: 2px 10px 0; text-transform: uppercase; text-decoration: none; letter-spacing: .1em;}
a.button:hover			{ background-color: rgb(100,80,70); background-color: rgba(170,150,135,.75); color: rgb(230,210,180); }

/* Header
------------------------------------------------------------------------------------------------- */
#header				{ background: url(../images/ui/bk-port-dark.jpg) center 0px fixed; border-bottom: 2px solid rgb(70,50,40); color: rgb(230,210,180); position: fixed; top: 0; width: 100%; z-index: 1000;}
h1 	{ font-size: 1.5em; line-height: 1; float: left; letter-spacing: .075em; margin: 0 0 0 40px; text-transform: uppercase;}
a#logo 				{ background: transparent; background: rgba(70,50,40,0); display: block; float: left; padding: .5em 20px; text-decoration: none;  }
a#logo:hover		{ background: rgb(70,50,40); background: rgba(70,50,40,.5); }
a#logo em			{ display: none; font-size: .625em; font-style: normal; }
a#logo:hover em		{ display: inline;}
a#logo:hover .long	{ display: none; }



/* Navigation
------------------------------------------------------------------------------------------------- */
#accessibility		{ z-index: 1000; }
#skip-link			{ background: rgba(70,50,40,.25); position: fixed; height: 3px; left: 0; right: 0; top:0; text-indent: -9999px; z-index: 1000;}

.nav-main				{ list-style: none; float: right; display: inline; line-height: 1em; font-size: 1.5em;  margin: 0 40px 0 0; padding: 0; text-transform: uppercase; letter-spacing: .075em; font-weight: normal;}
.nav-main li			{ float: left; display: inline; }
.nav-main a, 
.nav-main a:visited 		{ background: transparent; background: rgba(70,50,40,0); display: block; padding: .5em 20px; text-decoration: none;}
.nav-main a:hover			{ background: rgb(70,50,40); background: rgba(70,50,40,.5); }
.nav-main li.current a		{ background: rgb(70,50,40); background: rgba(70,50,40,.5); color: rgb(220,160,75); }

/* Content
------------------------------------------------------------------------------------------------- */
#content						{ padding: 0 20px 20px 20px;}
#intro,
#contact							{ margin: 0 auto 1.5em; width: 820px;  }
#intro p						{ width: 460px; float: left; display: inline;}
#intro p.skills					{ width: 340px; float: right; display: inline;}

.portrait			{ float: left; display: inline; margin-right: 20px; margin-left: -20px; background: rgb(170,150,135) url(../images/ui/loading.gif) center center no-repeat; padding: 5px; background-color: rgba(170,150,135,.5); }

/* Portfolio
------------------------------------------------------------------------------------------------- */
.next-prev						{ display: inline; float: right; list-style: none; margin: 2px 0;  }
.next-prev li					{ float: left; display: inline; margin-right: 2px; }
.next-prev li.meta				{ margin-right: 10px; }

.project			{ border-top: 5px solid rgba(170,150,135,.125); padding: 5em 0 2em 0; }
.project h4			{ width: 460px; float: left; display:inline; }

.details	{ width: 220px; float: left; clear: left; display: inline; margin-right: 20px; margin-left: 0; list-style: none;}
.details li	{ margin-bottom: 1em; }
.details li p { margin-bottom: 0;}
.hero		{ float: right; display: inline; background: rgb(170,150,135) url(../images/ui/loading.gif) center center no-repeat; padding: 5px; background-color: rgba(170,150,135,.5); }

a.lightbox	{ display: none;}
a.button.lightbox	{ display: block;}

/* Contact
------------------------------------------------------------------------------------------------- */
#contact		{ border-bottom: 0; }
.vcard			{ list-style: none; }
.vcard li		{ line-height: 1; margin-bottom: .5em;}

/* Footer
------------------------------------------------------------------------------------------------- */
#footer							{ background: rgb(70,50,40) url(../images/ui/bk-dark.jpg) center top; border-top: 2px solid rgb(70,50,40); color: rgb(230,210,180);  } 
.footer							{ background: url(../images/ui/gear-crop-bottom.png) center top no-repeat; padding: .5em 0 2em; }
.copyright,
.credits						{ float: left; display: inline; width: 460px; }
.credits						{ margin-left: 20px; }
.credits dt						{ clear: left; display: inline; float:left; width: 225px; margin-right: 15px; font-weight: normal; text-align: right; }
.credits dd						{ display: inline; float: left; }





 
 /*
    ColorBox Core Style
------------------------------------------------------------------------------------------------- */

#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative; overflow:visible;}
#cboxLoadedContent{overflow:auto;}
#cboxLoadedContent iframe{display:block; width:100%; height:100%; border:0;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}

/* 
    ColorBox example user style
------------------------------------------------------------------------------------------------- */
#cboxOverlay{background:rgb(240,220,200);}

#colorbox{}
    #cboxContent{margin-top:32px;}
        #cboxLoadedContent{background: rgb(170,150,135); padding:5px;}
        #cboxLoadingGraphic{background:url(../images/ui/loading.gif) center center no-repeat;}
        #cboxLoadingOverlay{background:#000;}
        #cboxTitle{position:absolute; top:-22px; left:0; color:rgb(100,80,70);}
        #cboxCurrent{position:absolute; top:-22px; right:205px; text-indent:-9999px;}
        #cboxSlideshow, #cboxPrevious, #cboxNext, #cboxClose{text-indent:-9999px; width:20px; height:20px; position:absolute; top:-20px; background:url(../images/ui/controls.png) 0 0 no-repeat;}
        #cboxPrevious{background-position:0px 0px; right:44px;}
        #cboxPrevious.hover{background-position:0px -25px;}
        #cboxNext{background-position:-25px 0px; right:22px;}
        #cboxNext.hover{background-position:-25px -25px;}
        #cboxClose{background-position:-50px 0px; right:0;}
        #cboxClose.hover{background-position:-50px -25px;}
        .cboxSlideshow_on #cboxPrevious, .cboxSlideshow_off #cboxPrevious{right:66px;}
        .cboxSlideshow_on #cboxSlideshow{background-position:-75px -25px; right:44px;}
        .cboxSlideshow_on #cboxSlideshow.hover{background-position:-100px -25px;}
        .cboxSlideshow_off #cboxSlideshow{background-position:-100px 0px; right:44px;}
        .cboxSlideshow_off #cboxSlideshow.hover{background-position:-75px -25px;}

 
 
 
/* MODERNIZR 
------------------------------------------------------------------------------------------------- */

/* csstransforms */
.csstransforms ul.thumbnails img:hover {
-webkit-transform : scale(1.15);
-moz-transform : scale(1.15); }

/* csstransitions */
.csstransitions a:hover,
.csstransitions ul.thumbnails img:hover {
-webkit-transition : all .2s linear;
-moz-transition : all .2s linear; }

/* Clear Floats (clearfix)
----------------------------------------------------------------------------------------- */
.group:after {content: "."; display: block; height: 0; clear: both; visibility: hidden;}
.group {display: inline-block;}
/* Hides from IE-mac */
* html .group {height: 1%;}
.group {display: block;}
/* End hide from IE-mac */


.last	{ margin-right: 0; }



/* Grid
----------------------------------------------------------------------------------------- */

#grid			{ background: url(../images/ui/bk-grid-16.gif) repeat-y 0 0; width: 980px; position: absolute; top: 0; left: 50%; margin-left: -490px; }
#grid .horiz	{ height: 11px; border-bottom: 1px dotted rgba(255,255,255,.5); margin: 0; padding: 0; }