* {
	margin: 0;
	padding: 0;
} 

body {
	font-size: 12px;
	font-family: Arial, Helveitca, sans-serif;
	background: #363636 url(../images/bg_tile.jpg) repeat-x;
	color: #fff;
}

p {
	line-height: 18px;
	margin: 5px 0;
}

a {
	color: #fff;
	text-decoration: none;
}

a:hover {
	color: #e4bed7;
}

#headerlinks a, #prevnext a {
	margin: 0 5px;
}

#outercontainer {
	background: url(../images/bg_design_art2.jpg) no-repeat center -1px;
	width: 100%;
}

#innercontainer {
	position: relative;
	width: 729px;
	border: 0px solid red;
	margin: 0 auto;
}

#header {
	position: relative;
	height: 182px;
	background: url(../images/bg_headerall.jpg) no-repeat;
}

h1 {
	position: absolute;
	top: 60px;
	left: 0px;
}

h1 a {
	display: block;
	width: 482px;
	height: 0px;
	padding: 85px 0 0 0;
	overflow: hidden;
}

#headerlinks {
	position: absolute;
	top: 10px;
	right: 0px;
}

/* MAIN NAV */

#mainnav {
	width: 735px;
	height: 45px;
}

/* Leahy Image Replacement Technique - used to hide the html text*/
#nav li#navitem1 a, #nav li#navitem2 a, #nav li#navitem3 a, #nav li#navitem4 a, #nav li#navitem5 a, #nav li#navitem6 a, #nav li#navitem7 a {
	display: block;
	height: 0px;
	padding: 27px 0 0px 0;
	overflow: hidden;
}



#nav, #nav ul { /* all lists */
	padding: 0;
	margin: 0;
	list-style: none;
}

#nav li { /* all list items */
	float: left;
}

#nav li#navitem1 a {
	background: url(../images/nav_about_up.jpg) no-repeat;
	width: 58px;
}

#nav li#navitem1 a:hover, #nav li#navitem1 { /* second item - the li - is used to preload the rollover image */
	background: url(../images/nav_about_over.jpg) no-repeat;
}

#nav li#navitem2 a {
	background: url(../images/nav_in_design_up.jpg) no-repeat;
	width: 123px;
}

#nav li#navitem2 a:hover, #nav li#navitem2 { /* second item - the li - is used to preload the rollover image */
	background: url(../images/nav_in_design_over.jpg) no-repeat;
}

#nav li#navitem3 a {
	background: url(../images/nav_type_up.jpg) no-repeat;
	width: 95px;
}


#nav li#navitem4 a {
	background: url(../images/nav_dig_imag_up.jpg) no-repeat;
	width: 118px;
}

#nav li#navitem5 a {
	background: url(../images/nav_intro_digital_up.jpg) no-repeat;
	width: 137px;
}

#nav li#navitem6 a {
	background: url(../images/nav_intro_design_up.jpg) no-repeat;
	width: 114px;
}

#nav li#navitem7 a {
	background: url(../images/nav_intern_up.jpg) no-repeat;
	width: 88px;
}

#nav li#navitem7 a:hover, #nav li#navitem7 { /* second item - the li - is used to preload the rollover image */
	background: url(../images/nav_intern_over.jpg) no-repeat;
}

#nav li a { /* all list item a tags */
	display: block;
	float: left;
}

#nav li a:hover { /* all list item a tags rollover state */

}

/* SECOND LEVEL DROPDOWN CSS BEGINS HERE */

#nav li#navitem1 li a, #nav li#navitem2 li a, #nav li#navitem3 li a, #nav li#navitem4 li a, #nav li#navitem5 li a, #nav li#navitem6 li a, #nav li#navitem7 li a {
	background: url(../css%20copy/none);
	height: auto; /* needs to be set to correct the leahy image replacement menthod used above */
	width: auto;
	padding: 2px 12px;
	font-size: 11px;
}

#nav li#navitem1 li a:hover, #nav li#navitem2 li a:hover, #nav li#navitem3 li a:hover, #nav li#navitem4 li a:hover, #nav li#navitem5 li a:hover, #nav li#navitem6 li a:hover, #nav li#navitem7 li a:hover {
	background: url(../css%20copy/none);
	color: #e4bed7;
}

#nav li ul { /* second-level lists */
	background: #161616;
	clear: both;
	float: none;
	position: absolute;
	top: 200px;
	left: -999em; /* using left instead of display to hide menus because display: none isn't read by screen readers */
	z-index: 2;
	padding: 5px 0 8px 0;
}

