﻿/***********************************************************
 *
 *  File:     traders.css
 *  Author:   MetaDesign
 *  Created:  February 13, 2007
 *
 *  Description:
 *  Stylesheet for Shangri-La Web site.
 *  Styles for hotel pages.
 *  Styles are organized into the following groups:
 *
 *  - HTML Elements
 *  - Form
 *  - Titles
 *  - Top Banner
 *  - Top Nav
 *  - Main Area
 *  - Left Nav
 *  - Middle Area
 *  - Footer
 *  - Banners
 *  - Rules
 *  - Lists
 *  - Gallery & Map
 *  - Spinner
 *  - Lightbox
 *  - Listing Table
 *
 *  Colors:
 *  - xxxxxx - background
 *  
 *
 **********************************************************/

/* ************************ */
/* Base Style Sheet Imports */
/* ************************ */

@import "/style/basic.css";
 
/* ************* */
/* HTML Elements */
/* ************* */

/* default body styles */
body {
  color:                #290502;
  background:           #463c33 url('/images/background/bg_traders.gif') top left repeat-x;
}

/* selective overrides for home page */
body#homepage {
  background:           #3f2e1a url('/images/background/bg_home.gif') top left repeat-x;
}
 
/* selective overrides for landing pages */
body.landing {
  background:           #463c33 url('/images/background/bg_traders_landing.gif') top left repeat-x;
}

/* selective overrides for detail pages */
body.detail {
  color:                #290502;
  background:           #463c33 url('/images/background/bg_traders.gif') top left repeat-x;
}

/* selective overrides for find hotel page */
body.find {
  background:           #3c2818 url('/images/background/bg_find_hotel.gif') top left repeat-x;
}

/*
Background color for lightbox page
- Only seen if the lightbox fails and shows as a separate window.
*/
body#lbPage {
  background:           #463c33;
}

body#fullpage {
  /*background:         #554c41;*/
  background:           #463c33 url("/images/background/bg_progress_traders.gif") top left repeat-x;
}

a {
  color:                #ffffff;
}
a.footer {
  color:                #c7b79f;
}
a.footer2 {
  color:                #7b7369;
}
a.topBanner {
  color:                #ffffff;
}
a.topBanner:active {
  color:                #b8b4aa;
}
a.selected { 
  color:                #b8b4aa;
}
a.darkLink  {   
  color:                #290502;
}

/* ************* */
/* Form		 	     */
/* ************* */

input,
select,
textarea {
  background:           #ebe9e7;
  border-top:           1px solid #cbc6b6;
  border-right:         1px solid #ccc6b7;
  border-bottom:        1px solid #d8d5cb;
  border-left:          1px solid #cbc6b7;
}

.formSubhead {
  color:                #ffffff;
}

.formError ,
.formErrorRef {
  color:                #660000;
}

/* treatment for indicating header for default saved credit card */
.formCcDefaultHead {
  background:           #756C63;
}
.formCcAlternateHead {
  border:               1px solid #756C63;
  border-bottom:        0px;
}

/* treatment for indicating default saved credit card */
.formCcDefault,
.formCcAlternate {
  border:               1px solid #6F6353;
}

/* ************* */
/* Titles (delete) - repeated in basic.css - 
/* this section should only include colors - */
/* ************* */

.title1 {
  font-size:            18px;
}
.title2 {
  font:                 14px georgia,serif;
  margin:               0px 0px 8px 0px;
}
.title3 {
  font:                 10px verdana,geneva,sans-serif;
}
.title4 {
  color:                #ffffff;
}
.title5 {
  font:                 bold 10px verdana,geneva,sans-serif;
  margin:               0px 0px 8px 0px;
}

/* ************* */
/* Top Banner   */
/* ************* */

.pattern {
  background:           url('/images/background/bg_traders_pattern.jpg') top left repeat-x;
}

.topBanner {
  color:                #b8b4aa;
}

#home, 
#home a {
  color:                #ffffff;
}

#lang,
#lang a {
  color:                #b8b4aa;
}

