@charset "utf-8";
/* CSS Document */

@import url("reset.css");




/***   structure   ***/

html {}

body { background: #c9a960 url(../images/bg-page-all.jpg) center -26px no-repeat; }
	body.home {}
	/*
	#extra1 {z-index: 10; height: 100%; width: 50%; display: block; position: absolute; top: 0; left:0; background:url(../images/bg-page-left.jpg) top left repeat-x;  }
	#extra2 {z-index: 10; height: 100%; width: 50%; display: block; position: absolute; top: 0; left:50%; background:url(../images/bg-page-right.jpg) top left repeat-xt; }
	*/
.other #extra1 {display: block; width: 50%; height: 539px; 
		position: absolute; top:414px; left:-371px; 
		background: url(../images/bg-page-arm.jpg) right 0px no-repeat; }

#container {position: relative; margin: 0 auto; width: 100%; height: 768px; display: block; z-index: 50; }

	#site {position: relative; margin: 0 auto; width: 1024px; height: 768px; /*background: url(../images/page-bg.jpg) top left no-repeat;*/}

		#frame {display: block; position: absolute; top: 21px; }
			#frame.mcdonalds {left: 278px; background: url(../images/frame.jpg); width: 484px; height: 600px; }
			#frame.adf {left: 278px; background: url(../images/frame-white.jpg); width: 484px; height: 600px; }
			#frame.budweiser {left: 278px; background: url(../images/frame.jpg); width: 484px; height: 600px; }
			#frame.lenscrafters {left: 278px; background: url(../images/frame-white.jpg); width: 484px; height: 600px; }
			#frame.dwb {left: 312px; background: url(../images/frame-dwb.jpg); width: 410px; height: 600px; }
			#frame.petco {left: 76px; background: url(../images/frame-petco.jpg); width: 881px; height: 600px; }
			#frame.rollingrock {left: 76px; background: url(../images/frame-rock.jpg); width: 881px; height: 600px; }
			#frame img {position: absolute; top: 34px; left: 34px; }
			#frame.photo-white {left: 76px; background: url(../images/frame-rock.jpg); width: 881px; height: 600px; }
			#frame.photo-vert-white {left: 282px; background: url(../images/frame-photo-white.jpg); width: 474px; height: 636px; }
			#frame.photo-dirty {left: 76px; background: url(../images/frame-petco.jpg); width: 881px; height: 600px; }
			#frame.photo-vert-dirty {left: 282px; background: url(../images/frame-photo-dirty.jpg); width: 474px; height: 636px; }
			
			#frame.reel {left: 240px; top: 126px; background: url(../images/frame-video-black-small.jpg); width: 556px; height: 440px; }

			#flashvid { width: 480px; height: 360px; margin: 33px 0 0 32px;   }
				#flashvid p {font: 20px/24px "Trebuchet MS", verdana, arial, sans-serif; text-align: center; color: #fff;  width: 400px; 
					border: 1px solid #eee; display: block; padding: 1em; position: relative; top: 200px; left: 250px;   }
		
		.resume1 {display: block; position: absolute; top: 200px; left: 30px; width: 482px; height: 471px; background: url(../images/resume-1.jpg);  }
		.resume2 {display: block; position: absolute; top: 200px; left: 512px;  width: 473px; height: 471px; background: url(../images/resume-2.jpg); }
			.resume1 p, .resume1 h2, .resume1 h3, .resume2 p, .resume2 h2, .resume2 h3 {margin-left: -9999px}
			.resume2 p a.email {
	display: block;
	position: absolute;
	top: 383px;
	left: 51px;
	width: 273px;
	height: 20px;
	display: block;
	background: url(../images/email.jpg) top left no-repeat;
	text-indent: -9999px;
	overflow: hidden;
}
			.resume2 p a.email:hover {background-position: bottom left; }

		.linkage {	display: block;	position: absolute;	top: 640px;	left: 563px;}
			.linkage ul li {float: left; display: block; width: 44px; height: 44px; margin: 0 12px 0 0; }
				.linkage a {display: block; width: 44px; height: 44px; text-indent: -9999px; overflow: hidden; }
				.linkage a.linkedin {background: url(../images/icon-linkedin.jpg); }
				.linkage a.facebook {background: url(../images/icon-facebook.jpg); }
				.linkage a.twitter {background: url(../images/icon-twitter.jpg); }
				.linkage a.gmail {background: url(../images/icon-gmail.jpg); }
		