#nav li ul li { /* second-level list items */
	clear: both;
}

#nav li ul li a { /* second-level list item a tags */
	background: #161616;
	color: #fff;
	padding: 1px 15px;
	width: 100px; /* necessary for consistent background rollover */
}

#nav li ul li a { /* second-level list item a tags rollover state */
	
}

#nav li:hover ul, #nav li.sfhover ul { /* lists nested under hovered list items */
	left: auto;
}


/* CONTENT */

#flower {
	position: absolute;
	top: 500px;
	left: 275px;
	height: 700px;
	width: 840px;
	background: url(../images/bg_lotus_lg.jpg) no-repeat;
}

#maincontent {
	position: absolute;
	top: 220px;
	left: 0px;
}

#section1 {
	margin: 0 0 0 355px;
}


h2 {
	width: 207px;
	height: 38px;
	text-indent: -9000px;
}

h2#hd_about {background: url(../images/hd_about.jpg) no-repeat;}
h2#hd_in_design {background: url(../images/hd_in_design.jpg) no-repeat;}
h2#hd_type {background: url(../images/hd_type.jpg) no-repeat;}
h2#hd_di_imag {background: url(../images/hd_di_imag.jpg) no-repeat;}
h2#hd_intro_dig_art {background: url(../images/hd_intro_dig_art.jpg) no-repeat;}
h2#hd_intro_design {background: url(../images/hd_intro_design.jpg) no-repeat;}
h2#hd_intern {background: url(../images/hd_intern.jpg) no-repeat;}

h3 {
	margin: 20px 0 0 -4px;
	width: 210px;
	height: 21px;
	text-indent: -9000px;
}


h3#sh_ab_teach {background: url(../images/sh_ab_teach.gif) no-repeat;}
h3#sh_ab_collage {background: url(../images/sh_ab_collage.gif) no-repeat;}
h3#sh_ab_col_ap {background: url(../images/sh_ab_col_ap.gif) no-repeat;}
h3#sh_ab_teach {background: url(../images/sh_ab_teach.gif) no-repeat;}
h3#sh_interface_web {background: url(../images/sh_interface_web.gif) no-repeat;}
h3#sh_int_design_brief {background: url(../images/sh_int_design_brief.gif) no-repeat;}
h3#sh_ty_hierarchy {background: url(../images/sh_ty_hierarchy.gif) no-repeat;}
h3#sh_ty_info {background: url(../images/sh_ty_info.gif) no-repeat;}
h3#sh_ty_legibility {background: url(../images/sh_ty_legibility.gif) no-repeat;}
h3#sh_ty_meaning {background: url(../images/sh_ty_meaning.gif) no-repeat;}
h3#sh_ty_let_unity {background: url(../images/sh_ty_let_unity.gif) no-repeat;}
h3#sh_ty_synthesis {background: url(../images/sh_ty_synthesis.gif) no-repeat;}
h3#sh_ty_word {background: url(../images/sh_ty_word.gif) no-repeat;}
h3#sh_di_asset {background: url(../images/sh_di_asset.gif) no-repeat;}
h3#sh_di_fantasy {background: url(../images/sh_di_fantasy.gif) no-repeat;}
h3#sh_di_spin {background: url(../images/sh_di_spin.gif) no-repeat;}
h3#sh_di_motion {background: url(../images/sh_di_motion.gif) no-repeat;}
h3#sh_ida_fantasy {background: url(../images/sh_ida_fantasy.gif) no-repeat;}
h3#sh_ida_symbolic {background: url(../images/sh_ida_symbolic.gif) no-repeat;}
h3#sh_ida_motion {background: url(../images/sh_ida_motion.gif) no-repeat;}
h3#sh_id_unity {background: url(../images/sh_id_unity.gif) no-repeat;}
h3#sh_id_symm {background: url(../images/sh_id_symm.gif) no-repeat;}
h3#sh_id_asymm {background: url(../images/sh_id_asymm.gif) no-repeat;}
h3#sh_id_figure {background: url(../images/sh_id_figure.gif) no-repeat;}
h3#sh_id_grid {background: url(../images/sh_id_grid.gif) no-repeat;}
h3#sh_id_color {background: url(../images/sh_id_color.gif) no-repeat;}

#prevnext {
	margin: 35px 0 0 0;
}

#samples {
	position: absolute;
	top: 0px;
	left: 0px
	z-index: 1;
}

#caption {
	margin: 4px 0 0 0;
	font-size: 11px;
}