a.topNavBar {
  color:                #ffffff;
}

a.topNavBarSm:hover {
  background:           url('/images/nav/main_nav_sm_traders.jpg') top center no-repeat;
  color:                #b8b4aa;
}

a.topNavBarMd:hover {
  background:           url('/images/nav/main_nav_md_traders.jpg') top center no-repeat;
  color:                #b8b4aa;
}

a.topNavBarLg:hover {
  background:           url('/images/nav/main_nav_lg_traders.jpg') top center no-repeat;
  color:                #b8b4aa;
}

a.topNavBarSmSelected {
  background:           url('/images/nav/main_nav_sm_traders.jpg') top center no-repeat;
  color:                #b8b4aa;
}

a.topNavBarMdSelected {
  background:           url('/images/nav/main_nav_md_traders.jpg') top center no-repeat;
  color:                #b8b4aa;
}

a.topNavBarLgSelected {
  background:           url('/images/nav/main_nav_lg_traders.jpg') top center no-repeat;
  color:                #b8b4aa;
}

/******************/

#address {
  color:                #b8b4aa;
}

/* ************* */
/* Top Nav     */
/* ************* */

#topNavBar {
  color:                #b8b4aa;
  background:           #352f27;
}

/* ************* */
/* Main Area     */
/* ************* */

#gallery, .enlargedPhotoLB {
  background:           #878077;
}

/* ************* */
/* Left Nav      */
/* ************* */

td.leftNavContainer {
  background:           #878077;
}

a.leftNav:hover,
a.leftNavSelected {
  color:                #b8b4aa;
  background:           url("/images/nav/left_nav_highlight_traders.jpg") top left repeat-y;
}

.leftNavHeader  {
  color:                #290502;
}

/* ************* */
/* Middle Area   */
/* ************* */

td.middleAreaContainer {
  background:           #878077;
}

td.middleAreaContainerData {
  background:           #aaa49d;
  color:                #290502;
}

/* when using as top anchor need to have color specified */
.detailTitle {
  color:                #290502;
}

.rightContentArea .pageTitle,
.rightContentArea .pageTitle a.anchor,
.middleAreaContainer .pageTitle,
.middleAreaContainer .pageTitle a.anchor {
  color:                #290502;
}

.rightContentAreaData .pageTitle,
.rightContentAreaData .pageTitle a.anchor,
.rightContentAreaDataNoBottomPad .pageTitle,
.rightContentAreaDataNoBottomPad .pageTitle a.anchor,
.middleAreaContainerData .pageTitle,
.middleAreaContainerData .pageTitle a.anchor {
  color:                #290502;
}


/* buttons */

a.btn,
a.btnCancel,
a.btnDisabled {
  text-decoration:      none;
  color:                #b8b4aa;
  height:               12px;
  display:              block;
  padding:              1px 12px 2px 23px;
  font:					        9px verdana,geneva,sans-serif;
}
a.btn {
  background:           #352f27 url("/images/common/btn_traders.gif") top left no-repeat;
}
a.btnCancel {
  background:           #574e43 url("/images/common/btn_cancel_traders.gif") top left no-repeat;
}
/* disabled button assumes hover style of cancel btn */
a.btnDisabled {
  background:           #574e43 url("/images/common/btn_cancel_traders.gif") 0px -15px no-repeat;
}
a.btnDisabled:hover,
a.btnDisabled:active {
  cursor:               default;
  text-decoration:      none;
}

a.btn:hover,
a.btn:active,
a.btnCancel:hover,
a.btnCancel:active {
  text-decoration:      none;
  background-position:  0px -15px;
}
a.btn:hover,
a.btn:active {
  background-color:     #484038;
}
a.btnCancel:hover,
a.btnCancel:active {
  background-color:     #655d52;
}

.darkTitleBand  {
  height:               14px;
  background-color:     #756c63;
  color:                #b8b427;
  font:                 bold 9px verdana,geneva,sans-serif;
  line-height:          14px;
  margin:               10px -10px 10px -10px;
  padding:              1px 0px 2px 10px;
  
}

