﻿
p { font-size: 12px; margin: 0.2em 0; }
input { font-size: 12px; font-family: Trebuchet MS, Tahoma, Geneva, sans-serif; margin: 2px; padding: 3px; }
textarea { font-size: 12px; font-family: Trebuchet MS, Tahoma, Geneva, sans-serif; }
select { font-size: 12px; font-family: Trebuchet MS, Tahoma, Geneva, sans-serif; margin: 2px; padding: 3px; }
label { font-size: 12px; font-family: Trebuchet MS, Tahoma, Geneva, sans-serif; }
input[type=checkbox] { vertical-align: middle;  }

.divCol99 p { font-size: 14px; margin: 4px 0px; }
.divCol99 label { font-size: 14px; }

.adTable { font-size: 12px; border-spacing: 0px; margin: 10px; }
.adTable td { padding: 2px 4px; }
.adTable td input[type=checkbox] { margin: 3px 3px 3px 4px; padding: 0px; }
.adTable a, .adTable a:visited { color: #b71f25; text-decoration: none; }
.trRow0 { background-color: #e0e0e0; }
.trRow1 { background-color: #ffffff; }

.butProviderData { display: inline-block; }
.divProviderData { display: none; overflow: scroll; }

#divShowImage { display: none; position: absolute; z-index: 500; background-color: #c0c0c0; border: solid 1px #404040; }
#divShowImage table { -webkit-border-horizontal-spacing: 0px; -webkit-border-vertical-spacing: 0px; padding: 0px; }
#divShowImage td { padding: 0px; }

.divNewImage, .divGalleryImage { border-bottom: 1px solid #808080; width: 300px; display: block; vertical-align: top; text-align: center; margin: 5px 0px; }

.divNewImage img, .divGalleryImage img { border: 1px solid #808080; padding: 0px; max-height: 200px; max-width: 300px; }
.divNewImage input, .divGalleryImage input { margin: 4px 0px; }
.divNewImage input[type=text], .divGalleryImage input[type=text] { width: 300px; display: block; }
.divNewImage input[type=button], .divGalleryImage input[type=button] { display: block;}

#tblCodes td { padding-right: 5px; }
#tblCodes a { color: #b71f25; text-decoration: none; }

#tblHotels td { font-size: 12px; vertical-align: top; }

/*** Hotel matching and location editing page ***/

.divLocationSelect { border-bottom: solid 1px #d0d0d0; }
.divLocationSelect h2 { width: 250px; margin: 8px 5px; display: inline-block; vertical-align: middle; }

.divPanel { width: 395px; float: left; display: inline-block; margin: 0px 0px 10px 0px; }
.divPanelWide { width: 500px; }
.divPanel h2 { margin: 8px 5px; }
.divFilter { margin-bottom: 5px; height: 132px; }
.divFilter label { margin: 0px 5px; width: 60px; display: inline-block; }
.divFilter select { width: 280px; margin: 2px; }
.divFilter input[type=text] { line-height: 18px; padding: 0px 6px; width: 265px; margin: 2px; }
.divPanel ul li h2 { font-size: 17px; font-weight: normal; margin: 0px; display: inline-block; }
.divPanel .pLocName { padding: 0px 10px; font-size: 17px; line-height: 22px; }
.divPanel .pLocName img { float: right; height: 20px; margin-left: 5px; cursor: pointer; }
.divUlPanel { max-height: 600px; overflow-y: auto; border: solid 1px #d0d0d0; margin: 0px 5px; }

.divUlPanel ul { list-style: none; padding: 0px; margin: 0px; }
.divUlHotels ul li, .ddUmHot, .ddRejHot { cursor: pointer; padding: 2px 5px; border: solid 1px #ffffff; }
.divUlHotels ul li:hover, .ddUmHotSelected, .ddRejHotSelected, .ddBaHotSelected { background-color: #ffffd0; border-color: #c0c0c0; }
.ddBaHotHover, .ddBaLocHover { background-color: #ffd0d0; }

.divBaHot span { display: block; width: 24px; height: 24px; float: right; }
.divBaHot a { display: block; width: 24px; height: 24px; float: right; }
.divBaHot p { padding-right: 26px; }

div.ddBaLoc { cursor: pointer; }
#ulLocIndex .ulLocationHotels { height: 0px; overflow: hidden; margin-top: 0px; }
#ulLocIndex .ulLocationHotelsShow ul.ulLocationHotels { height: auto; }
#ulLocIndex .ulLocationHotels li { font-size: 12px; padding: 0px 35px 0px 25px; background: none; position: relative; text-indent: -10px; }
#ulLocIndex .ulLocationHotels li span { padding: 0px 13px; position: absolute; right: 0px; top: 0px; }
#ulLocIndex .ulLocationHotels li span img { height: 14px; cursor: pointer; }

li.ui-draggable-dragging { list-style: none; background-color: #ffffd0; border-color: #c0c0c0; }

#ulRejHotIndex, #ulUmHotIndex, #ulBaHotIndex { min-height: 200px; }

#ddUmHotGroup, #ddBaHotGroup { max-height: 42px; max-width: 356px; overflow-y: auto; background-color: #ffffff; border: solid 1px #c0c0c0; z-index: 500; }

.ulFormElements { list-style: none; margin: 0px; padding: 0px; }

.divEdit { display: none; margin: 5px; padding: 5px; border: solid 1px #d0d0d0; background-color: #ffffd0; }
.divEdit span { display: block; width: 24px; height: 24px; float: right; cursor: pointer; }
.divEdit label { display: inline-block; width: 100px; }
.divEdit label.lblTextarea { vertical-align: top; margin-top: 5px; }
.divEdit input[type=text] { display: inline-block; width: 250px; }
.divEdit textarea { margin: 2px; width: 248px; height: 40px; }
.divEdit select { width: 254px; }
.divEdit input[type=button] { margin-left: 100px; display: block; }
/*.divEdit input::after, .divEdit select::after { content: '<br />'; }*/
.divEditLocation input::after, .divEditLocation select::after, .divEditLocation textarea::after { content: "\A"; white-space: pre; }

.divEditLocation { display: none; margin: 5px; padding: 5px; border: solid 1px #d0d0d0; /*background-color: #ffffd0;*/ }
.divEditLocation span { display: block; width: 24px; height: 24px; float: right; cursor: pointer; }
.divEditLocation label { display: inline-block; width: 100px; }
.divEditLocation label.lblTextarea { vertical-align: top; margin-top: 5px; }
.divEditLocation input[type=text] { display: inline-block; width: 370px; }
.divEditLocation textarea { margin: 2px 0px; width: 368px; height: 300px; }
.divEditLocation select { width: 374px; }
.divEditLocation input[type=button] { margin-left: 100px; margin-top: 8px; display: block; }
.divEditLocation input[type=file] { margin: 2px 0px; }
/*.divEditLocation input::after, .divEditLocation select::after, .divEditLocation textarea::after { content: '<br />'; }*/
.divEditLocation input::after, .divEditLocation select::after, .divEditLocation textarea::after, .divImage::after { content: "\A"; white-space: pre; }

.ulFormElements span { display: block; width: 24px; height: 24px; float: right; cursor: pointer; }
.ulFormElements label { display: inline-block; width: 100px; }
.ulFormElements label.lblTextarea { vertical-align: top; margin-top: 5px; }
.ulFormElements input[type=text] { display: inline-block; width: 350px; }
.ulFormElements textarea { margin: 2px 0px; width: 368px; height: 300px; }
.ulFormElements select { width: 374px; }
.ulFormElements input[type=button] { margin-left: 100px; margin-top: 8px; display: block; }
.ulFormElements .butMidForm { margin-top: 4px !important; margin-bottom: 2px;}
.ulFormElements input[type=file] { margin: 2px 0px; }
.ulFormElements input::after, .divEditLocation select::after, .divEditLocation textarea::after, .divImage::after { content: "\A"; white-space: pre; }

.divImage { width: 200px; height: 200px; margin: 3px 0px; background-size: cover; background-position: center center; border: 1px solid #808080; display: inline-block; }
.divBanner { width: 374px; height: 76px; margin: 3px 0px; background-size: cover; background-position: center center; border: 1px solid #808080; display: inline-block; }

.pCountryName { font-size: 16px; font-weight: bold; }
.pStateName { font-size: 16px; }
.pLocName { font-size: 15px; font-weight: bold; }
.pHotName { font-size: 14px; }
.pHotName a { color: inherit; text-decoration: none; }

.width100 { width: 100px !important; }
.width200 { width: 200px !important; }
.width368 { width: 368px !important; }

#divTestMap { padding: 30px; display: none; width: 400px; height: 400px; position: absolute; }
#divTestMap span { width: 24px; height: 24px; background-image: url(../images/close.png); background-position: center center; background-repeat: no-repeat; position: absolute; top: 0px; right: 0px; }
#divMap { width: 100%; height: 100%; }

#divHotelEditRHCol { margin: 0px 0px 0px 20px; width: 600px; display: inline-block; vertical-align: top; }
/*#divHotelEditRHCol > div { width: 100%; }*/
#divMultipleImageUpload { overflow: hidden; height: auto; }
#divMultipleImageUpload.miuHide { height: 44px; }
.miuToggle { font-size: 0.5em; }

#divRawProviderHotelData { /*margin: 0px 0px 0px 20px; width: 600px; display: inline-block; vertical-align: top;*/ }
#divRawProviderHotelData span { font-size: 12px; border: 1px solid #d0d0d0; padding: 4px; margin: 0px 5px 0px 0px; }

#divBAwayHotelDetails { max-height: 680px; overflow-y: auto; width: 500px; display: inline-block; vertical-align: top; margin-top: 8px; }

.divRawHotel { display: none; margin-top: 10px; padding: 5px; max-height: 600px; overflow-y: auto; border: solid 1px #d0d0d0; }
.divRawHotel ul { list-style: none; margin: 0px; padding: 0px; }
.divRawHotel ul li p { vertical-align: top; display: inline-block; }
.divRawHotel ul li p.pLabel { width: 150px; }
.divRawHotel ul li .divImgWrapper { display: inline-block; }
.divRawHotel ul li .divImgWrapper img { display: block; width: 320px; }
.divRawHotel ul li .divImgWrapper p { display: block; margin: 3px 0px; }
.divRawHotel ul li .spUnlink, .divRawHotel ul li .spConfirm { margin: 5px 0px 5px 5px !important; display: inline-block; cursor: pointer; }

#ulHotelImages { min-height: 40px; min-width: 370px; border: solid 1px #a0a0a0; padding: 0px; margin: 0px; display: inline-block; padding: 0px; margin: 0px; list-style: none; }
#ulHotelImages li { padding: 8px; }
#ulHotelImages li .divImgWrapper img { display: block; width: 120px; }
#ulHotelImages li .divImgWrapper img.imgDelete { width: auto; float: right; cursor: pointer; }
#ulHotelImages li .divImgWrapper input { width: 90%; }
.ddUlHotelImages { background-color: #ffeeee; }
#ddImageWrapper img { width: 120px; }

#tblBaHotIndex { font-size: 13px; min-height: 40px; border-spacing: 0px; width: 98%; margin: 20px 0px; }
#tblBaHotIndex tr.trOdd { background-color: #f0f0f0; }
#tblBaHotIndex td { padding: 2px 4px; }

#tblBaHotIndex.tblCrHotIndex td:nth-child(5) { display: none; }

#tblBaHotIndex td a { text-decoration: none; color: inherit; }
#tblBaHotIndex .aSort { font-family: Webdings; font-size: 18px; }

.spHelp { float: right; line-height: 30px; font-size: 13px; cursor: pointer; margin-right: 8px; margin-top: 8px; }
#divHelp { display: none; width: 97%; padding: 8px; border: solid 1px #d0d0d0; }

#tblHotelMatchSummary { font-size: 11px; border-collapse: collapse; }
#tblHotelMatchSummary tr { }
#tblHotelMatchSummary td { text-align: center; padding: 2px 5px; border: solid 1px #a0a0a0; }

#tblHotelMatchSummary tr.trHeader { background-color: #a0a0a0 !important; color: #ffffff; }
#tblHotelMatchSummary tr.trHeader td { border-color: #000000; }

#tblHotelMatchSummary td.textLeft { text-align: left; max-width: 70px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

#tblHotelMatchSummary td.tdTotal { background: #d0d0f0; }
#tblHotelMatchSummary td.tdMatched { background: #d0f0d0; }
#tblHotelMatchSummary td.tdRejected { background: #f0d0d0; }
#tblHotelMatchSummary td.tdUnmatched { background: #f0f0d0; }

#tblHotelMatchSummary tbody tr:nth-child(odd) { background: #f0f0f0; }

#divAutoMatchList { max-height: 55vh; overflow-y: scroll; width: 95%; }
#ulAutoMatchList { list-style: none; border: solid 1px #f0f0f0; padding: 0px; margin: 0px; font-size: 0.85em; }
#ulAutoMatchList li { padding: 2px; }
#ulAutoMatchList li:nth-child(even) { background: #f0f0f0; }
#ulAutoMatchList li .spAutoMatchName { float: none; display: inline-block; width: 85%; overflow: hidden; }
#ulAutoMatchList li span { float: right; display: inline-block; width: 10%; }

#pMatchStatus { margin: 15px 0px; font-size: 1.2em; }

#ifCaptcha { width: 95%; height: 400px; }

#divHotelMatchTest ul { list-style: none; padding: 0px; margin: 10px 0px; font-size: 0.85em; }
#divHotelMatchTest span { width: 150px; display: inline-block; font-size: 0.85em; }
#divHotelMatchTest input[type=text] { width: 400px; }
#divHotelMatchTest input[type=submit] { margin-left: 150px; }

.ulUtilities { list-style: none; }
.ulUtilities li { }
.ulUtilities li p { }
.ulUtilities li p input[type=submit]{ display: inline-block; margin: 0px 3px; }

.ulUtilities input { display: block; margin-bottom: 5px; }
.ulUtilities textarea { width: 100%; height: 300px; }
.ulUtilities input[type=file] { display: inline-block; font-size: 13px; margin: 0px 3px; }

.divLocationsWrapper table { margin: 10px 0px; font-size: 0.75em; }
.divLocationsWrapper table th { font-weight: normal; text-align: left; background-color: #d0d0d0; }
.divLocationsWrapper table th, .divLocationsWrapper table td { padding: 2px 4px; }
.divLocationsWrapper table tr:nth-child(odd) { background-color: #e8e8e8; }

.ulAccessUserIndex { list-style: none; padding: 0px; margin: 10px 0px; font-size: 0.85em; }
.ulAccessUserIndex li { margin: 3px 0px; padding: 3px; }
.ulAccessUserIndex li:nth-child(even) { background: #f0f0f0; }
.ulAccessUserIndex span { display: inline-block; margin: 0px 10px 0px 0px; text-align: center; }
.ulAccessUserIndex span:nth-child(1) { width: 30px; }
.ulAccessUserIndex span:nth-child(2) { width: 200px; }
.ulAccessUserIndex span:nth-child(3) { width: 50px; }
.ulAccessUserIndex span:nth-child(4) { width: 80px; }
.ulAccessUserIndex span:nth-child(5) { width: 80px; }
.ulAccessUserIndex span:nth-child(6) { width: 80px; }

.ulUserIndex { list-style: none; padding: 0px; margin: 10px 0px; font-size: 0.85em; }
.ulUserIndex li { margin: 3px 0px; padding: 3px; }
.ulUserIndex li:nth-child(even) { background: #f0f0f0; }
.ulUserIndex span.spCol { display: inline-block; margin: 0px 10px 0px 0px; text-align: left; width: 80px; }
.ulUserIndex span.spCol:nth-child(1) { width: 150px; }
.ulUserIndex span.spCol:nth-child(2) { width: 150px; }
.ulUserIndex span.spCol:nth-child(3) { width: 50px; text-align: center; }

.ulUserEdit { list-style: none; padding: 0px; margin: 10px 0px; font-size: 0.85em; }
.ulUserEdit li { vertical-align: middle; margin: 3px 0px; padding: 3px; }
.ulUserEdit li label { display: inline-block; width: 150px; }
.ulUserEdit li input[type=text] { width: 200px; }
.ulUserEdit li input[type=submit] { margin-right: 10px; }

#divFlagFilters label { display: inline-block; margin-right: 0.5em; }
#divFlagFilters select { margin-right: 0.5em; }

.divHotelFlags { width: 100%; max-height: 600px; overflow-y: auto; margin: 10px 0px 0px 0px; }
.tblHotelFlags { border-collapse: collapse; }
.tblHotelFlags tr:nth-child(even) { background: #f0f0f0; }
.tblHotelFlags p { height: 19px; line-height: 19px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.tblHotelFlags a { color: inherit; text-decoration: none; }
.tblHotelFlags a:hover { color: #b71f25; }
.tblHotelFlags .pEdit { width: 30px; }
.tblHotelFlags .pName { width: 300px; }
.tblHotelFlags .pAddress { width: 335px; }
.tblHotelFlags .pLocation { width: 100px; }
.tblHotelFlags .pRating { width: 40px; text-align: center; }
.tblHotelFlags .pCB { width: 20px; text-align: center; }

.tblHotelFlags .pNameLX { width: 400px; }
.tblHotelFlags .pAddressLX { width: 500px; }
.tblHotelFlags .pLocationLX { width: 130px; }

.tblHotelFlags tr td:nth-child(3n + 7) { background: #ffc0c0; }
.tblHotelFlags tr td:nth-child(3n + 8) { background: #c0ffc0; }
.tblHotelFlags tr td:nth-child(3n + 9) { background: #c0c0ff; }


/*.tblHotelFlags tr td:nth-child(7) { background: #ffe0e0; }
.tblHotelFlags tr td:nth-child(8) { background: #e0ffe0; }
.tblHotelFlags tr td:nth-child(9) { background: #e0e0ff; }
.tblHotelFlags tr td:nth-child(10) { background: #ffffe0; }
.tblHotelFlags tr td:nth-child(11) { background: #ffe0ff; }
.tblHotelFlags tr td:nth-child(12) { background: #ffc0e0; }
.tblHotelFlags tr td:nth-child(13) { background: #c0ffe0; }
.tblHotelFlags tr td:nth-child(14) { background: #e0ffc0; }
.tblHotelFlags tr td:nth-child(15) { background: #e0ffff; }
.tblHotelFlags tr td:nth-child(16) { background: #e0c0ff; }
.tblHotelFlags tr td:nth-child(17) { background: #ffe0c0; }
.tblHotelFlags tr td:nth-child(18) { background: #ffffe0; }
.tblHotelFlags tr td:nth-child(19) { background: #ffe0ff; }*/

.tblProvSummary { background-color: #a0a0a0; border-spacing: 1px; }
.tblProvSummary td { background-color: #ffffff; padding: 5px; text-align: center; min-width: 110px; }
.tblProvSummary tr td:nth-child(1) { text-align: left; }

.divHotelMatchConfirmControls { padding: 10px 0px; font-size: 1em; }
.divHotelMatchConfirmControls select, .divHotelMatchConfirmControls label { margin-right: 5px; }
.tblHotelMatchConfirm { border-collapse: collapse; width: 100%; }
.tblHotelMatchConfirm tr:nth-child(even) { background: #f0f0f0; }
.tblHotelMatchConfirm td { padding: 3px; }

.divProviderMarkupControls { margin: 5px; }
.divProviderMarkupControls ul { list-style: none; margin: 0px; padding: 0px; }
.divProviderMarkupControls li { margin: 4px 0px; }
.divProviderMarkupControls label { width: 130px; display: inline-block; }
.divProviderMarkupControls input[type=text] { width: 50px; }

.tblProviderMarkup { border-collapse: collapse; margin: 5px; }
.tblProviderMarkup tr:nth-child(even) { background: #f0f0f0; }
.tblProviderMarkup td { padding: 3px; }
.tblProviderMarkup input[type=text] { width: 50px; }

.ulLxTabs { list-style: none; padding: 0px; margin: 1em 0px; }
.ulLxTabs li {
    display: inline-block; padding: 0.75em; cursor: pointer; 
    background-color: rgba(48,48,48,0.2); border: solid 1px rgba(48,48,48,0.4); border-radius: 5px 5px 0 0;
}
.ulLxTabs li.selected { background-color: white; border-bottom: none; }
    
.ulLxTabs li h3 {
    margin: 0px;
}

.panLxHotel { display: none; }
.panLxHotel.selected { display: block; }

.ulLxFormElements {
    list-style: none;
    padding: 0px;
    margin: 1em 0px;
}
.ulLxFormElements li { }

    .ulLxFormElements li span {
        display: inline-block;
        font-size: 12px;
        font-family: Trebuchet MS, Tahoma, Geneva, sans-serif;
        margin: 2px;
        padding: 3px 7px 3px 3px;
    }
.ulLxFormElements li input[type=text] {  }
.ulLxFormElements li input[type=button], .ulLxFormElements li input[type=submit] {     }
.ulLxFormElements li textarea {    }

.ulLxFormElements .inLxDescription { width: 100%; height: 10em; }

.ulLxFormElements .inLxNarrow { width: 150px; }
.ulLxFormElements .inLxMedium { width: 250px; }
.ulLxFormElements .inLxWide { width: 250px; }
.ulLxFormElements .inLxDate { width: 80px; }
.ulLxFormElements .inLxOffer { width: 500px; height: 80px; }
.ulLxOffers li { padding: 1em 0px; }
.ulLxOffers li:nth-child(even) { border-bottom: solid 1px rgba(48,48,48,0.2); }
.ulLxOffers li * { vertical-align: top; }
.ulLxOffers li input[type=checkbox] { margin-top: 5px; }

.divImageUpload { margin: 1em 0px; }

.ulLxBanner li { padding: 1em 0px; }
.ulLxBanner img { width: 500px; display: block; margin: 0.5em 0px; }

.ulLxGallery li { padding: 1em 1em 1em 0px; display: inline-block; }
.ulLxGallery img { width: 300px; display: block; margin: 0.5em 0px; }

.ulLxVideo li { display: block; padding: 1em 0px; }
.ulLxVideo li > * { vertical-align: middle; }
.ulLxVideo li iframe { width: 300px; height: 150px; background-color: lightgray; }


i.fa { cursor: pointer; }

#ulSHotelList { list-style: none; margin: 0; padding: 0; font-size: 0.8em; }
#ulSHotelList li { margin: 0; padding: 0.4em; display: none; }
#ulSHotelList li.show { display: list-item; }
#ulSHotelList li.shade { background-color: rgb(220,220,220); }
/*#ulSHotelList li.show:nth-child(even) { background-color: rgb(220,220,220); }*/
#ulSHotelList li.liHeader { display: list-item; font-weight: 600; }

#ulSHotelList li span { display: inline-block; margin-right: 0.5em; vertical-align: middle; }
#ulSHotelList li span i.fa { display: inline-block; font-size: 1.2em; /*vertical-align: middle;*/ cursor: pointer; }

#ulSHotelList li span.spRed { color: red; }
#ulSHotelList li span.spButtons { width: 30px; }

#ulSHotelList li span.spName { width: 250px; }
#ulSHotelList li span.spLocation { width: 120px; }
#ulSHotelList li span.spCountry { width: 70px; }
#ulSHotelList li span.spGroup { width: 120px; }
#ulSHotelList li span.spLux { width: 50px; }
#ulSHotelList li span.spCheck { width: 30px; text-align: center; }
#ulSHotelList li span.spContracts { width: 30px; text-align: center; }
#ulSHotelList li span.spContact { width: 120px; }

#divSHotelDetailWrapper { position: fixed; left: 0; top: 0; right: 0; bottom: 100%; opacity: 0; transition: all 0.5s; background-color: rgba(40,40,40,0.6); }
#divSHotelDetailWrapper.show { bottom: 0; opacity: 1; }
#divSHotelDetail { position: absolute; left: 10%; top: 5%; right: 10%; bottom: 5%; overflow: auto; background-color: rgb(255,255,255); border: solid 1px rgb(220,220,220); padding: 1em; }
#divSHotelDetail .spClose { float: right; }
#divSHotelDetail .spClose i { font-size: 2em; }

/*
#ulSHotelData { list-style: none; padding: 0; font-size: 0.8em; margin: 1em 5px; }
#ulSHotelData li {  }
#ulSHotelData li span.spLabel { width: 200px; display: inline-block; }
#ulSHotelData li input[type=text] { font-size: 1em; width: 400px; }
#ulSHotelData li input[type=checkbox] { margin: 8px 3px; }
*/

#ulHotelOptions, #ulNewHotelOptions { list-style: none; padding: 0; margin: 0.5em 0; margin-left: 200px; max-height: 25.1em; overflow-y: scroll; }
#ulHotelOptions li, #ulNewHotelOptions li { padding: 0.2em; cursor: pointer; }
#ulHotelOptions li:nth-child(even), #ulNewHotelOptions li:nth-child(even) { background-color: rgb(220,220,220); }
#ulHotelOptions li.sel, #ulNewHotelOptions li.sel { background-color: rgb(120,120,120); color: rgb(255,255,255); }

#ulHotelDataTabs { list-style: none; padding: 0; border-bottom: solid 1px rgb(220,220,220); }
#ulHotelDataTabs li { display: inline-block; padding: 0.5em 1em; border-width: 1px; border-style: solid solid none solid; border-color: rgb(220,220,220); border-radius: 10px 10px 0 0;
                      position: relative; font-size: 0.8em; margin-right: -0.7em; background-color: rgb(240,240,240); cursor: pointer; }
#ulHotelDataTabs li.show { z-index: 100 !important; background-color: rgb(255,255,255); }

#divHotelDataTabs div { display: none; }
#divHotelDataTabs div.show { display: block; }

.ulSHotelForm { list-style: none; padding: 0; font-size: 0.8em; margin: 1em 5px; }
.ulSHotelForm li {  }
.ulSHotelForm li span.spLabel { width: 200px; display: inline-block; }
.ulSHotelForm li input[type=text] { font-size: 1em; width: 400px; }
.ulSHotelForm li input[type=button] { font-size: 1em; }
.ulSHotelForm li input[type=date] { font-size: 1em; }
.ulSHotelForm li input[type=file] { font-size: 1em; }
.ulSHotelForm li input[type=checkbox] { margin: 8px 3px; }
.ulSHotelForm li select { width: 410px; font-size: 1em; }
.ulSHotelForm li p { font-size: 1em; margin: 1em 0; }
.ulSHotelForm li .ulLinkedHotels { height: 7.2em; overflow-y: scroll; }

#ulSContractData li span { display: inline-block; padding: 7px; }
#ulSContractData li .spDesc { width: 400px; }
#ulSContractData li .spYear { width: 50px; }
#ulSContractData li .spDate { width: 70px; }
#ulSContractData li .spFile { width: 200px; }
#ulSContractData li i.fa { font-size: 1.2em; vertical-align: middle; margin-left: 0.5em; }

#ulSContractForm.hide { display: none; }
#ulSContractLink.hide { display: none; }

#divSHotelProcessingWrapper { display: none; position: fixed; z-index: 0; left: 0; top: 0; right: 0; bottom: 0; opacity: 0; transition: opacity 0.5s; background-color: rgba(40,40,40,0.6); }
#divSHotelProcessingWrapper.show { opacity: 1; z-index: 10000; display: block; }
#divSHotelProcessingWrapper div { position: absolute; left: 50%; top: 50%; width: 200px; height: 100px;
    margin-left: -100px; margin-top: -50px; color: rgb(255,255,255); font-size: 1em; text-align: center; }
#divSHotelProcessingWrapper i.fa { font-size: 4em; }
#divSHotelProcessingWrapper p { position: absolute; bottom: 0; left: 0; right: 0; text-align: center; font-size: 1.5em; }

#divSHotelAddWrapper { position: fixed; left: 0; top: 0; right: 0; bottom: 100%; opacity: 0; transition: all 0.5s; background-color: rgba(40,40,40,0.6); overflow: hidden; }
#divSHotelAddWrapper.show { bottom: 0; opacity: 1; }
#divSHotelAdd { position: absolute; left: 10%; top: 5%; right: 10%; bottom: 5%; overflow: auto; background-color: rgb(255,255,255); border: solid 1px rgb(220,220,220); padding: 1em; }
#divSHotelAdd .spClose { float: right; }
#divSHotelAdd .spClose i { font-size: 2em; }

.pAddHotelpAddHotel { font-size: 0.8em; }
.pAddHotelpAddHotel i.fa { font-size: 1.5em; vertical-align: middle; margin-right: 0.2em; }

#divFilter { font-size: 0.8em; margin: 1em 0; }

#divReport.updating #ulReport { display: none; }
#divReport #pReportMessage { display: none; font-size: 0.8em; margin: 1em 0; }
#divReport.updating #pReportMessage { display: block; }

#ulReport { list-style: none; padding: 0; font-size: 0.8em; margin: 1em 0; }
#ulReport li { display: inline-block; margin-right: 1em; }
#ulReport li span { margin-right: 0.5em; }


#ulSSupplierList { list-style: none; margin: 0; padding: 0; font-size: 0.8em; }
#ulSSupplierList li { margin: 0; padding: 0.4em; display: none; }
#ulSSupplierList li.show { display: list-item; }
#ulSSupplierList li.shade { background-color: rgb(220,220,220); }
/*#ulSHotelList li.show:nth-child(even) { background-color: rgb(220,220,220); }*/
#ulSSupplierList li.liHeader { display: list-item; font-weight: 600; }

#ulSSupplierList li span { display: inline-block; margin-right: 0.5em; vertical-align: middle; }
#ulSSupplierList li span i.fa { display: inline-block; font-size: 1.2em; /*vertical-align: middle;*/ cursor: pointer; }

#ulSSupplierList li span.spButtons { width: 30px; }

#ulSSupplierList li span.spName { width: 200px; }
#ulSSupplierList li span.spType { width: 150px; }
#ulSSupplierList li span.spLocation { width: 150px; }
#ulSSupplierList li span.spURL { width: 40px; }
#ulSSupplierList li span.spIntra { width: 40px; text-align: center; }
#ulSSupplierList li span.spComm { width: 60px; text-align: center; }
#ulSSupplierList li span.spAgree { width: 40px; text-align: center; }
#ulSSupplierList li span.spSPS { width: 40px; text-align: center; }
#ulSSupplierList li span.spEmail { width: 200px; }
#ulSSupplierList li span.spPayment { width: 75px; }

#ulSSupplierList li span.spURL a { color: #b71f25; }

#divSSupplierDetailWrapper { position: fixed; left: 0; top: 0; right: 0; bottom: 100%; opacity: 0; transition: all 0.5s; background-color: rgba(40,40,40,0.6); }
#divSSupplierDetailWrapper.show { bottom: 0; opacity: 1; }
#divSSupplierDetail { position: absolute; left: 10%; top: 5%; right: 10%; bottom: 5%; overflow: auto; background-color: rgb(255,255,255); border: solid 1px rgb(220,220,220); padding: 1em; }
#divSSupplierDetail .spClose { float: right; }
#divSSupplierDetail .spClose i { font-size: 2em; }

#ulSupplierOptions, #ulNewSupplierOptions { list-style: none; padding: 0; margin: 0.5em 0; margin-left: 200px; max-height: 25.1em; overflow-y: scroll; }
#ulSupplierOptions li, #ulNewSupplierOptions li { padding: 0.2em; cursor: pointer; }
#ulSupplierOptions li:nth-child(even), #ulNewSupplierOptions li:nth-child(even) { background-color: rgb(220,220,220); }
#ulSupplierOptions li.sel, #ulNewSupplierOptions li.sel { background-color: rgb(120,120,120); color: rgb(255,255,255); }

#ulSupplierDataTabs { list-style: none; padding: 0; border-bottom: solid 1px rgb(220,220,220); }
#ulSupplierDataTabs li { display: inline-block; padding: 0.5em 1em; border-width: 1px; border-style: solid solid none solid; border-color: rgb(220,220,220); border-radius: 10px 10px 0 0;
                      position: relative; font-size: 0.8em; margin-right: -0.7em; background-color: rgb(240,240,240); cursor: pointer; }
#ulSupplierDataTabs li.show { z-index: 100 !important; background-color: rgb(255,255,255); }

#divSupplierDataTabs div { display: none; }
#divSupplierDataTabs div.show { display: block; }

.ulSSupplierForm { list-style: none; padding: 0; font-size: 0.8em; margin: 1em 5px; }
.ulSSupplierForm li {  }
.ulSSupplierForm li span.spLabel { width: 200px; display: inline-block; padding: 5px 0; margin: 2px 0; vertical-align: top; }
.ulSSupplierForm li input[type=text] { font-size: 1em; width: 400px; }
.ulSSupplierForm li input[type=button] { font-size: 1em; }
.ulSSupplierForm li input[type=date] { font-size: 1em; }
.ulSSupplierForm li input[type=file] { font-size: 1em; }
.ulSSupplierForm li input[type=checkbox] { margin: 8px 3px; }
.ulSSupplierForm li select { width: 410px; font-size: 1em; }
.ulSSupplierForm li textarea { font-size: 1em; width: 402px; height: 50px; margin: 2px 2px 0 2px; padding: 3px;}
.ulSSupplierForm li p { font-size: 1em; margin: 1em 0; }
.ulSSupplierForm li .ulLinkedSuppliers { height: 7.2em; overflow-y: scroll; }

.ulSSupplierForm li span { display: inline-block; margin: 7px; }
.ulSSupplierForm li .spBranch { width: 150px !important; }
.ulSSupplierForm li .spAgencyId { width: 150px !important; }
.ulSSupplierForm li .spUser { width: 150px !important; }
.ulSSupplierForm li .spPass { width: 150px !important; }

.ulSSupplierForm li i.fa { font-size: 1.2em; vertical-align: middle; margin-left: 0.5em; }

#ulSAccountForm.hide { display: none; }

#divSSupplierAddWrapper { position: fixed; left: 0; top: 0; right: 0; bottom: 100%; opacity: 0; transition: all 0.5s; background-color: rgba(40,40,40,0.6); overflow: hidden; }
#divSSupplierAddWrapper.show { bottom: 0; opacity: 1; }
#divSSupplierAdd { position: absolute; left: 10%; top: 5%; right: 10%; bottom: 5%; overflow: auto; background-color: rgb(255,255,255); border: solid 1px rgb(220,220,220); padding: 1em; }
#divSSupplierAdd .spClose { float: right; }
#divSSupplierAdd .spClose i { font-size: 2em; }

/*
#tblLxHotelReport { border-spacing: 0; }
#tblLxHotelReport thead p { font-weight: bold; }
#tblLxHotelReport tr:nth-child(even) { background-color: rgba(40,40,40,0.1); }
#tblLxHotelReport td { padding: 5px 3px; }
#tblLxHotelReport p { font-size: 0.8em; margin: 0; }
*/

.tblReport { border-spacing: 0; }
.tblReport thead p { font-weight: bold; }
.tblReport tr:nth-child(even) { background-color: rgba(40,40,40,0.1); }
.tblReport td { padding: 5px 3px; }
.tblReport p { font-size: 0.8em; margin: 0; }