/* ################################################################# */
/*                                                                   */
/*  TITLE:        WA.CSS                                             */
/*  SITE:         weddingatelier.com                                 */
/*  AUTHOR:       Brian Maniere                                      */
/*  VERSION:      1.0                                                */
/*  LAST UPDATED: 2006/05/03                                         */
/*                                                                   */
/* ################################################################# */


/* ##### GENERAL ####################### */

html {
	font: 11px/1em "Lucida Grande", Verdana, Arial, Helvetica, sans-serif;
	color: #505153;
	background: #fff;
	}

.canvas {
	position: relative;
	left: 50%;
	margin: 41px auto 0 -390px;
	width: 780px;
	height: 567px;
	}


/* ##### HEAD ########################## */

#head {
	position: absolute;
	top: 0;
	left: 0;
	width: 780px;
	height: 155px;
	}

h1 {
	position: absolute;
	top: 0;
	left: 284px;
	background: url('../images/wa_logo_roll.gif') 0 0 no-repeat;
	}

h1, h1 a {
	width: 209px;
	height: 63px;
	}

h1 a {
	display: block;
	background: url('../images/wa_logo_grey.gif') 0 0 no-repeat;
	}

h1 a:hover {
	background: transparent;
	text-decoration: none;
	}

/* ===== NAV =========================== */

#nav {
	position: absolute;
	top: 104px;
	left: 0;
	padding-left: 12px;
	border-bottom: 1px solid #d0cbdb;
	width: 780px;
	height: 24px;
	background: #efeef5;
	voice-family: "\"}\"";
	voice-family: inherit;
	width: 768px;
	}

html>body #nav {
	width: 768px;
	}
	
#head #nav li, #head #nav a {
	display: block;
	float: left;
	height: 24px;
	}

.home {	width: 60px;	background: url('../images/home_a.gif') 0 0 no-repeat; }
.home a {	width: 60px;	background: url('../images/home.gif') 0 0 no-repeat; }

.dresses {	width: 70px;	background: url('../images/dresses_a.gif') 0 0 no-repeat; }
.dresses a {	width: 70px;	background: url('../images/dresses.gif') 0 0 no-repeat; }

.shoes {	width: 62px;	background: url('../images/shoes_a.gif') 0 0 no-repeat; }
.shoes a {	width: 62px;	background: url('../images/shoes.gif') 0 0 no-repeat; }

.accessories {	width: 92px;	background: url('../images/access_a.gif') 0 0 no-repeat; }
.accessories a {	width: 92px;	background: url('../images/access.gif') 0 0 no-repeat; }

.events {	width: 66px;	background: url('../images/events_a.gif') 0 0 no-repeat; }
.events a {	width: 66px;	background: url('../images/events.gif') 0 0 no-repeat; }

.experience {	width: 122px;	background: url('../images/exper_a.gif') 0 0 no-repeat; }
.experience a {	width: 122px;	background: url('../images/exper.gif') 0 0 no-repeat; }

.resources {	width: 84px;	background: url('../images/resources_a.gif') 0 0 no-repeat; }
.resources a {	width: 84px;	background: url('../images/resources.gif') 0 0 no-repeat; }

.media {	width: 99px;	background: url('../images/media_a.gif') 0 0 no-repeat; }
.media a {	width: 99px;	background: url('../images/media.gif') 0 0 no-repeat; }

.appointments {	width: 102px;	background: url('../images/appoint_a.gif') 0 0 no-repeat; }
.appointments a {	width: 102px;	background: url('../images/appoint.gif') 0 0 no-repeat; }

.contact {	width: 76px;	background: url('../images/contact_a.gif') 0 0 no-repeat; }
.contact a {	width: 76px;	background: url('../images/contact.gif') 0 0 no-repeat; }

#home .home a, #dresses .dresses a, #shoes .shoes a, #accessories .accessories a, #events .events a, #experience .experience a, #resources .resources a, #media .media a, #appointments .appointments a, #contact .contact a, #nav a:hover {
	background: transparent;
	text-decoration: none;
	}

/* ===== CRUMBS ======================== */

#crumbs {
	position: absolute;
	top: 134px;
	left: 0;
	width: 780px;
	height: 15px;
	background: #f6f4f4;
	font-size: 9px;
	text-align: left;
	}