/*******************************************************************/

/* proposed replacement for above two styles - "light" and dark" */
.titleBand,
.titleBandNoMarginBtm,
.titleBandNoMarginTop,
.titleBand a.anchor {
  height:               14px;
  background:           #a59e94;
  font:                 bold 9px/14px verdana,geneva,sans-serif;
  padding:              1px 0px 2px 0px;
}
#contentAreaData .titleBand,
#contentAreaDataFixedHeight .titleBand,
#middleAreaData .titleBand,
#rightContentAreaData .titleBand,
#rightContentAreaDataNoBottomPad .titleBand,
#contentAreaData .titleBandNoMarginBtm,
#contentAreaDataFixedHeight .titleBandNoMarginBtm,
#middleAreaData .titleBandNoMarginBtm,
#rightContentAreaDataNoBottomPad .titleBandNoMarginBtm,
#contentAreaData .titleBandNoMarginTop,
#contentAreaDataFixedHeight .titleBandNoMarginTop,
#middleAreaData .titleBandNoMarginTop,
#rightContentAreaData .titleBandNoMarginTop,
#rightContentAreaDataNoBottomPad .titleBandNoMarginTop {
  background:           #756c63;
  color:                #b8b4aa;
}
/* tr.titleBand cannot have these styles! */
#contentAreaData div.titleBand,
#contentAreaDataFixedHeight div.titleBand,
#middleAreaData div.titleBand,
#rightContentAreaData div.titleBand,
#rightContentAreaDataNoBottomPad div.titleBand,
#contentAreaData div.titleBandNoMarginBtm,
#contentAreaDataFixedHeight div.titleBandNoMarginBtm,
#middleAreaData div.titleBandNoMarginBtm,
#rightContentAreaData div.titleBandNoMarginBtm,
#rightContentAreaDataNoBottomPad div.titleBandNoMarginBtm,
#contentAreaData div.titleBandNoMarginTop,
#contentAreaDataFixedHeight div.titleBandNoMarginTop,
#middleAreaData div.titleBandNoMarginTop,
#rightContentAreaData div.titleBandNoMarginTop,
#rightContentAreaDataNoBottomPad div.titleBandNoMarginTop {
  margin:               20px 0px 20px 0px;
  padding:              1px 0px 2px 10px;
  position:             relative;
  z-index:              2;
}

/* GC FAQ */
#faq div.titleBand {
  margin:               0px 0px 2px 0px;
}

/* Multiroom */
#multiroom div.titleBand {
  margin:               0px 0px 0px 0px;
}

#contentAreaData div.titleBandNoMarginBtm,
#contentAreaDataFixedHeight div.titleBandNoMarginBtm,
#middleAreaData div.titleBandNoMarginBtm,
#rightContentAreaData div.titleBandNoMarginBtm,
#rightContentAreaDataNoBottomPad div.titleBandNoMarginBtm {
  margin-bottom:        0px;
}

#contentAreaData div.titleBandNoMarginTop,
#contentAreaDataFixedHeight div.titleBandNoMarginTop,
#middleAreaData div.titleBandNoMarginTop,
#rightContentAreaData div.titleBandNoMarginTop,
#rightContentAreaDataNoBottomPad div.titleBandNoMarginTop {
  margin-top:          0px;
}

.subtitleBand {
  height:               14px;
  background:           #a59e94;
  font:                 bold 9px/14px verdana,geneva,sans-serif;
  padding:              1px 0px 2px 0px;
}
#contentAreaData div.subtitleBand,
#contentAreaDataFixedHeight div.subtitleBand,
#middleAreaData div.subtitleBand,
#rightContentAreaData div.subtitleBand,
#rightContentAreaDataNoBottomPad div.subtitleBand {
  margin:               2px 0px 10px 0px;
  padding:              1px 0px 2px 10px;
  position:             relative;
}

/* special treatment for named anchors */

