/* Flex Template CSS v.3 */

/* Font & Color quick replace:

Font Family: Arial,Helvetica,sans-serif
Size: 12px (all other font sizes will scale using em unit based on this size)
Color: #514438
Secondary and Warnings text color: #827f5e (this color is also applied to the form elements borders and some borders)

Link: #837567
Link hover status: #514438

Headers and Breadcrumbs Font Family: "p22-underground-n5", "p22-underground", QuattrocentoSansRegular, sans-serif;
Headers color: #3A5E68 (some labels and the "required" asterisk (when not using the image) will use this same color, it can be replaced below).

Error messages: #B21010

Background & Border colors (from light to dark):
#FCFBF5
#FFFFFF
#f2eee2
#d8cfc0
#897b6e
#b8b591 (border #ddd9ae)

Note: 
- For Avaiability Calendar Restrictions color see "CALENDAR COLOR CODES" section.
- For Button Styles, see "BUTTONS" section.
- For Compare page scrollbar see "SCROLLBAR (COMPARE PAGE)" section
*/

    
    
/**************************/
/*      SPRITE IMAGE      */
/**************************/

.IconBg, .ToggleArrowDiv_On, .ToggleArrowDiv_Off, .TitlewBkgDrk, .TitlewBkgLight, a.FilterLinkInActive, a.FilterLinkActive,
.WarningMsg, .ErrorMsg, .ErrorAttn, .reqAsterisk, .ButtonSt1, .ButtonSt2, .ButtonSt3, .ButtonSt4, .ButtonSt4Disabled,
.VerticalScroll .thumb, .VerticalScroll .thumb .end, .HorizontalScroll .thumb, .HorizontalScroll .thumb .end, .DDListCurrent,
.BEBreadcrumb li, .BEStep1On, .BEStep2On, .BEStep3On, .BEStep4On, .BEStep5On, .BEStep6On, .activeLink, .nonactiveLink,
.ModifyLink, .RemoveLink, .RemovePkgLink, .CluetipLink, .CluetipLinkNoTxt, .MorePhotosLink, .PriceInfoLink, .ProductNamePromo .PromoIcon,
.ClueTipCloseImg, .ad-gallery .ad-forward, .ad-gallery .ad-back, .ad-gallery .ad-image-wrapper .ad-prev .ad-prev-image, 
.ad-gallery .ad-image-wrapper .ad-next .ad-next-image
    { background-image:url(/chain/11693/images/shell/sprite_2013.png); }
    
    /* Background positions are on a separate file in the extra CSS folder as it shouldn't be necessary to change it unless the size or location on the sprite image is changed */
    


/******************/
/*      TEXT      */
/******************/