#crumbs li {
	float: left;
	padding: 2px 10px 0 15px;
	background: url('../images/arrow_c.gif') 0 6px no-repeat;
	}
	
#crumbs li.first {
	padding-left: 30px;
	background: transparent;
	}
	
#crumbs li a {
	float: left;
	display: block;
	}

/* ##### MAIN ########################## */

#main {
	position: absolute;
	top: 149px;
	left: 0;
	border: 1px solid #ede9e9;
	width: 780px;
	height: 336px;
	voice-family: "\"}\"";
	voice-family: inherit;
	width: 778px;
	height: 334px;
	}

html>body #main {
	width: 778px;
	height: 334px;
	}

#home #main {
	height: 370px;
	background: #b2a9c2;
	voice-family: "\"}\"";
	voice-family: inherit;
	height: 368px;
	}

html>body #home #main {
	height: 368px;
	}

/* ***** COPY ************************** */

#copy {
	position: absolute;
	top: 10px;
	left: 487px;
	width: 276px;
	height: 314px;
	z-index: 1;
	}
	
#copy .scroll {
	top: 51px;
	right: 0;
	}

#copy p {
	line-height: 16px;
	}

/* ***** SHOWCASE ********************** */

#showcase {
	position: absolute;
	top: 0;
	left: 0;
	width: 459px;
	height: 334px;
	z-index: 0;
	}

#showcase img {
	position: absolute;
	top: 0;
	left: 29px;
	}

#showcase .scroll {
	top: 103px;
	right: 0;
	border: 0;
	padding: 10px 8px 10px 30px;
	width: 430px;
	height: 234px;
	voice-family: "\"}\"";
	voice-family: inherit;
	width: 392px;
	height: 214px;
	}

html>body #showcase .scroll {
	width: 392px;
	height: 214px;
	}

/* ===== CONTAINER ===================== */

.container {
	position: absolute;
	top: 50px;
	right: 0;
	padding-right: 10px;
	width: 276px;
	overflow: auto;
	voice-family: "\"}\"";
	voice-family: inherit;
	width: 266px;
	}

html>body .container {
	width: 266px;
	}

/* ===== EMPATHOMETER ================== */

#empathometer {
	position: absolute;
	top: 0;
	left: 0;
	width: 389px;
	height: 360px;
	}

#empath {
	background: url('../images/stripe_tile.gif') 0 0 repeat;
	}

#interface img {
	position: absolute;
	top: 332px;
	left: 60px;
	}

#interface ul {
	position: absolute;
	top: 338px;
	left: 210px;
	height: 17px;
	}

#interface li {
	float: left;
	width: 26px;
	height: 17px;
	}

#interface a {
	float: left;
	display: block;
	width: 17px;
	height: 17px;
	}

#interface ul img {
	position: static;
	}

#interface .romantic {	background: url('../images/pinkdot_3d.gif') 0 0 no-repeat; }
#interface .romantic a {	background: url('../images/pinkdot.gif') 0 0 no-repeat; }
.romantic #interface .romantic a {	background: transparent; }

#interface .dreamy {	background: url('../images/yeldot_3d.gif') 0 0 no-repeat; }
#interface .dreamy a {	background: url('../images/yeldot.gif') 0 0 no-repeat; }
.dreamy #interface .dreamy a {	background: transparent; }

#interface .glamorous {	background: url('../images/grndot_3d.gif') 0 0 no-repeat;	}
#interface .glamorous a {	background: url('../images/grndot.gif') 0 0 no-repeat;	}
.glamorous #interface .glamorous a {	background: transparent; }

#interface .happy {	background: url('../images/bldot_3d.gif') 0 0 no-repeat; }
#interface .happy a {	background: url('../images/bldot.gif') 0 0 no-repeat; }
.happy #interface .happy a {	background: transparent; }

#interface .beautiful {	background: url('../images/lilacdot_3d.gif') 0 0 no-repeat; }
#interface .beautiful a {	background: url('../images/lilacdot.gif') 0 0 no-repeat; }
.beautiful #interface .beautiful a {	background: transparent; }

#interface ul li a:hover {	background: transparent; text-decoration: none; }

/* ===== LINKAREA ========================= */

#linkarea_home {
	margin-left: 100px;
	margin-top: 150px;
	bottom: 4px;
	right: 0;
	}
#linkarea_home li {
	width: 200px;
	padding-bottom: 8px;
	height: auto;
	font-family: Trebuchet, "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 10px;
	text-transform: uppercase;
	}
