@import url('reset.css');


/* COLORS */
body {}
#container, p a {color:#fff;}
#copyright {color:#ececec;}
a.nav-link {color:#fff; }

/* TYPOGRAPHY */
body, #copyright {text-align:center;}
#container
{text-align:center; font-family:arial, verdana, sans serif; font-size:0.75em; line-height:1.4em;}
#copyright {font-size:0.75em; text-transform:uppercase;}
h1, h2 , #nav dt, #work dt{text-indent:-1000px;}
li h2 {text-indent:0; text-align:left;}
h3 {}
a {text-decoration:underline;}
a:hover{text-decoration:none;}
a.nav-link {font-size:1.5em; font-weight:bold; text-decoration:none;}
p {text-align:left;}
p.fancy-first-char:first-letter {font-size: 250%;}
p.fancy-first-char:first-line {line-height:130%;} 


/* UTILITY */
.clear {clear:both;}
.hidden {display:none;}
dl#nav dt, #work dt {overflow:hidden;}


/* secret mode

h1, #logo, ul#sampleset1, ul#sampleset2, ul#sampleset3 
{display:none;}
*/




body {background:url(../images/bg.jpg) top repeat-x;}

#container
{width:1000px; height:1348px; margin:100px auto; background:url(../images/wood.jpg) top center no-repeat; position:relative; z-index:0;}

#logo
{width:741px; height:278px; position:absolute; top:-80px; left:120px; z-index:1; background:url(../images/logo.png) no-repeat;}

h1
{overflow:hidden; width:318px; height:151px; position:absolute; top:165px; left:150px; z-index:10; background:url(../images/heading.gif) no-repeat;}

#description
{position:absolute; top:170px; left:510px; width:340px; z-index:10; }

#description2
{position:absolute; top:280px; left:510px; width:340px; z-index:10; }


dl#nav
{position:absolute; left:420px; top:1020px; width:150px; height:30px; z-index:10;}
	dl#nav dd
	{position:absolute; no-repeat; width:30px; height:30px;}
	#nav1 
	{position:relative; top:0; left:0;}
	#nav2
	{position:relative; top:0px; left:40px;}
	#nav3 
	{position:relative; top:0px; left:80px;}
	#nav4 
	{position:relative; top:0px; left:120px;}
		a.nav-link
		{position:absolute; top:0; left:0; background:url(../images/nav-bg.gif) top left; width:100%; height:30px; margin-top:0px; line-height:150%;}
		a.nav-link:hover
		{background-position:0px -30px}



dl#work
{position:absolute; top:470px; left:47px;}

#work dt
{z-index:10; height:18px;}
	dt.design
	{width:117px; background:url(../images/label-design.jpg) no-repeat;}
	dt.develop
	{width:161px; background:url(../images/label-develop.jpg) no-repeat;}
	#dt1
	{position:absolute; top:95px; left:390px; }
	#dt2
	{position:absolute; top:295px; left:390px; }
	#dt3
	{position:absolute; top:495px; left:402px; }

#work dd
{height:200px; position:relative;}

.shelf
{width:890px; height:168px; background:url(../images/shelf.png) no-repeat; background-position:bottom;}


ul#sampleset1, ul#sampleset2, ul#sampleset3, ul#sampleset4, ul#sampleset5, ul#sampleset6, ul#sampleset7, ul#sampleset8, ul#sampleset9, ul#sampleset10, ul#sampleset11, ul#sampleset12
{position:absolute; top:-80px; left:80px;}

ul#sampleset4, ul#sampleset5, ul#sampleset6, ul#sampleset7, ul#sampleset8, ul#sampleset9, ul#sampleset10, ul#sampleset11, ul#sampleset12
{display:none;}

ul.sampleset li
{float:left; border:none;}

li h2 {margin-bottom:5px; width:230px;}

#hdr-contact
{overflow:hidden; width:254px; height:38px; position:absolute; top:1130px; left:180px; background:url(../images/heading-contact.gif) no-repeat;}

#contact-copy
{position:absolute; top:1180px; left:180px; width:330px; }

#end-copy
{position:absolute; top:1140px; left:540px; width:250px; }

#copyright
{position:absolute; bottom:40px; left:0; width:100%;}