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

Body {
	font-family:Arial, Helvetica, sans-serif;
	font-size: 10px;
	margin:10px;
	background: #3e4018;
	behavior:url("http://www.archstonemarble.com/scripts/csshover.htc");
}

td {
	font-family:Arial, Helvetica, sans-serif;
	font-size: 11px;
	margin:0px;
}

td.sidebar {
	background:url(images/common/bkg-sidebar.jpg);
	background-repeat:no-repeat;
	background-color:#aaa27a;
}

td.content {
	background:url(images/common/bkg-content.jpg);
}

td.footer {
	color:#74734d;
}

#content {
	padding:5px;
}

label {
	margin-right: 8px;
	/*white-space:nowrap;*/
}

.preloader {
	position: absolute;
	top: 20%;
	margin-left: 220px;
	width: 500px;
	height: 300px;
	z-index: 1000;
	text-align:center;
	background:#FFFFFF;
	opacity:.9; 
	filter:alpha(opacity=90);
	display:none;
}


/* ======================================================== */
/* font settings for headings */

.sitename {
	font-family:Arial, Helvetica, sans-serif;
	font-size: 18px;
	color:#FFFFFF;
	float: left;
	padding: 5px 0px 0px 10px;
	font-style:italic;
}

.pageHeading {
	font-family:Arial, Helvetica, sans-serif;
	font-size: 18px;
	font-weight: bold;
	color:#90560a;
}

.subHeading {
	font-family:Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-weight: bold;
	color:#90560a;
}

.notes {
	font-family:Arial, Helvetica, sans-serif;
	font-size: 11px;
	color:#5E5C3E;
}

.pageNum {
	font-family:Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	color:#990000;
}

/* ======================================================== */
/* overall link settings */
a {
	color:#74734d;
	text-decoration:none;
	cursor:pointer;
}
a:hover {
	text-decoration:underline;
	color: #6A6A48;
}

/* ======================================================== */
/* Main Navigation (on top of the page) */

#mainNavi {
	font-family:Arial, Helvetica, sans-serif;
	font-size: 12px;
	float: right;
	/* width: 435px; */
	padding-right: 1px;
}

.link {
	color:#FFFFFF;
	font-weight: bold;
	text-decoration: none;
	display:block;
	padding: 5px 15px 5px 15px;
	/*border-left-width: 1px;
	border-left-style: solid;
	border-color: #cc9966;*/
	float: left;
}

.link:hover {
	background:url(images/common/bg-navi.gif);
	color:#FFFFFF;
	text-decoration: none;
}

/* ======================================================== */
/* Side Navigation for products */

#sideNavi {
	font-family:Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-weight: bold;
	width: 100%;
}


#sideNavi ul {
	list-style: none; /* Remove the bullets */
	margin: 0;
	padding: 0;
	width:120px; /* Menu width */
}
#sideNavi ul li {
	display: block; /* Make a menu item a block (height 100%, width 100%) */
	height:100%;
	width:100%;
	position: relative;
	float:left; /* Make sure (in IE) there is no margin between the menu items */
	background:url(http://www.archstonemarble.com/images/common/bkg-sideNavi-main.png);
	margin-bottom:1px;
}
#sideNavi ul li a{
	display:block; /* When rollover the menu item, the whole item will be seen as link. */
	padding: 5px 5px 5px 5px;
	color:#000000;
}

#sideNavi ul li a.special {
	display:block;
	padding: 5px 5px 5px 5px;
	color:#CC0000;
	font-weight: bold;
}

#sideNavi ul li a:hover {
	display:block;
	padding: 5px 5px 5px 5px;
	text-decoration: none;
	border-left:1px solid #fff;
	color:#FFFFFF;
}
#sideNavi ul ul {
	position: absolute;
	top: 0;
	display:none; /* Display nothing when not 'hovered' */
	width: 92px;
}
#sideNavi ul li ul li{
	background:url(http://www.archstonemarble.com/images/common/bkg-sideNavi-main2.png);
	float:left; /* Make sure (in IE) there is no margin between the menu items */
	margin-bottom:0px;
	z-index: 500;
	border-bottom: 1px solid #888800;
}
#sideNavi ul li ul li a:hover{}
#sideNavi ul li:hover ul{
	display: block; /* Make sure the submenu is displayed as blocks as well. */
	left:120px; /* Your menu width. The submenu appears there, when you hover a menu item. */
	z-index: 500;
}