#linkarea_home .arrows li, #linkarea_home .arrow {
	background: url('../images/arrow.gif') 0 1px no-repeat;
	margin-top: 6px;
	}

#linkarea {
	position: absolute;
	bottom: 4px;
	right: 0;
	}

#linkarea, #linkarea p {
	font-size: 10px;
	line-height: 10px !important;
	}

#linkarea li {
	padding-bottom: 8px;
	height: auto;
	font-family: Trebuchet, "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 10px;
	text-transform: uppercase;
	}

/* ===== SCROLL ======================== */

.scroll {
	position: absolute;
	border: 1px solid #cfced4;
	padding: 9px 8px 10px 10px;
	width: 274px;
	height: 196px;
	overflow: auto;
	background: #fafafa;
	voice-family: "\"}\"";
	voice-family: inherit;
	width: 256px;
	height: 177px;
	}

html>body .scroll {
	width: 256px;
	height: 177px;
	}

* html .scroll {
	padding-top: 8px;
	height: 178px;
	}

/* ~~~ APPOINTMENTS ~~~~~~~~~~~~~~~~~~~~ */

#appointments #showcase {
	background: #f4b6d0;
	}

#appointments #fill {
	position: absolute;
	top: 0;
	left: 30px;
	border: 1px solid #f4b6d0;
	width: 428px;
	height: 332px;
	overflow: auto;
	background: #fff7fc;
	}

#appointments #copy .container {
	height: 258px;
	}

/* - - FORM:APPOINTMENT  - - - - - - - - */

#frmAppointment, #frmAppointment #submit {
	position: absolute;
	font-size: 9px;
	line-height: 12px;
	color: #8d3964;
	}

#frmAppointment {
	top: 18px;
	left: 20px;
	width: 388px;
	height: 305px;
	}

#frmAppointment #one, #frmAppointment #two {
	position: absolute;
	top: 0;
	width: 184px;
	}

#frmAppointment #one {
	left: 0; 
	}

#frmAppointment #two {
	right: 0;
	}

#frmAppointment fieldset {
	margin-bottom: 8px;
	}

#frmAppointment input, #txtStylePrefs {
	margin-top: 2px;
	height: 16px;
	}

#frmAppointment #contactInfo {
	text-align: right;
	}

#frmAppointment #contactInfo input {
	margin: 2px 0 0 5px;
	width: 122px;
	voice-family: "\"}\"";
	voice-family: inherit;
	width: 118px;
	}

html>body #frmAppointment #contactInfo input {
	width: 118px;
	}

* html #frmAppointment #contactInfo input {
	margin-top: 0;
	}

#frmAppointment #shoppingList {
	margin-top: 5px;
	}

#frmAppointment #shoppingList input {
	margin: 2px 5px 0 10px;
	padding: 0;
	width: 13px;
	height: 13px;
	}

#frmAppointment #txtWhen {
	width: 180px;
	}

#frmAppointment #txtCompany {
	width: 180px;
	}

#frmAppointment #occasionInfo {
	margin-top: 5px;
	text-align: right;
	}

#frmAppointment #occasionInfo input {
	margin: 2px 0 0 5px;
	width: 117px;
	voice-family: "\"}\"";
	voice-family: inherit;
	width: 112px;
	}

html>body #frmAppointment #occasionInfo input {
	margin-top: 2px;
	width: 112px;
	}

* html #frmAppointment #occasionInfo input {
	margin-top: 0;
	}

#frmAppointment #dressPrefs input {
	margin-top: 2px;
	width: 180px;
	}

* html #frmAppointment #dressPrefs input {
	margin-top: 0;
	}

#frmAppointment #dressPrefs #txtStylePrefs {
	margin-top: 2px;
	width: 180px;
	height: 34px;
	overflow: auto;
	}

* html #frmAppointment #dressPrefs #txtStylePrefs {
	margin-top: 0;
	width: 180px;
	}

#frmAppointment #prospect_source {
	margin-top: 5px;
	width: 180px;
	}

#frmAppointment #prospect_source input {
	margin: 2px 5px 0 10px;
	padding: 0;
	height: 13px;
	}

#frmAppointment #submit {
	top: 378px;
	left: 220px;
	width: 60px;
	height: 21px;
	padding-bottom: 25px;
	}