/* Default Style */
body { font-family: "p22-underground-n3", "p22-underground", sans-serif; font-size:13px; color:#514438; }

/* Datepickker font color */
.calendars-popup .ui-datepicker th, .calendars-popup .ui-datepicker td span { color:#514438; }

/* Secondary Color (Lighter than Default) */
.TxtLt, .TxtLtBold, .TxtSmlLt, .TxtSmlLtBold 
    { color:#827f5e; }
    
/* Hotel Name  */
.HotelName { font-family:"p22-underground-n5", "p22-underground", QuattrocentoSansRegular, sans-serif; }
    
/* Links */
a { color:#837567;  text-decoration:underline; }
    
a:hover { color:#514438; text-decoration:none; }

/* Links Same color as Default Text */
a.TxTColor { color:#514438; text-decoration:none; }
    
/* Labels with same color as headers */
.TxtClrBold { color:#3A5E68; }

/* Headers */
.TitleSz1, .TitleSz2, .TitlewIconDrk, .TitlewIconLgt, .TitlewIconToggleDrk, .TitlewIconToggleLgt,
.TitlewBkgDrk, .TitlewBkgLight, .TitlewIconCircleArrow, .TitlewIconArrow 
    { color:#514438; font-family:QuattrocentoSansRegular, "p22-underground-n3", "p22-underground", sans-serif; }
	
/* Headers with dark background */    
.TitlewIconDrk .IconBg, .TitlewBkgDrk.TitleSz1, .TitlewBkgDrk.TitleSz2  { color:#FFF; }	    

/* SubHeads */
.SubTitle, .SubTitlewArrow, a.FilterLinkInActive, a.FilterLinkInActive:hover, a.FilterLinkActive, a.FilterLinkActive:hover
    { color:#827f5e; }
    
/* Warning Messages */
.WarningMsg { color:#827f5e; }

/* Error Messages */
.ErrorMsg, .ErrorAttn { color:#B21010; }

/* Required Asterix */
.reqAsterisk { color:#3A5E68; }  



/*************************/
/*      FORM STYLES      */
/*************************/

input[type="text"], input[type="password"], textarea, select { border:1px solid #827f5e; }

input[type="text"]:focus, input[type="password"]:focus, textarea:focus, select:focus  { border:2px solid #827f5e; } 



/*************************/
/*      BACKGROUNDS      */
/*************************/

/* Backgroungs with No Borders */
.BgNB1, .popupBody { background:#FCFBF5; }

.BgNB2 { background:#FFFFFF; }

.BgNB3, .SubDDList li:hover { background:#f2eee2; }

.BgNB4 { background:#897b6e; color:#FFF; }

.BgNB5 { background:#d8cfc0; }


/* Background with Thin Border */
.Bg1B1, .ui-widget-content { background:#FCFBF5; border:1px solid #f2eee2; }

.Bg1B2 { background:#FFFFFF; border:1px solid #f2eee2; }

.Bg1B3 { background:#FFFFFF; border:1px solid #d8cfc0; }

.Bg1B4 { background:#f2eee2; border:1px solid #d8cfc0; }

.Bg1B5 { background:#b8b591; border:1px solid #ddd9ae; }


/* Background with Thick Border */
.Bg5B1 { background:#FCFBF5; border:5px solid #FCFBF5; }

.Bg5B2 { background:#FFFFFF; border:5px solid #f2eee2; }

.Bg5B3 { background:#FFFFFF; border:5px solid #FFFFFF; }

.Bg5B4 { background:#f2eee2; border:5px solid #d8cfc0; }
    
    
    
/*********************/
/*      BORDERS      */
/*********************/

/* Colors */
.BorTp1, .BorRt1, .BorBtm1, .BorLft1, .Bor2Tp1, .Bor2Lft1, .Bor2Btm1 { border-color:#f2eee2; }
.BorTp2, .BorRt2, .BorBtm2, .BorLft2, .Bor2Tp2, .Bor2Lft2, .Bor2Btm2 { border-color:#d8cfc0; }
.BorTp3, .BorRt3, .BorBtm3, .BorLft3, .Bor2Tp3, .Bor2Lft3, .Bor2Btm3 { border-color:#827f5e; }



/**********************************/
/*      CALENDAR COLOR CODES      */
/**********************************/

/* Open Dates */
.ui-state-default.BECalOpen, .BECalOpen { background:#7CB250; border:0; }
    .ui-state-default.BECalOpen span { color:#FFF; }

/* No Available */
.ui-state-default.BENoAvail, .BENoAvail { background:#C88C68 url(/hotel/hotelid/images/shell/noavail_x.png) no-repeat center; border:0; }
    .ui-state-default.BENoAvail span { color:#FFF; }

/* Min Stay */
.ui-state-default.BEMinLen, .BEMinLen { background:#5C86CC; border:0; }
    .ui-state-default.BEMinLen span { color:#FFF; }

/* No Arrival */
.ui-state-default.BENoArrive, .BENoArrive { background:#EBE141; border:0; }
    .ui-state-default.BENoArrive span { color:#514438; }

/* Selected dates */
.ui-datepicker-calendar .ui-state-active, .SelectedDates { border:3px solid #4A4D4D; } 

/* Datepicker selected dates */
.calendars-popup .ui-datepicker-calendar .ui-state-active { background:#4A4D4D; border: 1px solid #4A4D4D !important; }
    .calendars-popup .ui-datepicker-calendar .ui-state-active span { color:#FFF; }


/*********************/
/*      BUTTONS      */
/*********************/

/* Main Button. i.e: advance to the next step */
.ButtonSt1 { background-color:#df742e; border:1px solid #E68C50; color:#FFF; text-shadow: 0 -1px #A94200;  text-transform: uppercase; }

/* Secondary Button. i.e: go back to previous step */
.ButtonSt2 { background-color:#f3aa7a; border:1px solid #E68C50; color:#FFF; text-shadow: 0 -1px #A94200; text-transform: uppercase; }

/* Small button, this is used to perform secondary action between the page, like edit dates, compare rooms */
.ButtonSt4, a.LinkButtonSt4:hover { background-color:#897b6e; border:1px solid #897b6e; color:#FFF; text-transform: uppercase; font-size:10px; }

/* Disabled Button */
.ButtonSt3, .ButtonSt4Disabled { background-color:#D8D8D8; border:1px solid #CDCDCD; color:#ADADAD;}

/* Shadow for all buttons */
.ButtonSt1, .ButtonSt2, .ButtonSt3, .ButtonSt4, .ButtonSt4Disabled
    { -webkit-box-shadow: 0 0 3px 0 #999; -moz-box-shadow: 0 0 3px 0 #999; box-shadow: 0 0 3px 0 #999; }
    
    
    
/**************************************/
/*      SCROLLBAR (COMPARE PAGE)      */
/**************************************/

/* Vertical */
.VerticalScroll .scrollbar, .HorizontalScroll .scrollbar
    { background:#AAA; border:1px solid #A3A3A3; }

.VerticalScroll .thumb, .HorizontalScroll .thumb
    { background-color:#595959; border:1px solid #323232; }

.VerticalScroll .thumb .end, .HorizontalScroll .thumb .end
    { background-color:#595959; }
    
    
/************************/
/*      BREADCRUMB      */
/************************/

/* Container */
.BEBreadcrumb { font-family:QuattrocentoSansRegular, "p22-underground-n3", "p22-underground", sans-serif; border:1px solid #897b6e; border-width:1px 0; }

/* Background */
.BEBreadcrumb ul { background:#FCFBF5; }

/* Current Step */
.BEBreadOn { background:#897b6e; color:#FFF; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; }

/* Previous Step */
.BEBreadBk
    { background:#d8cfc0; color:#897B6E; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; }

/* Following Step */
.BEBreadFwd { color:#897b6e; }

    
/************************/
/*      EXTRA STYLES    */
/************************/


.TitlewIconDrk .IconBg { background-position: right -18px; }

.TitlewIconToggleDrk .ToggleArrowDiv_Off { background-position: right -138px; }

.TitlewIconToggleDrk .ToggleArrowDiv_On { background-position: right -198px; }

.TitlewBkgLight.TitleSz1 {    background-position: right -76px;}

.TitlewBkgLight.TitleSz2 { background-position: right -76px;}


/*********** Room & Rates ***************/
.PolicyTxt { color: #DF6A1D;}

/**** Survey Button - Confirmation Page ****/
.ResConfirm .ResDetailRtCol, .ResConfirm .ResDetailLftCol {width:35%;}
.ResConfirm .survey {float:right; width:25%; position:relative;}
.survey a {float: right;}
.ResConfirm .ResDetailCntrLine { left: 35%; }

.HotelDiv.Bg5B3, .DatesDiv.Bg5B3, .QuantitiesDiv.Bg5B3, .CodesDiv.Bg5B3, .FiltersDiv.Bg5B3 { background: #FCFBF5; border: 5px solid #FCFBF5; }