a.anchor,
.titleBand a.anchor,
#contentAreaData .titleBand a.anchor,
#contentAreaDataFixedHeight .titleBand a.anchor,
#middleAreaData .titleBand a.anchor,
#rightContentAreaData .titleBand a.anchor,
#rightContentAreaDataNoBottomPad .titleBand a.anchor {
  text-decoration:      none;
  margin:               0px;
}

#contentAreaData .titleBand a.anchor,
#contentAreaDataFixedHeight .titleBand a.anchor,
#middleAreaData .titleBand a.anchor,
#rightContentAreaData .titleBand a.anchor,
#rightContentAreaDataNoBottomPad .titleBand a.anchor {
  background:           #756c63;
  color:                #b8b4aa;
}

.weatherTblHead {
  background:           #9b958d;
}

/***used in rates & reservations pages***/

/* Alternating color rows */

tr.lightTitleBand,
.tbOddRow,
tr.tbOddRow td,
.oddRow   {
  background-color:     #928a83;
}

.tbEvenRow,
tr.tbEvenRow td,
.evenRow  {
  background-color:     #9b958d;
}

table.listingTbl tr td {
  border-bottom:        2px solid #aaa49d;
}

/* ****************************************/
/* Content area for one column pages	    */
/* ************************************** */

#contentArea {
  background:           #878077;
}

#contentAreaData,
#contentAreaDataFixedHeight {
  background:           #aaa49d;
  color:                #290502;
}

/* ****************************************/
/* Right content area for two column pages	*/
/* ************************************** */

#rightContentArea,
#rightContent {
  background-color:     #878077;
}

#rightContentAreaData,
#rightContentAreaDataNoBottomPad,
#rightContentData {
  background-color:     #aaa49d;
  color:                #290502;
}

/*******************************/
/* Reservation Calendar styles */
/*******************************/

.calendar {
  border:               1px solid #756c63;
}

.controls {
  color:                #b8b4aa;
  background-color:     #756c63;
}

.yearMonth {
  background-color:     #756c63;
  color:                #b8b4aa;
}

img.calimg {
  border:               none;
  width:                4px;
  height:               7px;
}

div.button {
  display:              inline;
  width:                4px;
  height:               7px;
  margin:               4px 2px 0 2px;
}

.buttonLink {
  color:                #b8b4aa;
}

.buttonDisabled a,
.buttonDisabled a:hover {
  color:                #b8b4aa;
}

.dateField {
  background-color:     transparent;
}

.dayHeader {
  color:                #756c63;
}

.dateLink {
  color:                #31261c;
}

.dateSelected {
  background-color:     #22231d;
}

.dateSelected a {
  color:                #a9a096;
}

.dateToday {
  border:               none;
}

.dateDisabled a,
.dateDisabled a:hover {
  color:                #756c6f;
}

/************************************************************************************/
/* Rates or Check availabilty - Calendar styles are also defined in StayCalendar.ascx */
/************************************************************************************/
/* see basic_prop.css for form font size and dimension styles**/

.instructionText,
.sectionHeader  {
  color:                #290502;
}

/* the following calendar styles should not be renamed */
/* they match the CssClass names associated with the microsoft calendar */

.calStyle {
  border-color:         #290502;
  width:                145px;
  height:               130px;
}

.calDayStyle {
  color:                #290502;
}

.calDayHeaderStyle {     
  color:                #756c63;
  font-family:          verdana;
  font-size:            9px;
}

.calNextPrevStyle  {
  color:                #b8b4aa;
  font-size:            10px;
}

.calOtherMonthDayStyle {
  font-family:          verdana;
  font-size:            9px;
  color:                #b8b4aa;
}

.calSelectedDayStyle {
  color:                #b8b4aa;
  background-color:     #352f27;
}

.calSelectorStyle {  /* ??? */
  color:                #a9a096;
  background-color:     #22231d;
}

.calTitleStyle {
  font-family:          verdana;
  font-size:            9px;
  font-weight:          bold;
  background-color:     #6f6353;       
  color:                #b8b4aa;
  height:               14px;
  vertical-align:       top;
  padding:              0px;
}

.calTodayDayStyle {
  font-family:          verdana;
  font-size:            12px;
}