#frmAppointment h5 {
	text-align: left;
	margin-top: 0;
	}

/* tables
----------------------------------------------- */

table {
	border-collapse:collapse;
	border:0;
	margin:10px 20px 10px 0px;
	padding:5px;
	}
	
table th {
	background-color:#ccc;
	color:#fff;
	vertical-align:middle;
	text-transform:uppercase;
	font: bold 12px "Lucida Grande", Verdana, Arial, Helvetica, sans-serif;
	padding: 10px 0;
	border:1px solid #999;
	}	

table tr {
	vertical-align:top;
	border-bottom:1px solid #ccc;
	}
	
table tr.rowone {
	}	
	
table tr.rowtwo {
	background-color:#f3f3f3;
	}
	
table td {
	padding:5px;
	border:1px dotted #ccc;
	}

table td.designer {
	padding:5px;
	border:1px dotted #ccc;
	color:#534d75;
	font-weight:bold;
	}



/* ~~~ CONTACT ~~~~~~~~~~~~~~~~~~~~~~~~~ */

#contact #showcase {
	background: #f4b6d0;
	}

#contact #fill {
	position: absolute;
	top: 0;
	left: 30px;
	border: 1px solid #f4b6d0;
	width: 428px;
	height: 332px;
	background: #fff7fc;
	}

#contact p {
	font-size: 11px;
	line-height: 13px;
	}

/* - - FORM:CONTACT  - - - - - - - - - - */

#frmContact, #frmContact #txtName, #frmContact #lName, #frmContact #txtEmail, #frmContact #lEmail, #frmContact #txtMsg, #frmContact #lMsg, #frmContact #submit {
	position: absolute;
	font-size: 11px;
	color: #8d3964;
	}

#frmContact {
	top: 72px;
	right: 58px;
	}

#frmContact #txtName {
	top: 0;
	right: 0;
	width: 250px;
	}

#frmContact #lName {
	top: 3px;
	}

#frmContact #txtEmail {
	top: 33px;
	right: 0;
	width: 250px;
	}

#frmContact #lEmail {
	top: 36px;
	}

#frmContact #txtMsg {
	top: 66px;
	right: 0;
	width: 250px;
	height: 91px;
	}

#frmContact #lMsg {
	top: 69px;
	}

#frmContact #lName, #frmContact #lEmail, #frmContact #lMsg {
	right: 262px;
	height: 14px;
	}

#frmContact #submit {
	top: 176px;
	right: 0;
	width: 60px;
	height: 21px;
	}

#frmContact span {
	text-decoration: underline;
	}

/* ~~~ DRESSES ~~~~~~~~~~~~~~~~~~~~~~~~~ */

#dresses #showcase {
	background: #e69057;
	}
	
#dresses .scroll {
	height: 135px;
	}

#dresses .container {
	height: 191px;
	}

#dresses #linkarea {
	margin-right: -15px;
	width: 291px;
	}

#dresses #linkarea li {
	float: left;
	width: 145px;
	voice-family: "\"}\"";
	voice-family: inherit;
	width: 134px;
	}

html>body #dresses #linkarea li {
	width: 134px;
	}

/* --- DRESSES:WEDDINGDRESSES ---------- */

#weddingDresses #showcase {
	background: #f4b6d0;
	}
	
#weddingDresses h3 {
	margin-top: 5px;
	}

#weddingDresses .container {
	height: 110px;
	}
	
#weddingDresses .scroll {
	height: 95px;
	}

#weddingDresses #linkarea {
	height: 133px;
	}

#weddingDresses #linkarea li {
	width: 135px;
	voice-family: "\"}\"";
	voice-family: inherit;
	width: 124px;
	}

html>body #weddingDresses #linkarea li {
	width: 124px;
	}

#weddingDresses #linkarea .one {
	position: absolute;
	bottom: 0;
	right: 145px;
	width: 145px;
	}

#weddingDresses #linkarea .two {
	position: absolute;
	bottom: 18px; /*this had been set to 0; was changed when we removed a designer and everything moved down */
	right: 0;
	width: 145px;
	}

/* - - DRESSES:WEDDINGDRESSES:DESIGNER - */

#designer #showcase {
	background: #fcc;
	}
	
#designer .container {
	height: 227px;
	}

#designer #linkarea li {
	float: right;
	padding-right: 30px;
	width: auto;
	font-size: 11px;
	text-transform: none;
	}
	