/***    nav    ***/

#home {position: absolute; top:770px; left:490px; width: 47px; height: 17px; 
		background: url(../images/nav/home.png); text-indent: -9999px; }
	#home:hover {background-position: top right; }
	.home #home {display: none; }

#printnav {position: absolute; width: 595px; height: 44px; top: 652px; left: 215px; }
	#printnav li {height: 22px; float: left; }
	#printnav a {display: block;  height: 22px; text-indent: -9999px;}
	#printnav a.mcds {width: 159px; background: url(../images/nav/mcds-print.jpg); }
	#printnav a.bud {width: 121px; background: url(../images/nav/bud.jpg); }
	#printnav a.lens {width: 148px; background: url(../images/nav/lens.jpg); }
	#printnav a.rock {width: 167px; background: url(../images/nav/rock.jpg); }
	#printnav a.adf {width: 246px; background: url(../images/nav/adf.jpg); }
	#printnav a.petco {width: 82px; background: url(../images/nav/petco.jpg); }
	#printnav a.dwb {width: 267px; background: url(../images/nav/dwb.jpg); }
	.mcdonalds #printnav a.mcds, .budweiser #printnav a.bud, .lenscrafters #printnav a.lens, .rollingrock #printnav a.rock, .adf #printnav a.adf, .petco #printnav a.petco, .dwb #printnav a.dwb, #printnav a:hover { background-position: bottom left; }



#vidnav {position: absolute; width: 595px; height: 44px; top: 574px; left: 215px;}
	#vidnav li {height: 16px; float: left; }
	#vidnav a {display: block;  height: 16px; text-indent: -9999px;}
	#vidnav a.mcd-victory {margin-left: 202px; width: 99px; background: url(../images/nav/mcd-victory.jpg); }
	#vidnav a.mcd-karenking {width: 107px; background: url(../images/nav/mcd-karenking.jpg);}
	#vidnav a.att-sausagenator {margin-left: 36px; width: 152px; background: url(../images/nav/att-sausagenator.jpg);}
	#vidnav a.att-taichi {width: 127px; background: url(../images/nav/att-taichi.jpg);}
	#vidnav a.att-spokesmonkey {width: 159px; background: url(../images/nav/att-spokesmonkey.jpg);}
	#vidnav a.att-ceyoga {width: 94px; background: url(../images/nav/att-ceyoga.jpg);
			margin-left: 6px; }
	
	#vidnav li.lottery-edrules {margin-left: 261px; width: 78px; background: url(../images/nav/lottery-edrules.jpg);  }
	#vidnav li.degree-androids {margin-left: 261px; width: 78px; background: url(../images/nav/degree-androids.jpg);  }
	#vidnav li.dell-kidnap {margin-left: 261px; width: 78px; background: url(../images/nav/dell-kidnap.jpg);  }
	#vidnav li.smints-checkup {margin-left: 261px; width: 78px; background: url(../images/nav/smints-checkup.jpg);  }
		#vidnav li span {display: block; text-indent: -9999px; }
	
	#vidnav a:hover { background-position: bottom left; }
	#vidnav a.current { background-position: bottom left; }