.calWeekendDayStyle {
  font-family:          verdana;
  font-size:            9px;
  color:                #ff0000;
}

.formLabels {
  font:                 10px verdana;
}

#guestDetail  select  {
  background:           #d4d0c7;
  border:               1px solid #9c947b;
}

/* ************* */
/* Right Nav   */
/* ************* */

td.rightNavContainer {
  background:           #948e84;
}

td.rightNavContainerDetail {
  background:           #a09a93; 
}

.line {
  margin-left:          -10px;
}

/* ************* */
/* Footer     */
/* ************* */


#footerContainer {
	background:				    #352f27;
	color:                #7b7369;
}

#footerContainerInner  {
  color:                #7b7369;
}

/* ************* */
/* Banners       */
/* ************* */

/*for IE6 only*/
* html #landingMiddleBanner {
  filter:               progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=crop src='/images/background/bg_banner_landing_traders.png');
  color:                #b8b4aa; /* apply color here for separator bars */
}

* html #detailMiddleBanner {
  filter:               progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=crop src='/images/background/bg_banner_traders.png');
  color:                #b8b4aa; /* apply color here for separator bars */
}
/*  above proprietary Microsoft "filter" rules allow IE to display PNGs with transparency;
  rules below are invisible to IE and display the PNGs normally */
html>body #landingMiddleBanner  {
  background:           url('/images/background/bg_banner_landing_traders.png') top left;
  position:             relative;
  color:                #b8b4aa; /* apply color here for separator bars */
}

html>body #detailMiddleBanner {
  background:           url('/images/background/bg_banner_traders.png') top left;
  position:             relative;
  color:                #b8b4aa; /* apply color here for separator bars */
}

#landingBannerTitle,
.bannerTitle,
.bannerTitleNav,
.detailBannerNav {
  color:                #b8b4aa;
}

/* ************* */
/* Rules         */
/* ************* */

/* consider replacement of above with something like this */
/* created for checkout pages */
.ruleSolid,
.ruleDashed {
  height:               1px;
  background:           #756c63;
  margin:               10px 0px 10px 0px;
}
.ruleDashed {
  background:           url("/images/common/rule_dashed.gif") top left repeat-x;
}

/*This is used to override 10px margin - didn't want to include inline style*/
.ruleDashed_noMargin {
  height:               1px;
  background:           url("/images/common/rule_dashed.gif") top left repeat-x;
  margin:               10px -10px 10px -10px; 
}

.ruleDashedVertical {
  width:                1px;
  background:           url("/images/common/rule_dashed_vert.gif") top left repeat-y;
}


/* ************* */
/* Lists         */
/* ************* */

ul li {
  background:           url("/images/common/bullet_traders.gif") 0 .6em no-repeat;
}

/* ************* */
/* Gallery & Map */
/* ************* */

.galleryCaption,
.mapCaption {
  font:                 12px/14px georgia,serif;
}

.galleryFilter select {
  font:                 11px/14px verdana,geneva,sans-serif;
  color:                #290502;
  background:           #ffffff;
  border:               1px solid #b8b4aa;
}

.galleryControls {
  font:                 9px/12px verdana,geneva,sans-serif;
  color:                #b8b4aa;
}

/* ************* */
/* Spinner       */
/* ************* */

#spinnerMask {
  background-color:     #352f27;
}

/* ************* */
/* Lightbox      */
/* ************* */

#lightboxFooter,
#lightboxHeader {
  background:           #352f27;
}

/* ************* */
/* Listing Table */
/* ************* */

td.selected {
  background:           url("/images/common/icon_selected_hotel.gif") center center no-repeat;
}

.tbEvenRow td.selected {
  background-color:     #9b958d;
}

.tbOddRow td.selected {
  background-color:     #928a83;
}

/********************/
/* appointment page */
/********************/

.treatmentMenu a,
.checkboxSet a {
  color:                #290502;
}