/* --- DRESSES:CHINESEDRESSES ---------- */

#chineseDresses #showcase {
	background: #9c811b;
	}

#chineseDresses .container {
	height: 150px;
	}	
	
#chineseDresses .scroll {
	height: 165px;
	}
		
#chineseDresses #linkarea {
	bottom: 5px;
	right: 0;
	margin-right: -15px;
	width: 290px;
	}

#chineseDresses #linkarea li {
	float: left;
	width: 145px;
	voice-family: "\"}\"";
	voice-family: inherit;
	width: 134px;
	}
	
#chineseDresses h3 {
	margin-top: 12px;
	}

html>body #chineseDresses #linkarea li {
	width: 134px;
	}

/* - - DRESSES:CHINESEDRESSES:DESIGNER - */

#designer #showcase {
	background: #fcc;
	}
	
#designer .container {
	height: 160px;
	}

#designer #linkarea li {
	float: right;
	padding-right: 30px;
	width: auto;
	font-size: 11px;
	text-transform: none;
	}
	
/* --- DRESSES:MOTHEROFTHEBRIDE ---------- */

#mob #showcase {
	background: #d3d0b6;
	}

#mob .container {
	height: 150px;
	}	
	
#mob .scroll {
	height: 165px;
	}
		
#mob #linkarea {
	bottom: 5px;
	right: 0;
	margin-right: -15px;
	width: 290px;
	}

#mob #linkarea li {
	float: left;
	width: 145px;
	voice-family: "\"}\"";
	voice-family: inherit;
	width: 134px;
	}
	
#mob h3 {
	margin-top: 12px;
	}

html>body #mob #linkarea li {
	width: 134px;
	}

/* - - DRESSES:MOTHEROFTHEBRIDE:DESIGNER - */

#designer #showcase {
	background: #fcc;
	}
	
#designer .container {
	height: 227px;
	}

#designer #linkarea li {
	float: right;
	padding-right: 30px;
	width: auto;
	font-size: 11px;
	text-transform: none;
	}
	
/* --- DRESSES:SPECIALOCCASION ---------- */

#special #showcase {
	background: #99212b;
	}

#special .container {
	height: 145px;
	}	
	
#special .scroll {
	height: 145px;
	}
		
#special #linkarea {
	bottom: 5px;
	right: 0;
	margin-right: -15px;
	width: 290px;
	}

#special #linkarea li {
	float: left;
	width: 145px;
	voice-family: "\"}\"";
	voice-family: inherit;
	width: 134px;
	}
	
#special h3 {
	margin-top: 12px;
	}

html>body #special #linkarea li {
	width: 134px;
	}

/* - - DRESSES:SPECIALOCCASION:DESIGNER - */

#designer #showcase {
	background: #655c9b;
	}
	
#designer .container {
	height: 227px;
	}

#designer #linkarea li {
	float: right;
	padding-right: 30px;
	width: auto;
	font-size: 11px;
	text-transform: none;
	}
	
/* --- DRESSES:BRIDESMAID ---------- */

#bridesmaid #showcase {
	background: #fcc;
	}

#bridesmaid .container {
	height: 150px;
	}	
	
#bridesmaid .scroll {
	height: 165px;
	}
		
#bridesmaid #linkarea {
	bottom: 5px;
	right: 0;
	margin-right: -15px;
	width: 290px;
	}

#bridesmaid #linkarea li {
	float: left;
	width: 145px;
	voice-family: "\"}\"";
	voice-family: inherit;
	width: 134px;
	}
	
#bridesmaid h3 {
	margin-top: 12px;
	}

html>body #bridesmaid #linkarea li {
	width: 134px;
	}

/* - - DRESSES:CHINESEDRESSES:DESIGNER - */

#designer #showcase {
	background: #fcc;
	}
	
#designer .container {
	height: 160px;
	}

#designer #linkarea li {
	float: right;
	padding-right: 30px;
	width: auto;
	font-size: 11px;
	text-transform: none;
	}

/* ~~~ ACCESSORIES ~~~~~~~~~~~~~~~~~~~~~~~~~ */

#accessories #showcase {
	background: #bfd3e0;
	}	
	
#accessories .scroll {
	height: 150px;
	}
		
#accessories #linkarea {
	bottom: 5px;
	right: 0;
	margin-right: -15px;
	width: 290px;
	}

