/*fonts */
@font-face {
    font-family:'LeagueGothic';
    font-style: normal;
    font-weight: 400;
    src: url('/HOTEL/69558/SHELL/LeagueGothic-regular.ttf') format('truetype');
}
@font-face {
    font-family:'EnglishGrotesque';
    font-style: normal;
    font-weight: 400;
    src: url('/HOTEL/69558/SHELL/EnglishGrotesque.ttf') format('truetype');
}
/* General */

html { font-size: 16px; }

body {  color: #000000;  background: #fff; font-family: 'EnglishGrotesque';}

a { color: #000000; text-decoration: underline; }

    a:hover { color: #00afdb; text-decoration: none; }

    a.inherit { color: #000000; }

.logo img {max-height: calc(80px - 35px);}

.row { max-width: 1100px;}

/* end General */


/* Text & Headers */

.hSize1, .hSize2, .hSize3, .hSize4 { color: #000000; font-family: 'LeagueGothic'; text-transform: uppercase; font-weight: normal;}

.tLight { color: #3a3a3a; }

.hCollpase .ToggleArrowDiv_Off + span::before { color: #00afdb; }

.hCollpase .ToggleArrowDiv_On + span::before { color: #00afdb; }

.Bg4 .hCollpase .ToggleArrowDiv_Off + span::before, .Bg4 .hCollpase .ToggleArrowDiv_On + span::before, .Bg4 .shCollpase .ToggleArrowDiv_Off + span::before, .Bg4 .shCollpase .ToggleArrowDiv_On + span::before { color: #FFF; }

.StrikeOut { color: #d92400; }
.StepName h2 { text-transform: uppercase;  color:#000000;font-family: 'LeagueGothic';
}
/* end Text & Headers */


/* Icons */

.openModal::before, .FilterLinkInActive::before, .FilterLinkActive::before, 
.CloseBtnX::before, .modifyIco::before, .removeIco::before, 
.MonthlyAvailabilityLink::after, .ArrowTop::before, .DateBack .activeLink::before,
 .ShopCartIco::before, .calendarIco::before, .printIco::before { color: #00afdb; }

.infoIco::before, .infoIcoAfter::after, .ProductNamePromo .PromoIcon::before, 
.Asterisk::before, .DateFwd .activeLink::before, .removeIco::after { color: #00afdb; }

.ProductNamePromo .PromoIcon::before { color: #00afdb; }

.FilterClose::after, .CompareClose::after { color: #00afdb; }

/* end Icons */


/* Backgrounds & Borders */

.Bg1 { background: #ffffff; }

.Bg2 { background: #f6f6f6; }

.Bg3 { background: #f6f6f6; }

.ProductsInCategory:before, .PackageList:before { color: #f6f6f6; }

.Bg4 { background: #424242; color: #FFF; }

.Bg5 { background: #3a3a3a; }

.Bg6, .ui-widget-content { background: #ffffff; }

.Bg7 { background: #ededed; background: -moz-linear-gradient(top, #ffffff 0%, #ededed 100%); background: -webkit-linear-gradient(top, #ffffff 0%,#ededed 100%); background: linear-gradient(to bottom, #ffffff 0%,#ededed 100%); }

.Br1 { border-color: #DDDDDD; }

.Br2 { border-color: #E5E2DE; }

.AdditionalDetailsHeader h3.hCollpase { border-top: 1px solid #E5E2DE; }

.Br3 { border-color: #3a3a3a; }

/* end Backgrounds & Borders */



/* Form Fields */

input[type=text], input[type=number], input[type=email], input[type=password], input[type=tel], textarea, select { color: #000; background: #efefef; border: 0; font-family: "PT Sans","Helvetica Neue","Helvetica",sans-serif; font-size: 14px;}

.calendars-wrapper, .selectWrap { background: #f3f3f3; }

    .selectWrap::before { color: #999; }

input[type="text"].CodesInput {border: 1px solid black;}

.checkboxGroup input[type=checkbox] + label::before, .radiobuttonGroup input[type="radio"] + label::before,
.checkboxGroup td.unchecked + td label::before, .checkboxGroup td.checked + td label::before,
.checkboxGroup .unchecked + label::before, .checkboxGroup .checked + label::before { color: #999; }

/* end Form Fields */


/* Buttons */

.btnSt1, .btnSt2, .btnSt3, .btnSt4 { font-family:'LeagueGothic'; letter-spacing: 1px; color: #000000; border: 0; font-weight: normal;}

.btnSt1 { background: #00afdb; border:1px solid #00afdb; color: #000000; font-size: 25px;}

    .btnSt1:hover { background: #000000; color:#ffffff; border:1px solid #000000;}

.btnSt2 { background: #3e3e3e; color:#ffffff; border:none; font-size: 16px;}

    .btnSt2:hover { background: #e2e2e2; color:#3e3e3e; }

.btnSt3, .ReviewBtn, .ModifyResBtn { background: #00afdb; border:1px solid #00afdb; color: #000000; font-size: 25px;}

    .btnSt3:hover, .ReviewBtn:hover, .ModifyResBtn:hover { background: #000000; color:#ffffff; border:1px solid #000000;}

.btnSt4 { background: #3e3e3e; color:#ffffff; border:none; font-size: 16px;}

    .btnSt4:hover, .ReviewBtn.btnSt1.Mrgn3 { background: #e2e2e2; color:#3e3e3e; border: none;}

a.btnSt1:hover, a.btnSt2:hover, a.btnSt3:hover, a.btnSt4:hover, /*.backBtn::before,*/ .checkboxGroup .btnSt2 label::before { color: #FFF !important; }

.PkgBtmNoThxBtn, .PkgTopNoThxBtn { color: #00afdb; background: none; border:none;}

    .PkgBtmNoThxBtn:hover, .PkgTopNoThxBtn:hover { color: #00afdb; background: none; 
        border:none; text-decoration: none;}

a.backBtn:hover, a.backBtn:hover::before {color: #00afdb !important; }

.ReviewBtn.btnSt1.Mrgn3:hover {background: #dddddd; color:#111111;}
/* end Buttons */


/* jQuery UI */

/* Border for the datepicker and popups and price slider bar */
.ui-widget-content { border: 1px solid #c5c5c5; }

    /* Icons in popup contents. Not in use atm, use same color as popups text */
    .ui-icon, .ui-widget-content .ui-icon { background-image: url("/chain/19159/images/shell/ui-icons_222222_256x240.png"); }

/* Header styles. Used in datepicker, availability calendar and popups and price slider bar */
.ui-widget-header { background: #EEE; color: #717171; }
    .ui-widget-header .ui-icon { background-image: url("/chain/19159/images/shell/ui-icons_222222_256x240.png"); }

    /* Button styles default status. Datepicker and Popup close, dialog buttons; price slider handlers. Use same colors as BE btnSt3 and btnSt4 buttons */
    .ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default { border: 1px solid #00afdb; background: #00afdb; color: #fff; }
        .ui-state-default a, .ui-state-default a:link, .ui-state-default a:visited { color: #fff; }
        .ui-state-default .ui-icon { background-image: url("/chain/19159/images/shell/ui-icons_FFFFFF_256x240.png"); }

    /* Button Styles hover */
    .ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus, .ui-widget-header .ui-state-focus { border: 1px solid #00afdb; background: #00afdb; color: #fff; }
        .ui-state-hover a, .ui-state-hover a:hover, .ui-state-hover a:link, .ui-state-hover a:visited, .ui-state-focus a, .ui-state-focus a:hover, .ui-state-focus a:link, .ui-state-focus a:visited { color: #fff; }
        .ui-state-hover .ui-icon, .ui-state-focus .ui-icon { background-image: url("/chain/19159/images/shell/ui-icons_FFFFFF_256x240.png"); }

    /* Button Styles active */
    .ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active { border: 1px solid #00afdb; background: #00afdb; color: #fff; }
        .ui-state-active a, .ui-state-active a:link, .ui-state-active a:visited { color: #fff; }
        .ui-state-active .ui-icon { background-image: url("/chain/19159/images/shell/ui-icons_FFFFFF_256x240.png"); }

/* end jQuery UI */


/* Datepicker dates and selected date */

.calendars-popup td a.ui-state-default, .calendars-popup td a.ui-state-hover { border: 1px solid #DDDDDD; color: #3b3b3b; }

.calendars-popup td a.ui-state-active, .calendars-popup td a.ui-state-active:hover { border: 1px solid #3b3b3b; background: #3b3b3b; color: #FFF; }

.CalendarDiv .ui-state-active, .CalendarDiv a.ui-state-active { border: 3px solid #3b3b3b; }

/* end Datepicker dates and selected date */


/* Calendar Color Codes

.CalendarDiv .BECalOpen, .CalendarDiv a.BECalOpen, .CalendarDiv .ui-state-default { background: #288c4f; color: #FFF; border: 0; }

.CalendarDiv .BENoAvail, .CalendarDiv a.BENoAvail { background-color: #ececec; background-image: url(/hotel/HOTELID/images/shell/noavail.png); color: #3b3b3b; border: 0; }

.CalendarDiv .BEMinLen, .CalendarDiv a.BEMinLen { background: #81d9a3; color: #FFF; border: 0; }

.CalendarDiv .BENoArrive, .CalendarDiv a.BENoArrive { background: #55b37a; color: #FFF; border: 0; }

end Calendar Color Codes */
@media screen and (min-width: 901px) {
    .Checkout .fieldDiv label, .AdditionalInfoDiv .fieldDiv label, .QuestionRadioBtn > label { width: 28%; }
/*    WIKI: Fix 3 column layout showing in 2 columns in IE*/
    .msie .HotelContainer, .msie .ProductContainer, .msie .PackageItem { width: calc(99.9%/3); }
}
/******CALENDAR PRICING SPACING ***/
@media screen and (min-width: 600px)and (max-width: 1200px) { 
/* WIKI: Change padding and size to fit the price. Recommended tablet size < 900*/
    .CalwPrice .ui-datepicker td a, .CalwPrice .ui-datepicker td span { padding: 8px 3px; }
    .CalwPrice td a.ui-state-active { padding: 5px 1px; }
}   
@media screen and (min-width: 1101px)and (max-width: 1200px) { 
    .CalwPrice .ui-datepicker td span.DayPrice { font-size: 14px; } /* reduce font-size*/
}
@media screen and (min-width: 880px)and (max-width: 1100px) { 
    .CalwPrice .ui-datepicker td span.DayPrice { font-size: 13px; } /* reduce font-size*/
}
/*automatically goes to 11px at 900px*/
@media screen and (min-width: 827px)and (max-width: 879px) { 
    .CalwPrice .ui-datepicker td span.DayPrice { font-size: 12px; } 
}
@media screen and (min-width: 787px)and (max-width: 826px) { 
    .CalwPrice .ui-datepicker td span.DayPrice { font-size: 11px; } 
}
/*go vertical */
@media screen and (min-width: 601px) and (max-width: 787px) { /*uses min-width too*/
    .ui-datepicker-multi .ui-datepicker-group.first,
    .ui-datepicker-multi .ui-datepicker-group.last { padding: 0 20px; width: 100%; }
    .CalwPrice span.DayPrice {  /* czc - add to go back to original fontsize */
      font-size: 15px !important;
    }
}
/*********************************************/
/** this is good fix from WIKI for price under room **/
@media screen and (min-width: 601px) and (max-width: 750px) {
.HeaderPrice .PriceExtraInfo { display: block; }
.HeaderPrice .PriceExtraInfo span { display: inline; }

.HasImage .HeaderPrice .PriceExtraInfo { display: inline-block; }
.HasImage .HeaderPrice .PriceExtraInfo span { display: block; }
}
@media screen and (max-width: 600px) {
    .PckOptBtnsBtm, .CriteriaBtnDiv { background: #FFF; }
}

/* end Mobile */


/* Shell */

 .fixed { position: static; } /*makes header not fixed on top, will require adjust .content margin */

.to-toplink { background-color: rgba(0,0,0,0.4); color: #fff; }
    .to-toplink:hover, .to-toplink:focus { color: #fff; }
    .to-toplink.active:hover, .to-toplink.active:focus { background-color: rgba(0,0,0,0.6); color: #fff; }

.header-strip { background: #3b3b3b; color: #FFF; }

.header-main { background: #000000; min-height: 80px; }

.large-2 { width: 354px; float: left; margin: 0 auto; margin-top: 8px; padding-left: 25px;}

.menu-trigger { color: #fff; top: 22px; font-size: 25px; right: 35px;} 

nav.primary { float: none; position: static; text-align: center; }

/* code to center nav in desktop size */ /*new*/
@media only screen and (min-width: 1000px) {
    nav.primary { float: none; position: static; text-align: center; }
    nav.primary > div { margin: 0 auto; display: inline-block; } 
}
#primary-nav li { border-bottom: none; }

    #primary-nav li > a { color: #fff; font-family:'LeagueGothic'; display: block; font-size: 20px; padding: 0px; text-transform: uppercase; text-align: center;}

.footer-menu { border-top: none; background: #1c1c1c; padding: 20px 10px; color: #fff; margin-bottom: 0px;}

    .footer-menu .footer-nav ul li a { color: #ffffff; text-decoration: none; font-family: 'LeagueGothic'; text-transform: uppercase; font-weight: normal; letter-spacing: .9px; font-size: 16px;}

.footer-menu .footer-nav ul li a:hover {color: #00afdb;}

/* use this if you want the background image to show on the sides of the BE, instead of the .content line above
*/
.content { padding: 0 20px; margin: 40px auto; margin-bottom: 0px;}
#XbeViewPanel { background: #FFFFFF; padding: 15px 0 0; }



@media only screen and (min-width: 64.063em) {
    #primary-nav li { border: 0; }
        #primary-nav li:hover > a { color: #ffffff; border-bottom: 2px solid #00afdb; }
        #primary-nav li > a {padding: 0px 20px 5px 20px; border-bottom: 2px solid #000;}
	#primary-nav {margin-top: 28px;}
	.header-main { height: auto!important; }
}
  

@media only screen and (max-width: 600px) {
   .large-2 { max-width: 50%; float: none; text-align: center; padding-left: 0px;}
    .menu-trigger { top: 10px; }
	.StepName .backBtn { background: #A8934F; border:2px solid #A8934F; left: 15px; top:45px;}
	.header-main { height: auto!important; }
	nav.primary > div { display: block; }
	 #primary-nav li { float: none; border-bottom: none; display: block; }
	 #primary-nav li > a { padding: 10px; }
	.to-toplink.active { bottom: 120px; }
	.level_1:hover {color: #ffffff; border-bottom: 2px solid #00afdb!important;  padding-bottom: 0px;}
}


/* hide back button text */
@media only screen and (max-width: 420px) {
        .StepName .backBtn { background: none; height: 30px; padding: 0; text-indent: -9999em; width: 30px; border:none;}
            .StepName .backBtn::before { font-size: 30px; left: 0; text-indent: 0; top: 0; position:absolute;  color: #fff !important; border:none;}
                a.backBtn:hover::before {color: #A8934F !important; }
            .menu-trigger {right:10px;}
	.header-main { height: auto!important; }
	.large-2{padding-left: 0px;}
}


.ui-datepicker td { border: 1px solid #eeeeee;}

.AvailResults .StayBar {background: #00afdb; padding-left: 15px;}

.StayBar .ModifyLink a {font-size: 17px; text-decoration: underline;}
.StayBar .ModifyLink a:hover {text-decoration: none; color: #ffffff;}

.ProductsHeaderDiv{padding: 15px; background: #f6f6f6;}

.HeaderShortDesc, .HeaderLongDesc.Mrgn2, .ProductLongDesc.Mrgn6 {display: block !important;}
.MoreAboutLink.Mrgn2.tSmall, .ReadMoreLink.tSmall.Mrgn5 {display: none;}

.StayBar.Mrgn1.Br2.Pdng1 {padding: 15px; background: #00afdb;}
/* End Shell */