BODY {
	margin:0px;
	padding:0px;
	width:100%;
	height:100%;
	font-family:  courier new, arial, helvetica, sans;
	font-size:0.72em;
	line-height:1.25em;
	color:#ffffff;
	text-align:center;
	
	background:#000000;
	}
	
html {height:100%;background:#000000;}

IMG {border:0px;}

A 	{color:#d2b3b8;text-decoration:none;}
A:hover {color:#ffffff;}
	
H1, H2, H3, H4  {margin:0px;padding:0px;color:#372b26;}
	
H1 {font-size:160%;line-height:125%;color:#d2b3b8;letter-spacing:0.01em}
H2, H3, H4  {font-size:160%;line-height:155%;color:#d2b3b8;margin-top:5px;}
H3 {margin-top:15px;font-weight:normal;}

UL, LI {margin:0px;padding:0px;list-style-type:none;}
P {font-size:120%;line-height:155%;}

.container {width:890px;padding:50px;text-align:left;margin:auto;}

.mainNav {width:168px;float:left;display:inline;}
.mainNav IMG {display:block;}
.mainNav UL, .content UL {margin-top:50px;font-weight:bold;}
.mainNav UL LI {margin-bottom:10px;}
.mainNav UL LI A, .content UL LI A {padding-left:15px;background:url(../images/mainNav_bullet.gif) no-repeat 0px 5px;}
.mainNav UL LI A:hover, .content UL LI A:hover  {background:url(../images/mainNav_bullet_on.gif) no-repeat 0px 5px;}
.mainNav UL LI A.on {background:url(../images/mainNav_bullet_on.gif) no-repeat 0px 5px;color:#ffffff;}

.mainNav UL LI.portfolio {margin-top:20px;}


.content {width:416px;float:left;display:inline;position:relative;margin-top:90px;}


.content UL {margin-top:25px;font-weight:bold;}
.content UL LI {margin-bottom:5px;}
/*.content UL LI A,.content UL LI A:hover {background:none;padding-left:0px;}*/

.content.home {width:450px;margin-top:88px;}
.content.home H1 {font-size:280%;color:#ffffff;}
.content.home H2 {font-size:160%;line-height:120%;margin-top:40px;}

UL.clients LI A, UL.clients LI A:hover {padding-left:0px;background:none;}

.content.work {width:722px;margin-top:0px;margin-top:0px;}

.content.work .copy {width:294px;position:absolute;bottom:0px;right:0px;display:block;}
.content.work H1 {margin:0px 0px 10px 0px;}
.content.work H1.clientImageB {margin:90px 0px 10px 0px;}
.content.work H1 A {color:#ffffff;}
.content.work H1 A:hover {color:#d2b3b8;}

.michelle_pic {margin-top:16px;}
.home .michelle_pic {padding-bottom:20px;}

/* REMEMBER: change image widths back when removing border!! */
.clientImageA {width:386px;height:480px;border:4px solid #ffffff;background:#cccccc;float:left;}
.clientImageA IMG {display:block;}
.clientDescription {font-weight:bold;color:#d2b3b8;}

UL.clientImageB {float:left;display:inline;overflow:hidden;width:722px;height:359px;z-index:100;margin-top:0px;}
UL.clientImageB LI {list-style-type:none;float:left;display:inline;}
UL.clientImageB LI A{display:block;height:359px;width:74px;overflow:hidden;float:left;text-decoration:none;cursor:default;padding:0px;background:none;}
UL.clientImageB LI a.last {overflow:visible;}
UL.clientImageB LI A:hover {width:100%;padding:0px;background:none;}
UL.clientImageB IMG {display:block;border:4px solid #FFFFFF;border-right:0px;}
UL.clientImageB LI a.last IMG {border-right:4px solid #FFFFFF;}
.itemDesc {float:left;display:inline;font-weight:normal;color:#d2b3b8;}


#ribbon-mask {width:855px;height:480px;border:4px solid #ffffff;overflow:hidden;margin:30px 0 30px 0;}

/* ribbon styles
#ribbon {width:855px; background:#000000;}
#ribbon ul {margin:0;}
#ribbon li {float:left;	width: auto; height: auto;}
*/
/*li.first {padding-left:186px;}*/

/* SCROLLING */


#scrollingText div.scrollableArea *	{display:inline;margin:0;padding:0;background-color:#000;}
#scrollingText li {float:left;	width: auto; height: auto;} {}

/* Hotspots Do I need these? 
div.scrollingHotSpotLeft {min-width: 75px;width: 10%;height: 100%;background-image: url(../images/big_transparent.gif);background-repeat: repeat;background-position: center center;position: absolute;z-index: 200;left: 0;	cursor: url(../images/cursors/cursor_arrow_left.cur), w-resize;}
div.scrollingHotSpotLeftVisible {background-image: url(../images/arrow_left.gif);background-color: #fff;background-repeat: no-repeat;opacity: 0.35;	-moz-opacity: 0.35; filter: alpha(opacity = 35); zoom: 1; }
div.scrollingHotSpotRight {min-width: 75px;width: 10%;height: 100%;background-image: url(../images/big_transparent.gif);background-repeat: repeat;background-position: center center;	position: absolute;	z-index: 200;	right: 0;	cursor: url(../images/cursors/cursor_arrow_right.cur), e-resize;}
div.scrollingHotSpotRightVisible {background-image: url(../images/arrow_right.gif);	background-color: #fff;	background-repeat: no-repeat;	opacity: 0.35;	filter: alpha(opacity = 35);	-moz-opacity: 0.35;	zoom: 1;}
*/

/* The scroll wrapper is always the same width and height as the containing element (div).
   Overflow is hidden because you don't want to show all of the scrollable area.
*/
div.scrollWrapper
{
	position: relative;
	overflow: hidden;
	width: 100%;
	height: 100%;
}

div.scrollableArea
{
	position: relative;
	width: auto;
	height: 100%;
}