#accessories #linkarea li {
	float: left;
	width: 145px;
	voice-family: "\"}\"";
	voice-family: inherit;
	width: 134px;
	}
	
#accessories h3 {
	margin-top: 12px;
	}

html>body #accessories #linkarea li {
	width: 134px;
	}
	

/* --- ACCESSORIES: DESIGNER  --------- */

#accessories #designer #showcase {
	background: #fcc;
	}
	
#accessories #designer #linkarea {
	bottom: 0;
	margin-right: 0;
	}

#accessories #designer #linkarea li {
	float: right;
	width: auto;
	font-size: 11px;
	text-transform: none;
	}
	
	
/* ~~~ SHOES ~~~~~~~~~~~~~~~~~~~~~~~~~ */

#shoes #showcase {
	background: #c3c0d9;
	}
		
#shoes #linkarea {
	bottom: 5px;
	right: 0;
	margin-right: -15px;
	width: 290px;
	}

#shoes #linkarea li {
	float: left;
	width: 145px;
	voice-family: "\"}\"";
	voice-family: inherit;
	width: 134px;
	}
	
#shoes h3 {
	margin-top: 12px;
	}

html>body #shoes #linkarea li {
	width: 134px;
	}


/* --- SHOES: DESIGNER  --------- */

#shoes #designer #showcase {
	background: #fcc;
	}
	
#shoes #designer #linkarea {
	bottom: 0;
	margin-right: 0;
	}

#shoes #designer #linkarea li {
	float: right;
	width: auto;
	font-size: 11px;
	text-transform: none;
	}

/* ~~~ EVENTS ~~~~~~~~~~~~~~~~~~~~~~~~~~ */

#events #showcase {
	line-height: 16px;
	background: #d1f0f5;
	}

#events .scroll {
	padding-top: 7px;
	}

#events #showcase #deco {
	border-bottom: 1px solid #c1bab3;
	}

#events #showcase img {
	position: static;
	float: right;
	}

#events #fill {
	position: absolute;
	top: 0;
	left: 460px;
	width: 319px;
	height: 334px;
	background: url('../images/sketches.jpg') 1px 2px no-repeat;
	}
	
#events #sale {
	position: absolute;
	top: 0;
	left: 460px;
	width: 319px;
	height: 334px;
/*background: url('../images/sketches.jpg') 1px 2px no-repeat;*/
	}

#events h2 {
	margin-top: 20px;
	}

#events h3 {
	margin-top: 31px;
	}

#events .container {
	top: 104px;
	height: 210px;
	}

#events h5 {
	margin-top: 7px;
	font-size: 12px;
	}

#events .arrow {
	margin-left: 15px;
	}

#events .arrows {
	float: right;
	margin-top: 7px;
	}

#events #copy {
	top: 0;
	left: 30px;
	}

#events #copy h5 {
	margin-top: 0;
	font-size: 11px;
	line-height: 16px;
	}

/* ~~~ EXPERIENCE ~~~~~~~~~~~~~~~~~~~~~~ */

/*-- We removed two sub-sections in the Experience  section for launch. Below are the rules which would be used if there were 6 instead of 4 sections
	#experience #linkarea {
	margin-right: -10px;
	width: 286px;
	}

#experience #linkarea li {
	float: left;
	padding-left: 8px;
	width: 92px;
	voice-family: "\"}\"";
	voice-family: inherit;
	width: 84px;
	}

html>body #experience #linkarea li {
	width: 84px;
	}

#experience #linkarea li.w {
	width: 102px;
	voice-family: "\"}\"";
	voice-family: inherit;
	width: 94px;
	}

html>body #experience #linkarea li.w {
	width: 94px;
	} */

/*These are the rules for 4 sections, borrowed from Shoes */

#experience #linkarea {
	bottom: 5px;
	right: 0;
	margin-right: -15px;
	width: 290px;
	}

#experience #linkarea li {
	float: left;
	width: 145px;
	voice-family: "\"}\"";
	voice-family: inherit;
	width: 134px;
	}
	
#experience h3 {
	margin-top: 12px;
	}

html>body #experience #linkarea li {
	width: 134px;
	}

#experience #showcase {
	background: #d5b3c2;
	}

/* --- EXPERIENCE: SUBSECTION  --------- */

#experience #sub #showcase {
	background: #fcc;
	}
	