#reelnav {position: absolute; width: 595px; height: 44px; top: 652px; left: 233px; }
	#reelnav li {height: 22px; float: left; }
	#reelnav a {display: block;  height: 22px; text-indent: -9999px;}
	#reelnav a.mcds {width: 136px; background: url(../images/nav/mcds-reel.jpg); }
	#reelnav a.lottery {width: 211px; background: url(../images/nav/lottery.jpg); }
	#reelnav a.degree {width: 216px; background: url(../images/nav/degree.jpg); }
	#reelnav a.dell {margin-left: 136px; width: 164px; background: url(../images/nav/dell.jpg); margin-top: 3px; }
	#reelnav a.att {width: 61px; background: url(../images/nav/att.jpg);  margin-top: 3px;}
	#reelnav a.smints {width: 72px; background: url(../images/nav/smints.jpg);  margin-top: 3px;}
	
	.mcdonalds #reelnav a.mcds, .lottery #reelnav a.lottery, .degree #reelnav a.degree, .dell #reelnav a.dell, .att #reelnav a.att, .smints #reelnav a.smints, #reelnav a:hover { background-position: bottom left; }




#arrows {position: absolute; top: 621px; left: 453px; }
.photos #arrows {	top: 657px;}
	#arrows li {display: block; width: 59px; height: 32px; float: left;  }
	#arrows a {display: block; width: 59px; height: 32px; text-indent: -9999px; }
	#arrows a.prev {background: url(../images/arrow-left.jpg) top left no-repeat; }
	#arrows a.next {background: url(../images/arrow-right.jpg) top left no-repeat; }
	.photos #arrows a.prev {background: url(../images/arrow-left-photos.jpg) top left no-repeat; }
	.photos #arrows a.next {background: url(../images/arrow-right-photos.jpg) top left no-repeat; }
		#arrows a:hover, .photos #arrows a:hover {background-position: bottom left; }
	#arrows .hidden {visibility: hidden;  }




#sitenav {position: absolute; top: 700px; left: 76px; }
	#sitenav li {height: 48px; float: left;}
	#sitenav a {display: block; }
		#sitenav a.print {height: 48px; width: 163px; background: url(../images/nav/nav-print.jpg); }
		#sitenav a.reel {height: 48px; width: 123px; background: url(../images/nav/nav-reel.jpg); }
		#sitenav a.other {height: 48px; width: 176px; background: url(../images/nav/nav-other.jpg); }
		#sitenav a.photos {height: 48px; width: 220px; background: url(../images/nav/nav-photos.jpg); }
		#sitenav a.resume {height: 48px; width: 197px; background: url(../images/nav/nav-resume.jpg); }
	
	#sitenav a:hover {background-position: bottom left; }
	.print #sitenav a.print {background-position: bottom left; }
	.reel #sitenav a.reel {background-position: bottom left; }
	.other #sitenav a.other {background-position: bottom left; }
	.photos #sitenav a.photos {background-position: bottom left; }
	.resume #sitenav a.resume {background-position: bottom left; }


#hand {display: block; width: 312px; height: 570px; position: absolute; top: 90px; left:0; }
	#hand.coffee {background: url(../images/portfolio/hand-beetag-coffee.jpg); }
	#hand.fries {background: url(../images/portfolio/hand-beetag-fries.jpg); }
	#hand.burger {background: url(../images/portfolio/hand-beetag-burger.jpg); }

#beetag {display: block; width: 213px; height: 280px; position: absolute; top: 168px; left:764px; background: url(../images/portfolio/beetag-copy.jpg); }

.other #label { display: block; width: 123px; height: 21px; background: url(../images/nav/other-mcdonalds.jpg); 
	position: absolute; top: 651px; left: 451px; }	


/***    styles    ***/
a, a:visited {}
a:hover, a:active {}
	a span {margin-left: -9999px; }

h1 {display: none; }
	.home h1 {display: block;  position: absolute; top: 200px; left: 110px; width: 813px; height: 278px; background:url(../images/logo-home.jpg); text-indent: -9999px; }
	.resume h1 {display: block;  position: absolute; top: 37px; left: 30px; width: 926px; height: 163px; background:url(../images/logo-resume.jpg); text-indent: -9999px; }
h2 {}
h3 {}
h4 {}

.clear{ clear: both; }