.treatmentBox {
  width:                300px;
  float:                left;
  background-color:     #352f27;
  opacity:              0.85;
  filter:               alpha(opacity=85);
  filter:               progid:DXImageTransform.Microsoft.Alpha(opacity=85);
  color:                #b8b4aa;
  padding:              10px;
}

.tip {
  width:                5px;
  height:               5px;
  float:                left;
  background:           url("/images/common/tooltip_point_traders.gif") top left no-repeat;
}

.progressPage {
/*
	background:           #352f27 url("/images/background/bg_progress_traders.gif") top left repeat-x;
*/
  background-color:     #352f27;	
  color:                #b8b4aa;  
}

/***********************/ 
/* Press photo library */
/***********************/

.libPhoto,
.libPhotoAir {
  border:               1px solid #756c63;
}

/***********************/ 
/* Lightbox            */
/***********************/

.lbContentOuter,
.lbContentOuterFullPage,
#outerContainer {
  background:           #878077;
}


/***********************/ 
/* PopupSelector       */
/***********************/
.popupSelectorCreditCard
{
  border: 0px outset black; 
  width: 346px;
  background-color: #756c63;
  padding: 0px 20px 0px 10px;
}

.popupSelectorComments
{
  border: 0px outset black; 
  width: 346px;
  background-color: #756c63;
  padding: 0px 20px 0px 10px;
}

.popupSelectorRoomPreferences
{
  border: 0px outset black; 
  width: 200px; 
  background-color: #756c63;
  padding: 0px 20px 0px 10px;
}

.popupSelectorAirportPickup
{
  border: 0px outset black; 
  width: 346px;
  background-color: #756c63;
  padding: 0px 20px 0px 10px;
}


/********************************/
/* Multiroom booking guest tabs */
/********************************/
.guestMenuSelected {
  background:          #aaa49d;
}
/****************************/
/* Request Proposal buttons */
/****************************/
a.btnRFP {
  text-decoration:      none;
  text-align:           center;
  color:                #b8b4aa;
  height:               12px;
  display:              block;
  padding:              1px 2px 2px 2px;
  font:					        9px verdana,geneva,sans-serif;
  background:           #352f27;
  margin-top:           2px;
}
a.btnRFP:hover,
a.btnRFP:active {
  text-decoration:      none;
  background-color:     #484038;
}

.RFPAgendaTab .ajax__tab_header {background-image:url(/images/tab/tab-line_traders.gif);}
.RFPAgendaTab .ajax__tab_outer {background-image:url(/images/tab/tab-right_traders.gif)}
.RFPAgendaTab .ajax__tab_inner {background-image:url(/images/tab/tab-left_traders.gif)}
.RFPAgendaTab .ajax__tab_tab {background-image:url(/images/tab/tab_traders.gif)}
.RFPAgendaTab .ajax__tab_hover .ajax__tab_outer {background-image:url(/images/tab/tab-hover-right_traders.gif)}
.RFPAgendaTab .ajax__tab_hover .ajax__tab_inner {background-image:url(/images/tab/tab-hover-left_traders.gif)}
.RFPAgendaTab .ajax__tab_hover .ajax__tab_tab {background-image:url(/images/tab/tab-hover_traders.gif)}
.RFPAgendaTab .ajax__tab_active .ajax__tab_outer {background-image:url(/images/tab/tab-active-right_traders.gif)}
.RFPAgendaTab .ajax__tab_active .ajax__tab_inner {background-image:url(/images/tab/tab-active-left_traders.gif)}
.RFPAgendaTab .ajax__tab_active .ajax__tab_tab {background-image:url(/images/tab/tab-active_traders.gif)}

.txtDisabled
{
  color: #c7b79f;
}

/** package quantity tool tip **/
.packageQuantityBox {
  width:                300px;
  float:                left;
  background-color:     #c4bdb5;
  color:                #2e2015;
  padding:              5px;
  border:				1px solid;
  border-color:			#2e2015;
}


/** social media **/
.socialBookmarks {	
	border: 1px solid #514436; 
	background-color: #3a332b;	
}

.socialBookmarksS {	
	border: 0px; 
	background-color: #887f74;	
}