/* ======================================================== */
/* Scrollable content styles */
/* root element for the scrollable.      
when scrolling occurs this element stays still.  */ 

div.scrollable {
/* required settings */
position:relative;
overflow:hidden;
width: 600px;
height:400px;
}  


/*root element for scrollable items. Must be absolutely positioned
 and it should have a super large width to accomodate scrollable items.
 it's enough that you set width and height for the root element and
 not for this element. */ 
 
 div.scrollable div.content {
 /* this cannot be too large */
 width:20000em;
 position:absolute;
 }
 
 
 /* a single item. must be floated on horizontal scrolling
 typically this element is the one that *you* will style
 the most. */ 
 
 div.scrollable div.content div {
 float:left;
 width: 600px;
 height: 400px;
 padding:5px;
 }
 
/* ======================================================== */
/* Gallery styles */

#slideshow {list-style:none; color:#fff}
#slideshow span {display:none}
#wrapper {width:550px; margin:50px auto; display:none}
#wrapper * {margin:0; padding:0}
#fullsize {position:relative; width:550px; height:400px; padding:2px; border:1px solid #ccc; background:#000}
#information {position:absolute; bottom:0; width:550px; height:0; background:#000; color:#fff; overflow:hidden; z-index:200; opacity:.7; filter:alpha(opacity=70)}
#information h3 {padding:4px 8px 3px; font-size:14px}
#information p {padding:0 8px 8px}
#image {width:500px}
#image img {position:absolute; z-index:25; width:auto}
.imgnav {position:absolute; width:25%; height:400px; cursor:pointer; z-index:150}
#imgprev {left:0; background:url(images/gallery/left.gif) left center no-repeat}
#imgnext {right:0; background:url(images/gallery/right.gif) right center no-repeat}
#imglink {position:absolute; height:306px; width:100%; z-index:100; opacity:.4; filter:alpha(opacity=40)}
.linkhover {background:url(images/gallery/link.gif) center center no-repeat}
#thumbnails {margin-top:15px}
#slideleft {float:left; width:20px; height:81px; background:url(images/gallery/scroll-left.gif) center center no-repeat; background-color:#222}
#slideleft:hover {background-color:#333}
#slideright {float:right; width:20px; height:81px; background:#222 url(images/gallery/scroll-right.gif) center center no-repeat}
#slideright:hover {background-color:#333}
#slidearea {float:left; position:relative; width:500px; margin-left:5px; height:81px; overflow:hidden}
#slider {position:absolute; left:0; height:81px}
#slider img {cursor:pointer; border:1px solid #666; padding:2px}


/* ======================================================== */
/* My Favorites pop up styles */

.bubbleInfo {
    position: relative;
	cursor:pointer;
}
.popup {
	position: absolute;
	display: none; /* keeps the popup hidden if no JS available */
	background-color:#DCDAAF;
	padding: 10px;
	text-align: left;
	border:1px solid #999900;
	width: 200px;
	height: 180px;
}

.bubbleclose {
	position: relative;
	width: 15px;
	height: 15px;
	float: right;
	margin-top: -7px;
	margin-right: -10px;
}


/* ======================================================== */
/* buttons for back office */

.delete {
	cursor: pointer; /* hand-shaped cursor */
	cursor: hand; /* for IE 5.x */
	background: none;
	border: none;
	font-weight:bold;
}

/* ======================================================== */
/* reward card cover */
#cover {
	position:relative;
	width: 600px;
	height: 120px;
	z-index: 100;
	top: -540px;
	left: 0px;
	background-color:#000000;
	text-align:right;
	color:#FFFFFF;
}

#cover a {
	color:#FFFFFF;
}

/* ======================================================== */
/* Client Support Section */