/*-- Freeonlinebooking.com Responsive Booking Sequence Styles --*/

/*-- Fonts --*/
    @import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;550;600;700&display=swap');
    @import url('https://fonts.googleapis.com/css2?family=Rubik:wght@400;500;550;600;700&display=swap');
    @import url('https://fonts.googleapis.com/css2?family=Cabin:wght@400;500;550;600;700&display=swap');


/*-- Colours var(--CustomColor) var(--HiLightColor)  --*/
    .Green { background-color: #00CC66; }
    .HoverGreen { background-color: #00A452; }
    .DarkRed { color: #990000; }

/*-- Page --*/
/*
	.FullPage { width:95%; max-width: 1100px; margin-left:auto; margin-right:auto; padding-left: 5px; padding-right: 5px; display:block; }
	.ClippedPage { width:95%; max-width: 1100px; margin-left:auto; margin-right:auto; padding-left: 5px; padding-right: 5px; display:block; }
*/
    *,*:focus,*:hover{ outline:none; }  /*-- Prevent bold outlines round form fields --*/
    .ContentBox { width:95%; max-width:1100px; margin: auto; box-shadow: rgba(50, 50, 93, 0.25) 0px 6px 12px -2px, rgba(0, 0, 0, 0.3) 0px 3px 7px -3px; background: #FFFFFF; border-top: 3px solid var(--CustomColor); border-top-left-radius: 5px; border-top-right-radius: 5px; padding: 20px; }
    .Spacer { width:100%; display: block; height:5px; clear:both; }
    .ClearAll { clear:both; }

/*-- HTML elements*/
    body { font-family: Roboto, Helvetica, Arial, sans-serif; FONT-SIZE: 13px; FONT-WEIGHT: 400; COLOR: #555555; background: #FAFAFA; margin:0;padding:0; margin-top: 10px; }  
    h1 { font-family: Roboto, Helvetica, Arial, sans-serif; FONT-SIZE: 22px; FONT-WEIGHT: 700; COLOR: var(--H1Colour); MARGIN: 0px 0px 15px 0px; text-transform: none; }
    h2 { font-family: Roboto, Helvetica, Arial, sans-serif; FONT-SIZE: 16px; FONT-WEIGHT: 500; COLOR: var(--H2Colour); MARGIN: 0px 0px 10px 0px; text-transform: none; }
    h3 { font-family: Roboto, Helvetica, Arial, sans-serif; FONT-SIZE: 15px; FONT-WEIGHT: 500; COLOR: #1590C1; MARGIN: 0px 0px 10px 0px; text-transform: none; }
    P { font-family: Roboto, Helvetica, Arial, sans-serif; FONT-SIZE: 13px; FONT-WEIGHT: 400; COLOR: #333333; MARGIN: 0px 0px 10px 0px; }  
	ul { MARGIN: 0px 0px 0px 10px; text-indent: 0px; padding: 0px; }
	li { color: #777; MARGIN: 0px 0px 5px 0px; }
	li span { color: #000; }
	img { border:none; }
    .StandardText { font-family: Roboto, Helvetica, Arial, sans-serif; FONT-SIZE: 13px; FONT-WEIGHT: 400; COLOR: #333333; MARGIN: 0px 0px 0px 0px; }  
    .HelpText { font-family: Roboto, Helvetica, Arial, sans-serif; FONT-SIZE: 13px; FONT-WEIGHT: 400; COLOR: #999; display:inline-block;}  
    .h1Mobile { font-family: Roboto, Helvetica, Arial, sans-serif; FONT-SIZE: 20px; FONT-WEIGHT: 700; COLOR: var(--H1Colour); MARGIN: 0px 0px 10px 0px; text-transform: none; }

/*-- Responsive Layout --*/
    * { box-sizing: border-box; }
    #dimensions { height: 20px; line-height: 20px; background: orange; margin: 0 auto; position: relative; text-align: center; FONT-SIZE: 10pt; COLOR: #FFFFFF; FONT-WEIGHT: bold; }
    .ResponsiveContainer { width:100%; padding:0; margin:0; clear:both; }
    .ResponsiveRow:after { content:""; display: table; clear: both; }
    .ResponsiveColumn { float: left;  width:50%; padding-right:10px; }  /*-- Cannot vary width of columns on page otherwise they wont be responsive! --*/
    .ResponsiveColumnOnlineBooking { float: left;  width:40%; }
    .ResponsiveColumnOnlineBooking h1 { MARGIN: 0px; }
    .ResponsiveColumnProgress { float: right;  width:60%; text-align:right; }
    .TwoColGrid { width:100%; display: grid; grid-template-columns:75% 25%; grid-row-gap: 0px; } 
    .TwoColGrid5050 { width:100%; display: grid; grid-template-columns:50% 50%; grid-row-gap: 0px; } 

    @media screen and (max-width: 1000px) {
        .ResponsiveColumnOnlineBooking { width:100%; }
        .ResponsiveColumnProgress { float: left; text-align:left; margin-top: 10px; width:100%; }
    }

    @media screen and (max-width: 900px) {
        .ResponsiveColumn { width: 100%; margin-bottom: 10px; text-align:left; }
    }

/*-- Booking Sequence --*/
    .ProgressCompleted { font-family: Roboto, Helvetica, Arial, sans-serif; FONT-SIZE: 20px; FONT-WEIGHT: 700; COLOR: var(--CustomColor); MARGIN: 0px 0px 15px 0px; text-transform: none; display:inline-block; text-decoration:none; }
    .ProgressToDo { font-family: Roboto, Helvetica, Arial, sans-serif; FONT-SIZE: 20px; FONT-WEIGHT: 700; COLOR: #DDD; MARGIN: 0px 0px 15px 0px; text-transform: none; display:inline-block; text-decoration:none; }
    .NavButtonsGrid { width:100%; display: grid; grid-template-columns:auto auto; grid-row-gap: 0px; padding-top:5px; padding-bottom:5px; text-align:right; margin-bottom:10px; } 

    @media screen and (max-width: 1000px) {
        .ProgressCompleted { FONT-SIZE: 15px; MARGIN: 0px 0px 0px 0px; }
        .ProgressToDo { FONT-SIZE: 15px; MARGIN: 0px 0px 0px 0px; }
    }

    @media screen and (max-width: 500px) {
        .ProgressCompleted { FONT-SIZE: 12px; MARGIN: 0px 0px 0px 0px; }
        .ProgressToDo { FONT-SIZE: 12px; MARGIN: 0px 0px 0px 0px; }        
    }

    @media screen and (max-width: 450px) {
        .ProgressCompleted { FONT-SIZE: 10px; MARGIN: 0px 0px 0px 0px; }
        .ProgressToDo { FONT-SIZE: 10px; MARGIN: 0px 0px 0px 0px; }        
    }

/*-- Forms --*/
	.RoundedForm { background: #FAFAFA; border-radius: 7px; border: 1px solid #DDD; padding: 0px; font-size:13px; display:inline-block; width:100%; }
    .RoundedFormContent { padding:15px; }
	.RoundedFormNon100 { background: #FAFAFA; border-radius: 7px; border: 1px solid #DDD; padding: 0px; font-size:13px; display:inline-block; }
    .RoundedFormContent { padding:15px; }
	input[type="text"],input[type="password"] { COLOR: #000; background-color: #FFFFFF; font-size: 13px; font-family: Roboto, Helvetica, Arial, sans-serif; Height:35px; border:1px solid #BBB; border-radius: 4px; }    
    textarea { COLOR: #000; background-color: #FFFFFF; font-size: 13px; font-family: Roboto, Helvetica, Arial, sans-serif; border:1px solid #BBB; padding: 5px 5px 5px 10px; border-radius: 4px; }
    input[type="text"]:focus,input[type="password"]:focus,select:focus,input[type='checkbox']:focus,textarea:focus { border: 1px solid #00CC66; }
    select { COLOR: #000; background-color: #FFFFFF; font-size: 13px; font-family: Roboto, Helvetica, Arial, sans-serif; border:1px solid #BBB; padding: 3px 3px 3px 8px; border-radius: 4px; -webkit-appearance: menulist; }
	.ErrorBlock { line-height: 20px; font-size: 12px; font-weight: normal; color: #FFFFFF; background: url('../../Images/CrossWhite.png') no-repeat 5px 8px #f44336; border: 0px solid red; display:block; padding: 5px 5px 5px 30px; margin: 0px;}

    .FormField { box-shadow: none !important; padding: 3px 3px 3px 25px; }
    .FormText { position: relative; padding-top: 5px; padding-bottom: 10px; clear:both; }
    .FormText label { position: absolute; top: -5px; left: 10px; padding: 2px; z-index: 1; color: #444; }
    .FormText label:after { content: " "; background-color: #fff; width: 100%; height: 13px; position: absolute; left: 0; bottom: 0; z-index: -1; }
    .FormText:before { content: "*"; font-size: 15px; color: red; background-color: #fff; font-weight: 500; height: 13px; position: absolute; left: 10px; bottom: 20px; z-index: 100; }

    .FormTextNotRequired { position: relative; padding-top: 5px; padding-bottom: 10px; clear:both; }
    .FormTextNotRequired label { position: absolute; top: -5px; left: 10px; padding: 2px; z-index: 1; color: #444; }
    .FormTextNotRequired label:after { content: " "; background-color: #fff; width: 100%; height: 13px; position: absolute; left: 0; bottom: 0; z-index: -1; }

    .FormSelect select { height:34px; }
    .FormSelect { position: relative; padding-top: 5px; padding-bottom: 10px; clear:both; }
    .FormSelect label { position: absolute; top: -5px; left: 10px; padding: 2px; z-index: 1; color: #444; }
    .FormSelect label:after { content: " "; background-color: #fff; width: 100%; height: 13px; position: absolute; left: 0; bottom: 0; z-index: -1; }
    .FormSelect:before { content: "*"; font-size: 15px; color: red; background-color: #fff; font-weight: 500; height: 13px; position: absolute; left: 10px; bottom: 20px; z-index: 100; -webkit-appearance:none; }

    .FormSelectNotRequired select { height:34px; }
    .FormSelectNotRequired { position: relative; padding-top: 5px; padding-bottom: 10px; clear:both; }
    .FormSelectNotRequired label { position: absolute; top: -5px; left: 10px; padding: 2px; z-index: 1; color: #444; }
    .FormSelectNotRequired label:after { content: " "; background-color: #fff; width: 100%; height: 13px; position: absolute; left: 0; bottom: 0; z-index: -1; }

    .FieldBlock { color: #444; padding: 0 0 10px 0; font-size: 13px; height: 30px; }
    .LabelBlock { color: #444; padding: 0 0 5px 0; font-size: 13px; }
    .RequiredFieldStar { font-size: 15px; color: red; font-weight: 500; }
    .StandAloneSelect { COLOR: #000; background-color: white; font-size: 13px; font-family: Roboto, Helvetica, Arial, sans-serif; Height:30px; border:1px solid #BBB; padding: 3px 3px 3px 10px; border-radius: 4px; -webkit-appearance: none; -webkit-appearance: menulist; }

    .FormTextFloat { position: relative; padding-top: 5px; padding-bottom: 10px; display:inline; margin-right:15px; }
    .FormTextFloat label { position: absolute; top: -15px; left: 10px; padding: 2px; z-index: 1; color: #444; }
    .FormTextFloat label:after { content: " "; background-color: #fff; width: 100%; height: 13px; position: absolute; left: 0; bottom: 0; z-index: -1; }
    .FormFieldFloat { box-shadow: none !important; padding: 3px 3px 3px 10px; }
    .FormSelectFloat { Height:35px; }

	.btnPrimary { text-transform: uppercase; background: var(--ButtonColor); border: solid 0px #236946; color: #fff; text-decoration: none; font-family:"Cabin",Trebuchet MS, Helvetica, Arial, sans-serif; font-size:15px; font-weight:bold; font-style:normal; padding:5px 10px; border-radius: 2px; -moz-border-radius: 2px; -webkit-border-radius: 2px; cursor: pointer; -webkit-appearance: none; box-shadow: rgba(50, 50, 93, 0.25) 0px 3px 4px -2px; }
	.btnPrimary:hover,.btnPrimary:focus { background: var(--ButtonColorLowLight); color: #fff; text-decoration: none; }
	.btnPrimarySmall { text-transform: uppercase; background: var(--ButtonColor); border: solid 0px #236946; color: #fff; text-decoration: none; font-family:"Cabin",Trebuchet MS, Helvetica, Arial, sans-serif; font-size:13px; font-weight:bold; font-style:normal; padding:5px 10px; border-radius: 2px; -moz-border-radius: 2px; -webkit-border-radius: 2px; cursor: pointer; -webkit-appearance: none; box-shadow: rgba(50, 50, 93, 0.25) 0px 3px 4px -2px; }
	.btnPrimarySmall:hover { background: var(--ButtonColorLowLight); color: #fff; text-decoration: none; }
  	.btnSecondary { text-transform: uppercase; background: #FFF; border: solid 1px #DDD; color: #AAA; text-decoration: none; font-family:"Cabin",Trebuchet MS,Helvetica, Arial, sans-serif; font-size:15px; font-weight:bold; font-style:normal; padding:5px 10px; border-radius: 2px; -moz-border-radius: 2px; -webkit-border-radius: 2px; cursor: pointer; -webkit-appearance: none; box-shadow: rgba(50, 50, 93, 0.25) 0px 3px 4px -2px; }
	.btnSecondary:hover,.btnSecondary:focus { background: var(--ButtonColorLowLight); color: #fff; text-decoration: none; }
  	.btnSecondarySmall { text-transform: uppercase; background: #FFF; border: solid 1px #DDD; color: #AAA; text-decoration: none; font-family:"Cabin",Trebuchet MS,Helvetica, Arial, sans-serif; font-size:13px; font-weight:bold; font-style:normal; padding:5px 10px; border-radius: 2px; -moz-border-radius: 2px; -webkit-border-radius: 2px; cursor: pointer; -webkit-appearance: none; box-shadow: rgba(50, 50, 93, 0.25) 0px 3px 4px -2px; }
	.btnSecondarySmall:hover,.btnSecondary:focus { background: var(--ButtonColorLowLight); color: #fff; text-decoration: none; }

    @media screen and (max-width: 500px) {
        .btnPrimary { font-size:13px; }
        .btnPrimarySmall { font-size:11px; }
        .btnSecondary { font-size:12px; }
        .btnSecondarySmall { font-size:11px; }
    }

/*-- Responses --*/
	.ErrorBox { background: #f44336; border-radius: 7px; padding: 2px; font-size:13px; COLOR: #FFFFFF; display: inline-block; }
    .ErrorTable { border-collapse: separate; border-spacing: 7px; border:none; }
    .ErrorTable td { vertical-align:top; }
    .ErrorTable .ErrorCross { font-size:25px; color:white; font-weight:bold; line-height:15px; }

	.OKBox { background: #00CC66; border-radius: 7px; padding: 2px; font-size:13px; COLOR: #FFFFFF; display: inline-block; }
    .OKTable { border-collapse: separate; border-spacing: 7px; border:none; }
    .OKTable td { vertical-align:top; }
    .OKTable .OKTick { font-size:25px; color:white; font-weight:bold; line-height:15px; }

/*-- Std Elements --*/
	.Hyperlink { COLOR: #000; TEXT-DECORATION: none; font-weight: bold; }
	a.Hyperlink { COLOR: #000; TEXT-DECORATION: none }
	a:hover.Hyperlink { TEXT-DECORATION: underline }
	a.HyperlinkVisible { COLOR: #333333; TEXT-DECORATION: underline }
	a:hover.HyperlinkVisible { TEXT-DECORATION: none }
	.HyperlinkHidden { COLOR: #333333; TEXT-DECORATION: none; }
	a.HyperlinkHidden { COLOR: #333333; TEXT-DECORATION: none }
	a:hover.HyperlinkHidden { TEXT-DECORATION: underline }

/*-- Property Details Block --*/
    .PropertyDetailsBox { width:95%; max-width:1100px; margin: auto; }
	#PropertyNameBlock { width:95%; max-width:1100px; margin: auto; margin-top:10px; }
	#PropertyTitle { width:50%; float:left; }
	#PropertyTitle h1 { FONT-WEIGHT: bold; FONT-SIZE: 20pt; COLOR: var(--H1Colour); TEXT-DECORATION: none; MARGIN: 0px 0px 3px 0px }
	#PropertyTitle h3 { FONT-WEIGHT: bold; FONT-SIZE: 10pt; color: #555; MARGIN: 0px 0px 7px 0px }
	#PropertyLogo { width:50%; float:right; text-align:right; }

/*-- Page footer --*/
    #CopyrightFooter { width:95%; max-width:1100px; margin: auto; FONT-SIZE: 8pt; COLOR: #AAA; text-align:left; TEXT-DECORATION: none; margin-top:8px; text-align:center; }
    #CopyrightFooter a, #CopyrightFooter a:hover { FONT-SIZE: 8pt; COLOR: #AAA; text-align:left; TEXT-DECORATION: none; cursor: text;}

/*-- RegionalDropdown --*/
    .RegionalOptionsBox { width:95%; max-width:1100px; margin: auto; }
    .RegionalDropdown { position: relative; display: inline-block; float:right; margin-left: 20px; }
    .RegionalDropbtn { color: #00182C; padding: 0px; FONT-SIZE: 10pt; border: none; cursor: pointer; text-decoration:none; }
    .RegionalDropdown-content { display: none; position: absolute; background-color: #f9f9f9; box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); z-index: 1; left:-30px; }
    .LanguageDropDown { min-width: 175px; }
    .CurrencyDropDown { min-width: 300px; }
    .RegionalDropdown-content a { color: black; padding: 12px 16px; text-decoration: none; display: block; }
    .RegionalDropdown-content a:hover { background-color: #f1f1f1 }
    .RegionalDropdown:hover .RegionalDropdown-content { display: block; }
    .RegionalDropdown:hover .RegionalDropbtn { /*background-color: #3e8e41;*/ }
	.TranslationErrors { COLOR: #000; TEXT-DECORATION: none; FONT-SIZE: 10pt; }
	a.TranslationErrors { COLOR: #000; TEXT-DECORATION: none }
	a:hover.TranslationErrors { TEXT-DECORATION: underline }

/*-- Search Page --*/

    /*-- Search Bar --*/
        #SearchBar { background: #f5f5f5; border-radius: 7px; padding: 15px; font-size:13px; }
        #SearchBarDates { float:left; height:50px; }
        #SearchBarDatesSimple { float:left; height:50px; }
        #SearchBarNights { float:left; height:50px; }
        #SearchBarGuests { float:left; height:50px; }
        #SearchBarInfants { float:left; height:50px; }
        #SearchBarButton { float:left; padding-left:10px; line-height:35px; }
        #SearchBarOfferCode { float:left; padding-left:10px; }
        #SearchSpecialOfferCodeLink { line-height:50px; font-size:12px; }
        #SearchBar .DatePickerBox { background-color: #FFFFFF; font-size: 14px; font-family: Roboto, Helvetica, Arial, sans-serif; Height:30px; border:1px solid #BBB; padding: 3px 3px; border-radius: 4px; width:180px; }
        #SearchBar .FieldBlock { color: #555555; padding: 0 5px 0 5px; font-size: 14px; display:inline-block; }
        #SearchBar .LabelBlock { color: #555555; padding: 0 5px 0 5px; font-size: 14px; display:inline-block; }
        .VerticalAlign { vertical-align:middle; }

    	/*-- Responsive blocks --*/
		@media screen and (max-width: 940px) {
            #SearchBar { width:100%; display:block; }
			#SearchBarButton { display:block; padding:0px; width:100%; }
		}

		@media screen and (max-width: 850px) {
            #SearchBarOfferCode { float:left; padding-left:0px; clear:left; }
            #SearchBarButton { float:left; width:auto; }
		}

		@media screen and (max-width: 690px) {
            #SearchBarInfants { float:left; clear:left; }
            #SearchBarOfferCode { float:left; clear:none; }
		}

		@media screen and (max-width: 590px) {
            #SearchBarInfants { float:left; clear:none; }
            #SearchBarOfferCode { float:left; clear:left; }
            /*#SearchBarDates { display:none; }*/
		}

		@media screen and (max-width: 450px) {
            #SearchBarOfferCode { float:left; clear:none; }
            #SearchBarButton { float:left; clear:left; }
            h1 { font-size:18px; }
            h2 { font-size:16px; }
            #PropertyTitle h1 { font-size:18px; }
		}

    /*-- Special Offers --*/
        #SpecialOffersBox, #SpecialOffersBoxSingle { float:left; display: grid; grid-template-columns: 300px 20px; background: #FAFAFA; border-radius: 7px; padding: 10px; font-size:13px;  grid-row-gap: 0px; margin-top:10px; margin-right:10px; }
		.SpecialOffersHeader { FONT-SIZE: 16px; FONT-WEIGHT: 500; COLOR: var(--H2Colour); MARGIN: 0px 0px 0px 0px; text-transform: none; float:left; display:block;  }
        .SpecialOffersTitleIcon { COLOR: var(--H2Colour); FONT-SIZE: 20px; padding-right:5px; }
		.SpecialOffersChevron, a.SpecialOffersChevron { FONT-SIZE: 16px; FONT-WEIGHT: 500; COLOR: var(--H2Colour); MARGIN: 0px 0px 0px 0px; text-transform: none; }

        .SpecialOffersPic { COLOR: #00CC66; FONT-SIZE: 40px; }
		.SpecialOfferRHS { width:100%; PADDING: 0px 0px 0px 0px; MARGIN: 0px 0px 10px 0px; display:block; float:right; border: solid 0px #990000; border-collapse:collapse; }
		.SpecialOfferTitle { COLOR: var(--H2Colour); FONT-WEIGHT: bold; FONT-SIZE: 11pt; display:block; PADDING: 5px 10px 0px 10px; margin: 0px; } 
		.SpecialOfferDetail { background: #FAFAFA; COLOR: #000; FONT-WEIGHT: normal; FONT-SIZE: 9pt; display:block; padding: 2px 10px 5px 10px; }
		.SpecialOfferSmallPrint { background: #FAFAFA; COLOR: #AAA; FONT-WEIGHT: normal; FONT-SIZE: 8pt; display:block; padding: 0px 10px 5px 10px; }

    /*-- Shopping Basket --*/
        #ShoppingBasketBox { float:left; background: #FAFAFA; border-radius: 7px; padding: 10px; font-size:13px;  grid-row-gap: 0px; margin-top:10px; margin-right:10px; }
		.ShoppingBasketHeader { float:left; display:block; FONT-SIZE: 16px; FONT-WEIGHT: 500; COLOR: var(--H2Colour); MARGIN: 0px 20px 0px 0px; text-transform: none;  }
        .ShoppingBasketTitleIcon { COLOR: var(--H2Colour); FONT-SIZE: 20px; padding-right:5px; }
        .ShoppingBasketContentBlock { float:left; } 
        .ShoppingBasketContent { float:left; line-height: 25px; font-family: Roboto, Helvetica, Arial, sans-serif; FONT-SIZE: 13px; FONT-WEIGHT: 400; COLOR: #333333; MARGIN: 0px 20px 0px 0px; }
        .ShoppingBasketButtons { float:left; line-height: 25px; }

    	/*-- Responsive blocks --*/
		@media screen and (max-width: 650px) {
            .ShoppingBasketContentBlock { display:block; margin-top:10px; width:100%; } 
            #ShoppingBasketBox { margin-right:0px; }
        }

    /*-- Notes --*/
        .SearchHeader { font-family: Roboto, Helvetica, Arial, sans-serif; FONT-SIZE: 12px; FONT-WEIGHT: 400; COLOR: #999; display:inline-block; }
        #TopNote { display:inline-block; background: #ffffe6; border-radius: 5px; padding:9px; margin-bottom: 7px; margin-top: 7px; }

    /*-- Display Tabs --*/
        .SearchDisplayTabs1 { width:100%; display: grid; grid-template-columns: max-content auto; grid-row-gap: 0px; align-items: center; padding-top:0px; padding-bottom:0px; vertical-align: top; margin-bottom:10px; margin-top:10px; }
        .SearchDisplayTabs2 { width:100%; display: grid; grid-template-columns: max-content max-content auto; grid-row-gap: 0px; align-items: center; padding-top:0px; padding-bottom:0px; vertical-align: top; margin-bottom:10px; margin-top:10px; }
        .SearchDisplayTabs3 { width:100%; display: grid; grid-template-columns: max-content max-content max-content auto; grid-row-gap: 0px; align-items: center; padding-top:0px; padding-bottom:0px; vertical-align: top; margin-bottom:10px; margin-top:10px; }
        .NewTabs { margin-bottom: 10px; }
        .NewTabActive { float:left; background-color: white; font-size: 10pt; font-weight:500; text-decoration: none; display: inline-block; PADDING: 5px 7px 7px 7px; color: black; text-align: center; border-color: #DDD; top: 1px; border-top: 3px solid var(--CustomColor); border-bottom: 0px; border-top-left-radius: 5px; border-top-right-radius: 5px; border-left: 2px solid #DDD; border-right: 2px solid #DDD; margin-right:2px; }
        .NewTabNotActive { float:left; background-color: #eee; font-size: 10pt; text-decoration: none; display: inline-block; PADDING: 5px 7px 7px 7px; color: black; text-align: center; border-color: #DDD; top: 1px; border-top: 3px solid var(--CustomColor); border-bottom: 0px; border-top-left-radius: 5px; border-top-right-radius: 5px; border-left: 2px solid #DDD; border-right: 2px solid #DDD; margin-right:2px; }
        .NewTabFiller { height:100%; border-bottom: 2px solid #DDD; }

    /*-- Availability Grid --*/
        .NewTable { width:100%; min-width: 300px; margin: 0 0; border-collapse: collapse; font-size: 0.9em;  margin-bottom:20px; }
        .NewTable thead tr { background-color: white; color: #ffffff; text-align: left; }
        .NewTable th:first-child { border-top-left-radius: 5px; }
        .NewTable th:last-child { border-top-right-radius: 5px; }
        .NewTable th { padding: 5px 5px; }
        .NewTable td { padding: 5px 5px;  }
        .NewTable tbody tr:first-of-type { border-bottom: 1px solid #fff; }
        .NewTable tbody tr { border-bottom: 1px solid #ddd; }
        .NewTable tbody tr:nth-of-type(even) { background-color: #f9f9f9; }
        .NewTable tbody tr:last-of-type { border-bottom: 2px solid #009879; }
        .NewTable tbody tr.active-row { font-weight: bold; color: #009879; }

        .NewHeaderTopRow {  -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; }
        .NewHeaderText { color:white; height:100%; text-align:left; vertical-align:middle; line-height:30px; background-color: var(--TableHeader) !important; border-color: var(--TableHeader); border-top-left-radius: 7px; }
        .NewHeaderWeekday { color:white; background-color: var(--TableHeader) !important; border-color: var(--TableHeader);}
        .NewHeaderWeekend { color:white; background-color: var(--TableHeaderHiLighted) !important; border-color: var(--TableHeader);}
        .NewHeaderSelected { color:white; background-color: var(--TableHeader) !important; color:#ffffcc; border-color: var(--TableHeader); }
        .NewHeaderRHSCell { border-top-right-radius: 7px ; }

	    .btnAvailabilityPrevNext { text-transform: uppercase; background: #eee; border: solid 1px #ddd; color: #000; font-family:"Roboto",Trebuchet MS; font-size:11px; font-weight:400; font-style:normal; padding: 4px 5px;  border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; cursor: pointer; text-decoration: none; -webkit-appearance: none;}
	    a.btnAvailabilityPrevNext { text-decoration: none;}
	    .btnAvailabilityPrevNext:hover { background: #ccc; text-decoration: none; }

		#PriceInfoBlock { width:100%; padding: 10px 0 10px 0; font-size:8pt; color: #666; background-color: yellow; }
        .AvailabilityRoomThumbnail { cursor:pointer; object-fit: cover; height: 80px;  }

        .BookingGridPrice { COLOR: black; FONT-WEIGHT: normal; FONT-SIZE: 9pt; TEXT-DECORATION: none; padding:0px; line-height:40px; }
        .BookingGridPriceLink { COLOR: black; FONT-WEIGHT: normal; FONT-SIZE: 9pt; TEXT-DECORATION: underline; padding:0px; line-height:40px; }
        a:hover.BookingGridPriceLink { TEXT-DECORATION: underline; }
        .BookingGridPriceNotes { COLOR: black; FONT-WEIGHT: normal; FONT-SIZE: 9pt; TEXT-DECORATION: none;  padding:0px; line-height:40px; }
        .Sold { TEXT-DECORATION: none; FONT-SIZE: 7pt; COLOR: #777; line-height:40px; }
        a.Sold { TEXT-DECORATION: none; FONT-WEIGHT: normal; FONT-SIZE: 7pt; COLOR: #777; }
        a:hover.Sold { TEXT-DECORATION: underline; }

        /*-- Tooltips http://www.cssportal.com/css-tooltip-generator/ --*/

	        /* -- 1 line --*/
	        a.tooltipsOneLine { position: relative; display: inline; COLOR: black; TEXT-DECORATION: underline; }
	        a.tooltipsOneLine span { position: absolute; width:200px; color: #000000; background: #ffff99; height: 35px; padding-top: 0px; line-height: 35px; text-align: center; visibility: hidden; border-radius: 6px; font-family: "Roboto", Arial, Helvetica, sans-serif; font-size: 9pt; }
	        a.tooltipsOneLine span:after { content: ''; position: absolute; bottom: 100%; left: 50%; margin-left: -8px; width: 0; height: 0; border-bottom: 8px solid #ffff99; border-right: 8px solid transparent; border-left: 8px solid transparent; }
	        a:hover.tooltipsOneLine span { visibility: visible; opacity: 1; top: 35px; left: 50%; margin-left: -110px; z-index: 99; }

	        /* -- 1 line short --*/
	        a.tooltipsOneLineShort { position: relative; display: inline; COLOR: black; TEXT-DECORATION: underline; }
	        a.tooltipsOneLineShort span { position: absolute; width:150px; color: #000000; background: #ffff99; height: 35px; padding-top: 0px; line-height: 35px; text-align: center; visibility: hidden; border-radius: 6px; font-family: "Roboto", Arial, Helvetica, sans-serif; font-size: 9pt; }
	        a.tooltipsOneLineShort span:after { content: ''; position: absolute; bottom: 100%; left: 50%; margin-left: -15px; width: 0; height: 0; border-bottom: 8px solid #ffff99; border-right: 8px solid transparent; border-left: 8px solid transparent; }
	        a:hover.tooltipsOneLineShort span { visibility: visible; opacity: 1; top: 35px; left: 50%; margin-left: -80px; z-index: 99; }
    
	        /* -- 2 lines --*/
	        a.tooltips { position: relative; display: inline; COLOR: #000; TEXT-DECORATION: underline; }
	        a.tooltips span { position: absolute; width:150px; color: #000000; background: #66FF66; height: 45px; padding-top: 10px; line-height: 17px; text-align: center; visibility: hidden; border-radius: 6px; font-family: "Roboto", Arial, Helvetica, sans-serif; font-size: 9pt; }
	        a.tooltips span:after { content: ''; position: absolute; bottom: 100%; left: 50%; margin-left: -8px; width: 0; height: 0; border-bottom: 8px solid #66FF66; border-right: 8px solid transparent; border-left: 8px solid transparent; }
	        a:hover.tooltips span { visibility: visible; opacity: 1; top: 30px; left: 50%; margin-left: -50px; z-index: 99; }

		/*-- Deals View --*/
            .DealsGrid { width:100%; display: grid; grid-template-columns: 340px auto 120px; grid-row-gap: 0px; align-items: center; padding-top:10px; padding-bottom:10px; vertical-align: top;  }
            .DealsGridRoomOdd { background-color: #FAFAFA; border-bottom: 1px solid #DDD; }
            .DealsGridRoomEven { background-color: #fff; border-bottom: 1px solid #DDD; }
            .DealsGridCellStart { padding-left:10px; height: 100%; vertical-align: top; }
            .DealsGridCell { padding-left:20px; height: 100%; vertical-align: top; }
            .DealsGridCellEnd { padding-left:20px; padding-right:10px; height: 100%; text-align: right; vertical-align: top; }
            .DealsRoomSpacer { width:100%; display: block; height: 1px; background-color: #DDD; }

            .DealsRoomTitle { TEXT-DECORATION: none; font-family: Roboto, Helvetica, Arial, sans-serif; FONT-SIZE: 12pt; COLOR: #000; FONT-WEIGHT: bold; MARGIN: 0px 0px 4px 0px; }
			.DealsBestAvailableRate { font-family: Roboto, Helvetica, Arial, sans-serif; FONT-SIZE: 20pt; COLOR: #00182C; FONT-WEIGHT: bold; MARGIN: 0px 0px 0px 0px; display:block; }			

            .DealsMainRoomPhotoContainer { position: relative; height:220px; }
            .DealsMainRoomPhotoContainer img { display: block; cursor:pointer; width: 330px; height: 220px; overflow: hidden; object-fit: cover; }
            .DealsMainRoomPhotoContainer .fa-magnifying-glass { position: absolute; bottom:0px; right:0px; padding: 12px; transition: 0.6s ease; border-radius: 5px; user-select: none; text-decoration: none; }
            .DealsMainRoomPhotoPrev,.DealsMainRoomPhotoNext { cursor: pointer; position: absolute;  top: 60%; width: auto; padding: 16px; margin-top: -50px; color: white; font-weight: bold; font-size: 20px; transition: 0.6s ease; border-radius: 0 3px 3px 0; user-select: none; text-decoration: none; -webkit-user-select: none; }
            .DealsMainRoomPhotoNext { right: 0; border-radius: 3px 0 0 3px; }
            .DealsMainRoomPhotoPrev:hover, .DealsMainRoomPhotoNext:hover, .fa-magnifying-glass:hover { background-color: rgba(0, 0, 0, 0.3); }
            .DealMainPhotoNumber { color: #f2f2f2; font-size: 12px; padding: 8px 12px; position: absolute; top: 0; }
            #DealsPhotoThumbs { display: grid; grid-auto-columns: 1fr; grid-auto-flow: column; width:auto; column-gap: 5px; margin-top:5px; vertical-align:middle; }
            .RoomThumbnail { cursor:pointer; object-fit: cover; height: 40px; }

			@media screen and (max-width: 1000px) {
                .DealsMainRoomPhotoContainer img { display: block; cursor:pointer; width: 100%; overflow: hidden; object-fit: cover; }
            }

            .DealsRateCardGrid { width:100%; display:table; padding-top:5px; padding-bottom:5px; }
            .DealsRateCardDescription { display:table-cell; height: 100%; display: grid; align-items: center; }
            .DealsRateCardPrice { display:table-cell; width:80px; line-height:30px; font-family: Roboto, Helvetica, Arial, sans-serif; FONT-SIZE: 16pt; COLOR: #00182C; FONT-WEIGHT: bold; }
            .DealsRateCardPriceUnavailable { display:table-cell; width:80px; line-height:30px; font-family: Roboto, Helvetica, Arial, sans-serif; FONT-SIZE: 16pt; COLOR: #AAA; FONT-WEIGHT: bold; }
            .DealsRateCardQty { display:table-cell; width: 100px; line-height:30px; }
            .DealsRateCardButton { display:table-cell; width: 100px; line-height:30px; }
            .DealsRateCardUnbookable { display:table-cell; width: 200px; line-height:30px; }

			@media screen and (max-width: 450px) {
                .DealsRateCardPrice { width: 60px; FONT-SIZE: 14pt; }
                .DealsRateCardPriceUnavailable { width: 60px; FONT-SIZE: 14pt; }
                .DealsRateCardQty { width: 80px; }
                .DealsRateCardButton { width: 60px; }
                .DealsRateCardUnbookable { width: 140px; }
            }

            /*-- Modal photo window --*/
                .modal { display: none; position: fixed; z-index: 1; padding-top: 0px; left: 0; top: 0; width: 100%; height: 100%; overflow: auto; background-color: black; }
                .close { color: white; position: absolute; top: 10px; right: 25px; font-size: 35px; font-weight: bold; z-index:100; }
                .close:hover, .close:focus { color: #999; text-decoration: none; cursor: pointer; }
                .mySlides { /*display: none;*/ }
                .cursor { cursor: pointer; }
                #caption { text-align: center; color: white; font-size: 20px; position: absolute; bottom:20px; z-index:100; width:100%; }

                /* #modalRoomPhotos .modal-content { position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); width:100%; background:yellow; } */

                #modalRoomPhotos .modal-content { width: 100%; height: 88%; margin-top:20px; margin-bottom:20px; }
                #PhotoHolder { width:90%; height:100%; margin:auto; }
                #DealMainModalPhoto { position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); max-height:88%; object-fit: cover; }  /* -- max-height:50%; -- */

                #DealMainModalPhotoRoomType { text-align: center; color: white; font-size: 20px; margin-top: 20px; z-index:100; }
                #DealMainModalPhotoNumber { color: #f2f2f2; font-size: 20px; font-weight: bold; position: absolute; margin-top: 20px; left: 25px; z-index: 100; }
                .DealsMainRoomModalPhotoPrev,.DealsMainRoomModalPhotoNext { background-color:#222222; cursor: pointer; position: absolute; top: 55%; width: auto; padding: 16px; margin-top: -50px; color: white; font-weight: bold; font-size: 35px; transition: 0.6s ease; border-radius: 0 3px 3px 0; user-select: none; text-decoration: none; -webkit-user-select: none; z-index:100; }
                .DealsMainRoomModalPhotoPrev { left: 5px; }
                .DealsMainRoomModalPhotoNext { right: 5px; border-radius: 3px 0 0 3px; }
                .DealsMainRoomModalPhotoPrev:hover, .DealsMainRoomModalPhotoNext:hover { background-color: rgba(0, 0, 0, 0.3); }

			    @media screen and (max-width: 700px) {
                .DealsMainRoomModalPhotoPrev,.DealsMainRoomModalPhotoNext { background-color: rgba(0, 0, 0, 0.1); }
                }

            /*-- Photo slideshow --*/
                /*#PhotoSlideshow .modal { display: block; position: fixed; z-index: 1; padding-top: 0px; left: 0; top: 0; width: 100%; height: 100%; max-height:600px; overflow: auto; background-color: black; }
                #PhotoSlideshow .close { color: black; position: absolute; top: 10px; right: 25px; font-size: 35px; font-weight: bold; z-index:100; text-decoration: none; }
                #PhotoSlideshow #caption { text-align: center; color: black; font-size: 20px; position: absolute; margin-top: 20px; right:25px; z-index:100; width:100%; }
                #PhotoSlideshow #DealMainModalPhotoNumber { color: black; font-size: 20px; font-weight: bold; position: absolute; margin-top: 0px; left: 25px; z-index: 100; }
                #PhotoSlideshow #DealMainModalPhotoRoomType { text-align: center; color: black; font-size: 20px; margin-top: 20px; z-index:100; }
                #PhotoSlideshow #PhotoHolder { width:90%; height:100%; margin:auto; margin-top:50px; }*/

                #PhotoSlideshow { width:100%; height:1000px; }
                #PhotoSlideshow_TopRow { display:table; width:100%; height:60px; color:black; clear:both; vertical-align:middle; }
                #PhotoSlideshow_SlideNumbers { display:table-cell; width:10%; text-align: center; font-size: 20px; font-weight: bold; vertical-align:middle; }
                #PhotoSlideshow_Title { display:table-cell; width:80%; text-align: center; font-size: 20px; font-weight: bold; vertical-align:middle; }
                #PhotoSlideshow_Close { display:table-cell;  width:10%; text-align: center; vertical-align:middle; }
                #PhotoSlideshow_Close_Link { font-size: 35px; font-weight: bold; color:black; text-decoration: none; vertical-align:middle; }

                #PhotoSlideshow_PhotoRow { display:block; width:100%; clear:both; background-color: yellow;  }
                #PhotoSlideshow_Photo { display:block; width:100%; max-height:600px; margin: auto; object-fit: cover; overflow:hidden; }

                /*  Background image approach
                #PhotoSlideshow_PhotoRow { display:block; width:100%; clear:both; background-image: 'http://localhost/FOB/Images/Photos/RoomPhotos/1185_78266820-5b60-4d0b-878a-b20e662058b2.jpg'; background-size:cover; background-position:center; background-repeat:no-repeat; }
                */

                /*  Flex approach - doesnt work                
                #PhotoSlideshow_PhotoRow { width:100%; height:800px; display:flex; justify-content:center; align-items:center; overflow:hidden }
                #PhotoSlideshow_Photo { flex-shrink:0; -webkit-flex-shrink: 0; max-width:90%; max-height:90%; }
                */

                #PhotoSlideshow_Prev { left:10px; position: absolute; top:350px; width:30px; padding-left:5px; padding-bottom:5px; background-color:#222222; cursor: pointer; color: white; font-weight: bold; font-size: 35px; transition: 0.6s ease; border-radius: 0 3px 3px 0; user-select: none; text-decoration: none; -webkit-user-select: none; z-index:100; }
                #PhotoSlideshow_Next { right:10px; position: absolute; top:350px; width:30px; padding-left:5px; padding-bottom:5px; background-color:#222222; cursor: pointer; color: white; font-weight: bold; font-size: 35px; transition: 0.6s ease; border-radius: 3px 0 0 3px; user-select: none; text-decoration: none; -webkit-user-select: none; z-index:100; }
                #PhotoSlideshow_BottomRow { display:block; width:100%; font-size: 20px; font-weight: bold; color:black; text-align: center; vertical-align:middle; height:60px; line-height:60px; clear:both; }

			    @media screen and (max-width: 700px) {
                    #PhotoSlideshow_TopRow { height:40px; }
                    #PhotoSlideshow_SlideNumbers { font-size: 15px; }
                    #PhotoSlideshow_Title { font-size: 15px; }
                    #PhotoSlideshow_Prev { top:200px; }
                    #PhotoSlideshow_Next { top:200px; }
                    #PhotoSlideshow_BottomRow { font-size: 15px; height:40px; line-height:40px; }
                }


		/*-- Weekly Deals View --*/
            #WeeklyDeals10 { display:block; }
            #WeeklyDeals6 { display:none; }
            #WeeklyDeals4 { display:none; }
            .WeeklyDealsGrid { width:100%; display: grid; grid-template-columns: 340px auto; grid-row-gap: 0px; align-items: center; padding-top:10px; padding-bottom:10px; vertical-align: top; }
            .WeeklyDealsContainer { width:100%; height:100%; padding-left:15px; vertical-align:top; }
            .WeeklyDealsAvailabilityButtonGrid { width:100%; display: grid; grid-template-columns: auto 275px 275px; grid-row-gap: 0px; align-items: center; padding-top:0px; padding-bottom:5px; vertical-align: top; }
            .WeeklyDealsAvailabilityButtonGrid div {  }
            .WeeklyDealsAvailabilityDatesGrid { width:100%; display: grid; grid-template-columns: auto repeat(10, 55px); grid-row-gap: 0px; align-items: center; padding-top:0px; padding-bottom:0px; vertical-align: top; }
            .WeeklyDealsAvailabilityDatesGrid div { text-align:center; }
            .WeeklyDealsAvailabilityGrid { width:100%; display: grid; grid-template-columns: auto repeat(10, 55px); grid-row-gap: 0px; align-items: center; padding-top:0px; padding-bottom:0px; vertical-align: top; } 
            .GridEven { line-height:40px; text-align:center; padding: 0px; padding-left:5px; border-bottom: 1px solid #dddddd; }
            .GridEvenBottom { line-height:40px; text-align:center; padding: 0px; padding-left:5px; border-bottom: 2px solid #009879; }
            .GridOdd { line-height:40px; text-align:center; padding: 0px; padding-left:5px; border-bottom: 1px solid #dddddd; background-color: #FFFFFF; }
            .GridOddBottom { line-height:40px; text-align:center; padding: 0px; padding-left:5px; border-bottom: 2px solid #009879; background-color: #FFFFFF; }

			@media screen and (max-width: 1170px) {
                /*.DealsGridCellStart { visibility:hidden; }
                .WeeklyDealsContainer { visibility:hidden; }*/
                .WeeklyDealsAvailabilityButtonGrid { width:400px; grid-template-columns: 200px 165px 165px; }
                .WeeklyDealsAvailabilityDatesGrid { width:400px; grid-template-columns: 200px repeat(10, 55px); }
                .WeeklyDealsAvailabilityGrid { width:400px; grid-template-columns: 200px repeat(10, 55px); background-color: green; }
                .WeeklyDealsAvailabilityDatesGrid > div:nth-child(n+8) {
                  visibility: hidden;
                  width:0px;
                }
                .WeeklyDealsAvailabilityGrid > div:nth-child(n+8) {
                  visibility: hidden;
                  width:0px;
                }
			}

			@media screen and (max-width: 1100px) {
                #WeeklyDeals10 { display:none; }
                #WeeklyDeals6 { display:block; }
                #WeeklyDeals4 { display:none; }
            }

			@media screen and (max-width: 1000px) {
                .WeeklyDealsGrid { width:100%; display: grid; grid-template-columns: 280px auto; grid-row-gap: 0px; align-items: center; padding-top:10px; padding-bottom:10px; vertical-align: top; }
                .WeeklyDealsAvailabilityButtonGrid { width:400px; grid-template-columns: 200px 110px 110px; }
                .WeeklyDealsAvailabilityDatesGrid { width:400px; grid-template-columns: 200px repeat(10, 55px); }
                .WeeklyDealsAvailabilityGrid { width:400px; grid-template-columns: 200px repeat(10, 55px); }
                .WeeklyDealsAvailabilityDatesGrid > div:nth-child(n+6) {
                  visibility: hidden;
                  width:0px;
                }
                .WeeklyDealsAvailabilityGrid > div:nth-child(n+6) {
                  visibility: hidden;
                  width:0px;
                }
			}

			/*@media screen and (max-width: 880px) {
                .WeeklyDealsGrid { width:100%; display: block; grid-template-columns: 340px auto 0px; grid-row-gap: 0px; align-items: center; }
			}*/

			@media screen and (max-width: 800px) {
                #WeeklyDeals10 { display:none; }
                #WeeklyDeals6 { display:none; }
                #WeeklyDeals4 { display:block; }
                .WeeklyDealsGrid { width:100%; display: grid; grid-template-columns: 200px auto; grid-row-gap: 0px; align-items: center; padding-top:10px; padding-bottom:10px; vertical-align: top; }
			}

			@media screen and (max-width: 730px) {
                #WeeklyDeals10 { display:none; }
                #WeeklyDeals6 { display:block; }
                #WeeklyDeals4 { display:none; }
			}

			@media screen and (max-width: 590px) {
                #WeeklyDeals10 { display:none; }
                #WeeklyDeals6 { display:none; }
                #WeeklyDeals4 { display:block; }
			}

            .WeeklyDealsRateCardGrid { width:100%; display:table; padding-top:5px; padding-bottom:5px; }
            .WeeklyDealsDate { display:table-cell; width:130px; line-height:30px; font-family: Roboto, Helvetica, Arial, sans-serif; FONT-SIZE: 11pt; COLOR: #00182C; FONT-WEIGHT: bold; }
            .WeeklyDealsRateCardDescription { display:table-cell; height: 100%; display: grid; align-items: center; }
            .WeeklyDealsRateCardPrice { display:table-cell; width:80px; line-height:30px; font-family: Roboto, Helvetica, Arial, sans-serif; FONT-SIZE: 12pt; COLOR: #00182C; FONT-WEIGHT: bold; }
            .WeeklyDealsRateCardPriceUnavailable { display:table-cell; width:80px; line-height:30px; font-family: Roboto, Helvetica, Arial, sans-serif; FONT-SIZE: 16pt; COLOR: #AAA; FONT-WEIGHT: bold; }
            .WeeklyDealsRateCardQty { display:table-cell; width: 100px; line-height:30px; }
            .WeeklyDealsRateCardButton { display:table-cell; width: 100px; line-height:30px; }

            .QtySelect { COLOR: #000; background-color: white; font-size: 13px; font-family: Roboto, Helvetica, Arial, sans-serif; Height:25px; border:1px solid #BBB; padding: 1px 1px 1px 1px; border-radius: 4px; -webkit-appearance: none; -webkit-appearance: menulist; }
            .UnavailableRateCard { text-transform: uppercase; background: #DDD; border: solid 0px #236946; color: #fff; text-decoration: none; font-family:"Cabin",Trebuchet MS, Helvetica, Arial, sans-serif; font-size:13px; font-weight:bold; font-style:normal; padding: 5px 10px 5px 10px; border-radius: 2px; -moz-border-radius: 2px; -webkit-border-radius: 2px; cursor: default; -webkit-appearance: none; box-shadow: rgba(50, 50, 93, 0.25) 0px 3px 4px -2px; }
            .RateCardSpacer { width:100%; display: block; height: 1px; background-color: #EEE; margin-top:3px; margin-bottom:3px; }
            .Spacer5 { width:100%; display: block; height:5px; }

			.Wait { z-index:20; display: none; font-size: 8pt; width:42px; height:35px; position:absolute;  padding: 5px; text-align:center; vertical-align:middle; }
			.ProcessingPopup { width:255px; position:absolute; top: 50%; left: 50%; margin:-50px 0 0 -150px; /* [-(height/2)px 0 0 -(width/2)px] */ background: #FFF; /*border: 5px solid #333;*/ /* browsers that don't support rgba */ /*border: 5px solid rgba(0,0,0,.7);*/ border: 5px solid orange; border-radius: 8px; box-shadow: 0 3px 3px rgba(0,0,0,.3); -webkit-background-clip: padding;     /* Safari 4? Chrome 6? */    -moz-background-clip: padding;     /* Firefox 3.6 */        background-clip: padding-box; /* Firefox 4, Safari 5, Opera 10, IE 9 */ text-align: center; padding: 20px; /*vertical-align: middle;*/ display:none; }

		/*-- Add to booking popup - Modal -- */
            #modal { display: none; position: fixed; z-index: 100; top:0; left:0; padding-top: 50px; width: 100%; height: 100%; overflow: auto; background-color: rgb(0,0,0); background-color: rgba(0,0,0,0.4); }
            #modal .modal-content { display:block; width: 460px; height: 380px; position: fixed; top: 50%; left: 50%;  margin-right: -50%; transform: translate(-50%, -50%);  padding: 20px; color:#000; background-color:#fff; border:4px solid #ddd; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; box-shadow: 0px 0px 4px rgba(0,0,0,0.7); -webkit-box-shadow: 0 0 4px rgba(0,0,0,0.7); -moz-box-shadow: 0 0px 4px rgba(0,0,0,0.7); z-index:1000; }
			#modal .modal-header { FONT-FAMILY: "Roboto", "Trebuchet MS", Arial, Helvetica, sans-serif; FONT-WEIGHT: bold; FONT-SIZE: 20px; COLOR: #344282; TEXT-DECORATION: none; MARGIN: 0px 0px 10px 0px }
            #modal .close { color: #aaaaaa; float: right; font-size: 28px; font-weight: bold; }
            #modal .close:hover,
            #modal .close:focus { color: #000; text-decoration: none; cursor: pointer; }

			@media screen and (max-width: 490px) {
                #modal .modal-content { width: 98%; }
            }

		/*-- Add to booking popup --*/
			#divProcessing { width:240px; height: 32px; line-height:32px; vertical-align: middle; TEXT-DECORATION: none; FONT-SIZE: 14pt; COLOR: #000; FONT-WEIGHT: bold; PADDING: 0px 0px 0px 40px; MARGIN: 0px 0px 4px 0px; display:block; background: url('../../Images/Processing.gif') no-repeat 0px 0px #FFFFFF; }
			#divRoomBooking #RoomTitle { FONT-WEIGHT: bold; FONT-SIZE: 20px; COLOR: #000; TEXT-DECORATION: none; MARGIN: 0px 0px 15px 0px }
			#divRoomBooking #RoomDescription { width:100%; FONT-SIZE:10pt; COLOR: #000; TEXT-DECORATION: none; MARGIN: 0px 0px 15px 0px }
			#divRoomBooking .RoomSelectionTable { FONT-SIZE:10pt; COLOR: #000; }
			#divRoomBooking .AddToRes-TotalCost { FONT-SIZE:11pt; COLOR: #344282; FONT-WEIGHT: bold; }
			#AddToBookingRoomDescriptionBlock { display:block; }
			#AddToBookingRoomDescriptionBlockMobile { display:none; }
			.AddToSpacer { min-width:15px; }
			a.AddToBookingButton { text-decoration: none; }

		/*-- Add to booking page --*/
            #modalAddToBookingPage { display: block; z-index: 100; top:0; left:0; padding-top: 20px; padding-bottom: 20px; width: 100%; overflow: auto; }
            #modalAddToBookingPage .modal-content { display:block; width: 95%; max-width:500px; margin:auto; padding: 20px; color:#000; background-color:#fff; border:4px solid #ddd; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; z-index:1000; }
			#modalAddToBookingPage .modal-header { FONT-FAMILY: "Roboto", "Trebuchet MS", Arial, Helvetica, sans-serif; FONT-WEIGHT: bold; FONT-SIZE: 20px; COLOR: #344282; TEXT-DECORATION: none; MARGIN: 0px 0px 10px 0px }
            #modalAddToBookingPage .close { color: #aaaaaa; float: right; font-size: 28px; font-weight: bold; }
            #modalAddToBookingPage .close:hover,
            #modalAddToBookingPage .close:focus { color: #000; text-decoration: none; cursor: pointer; }

		/*-- Responsive blocks --*/			
            #Deals { display: block; }
			#DealsMobile { display: none; }
			#Results14 { display: block; }
			#Results7 { display: none; }
			#Results5 { display: none; }
			#Results3 { display: none; }

			@media screen and (max-width: 1200px) {
				#Results21 { display: none; }
				#Results14 { display: block; }
				#Results7 { display: none; }
				#Results5 { display: none; }
				#Results3 { display: none; }	
			}

			@media screen and (max-width: 1000px) {
                .DealsGrid { width:100%; display: grid; grid-template-columns: 280px auto 0px; grid-row-gap: 0px; align-items: center; padding-top:10px; padding-bottom:10px; vertical-align: top;  }
                .DealsGridCellEnd { display: none; }
                .RateCardGrid { padding-right:10px; }
			}

			@media screen and (max-width: 940px) {
				#Results21 { display: none; }
				#Results14 { display: none; }
				#Results7 { display: block; }
				#Results5 { display: none; }	
				#Results3 { display: none; }	
			}

			@media screen and (max-width: 800px) {
                .DealsGrid { width:100%; display: grid; grid-template-columns: 200px auto 0px; grid-row-gap: 0px; align-items: center; padding-top:10px; padding-bottom:10px; vertical-align: top;  }
                .DealsGridCellStart { padding-left:10px; height: 100%; vertical-align: top; }
                .DealsGridCell { padding-left:20px; height: 100%; vertical-align: top; }
                .DealsGridCellEnd { display: none; }
			}

			@media screen and (max-width: 730px) {
				#TwoColumnsRHS { float:left; clear:both; width:325px; margin: 10px 0 0 0; }
				#PropertyTitle { width:100%; }
				#PropertyLogo { display: none; }	
				#PropertyTitle h3 { FONT-WEIGHT: bold; FONT-SIZE: 8pt; color: #555; MARGIN: 0px 0px 7px 0px }
                #SearchBar { width:100%; }
				.ShoppingBasket { width:325px; border: 0px; PADDING: 0px 0px 0px 0px; MARGIN: 0px 0px 0px 0px; display:block; float:left; }
                #TopNote { display:inline-block; width:100%; background: background: #ffffcc; border-radius: 5px; padding:7px; margin-bottom: 7px; }
                
				#divRoomBooking #RoomTitle { FONT-WEIGHT: bold; FONT-SIZE: 18px; COLOR: #344282; TEXT-DECORATION: none; MARGIN: 0px 0px 15px 0px }
				#divRoomBooking #RoomDescription { FONT-SIZE:8pt; COLOR: #000; TEXT-DECORATION: none; MARGIN: 0px 0px 15px 0px }
				#divRoomBooking .RoomSelectionTable { FONT-SIZE:9pt; COLOR: #000; }	
				#divRoomBooking .AddToRes-TotalCost { FONT-SIZE:12pt; COLOR: #344282; FONT-WEIGHT: bold; }	
				#AddToBookingRoomDescriptionBlock { display:none; }
				#AddToBookingRoomDescriptionBlockMobile { display:block; }
				.AddToSpacer { min-width:5px; }

                .DealsGrid { width:100%; display: block; grid-template-columns: 340px auto 0px; grid-row-gap: 0px; align-items: center; }
                .DealsGridCellStart { padding-left:0px; padding-bottom:10px; }
                .DealsGridCell { padding-left:0px; height: 100%; }
                .DealsGridCellEnd { display:none; }

                .WeeklyDealsGrid { width:100%; display: block; grid-template-columns: 340px auto; grid-row-gap: 0px; align-items: center; }
                .WeeklyDealsGridCellStart { padding-left:0px; padding-bottom:10px;  }
                .WeeklyDealsContainer { display:block; padding-left:0px; }

                .RateCardGrid { padding-right:0px; }
			}

			@media screen and (max-width: 600px) {
				#SearchResultsBlock { background: #FFF; Padding: 0px; margin: 0px; width:325px; }
				#ClickToBook { width:100%; padding: 10px 5px 10px 5px; } 
				#Results21 { display: none; }
				#Results14 { display: none; }
				#Results7 { display: none; }
				#Results5 { display: block; }	
				#Results3 { display: none; }	
			}

			/*
            Mobile phone view
			*/
            @media screen and (max-width: 450px) {
                .NewTable { width:300px; }
				#Results21 { display: none; }
				#Results14 { display: none; }
				#Results7 { display: none; }
				#Results5 { display: none; }
				#Results3 { display: block; }	

                #SpecialOffersBox { float:left; width:100%; display: grid; grid-template-columns: 80% 20px; background: #FAFAFA; border-radius: 7px; padding: 10px; font-size:13px;  grid-row-gap: 0px; margin-top:10px; margin-right:10px; }

			}

/*-- Summary Page --*/
    #SummaryBookMoreTip { text-align:left; }
    .SummaryGridOdd { width:100%; display: grid; grid-template-columns:200px auto 90px; grid-row-gap: 0px; padding-top:5px; padding-bottom:5px; padding-left: 10px; padding-right: 10px; background:#FAFAFA; border-top: 1px solid #DDD; } 
    .SummaryGridEven { width:100%; display: grid; grid-template-columns:200px auto 90px; grid-row-gap: 0px; padding-top:5px; padding-bottom:5px; padding-left: 10px; padding-right: 10px; background:#FFF; border-top: 1px solid #DDD; } 
	.SummaryRoomTitle { display:block; }
    .SummaryTextRoomTitle { TEXT-DECORATION: none; FONT-SIZE: 12pt; COLOR: #252525; FONT-WEIGHT: bold; padding: 0px 0px 0px 0px; } 
    .SummaryTextRoomTitleSecondColumn { display:none }
    .SummaryText { }
    .SummaryTextRoomDescription { padding-top:30px; }
	.SummaryPrice { TEXT-DECORATION: none; FONT-SIZE: 12pt; COLOR: #252525; FONT-WEIGHT: bold; padding: 0px 0px 10px 0px; display:block; text-align:right;  }
    .SummaryCellPadding { padding-top:5px; padding-bottom:5px; }
	.SummaryBottomBorder { border-bottom: 1px solid #DDD; }    
    .SummaryLineSpacer { border-bottom: 1px solid #E1E1E1; margin-bottom:5px; } 
    .SummarySpecialOfferGrid { width:100%; display: grid; grid-template-columns:80px auto; grid-row-gap: 0px; padding-top:5px; padding-bottom:5px; } 
    .SummaryAddOnGrid { width:100%; display: grid; grid-template-columns:120px 80px auto; grid-row-gap: 0px; padding-top:5px; padding-bottom:5px; } 
    .SummaryTotalsGrid { width:100%; display: grid; grid-template-columns:auto 90px; grid-row-gap: 0px; padding-top:5px; padding-bottom:5px; padding-left: 10px; padding-right: 0px; background:#FFF; } 
	.SummaryDescription { FONT-WEIGHT: bold; FONT-SIZE: 12pt; TEXT-TRANSFORM: capitalize; BACKGROUND: #ffffff; COLOR: #000; MARGIN: 0px 0px 0px 0px; PADDING: 5px 5px 5px 5px; text-align:right; border-top: 3px solid #FFF; }
	.SummaryTotal { FONT-WEIGHT: bold; FONT-SIZE: 12pt; TEXT-TRANSFORM: capitalize; BACKGROUND: #ffffcc; COLOR: #000; MARGIN: 0px 0px 0px 0px; PADDING: 5px 10px 5px 5px; text-align:right; border-top: 3px solid #FFF; }

	#SummaryResLinesDescription { display: block; }
	#SummaryResLinesDescriptionMobile { display: none; }
	#SummaryResLinesPhoto { display: block; }
	#SummaryResLinesPhotoMobile { display: none; }

    .SummaryDatesRoomGrid { display: grid; grid-template-columns:80px 120px 90px 60px; grid-row-gap: 3px; padding-top:0px; padding-bottom:5px; } 
    .SummaryDatesRoomGridMobile { display:none; grid-template-columns:80px 120px; grid-row-gap: 3px; padding-top:0px; padding-bottom:5px; } 
	.SummaryRateDescription { font-family: Roboto, Helvetica, Arial, sans-serif; FONT-SIZE: 12px; FONT-WEIGHT: 400; COLOR: #999; display:inline-block; }
	.SummarySpecialOffer { background: #990000; COLOR: #FFFFFF; FONT-WEIGHT: bold; FONT-SIZE: 10pt; display:inline-block; MARGIN: 0px 0px 5px 0px; PADDING: 5px 10px 5px 10px; width:100px; }
	.SummaryOptions { background: #009966; COLOR: #FFFFFF; FONT-WEIGHT: bold; FONT-SIZE: 10pt; display:block; MARGIN: 0px 0px 5px 0px; PADDING: 5px 10px 5px 10px; }
	.SummaryTotalLabel { FONT-WEIGHT: bold; FONT-SIZE: 12pt; COLOR: #666; MARGIN: 0px 0px 0px 0px; PADDING: 5px 5px 5px 5px }
	.SummaryDeposit { FONT-WEIGHT: bold; FONT-SIZE: 12pt; COLOR: #000; MARGIN: 0px 0px 0px 0px; PADDING: 10px 5px 5px 5px }

	/*-- Summary Page: Responsive blocks --*/
		@media screen and (max-width: 870px) {
            .NavButtonsGrid { grid-template-columns:10px auto; height:30px; } 
            #SummaryBookMoreTip { visibility:hidden;}
		}

		@media screen and (max-width: 800px) {
			#SummaryTip { display: none; }
			#SummaryResLinesDescription { display: none; }
			#SummaryResLinesDescriptionMobile { display: block; }
            .SummaryTextRoomTitleFirstColumn { display: none; }
            .SummaryTextRoomTitleSecondColumn { display: block; }
            .SummaryTextRoomDescription { padding-top:10px; }
            #SummaryResLinesPhoto { display: none; }
			#SummaryResLinesPhotoMobile { display: block; }

            .SummaryGridOdd { grid-template-columns:0px auto 90px; }
            .SummaryGridEven { grid-template-columns:0px auto 90px; }
            .SummaryAddOnGrid { grid-template-columns:0px 80px auto; }
            .SummaryAddOnPhoto { display:none; }
            .SummaryCompulsoryFeeName  { display:none; }

		}

		@media screen and (max-width: 545px) {
            .ResponsiveColumnProgress { display:none; }
            .SummaryGridOdd { grid-template-columns:0px auto 60px; }
            .SummaryGridEven { grid-template-columns:0px auto 60px; }            
            .SummaryDatesRoomGrid { display: none; } 
            .SummaryDatesRoomGridMobile { display:grid; } 
            .SummaryPrice { font-size: 11pt; }
            .SummaryTotal { font-size: 11pt; }
            .SummaryTotalLabel { font-size: 11pt; }
		}

		@media screen and (max-width: 400px) {
			#SummaryResLinesPhotoMobile { display: none; }
		}
		
/*-- Your Details Page --*/
	#ThemeClassic #YourDetailsPage { width:100%; background: #FFF; padding:0px; margin: 0px; }
	#ThemeWhiteBackground #YourDetailsPage { width:100%; background: #EEE; padding:0px; margin: 0px; }
	#YourDetailsPageContent { padding: 15px; }
    .YourDetailsTerms { font-family: Roboto, Helvetica, Arial, sans-serif; FONT-SIZE: 12px; FONT-WEIGHT: 400; COLOR: #777; display:inline-block; }

/*-- PleaseWait --*/
    #ModalPleaseWaitBackground {  display: none; position: fixed; z-index: 1900; left: 0; top: 0; width: 100%; height: 100%; overflow: auto; background-color: rgb(0,0,0); background-color: rgba(0,0,0,0.3); }
	#PleaseWaitBox { position: fixed; left: 50%; top: 50%; margin-top: -150px; margin-left: -150px; z-index: 1950; width: 350px; height: 100px; margin: -130px 0 0 -150px; display:none; font-size: 20px; text-align:center; padding: 30px 0px 0px 75px; background: #FFF; border:4px solid #ddd; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; box-shadow: 0px 0px 4px rgba(0,0,0,0.7); -webkit-box-shadow: 0 0 4px rgba(0,0,0,0.7); -moz-box-shadow: 0 0px 4px rgba(0,0,0,0.7); }
	#PleaseWait { position: fixed; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: 2000; margin: -115px 0 0 -120px; border: 16px solid #f3f3f3; border-radius: 50%; border-top: 16px solid #3498db; width: 70px; height: 70px; -webkit-animation: spin 2s linear infinite; animation: spin 2s linear infinite; display:none; background: #FFF; }
	@-webkit-keyframes spin { 0% { -webkit-transform: rotate(0deg); } 100% { -webkit-transform: rotate(360deg); } }
	@keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }

	@media screen and (max-width: 500px) {
	    #PleaseWaitBox { position: fixed; left: 50%; top: 50%; margin-top: -150px; margin-left: -150px; z-index: 1950; width: 300px; height: 100px; margin: -130px 0 0 -150px; display:none; font-size: 20px; text-align:center; padding: 30px 0px 0px 75px; background: #FFF; border:4px solid #ddd; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; box-shadow: 0px 0px 4px rgba(0,0,0,0.7); -webkit-box-shadow: 0 0 4px rgba(0,0,0,0.7); -moz-box-shadow: 0 0px 4px rgba(0,0,0,0.7); }
	    #PleaseWait { position: fixed; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: 2000; margin: -115px 0 0 -120px; border: 16px solid #f3f3f3; border-radius: 50%; border-top: 16px solid #3498db; width: 70px; height: 70px; -webkit-animation: spin 2s linear infinite; animation: spin 2s linear infinite; display:none; background: #FFF; }    
	}

/*-- Payment Vault Page --*/
	#ThemeClassic #PaymentVaultPage { width:100%; background: #FFF; padding:0px; margin: 0px; }
	#ThemeWhiteBackground #PaymentVaultPage { width:100%; background: #EEE; padding:0px; margin: 0px; }
	#PaymentVaultPageContent { padding: 15px; }

/*-- Payment Datacom Page --*/
	#ThemeClassic #PaymentDatacomPage { width:100%; background: #FFF; padding:0px; margin: 0px; }
	#ThemeWhiteBackground #PaymentDatacomPage { width:100%; background: #EEE; padding:0px; margin: 0px; }
	#PaymentDatacomPageContent { padding: 15px; }

/*-- Paypal Page --*/
	#ThemeClassic #PaypalPage { width:100%; background: #FFF; padding:0px; margin: 0px; }
	#ThemeWhiteBackground #PaypalPage { width:100%; background: #EEE; padding:0px; margin: 0px; }
	#PaypalPageContent { padding: 15px; }

/*-- Terms Page --*/
    .TermsHeaderGrid { width:100%; display:table; padding-top:5px; padding-bottom:5px; }
    .TermsHeaderTitleCell { display:table-cell; width:80%; line-height:30px; }
    .TermsHeaderButtonCell { display:table-cell; width:20%; line-height:30px; text-align:right; }

	/*-- Responsive blocks --*/
		@media screen and (max-width: 800px) {

		}

/*-- Confirmation Page --*/
    .ResponsiveColumnRHS { float: left;  width:50%; padding-right:10px; text-align:right; }

    .ConfirmationThankYou { font-family: Roboto, Helvetica, Arial, sans-serif; FONT-SIZE: 18px; FONT-WEIGHT: 500; COLOR: #00CC66; MARGIN: 0px 0px 10px 0px; text-transform: none; }
    .ConfirmationPaymentRequired { font-family: Roboto, Helvetica, Arial, sans-serif; FONT-SIZE: 16px; FONT-WEIGHT: 500; COLOR: red; MARGIN: 0px 0px 10px 0px; text-transform: none; }

    .ConfirmationCustomerPropertyGrid { width:100%; display: grid; grid-template-columns:50% 50%; grid-row-gap: 0px; padding-top:5px; padding-bottom:5px; margin-bottom:10px; } 
    .ConfirmationCustomerPropertyGrid div { padding-top:2px; }
    .ConfirmationCustomerGrid { width:100%; display: grid; grid-template-columns:110px 200px; grid-row-gap: 0px; padding-top:5px; padding-bottom:5px; margin-bottom:10px; } 
    .ConfirmationCustomerGrid div { padding-top:1px; }
    .Span2 { grid-column: 1 / span 2; }
    .ConfirmationPropertyGrid { width:100%; display: grid; grid-template-columns:110px 200px; grid-row-gap: 0px; padding-top:5px; padding-bottom:5px; margin-bottom:10px; } 

	#ConfirmationPageContent { padding: 15px; }
	#ConfirmationPage2 { width:100%; background: #FFF; padding:0px; margin: 0px; }
	#ConfirmationPageContent2 { padding: 15px; }
	#ConfirmationDetails { display:block; }
	
	/*-- Responsive blocks --*/
		@media screen and (max-width: 800px) {
			#ConfirmationDetails { display:none; }
			#ConfirmationPage2 { display:none; }
            .ResponsiveColumnRHS { float: left;  width:100%; padding-right:10px; text-align:left; margin-bottom:10px; }
		}

/*-- Confirmation --*/
	#Confirmation h1 { color: #000; font-size: 22px; font-weight: bold; line-height: 1.0em; margin: 0; padding: 10px 0px 10px 0px; text-transform: uppercase; }
	/*#Confirmation .BookingDetails { background: #FFF; BORDER-LEFT: #C1EAD6 4px solid; BORDER-TOP: #C1EAD6 4px solid; BORDER-BOTTOM: #C1EAD6 4px solid; BORDER-RIGHT: #C1EAD6 4px solid; padding-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; FONT-SIZE: 10pt; } */
	#Confirmation .BookingTitle { FONT-WEIGHT: normal; FONT-SIZE: 11pt; COLOR: #666666; }
	#Confirmation .BookingSubTitle { FONT-WEIGHT: bold; FONT-SIZE: 11pt; COLOR: #666666; }
	#Confirmation .Header { FONT-WEIGHT: bold; FONT-SIZE: 8pt; OVERFLOW: hidden; COLOR: white; background: url('../Images/GridHeader.jpg') repeat-x #143652; TEXT-DECORATION: none; PADDING: 5px 5px 5px 5px; border-collapse: collapse; BORDER-TOP: #326792 1px solid; BORDER-LEFT: #1A486E 1px solid; }
	#Confirmation .TopRow { font-size: 9pt; font-weight: normal; COLOR: #00182C; background: #E6E6E6; padding-top: 5px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; BORDER-LEFT: #CCCCCC 0px solid; BORDER-TOP: #CCCCCC 1px solid; BORDER-BOTTOM: #CCCCCC 0px solid; BORDER-RIGHT: #CCCCCC 0px solid; }
	#Confirmation .Row1 { font-size: 9pt;	font-weight: normal; COLOR: #00182C; background: #D6D6D6; padding-top: 5px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; BORDER-LEFT: #CCCCCC 0px solid; BORDER-TOP: #CCCCCC 1px solid; BORDER-BOTTOM: #CCCCCC 0px solid; BORDER-RIGHT: #CCCCCC 0px solid; }
	#Confirmation .Row2 { font-size: 9pt;	font-weight: normal; COLOR: #00182C; background: #E6E6E6; padding-top: 5px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; BORDER-LEFT: #CCCCCC 0px solid; BORDER-TOP: #CCCCCC 1px solid; BORDER-BOTTOM: #CCCCCC 0px solid; BORDER-RIGHT: #CCCCCC 0px solid; }
	#Confirmation .RowTotal { font-size: 9pt;	font-weight: bold; COLOR: #00182C; background: #FFFFCC; padding-top: 5px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; border:0px;	}

/*-- Error Page --*/
	#ErrorPage { width:100%; background: #FFF; padding:0px; margin: 0px; }
	#ErrorPageContent { padding: 15px; }
	#ErrorPageTitle { FONT-WEIGHT: bold; FONT-SIZE: 14pt; OVERFLOW: hidden; COLOR: white; background: #AD0314; TEXT-DECORATION: none; PADDING: 10px 10px 10px 10px; border-collapse: collapse; }

/*--Property listing--*/
	/*--#Listing { width:900px; background:#DDD; margin:0 auto; padding: 20px 20px 20px 20px; margin-top: 0px; }--*/
	#Listing { width:95%; margin-left:auto; margin-right:auto; padding-left: 5px; padding-right: 5px; display:block; }
	#ListingTabs { width:95%; max-width:1100px; margin-left:auto; margin-right:auto; display:block; background-color:white; }
    #ListingTabsMobile { width:95%; margin-left:auto; margin-right:auto; display: none;  }

    #MobileMenuGrid { display: grid; grid-template-columns: auto 60px; } 
    #MobileMenuButton a { margin-bottom: 10px; display:table; background: #00CC66; color: white; text-align:right; text-decoration:none; padding:7px; border-radius: 5px; font-size:16px; font-family: "Cabin", Helvetica, Arial, sans-serif; font-weight:500; }
	#MobileMenuButton a:hover { color: #FFF; background: #00A452; cursor:pointer; } 
	#MobileMenuButton a.active,a.visited { color: #FFF; background: #00A452; }

    .NewMobileTabActive { color: #FFF; background: #00CC66; margin:0; padding:7px; font-size:14px; display: block; text-transform: uppercase; text-decoration:none; font-family: "Cabin", Helvetica, Arial, sans-serif; font-weight:500; border-bottom: 1px solid #FFF; }
    .NewMobileTabNotActive { color: #FFF; background: #00CC66; margin:0; padding:7px; font-size:14px; display: block; text-transform: uppercase; text-decoration:none; font-family: "Cabin", Helvetica, Arial, sans-serif; font-weight:500; border-bottom: 1px solid #FFF; }

	#MobileMenuList { display:block; width:100%; margin-top:0; }
	#MobileMenuList a { color: #FFF; background: #00CC66; margin:0; padding:7px; font-size:14px; display: block; text-decoration:none; font-family: "Cabin", Helvetica, Arial, sans-serif; font-weight:500; }
	#MobileMenuList a:hover { color: #FFF; background: #00A452; cursor:pointer; }
	#MobileMenuList a.active { color: #FF722A; background: #00A452; }	
    #MobileMenuList .activemobilesecondary { background: #76D1A4; }
    #MenuSpacer { display: block; margin-left: auto; margin-right: auto; padding-bottom: 0px; }
    #BaseMenuSpacer { display: block; margin-left: auto; margin-right: auto; padding-bottom: 0px; }

	#ListingContent { width:95%; max-width:1100px; margin-left:auto; margin-right:auto; display:block; padding:20px; background-color:white; }

    #BookingForm { display: block; }
    #ifrmBookingForm { display: none; }
	#ThemeClassic #ListingContent { padding: 15px; background: #FFF; }
	#ThemeWhiteBackground #ListingContent { padding: 15px; background: #EEE; }
	#HighLightOrange .ListingSubTitle { FONT-WEIGHT: bold; FONT-SIZE: 12pt; COLOR: orange; border-bottom: 2px solid orange; padding: 5px 5px 3px 0px; margin-bottom: 10px; width:auto; display:block;}	
	#HighLightBlue .ListingSubTitle { FONT-WEIGHT: bold; FONT-SIZE: 12pt; COLOR: #61a1d8; border-bottom: 2px solid #61a1d8; padding: 5px 5px 3px 0px; margin-bottom: 10px; width:auto; display:block;}	
	#HighLightGreen .ListingSubTitle { FONT-WEIGHT: bold; FONT-SIZE: 12pt; COLOR: #00A452; border-bottom: 2px solid #00A452; padding: 5px 5px 3px 0px; margin-bottom: 10px; width:auto; display:block;}	
	#HighLightRed .ListingSubTitle { FONT-WEIGHT: bold; FONT-SIZE: 12pt; COLOR: #993300; border-bottom: 2px solid #993300; padding: 5px 5px 3px 0px; margin-bottom: 10px; width:auto; display:block;}	
	/*--#ListingContent h3 { FONT-WEIGHT: bold; FONT-SIZE: 12pt; COLOR: orange; border-bottom: 2px solid orange; padding: 0 0px 5px 0px; width:auto; display:block;}--*/
	#ListingContent #TwoColumns { width:100%; margin :0 auto; }
	#ListingContent #TwoColumnsLHS { width:50%; float:left; }
	#ListingContent #TwoColumnsRHS { width:50%; float:right; }
	#ListingContent #LHSText { padding-right: 20px; }
	#ListingContent .AccommodationTextMobile { display: none; }
	#ListingContent .AccommodationText { display: block; }
	#ListingContent .AccommodationRow { padding: 10px 0 10px 0; }
    #MapLabel { text-align: left; padding: 15px; height: 100%; }
    #map-canvas { width: 100%; height: 600px; border: 1px solid #666666; text-align: right; }
	ul.no_bullet { list-style-type: none; padding: 0; margin: 0; }
	li.tick { color: rgb(100, 100, 100); background: url('../../Images/Tick.png') no-repeat left center; line-height: 1.4em; padding-left: 30px; margin-bottom: 7px; }

.ws_thumbs { height:500px; }

/*-- Fade-In/Out slideshow --*/
    .slide { position: relative; transition: opacity .5s ease-out; width:100%; }
    .slide + .slide { opacity: 0; }
    #slideshow_caption { position: relative; margin-top: 390px; text-align: center; background-color: #FFF; padding: 7px 7px 7px 7px; color: rgb(51, 67, 106); opacity: 1; width:100%; font-family: "Cabin", Helvetica, Arial, sans-serif; font-size:20px; font-weight:700; }

	/*-- Responsive blocks --*/

		@media screen and (max-width: 1000px) {
            #ListingContent #map-canvas { width: 100%; height: 500px; border: 1px solid #666666; text-align: right; }
        }

		@media screen and (max-width: 825px) {
			#ListingContent #TwoColumnsLHS { width:100%; float:left; }
			#ListingContent #TwoColumnsRHS { width:100%; float:left; margin-bottom:15px;}
		}

		@media screen and (max-width: 740px) {                        
            #Listing { width:100%; display:block; }

            #ListingTabs { display: none; }
            #ListingTabsMobile { display: block; }

    		/*#tabs a { text-decoration: none; display: block; PADDING: 6px 6px 6px 6px; color: black; text-align: center; }
    		#tabs li { float: left;	margin: 0; margin-right: 2px; }
			#Listing #tabs { font-size: 8pt; }*/
            .ws_thumbs { max-width: 100%; }
            #BookingForm { display: none; }
            #ifrmBookingForm { display: block; }
			#ListingContent .AccommodationTextMobile { display: block; }
			#ListingContent .AccommodationText { display: none; }
            #ListingContent #map-canvas { width: 100%; height: 300px; border: 1px solid #666666; text-align: right; }
            #ListingBookNow .FullPage { width:100%; padding-left: 0px; padding-right: 0px; display:block; }
            #CopyrightFooter { width: 340px;}
		}