#experience #sub #linkarea {
	bottom: 0;
	margin-right: 0;
	}

#experience #sub #linkarea li {
	float: right;
	width: auto;
	font-size: 11px;
	text-transform: none;
	}

/* ~~~ HOME ~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

#home #copy {
	top: 0;
	left: 389px;
	width: 389px;
	height: 318px;
	background: url('../images/stripe_tile.gif') 0 0 repeat;
	}

#badge {
	position: absolute;
	top: 73px;
	left: 104px;
	background: url('../images/stripe_tile_badge.gif') -4px 0 repeat;
	}

#home #linkarea {
	top: 211px;
	left: 229px;
	width: 135px;
	text-transform: none;
	}

#home #linkarea li {
	padding-bottom: 0;
	font-size: 12px !important;
	line-height: 14px;
	text-transform: none;
	}

#home #linkarea p {
	margin-top: 6px;
	line-height: 12px !important;
	}

/* ~~~ MEDIA ~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

#media #showcase {
	background: #b2cdd6;
	}

#media #copy .scroll {
	height: 220px;
	voice-family: "\"}\"";
	voice-family: inherit;
	height: 200px;
	}

html>body #media #copy .scroll {
	height: 200px;
	}

#media #linkarea li {
	padding-right: 15px;
	text-transform: none;
	font-size: 11px;
	font-family: "Lucida Grande", Verdana, Arial, Helvetica, sans-serif;
	}
	
/* ~~~ RESOURCES ~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

#resources #showcase {
	background: #655385;
	}

#resources #copy .scroll {
	height: 220px;
	voice-family: "\"}\"";
	voice-family: inherit;
	height: 200px;
	}

html>body #resources #copy .scroll {
	height: 200px;
	}

#resources #linkarea li {
	padding-right: 15px;
	text-transform: none;
	font-size: 11px;
	font-family: "Lucida Grande", Verdana, Arial, Helvetica, sans-serif;
	}


/* ##### FOOT ########################## */

#foot {
	position: absolute;
	top: 489px;
	width: 780px;
	border-top: 6px solid #b9b8bd;
	padding-top: 13px;
	height: 45px;
	font-size: 9px;
	line-height: 11px;
	text-align: center;
	}

* html #foot {
	width: 776px;
	}
	
#foot p {
	display: inline;
	margin-right: 4px;
	}

#foot p.section {
	margin-top: 3px;
	display: block;
	width: 100%;
	}

#foot a {
	padding-left: 4px;
	}

#home #foot {
	top: 527px;
	border-top: 0;
	}

/* ##### UTIL ########################## */

.inline, .inline li {
	display: inline;
	}

.nocss {
	display: none;
	}

.quote, .quoted {
	margin-top: 8px;
	font-size: 10px;
	line-height: 15px !important;
	}

.quoted {
	margin-top: 7px;
	text-align: right;
	font-style: italic;
	}

.right {
	float: right;
	margin-left: 10px
	}

* html .right {
	margin-left: 5px;
	}

body, div, h1, h2, h3, h4, h5, h6, p, span, ul, li, fieldset, input, img {
	margin: 0;
	padding: 0;
	}

fieldset {
	border: 0;
	}

h2 {
	margin-bottom: -6px;
	}

h3 {
	margin-bottom: 15px;
	}

h4 {
	margin: 14px 0 2px;
	font-size: 12px;
	font-weight: bold;
	line-height: 16px;
	}

h5 {
	margin-top: 5px;
	font-size: 11px;
	line-height: 14px;
	}

h6 {
	margin-top: 2px;
	font-size: 10px;
	line-height: 12px;
	font-weight: bold;
	}

p.section {
	margin-top: 12px;
	margin-right: 0;
	}

p.gap {
	margin-left: 1px;
	margin-right: 0;
	}

li {
	list-style: none;
	}

.arrows li, .arrow {
	padding-left: 11px;
	background: url('../images/arrow.gif') 0 2px no-repeat;
	}

#linkarea .arrows li, #linkarea .arrow {
	background: url('../images/arrow.gif') 0 1px no-repeat;
	}

img {
	border: 0;
	}

a {
	color: #36739b;
	text-decoration: none;
	}

a:visited {
	color: #9282b0;
	}

a:hover {
	color: #e69057;
	text-decoration: underline;
	}
	
a:active {
	color: #e69057;
	}