/*   Template14.css  */
/*   :: Copyright © 2016-2022 Travtech Inc. :: */
/*   :: Please refer Stylesheet Usage document before you make any changes :: */
/*   Last Updated 05/08/23 PB  */

/* ----- General Style Rules (applying to all pages) ------ */
body, form, img, div, h1, h2, h3, h4, h5 {
    margin: 0;
    border: none;
}

main {
    display: block;
}

a {
    color: #3c71aa;
    text-decoration: underline;
    cursor: pointer;
}

    a:hover {
        color: #224373;
    }

h1, h2, h3 {
    color: #224373;
}

h1 {
    margin: 10px 0;
    font-size: 21px;
}

h2 {
    font-size: 14px;
}

h3 {
    font-size: 12px;
}

h4, h5 {
    font-size: 11px;
}

p {
    margin: 3px 0;
}

select {
    font: normal 1em Verdana, Arial, Helvetica, sans-serif;
}

table {
    border-spacing: 0;
    border-collapse: collapse;
}

ul {
    margin: 0;
    color: #cc6633;
}

li span,
li a {
    color: #4e4e4e;
}

var {
    display: none;
}


/* --- Top-level page rules ------ */
div.zzTopDiv {
    font: normal 12px Verdana, Arial, Helvetica, sans-serif;
    color: #4e4e4e;
    text-align: right;
}

.zzMainBody, .zzFooter {
    max-width: 1140px;
    margin: 10px;
    overflow: hidden;
}

.zzAdSpace-Right {
    float: left;
    margin: 20px 10px 0 10px;
}

iframe {
    border: none;
    overflow: hidden;
}

    iframe.zzCustHdrFrame {
        width: 100%;
        height: 120px;
    }

    iframe.zzCustFtrFrame {
        width: 100%;
        height: 120px;
    }


/* ---Theme Class Style Rules (applying to all pages) ------ */
.zzBackground {
    background-color: #f0f0f0;
}

.zzTitleBox {
    background-color: #224373;
    color: #ffffff;
}

.zzSubTitleBox {
    background-color: #ccddff;
}

.zzTitleText {
    color: #cc0000;
}

.zzErrorText {
    color: #cc0000;
    font-weight: bold;
}

.zzAltRow {
    background-color: #eeeeee;
}

.zzCatColor {
    display: inline-block;
    width: 18px;
    height: 18px;
    border: solid 1px black;
}

.zzOffline {
    display: none;
}


/* ----------------  Header Classes --------------- */

.zzPageHeader {
    text-align: center;
    font-weight: bold;
    background-color: #224273;
    color: white;
    overflow: hidden;
}

    .zzPageHeader img {
        float: right; /*width:200px; height:31px;*/
    }

    .zzPageHeader > span {
        display: inline-block;
        margin: 5px 0;
    }

    .zzPageHeader span.phone {
        float: left;
        margin: 6px 0 0 10px;
        font-size: 1.3em;
    }

        .zzPageHeader span.phone a {
            color: white;
            text-decoration: none;
        }

    .zzPageHeader a {
        margin: 0 10px;
        color: white;
    }

.zzPageTitle {
    margin-top: -22px;
    margin-bottom: 7px;
    color: white;
    font-weight: bold;
    text-align: center;
}

    .zzPageTitle i.fa-refresh {
        margin-right: 8px;
        font-size: 16px;
        cursor: pointer;
    }

/* ----------------  Footer Classes --------------- */
.zzFooter {
    margin: 0 20px;
}

.zzAirDisclaimer,
.zzRateDisclaimer {
    font-size: 9px;
    margin-top: 5px;
}

.zzCallAssist,
.zzNeedHelp {
    margin-top: 10px;
    font-weight: bold;
    font-size: 12px;
}

    .zzNeedHelp span.phone,
    .zzNeedHelp span.refNum {
        color: #a35229;
    }

.zzCopyrightNotice {
    margin: 10px 0;
    font-size: 10px;
}

/*------------Other Commom Classes ---------------*/

/* Button classes */
button {
    color: white;
    background-color: #b85c2e;
    font-size: 14px;
    font-weight: bold;
    text-transform: uppercase;
    padding: 2px 8px;
    border: solid 1px white;
    border-radius: 4px;
    cursor: pointer;
}

    button:hover {
        background-color: #E07226;
    }

    button.pending {
        background-color: black;
    }

.zzCloseButton {
    background-color: #224273;
}

button.zzSlider {
    display: none;
    width: 100%;
    padding: 10px;
    margin: 5px 0;
    background: #0c5796 url('https://ttcm.s3.amazonaws.com/Images/Template/icon_search.png') 4%/20px no-repeat;
    text-align: right;
    font-size: 1.25em;
    border: none;
    border-radius: 5px;
}

    button.zzSlider span {
        float: left;
    }

.zzPriceCurrencyCode {
    font-size: .75em;
    margin-left: 2px;
}

/* Demo Site Banner */
div.zzDemoMessage {
    margin: 10px 0;
    border-style: solid;
    padding: 10px 40px;
    background-color: #D0D7E0;
    font-size: 12pt;
    font-weight: bold;
    text-align: center;
}

    div.zzDemoMessage p {
        color: #CC0000;
        font-size: 16pt;
        margin: 8px;
        text-transform: uppercase;
    }

/* Cabin Info Overlay */
div.zzCabinOverlay {
    display: none;
}

    div.zzCabinOverlay > div {
        position: fixed;
        z-index: 2;
        width: 40%;
        max-width: 400px;
        top: 30px;
        right: 20%;
        padding: 10px;
        border-style: solid;
        background-color: #ffffff;
    }

    div.zzCabinOverlay div.image {
        margin: 7px 10px;
        text-align: center;
    }

        div.zzCabinOverlay div.image img {
            width: 100%;
        }

    div.zzCabinOverlay div.info {
        margin-top: 10px;
    }

        div.zzCabinOverlay div.info div {
            margin: 3px 0;
        }

        div.zzCabinOverlay div.info span {
            margin-left: 3px;
            font-weight: bold;
        }




/*--------------------- Cruise Search Classes ----------------------*/
/* Ajax Overlays */
div.zzAjaxMask {
    display: none;
    position: absolute;
    z-index: 10;
    background-color: #cccccc;
    opacity: 0.4;
    width: 100%;
    height: 100%;
}




/*   - Location Explorer(le) Style Classes  */
/*   ---------------------------------------  */
#leBody {
}

    #leBody h1 {
        margin-right: 10px;
    }

#leTopDiv {
    padding: 10px;
}

h2 {
    color: #a35229;
}

#leTopDiv h3 {
    padding: 5px;
    border-top-right-radius: 5px;
    border-top-left-radius: 5px;
    background-color: #337ab7;
    color: white;
    font-size: 16px;
    font-weight: normal;
}

#leTopDiv .slider {
    cursor: pointer;
    font-size: 14px;
}

#leTopDiv h3.slider span {
    float: left;
}

#leTopDiv h4.slider {
    padding: 4px 5px;
    text-align: center;
}

    #leTopDiv h4.slider span {
        margin-right: 4px;
    }

#leMainBody > div {
    overflow: hidden;
}

/** Styling for menu tabs **/
#leTopDiv header ul.menu {
    margin-top: 10px;
    padding: 0;
    text-align: center;
}

    #leTopDiv header ul.menu li {
        display: inline-block;
        list-style-type: none;
        margin: 5px 2px;
        padding: 5px 8px;
        color: #4e4e4e;
        background-color: #eee;
        border-radius: 5px;
        cursor: pointer;
        font-size: 16px;
    }

        #leTopDiv header ul.menu li.selected {
            background-color: #337ab7;
            color: white;
        }

#leTopDiv .table {
    margin-top: 10px;
    border: solid 1px #ddd;
    border-radius: 5px;
}

#leTopDiv div.table h3 {
    padding: 5px;
    background-color: #337ab7;
    color: white;
}

#leTopDiv .table > div {
    padding: 3px 5px;
}

    #leTopDiv .table > div:nth-child(odd) {
        background-color: #ddd;
    }

    #leTopDiv .table > div > label {
        display: inline-block;
        width: 40%;
        vertical-align: top;
    }

    #leTopDiv .table > div > a,
    #leTopDiv .table > div > span {
        display: inline-block;
        width: 59%;
    }


/** Styling for Main tab **/
#leTabMain div.localColor {
    font: normal 12px "Helvetica Neue",Helvetica,Arial,sans-serif;
    line-height: 1.6em;
}

#leTabMain div.media {
    margin: 10px 0;
    padding-top: 10px;
    border-top: solid 1px #ddd;
    overflow: hidden;
}
/* styling for link thumbnails */
#leTabMain div.linkBox {
    float: right;
    width: 42%;
}

    #leTabMain div.linkBox > div {
        margin: 10px 10px 0 0;
    }

    #leTabMain div.linkBox img {
        width: 60px;
        height: 40px;
        margin: 4px 0 0 8px;
        cursor: pointer;
    }
/* styling for media display box */
#leTabMain div.media figure {
    margin: 0 43% 0 0px;
    text-align: center;
}
    /* styling for images */
    #leTabMain div.media figure img {
        width: 100%;
    }
    /* styling for iframed media */
    #leTabMain div.media figure > div > div {
        position: relative;
        height: 0px;
        margin-bottom: 5px;
        padding-bottom: 56%;
    }

    #leTabMain div.media figure iframe {
        position: absolute;
        left: 0;
        width: 100%;
        height: 100%;
    }
    /* styling for mp4 videos */
    #leTabMain div.media figure video {
        width: 100%;
    }

/** Styling for Facts tab **/
#leTabFacts {
    margin-top: 5px;
    padding-top: 10px;
    border-top: solid 1px #ddd;
}

    #leTabFacts section:first-child {
        overflow: hidden;
    }

    #leTabFacts div.col1 {
        float: right;
        width: 40%;
    }

        #leTabFacts div.col1 img {
            width: 100%;
        }

    #leTabFacts div.col2 {
        margin-right: 40%;
        padding: 0 10px;
    }

    #leTabFacts div.col1 a {
        display: block;
        margin-top: 2px;
        text-align: center;
    }

    #leTabFacts div.flags {
        display: flex;
        justify-content: space-around;
    }


/** Styling for Weather tab **/
#leWeatherWidget {
    margin: 5px;
    overflow: hidden;
}

    #leWeatherWidget div.current {
        float: right;
        overflow: hidden;
    }

        #leWeatherWidget div.current figure {
            float: right;
            margin: 0 0 0 10px;
            text-align: center;
            width: 130px;
        }

        #leWeatherWidget div.current figcaption {
            margin-top: -20px;
        }

        #leWeatherWidget div.current div.data {
            float: right;
        }

            #leWeatherWidget div.current div.data > div {
                margin: 5px;
            }

margin:5px 0;
#leWeatherWidget h4 {
    font-size: 16px;
    color: #cc6633;
}

#leWeatherWidget label {
    color: #538ac3;
    margin-left: 5px;
}

#leWeatherWidget a {
    display: block;
    margin-top: 10px;
}

#leWeatherWidget div.forecast {
    margin-right: 300px;
}

    #leWeatherWidget div.forecast h4 {
        text-align: center;
    }

    #leWeatherWidget div.forecast table {
        width: 100%;
    }

    #leWeatherWidget div.forecast td {
        text-align: center;
    }


/* styling for weather averages */
#leTabWeather section.averages > div {
    padding: 2px 0;
    border-bottom: solid 1px #eee;
}

    #leTabWeather section.averages > div > div {
        display: flex;
        justify-content: space-around;
        /*font-size:14px;*/
    }

        #leTabWeather section.averages > div > div div:nth-child(6) {
            margin-left: 3%;
        }

#leTabWeather section.averages label {
    color: #538ac3;
    display: block;
}
/** Styling for Parking tab **/
#leTabParking section:not(:first-child) > div {
    display: none;
}

#leTopDiv footer {
    margin: 10px 0;
    padding-top: 10px;
    border-top: solid 1px #ddd;
    text-align: center;
}

/** Styling for Comments form **/
#leCommentForm {
    display: none;
}

    #leCommentForm div.box {
        padding: 8px;
        border: solid 1px black;
    }

        #leCommentForm div.box > div {
            margin: 5px 0;
        }

    #leCommentForm label {
        display: inline-block;
        width: 20%;
    }

    #leCommentForm input,
    #leCommentForm textarea {
        width: 75%;
    }

    #leCommentForm div.buttonBox button {
        float: left;
        margin-top: 10px;
    }

    #leCommentForm div.buttonBox p {
        margin-left: 90px;
    }

#leButtonBox {
    text-align: center;
}


/*   - Default Search Widget (dw) Style Classes -   */
/*   --------------------------------------------   */
#dwBody {
}

#dwTopDiv {
    position: relative;
    max-width: 900px;
    background-color: #3c71aa;
    color: white;
    border: solid 1px black;
    font: normal 12px verdana,arial,sans-serif;
}

#dwSelectCriteria {
    margin: 8px;
    overflow: hidden;
}

    #dwSelectCriteria h1 {
        margin: 0;
        color: white;
        font-size: 14px;
    }

    #dwSelectCriteria h2 span {
        margin-right: 10px;
        font-size: .8em;
        font-weight: normal;
    }

    #dwSelectCriteria option:disabled {
        color: #aaa;
    }

    #dwSelectCriteria > div {
        float: right;
        width: 48%;
        margin-top: 5px;
        margin-left: 2%;
    }

    #dwSelectCriteria select {
        font-size: 12px;
        width: 100%;
    }

#dwSortBy {
    display: none;
}

#dwButtonBox {
    display: flex;
    justify-content: space-around;
    margin: 5px;
}

    #dwButtonBox button {
        min-width: 75px;
    }

    #dwButtonBox a {
        color: white;
        text-align: center;
    }



/*   - Left Search Widget (lf) Style Classes  */
/*   ---------------------------------------  */
.lfTopDiv {
    float: right;
    width: 200px;
}

    .lfTopDiv .zzHighlightText,
    .lfTopDiv h2, .lfTopDiv h3 {
        color: white;
    }

    .lfTopDiv > form {
        position: relative;
        background-color: #3c71aa;
        color: white;
    }

        .lfTopDiv > form input[type=text] {
            color: black;
            width: 97%;
        }

        .lfTopDiv > form select {
            color: black;
            width: 99%;
        }

    .lfTopDiv button.zzSlider {
    }

.lfSelectCriteria {
    padding: 5px 7px;
    overflow: hidden;
}

    .lfSelectCriteria > div {
        margin-bottom: 5px;
    }

    .lfSelectCriteria select {
        margin: 2px 0;
        font-weight: bold;
        font-size: .95em;
    }

    .lfSelectCriteria option:disabled {
        color: #aaa;
    }

.lfDate, .lfDays {
    width: 49%;
    float: right;
}

.lfDays {
    margin-right: 1.5%;
}


.lfBestDealBox {
    padding: 4px 8px 8px 8px;
    border-top: solid 1px #cccccc;
    border-bottom: solid 1px #cccccc;
}

    .lfBestDealBox h2 img {
        cursor: pointer;
    }

    .lfBestDealBox h3 {
        font-size: 1em;
        font-weight: normal;
        margin: 6px 0;
    }

    .lfBestDealBox div.overlay {
        display: none;
        position: absolute;
        right: 175px;
        top: 140px;
        width: 250px;
        border: solid 2px gray;
        color: black;
        background-color: #fdfdee;
        padding: 5px;
    }

    .lfBestDealBox > div.overlay h2 {
        margin: 5px 0;
        color: #cc6633;
    }

.lfPaxOptions {
    overflow: hidden;
}

    .lfPaxOptions div.ckb {
        float: right;
        margin: 0 4px 6px;
    }

.lfChkNRef {
    margin: 0;
}

.lfPpaxOvly {
    display: none;
    position: absolute;
    right: 10px;
    z-index: 2;
    width: 170px;
    font-size: .875em;
    color: black;
    background-color: #fefeee;
    border: solid 1px #666666;
}

    .lfPpaxOvly div.buttonBox {
        margin: 5px 0;
        text-align: center;
    }

        .lfPpaxOvly div.buttonBox button {
            font-size: .9em;
        }

.lfPaxOptions h5 {
    margin: 2px;
    font-size: 9px;
}

.lfChkNRef {
    margin-top: 2px;
}

.lfResidency {
    margin-top: 10px;
}

.lfPromoCode {
}

.lfButtonBox {
    padding: 5px 0;
    text-align: center;
}

    .lfButtonBox > div {
        margin: 5px 0;
    }

    .lfButtonBox span.zwSearchButton {
        display: inline-block;
        width: 80%;
    }

.lfTopDiv .adSpace {
    overflow: hidden;
    margin-bottom: 10px;
    color: black;
}

/*   -------------------------------------------------------  */
/*   CRUISE RESULT PAGE .cr) Style Classes */
#crBody {
}

#crTopDiv {
}

    #crTopDiv li a:hover {
        text-decoration: underline;
    }

/* Cruise Results Header */
#crHeader {
}

#crTopDiv .zzPageTitle {
    font-weight: normal;
}


#crMainBody {
    margin-right: 215px;
    max-width: 780px;
}

#crHeader2 {
    margin-left: 30px;
}

.crSCriteria {
    font-size: 12px;
    color: #4e4e4e;
    margin: 5px;
}

.crSMsgs div {
    margin: 5px 0;
    padding: 5px;
    border: solid 1px #888;
    border-radius: 5px;
    background-color: #ccffcc;
}

    .crSMsgs div.error {
        color: red;
        padding-right: 25px;
        background: #fad3d3 url('//ttcm.s3.amazonaws.com/Images/Template/warning.png') right 5px/top 18px no-repeat;
    }

    .crSMsgs div.warning {
        background-color: #ffffcc;
    }

.crSortLinks span,
.crSortLinks a {
    font-weight: bold;
    margin-right: 8px;
}

div.crPaging {
    text-align: left;
    margin-bottom: 10px;
}

    div.crPaging a {
    }

        div.crPaging a.left,
        div.crPaging a.right {
            display: inline-block;
            width: 6px;
            margin: 0 5px;
            text-decoration: none;
        }

        div.crPaging a.left {
            background: url('https://ttcm.s3.amazonaws.com/Images/Template/previous.gif') no-repeat;
        }

        div.crPaging a.right {
            background: url('https://ttcm.s3.amazonaws.com/Images/Template/next.gif') no-repeat;
        }


/*  Cruise Result Listings Classes */
#crCruiseListings {
    margin-top: 10px;
    max-width: 750px;
}

    #crCruiseListings > h2 {
        display: none;
        padding: 3px;
        background-color: #0099FF;
        color: white;
        font-weight: normal;
        text-align: center;
        text-transform: uppercase;
    }

.crCruiseListing {
    margin-bottom: 21px;
    padding: 10px;
    border: solid 1px #000066;
    min-height: 153px;
    background-color: #f3f3f3;
}

    .crCruiseListing.featured {
        background-color: #FFFED2;
        border-color: #0099FF;
    }

.crListBox {
    overflow: hidden;
}

.crShipImage {
    float: right;
    width: 225px;
    overflow: hidden;
    margin: 3px 0;
}

    .crShipImage > img {
        width: 100%;
    }

    .crShipImage img.new,
    .crShipImage img[alt=New] {
        margin-right: -100%;
        width: 100%;
    }

    .crShipImage span.stars {
        color: #CC6633;
        font-size: 1.6em;
    }

    .crShipImage img.maglass {
        cursor: pointer;
        margin-right: 4px;
        vertical-align: -3px;
    }

    .crShipImage img.vlogo {
        float: right;
        margin-left: 10px;
        width: 120px;
    }

div.crCruiseBox {
    margin-right: 240px;
}

div.crCompareLink {
    float: left;
}

    div.crCompareLink a {
        margin-left: 4px;
        font-size: .9em;
        color: #4e4e4e;
        text-decoration: underline;
        cursor: pointer;
    }

        div.crCompareLink a:hover {
            text-decoration: none;
        }

    div.crCompareLink input {
        vertical-align: middle;
    }

h3.crLengthDestination {
    margin-bottom: 2px;
    font-size: 1.17em;
}

div.crVendorCruise {
    font-weight: bold;
    margin-bottom: 2px;
}

    div.crVendorCruise span {
        color: #a35229;
    }

.crSailingDates {
    margin-top: 4px;
}

    .crSailingDates span.label {
        font-weight: bold;
    }

div.crPrices {
    margin: 5px 0 10px 0;
    padding: 3px 0;
    border: solid 1px gray;
    background-color: #fefeee;
}

    div.crPrices > div.label {
        margin-right: 3px;
    }

    div.crPrices div.cabinType {
        width: 23.5%;
        display: inline-block;
        font-size: .875em;
        text-align: center;
    }

        div.crPrices div.cabinType div.label {
            font-weight: bold;
        }

    div.crPrices div.price {
        color: #224273;
        font-size: 1.3em;
        font-weight: bold;
    }

    div.crPrices span.currencyCode {
        font-size: .8em;
        margin-left: 3px;
    }

    div.crPrices.noPrice {
        text-align: left;
        padding-left: 5px;
        color: #224273;
        font-size: 1.2em;
        font-weight: bold;
    }
/* Tablet/Desktop device bonus icons */
div.crBonusOffers {
    margin-right: 22px;
}

    div.crBonusOffers h4 {
        color: #a35229;
        font-weight: bold;
        font-size: 1.17em;
        text-transform: uppercase;
    }

    div.crBonusOffers ul {
        padding-right: 15px;
        color: #4e4e4e;
    }

    div.crBonusOffers a {
        text-decoration: none;
    }
/* Mobile device bonus icons */
.crListingIcons {
    display: none;
    overflow: hidden;
}

    .crListingIcons a:not(.crListingViewDetails),
    .crListingIcons > div {
        display: inline-block;
        max-width: 22%;
        margin: 0 0 3px 3px;
        padding: 3px;
        border: solid 1px #cccccc;
        color: black;
        background-color: #eeeeee;
        text-transform: uppercase;
        text-align: center;
        text-decoration: none;
    }

    .crListingIcons div.catUpgrade {
        max-width: none;
        padding: 3px 20px;
        color: white;
        background-color: #0e890e;
        font-weight: bold;
        text-transform: none;
    }

    .crListingIcons a.special {
        color: #541c00;
        background-color: #fbc00e;
    }

    .crListingIcons a.gratuities {
        color: white;
        background-color: #1a9adf;
    }

a.crListingViewDetails,
.crCruiseListing .zzSelectButton {
    float: left;
    font-weight: bold;
}

/*   Cruise Results Footer Classes*/
#crFooter {
    margin-right: 215px;
    padding: 2px;
    max-width: 780px;
}



/*   -------------------------------------------------------  */
/*   CRUISE DETAILS (sub)PAGE (cdp) Style Classes */

#cdBody {
}

    #cdBody div.ui-dialog {
        max-width: 100%;
    }

    #cdBody div.cdLocExp div.ui-dialog-buttonset {
        text-align: center;
        float: none;
    }

    #cdBody div.cdLocExp button.close {
        color: white;
        background: #cc6633;
    }

#cdTopDiv {
}

    #cdTopDiv section.error {
        border-color: #cc0000;
        border-width: 2px;
    }

    #cdTopDiv select.required {
        background-color: #ffffcc;
    }

    #cdTopDiv select.error {
        background-color: #ffcccc;
    }

#cdMainBody {
    margin-right: 210px;
    max-width: 780px;
}

    #cdMainBody button.zzSlider {
        background-image: url('https://ttcm.s3.amazonaws.com/Images/Template/icon_menu.png');
    }

#cdItinInfo button.zzSlider {
    background: #3292c9 url('https://ttcm.s3.amazonaws.com/Images/Template/icon_globe.png') 4%/20px no-repeat;
}

h2.cdEmailFriend {
    margin-bottom: 2px;
    text-align: left;
    font-size: 1em;
}

    h2.cdEmailFriend a {
        text-decoration: none;
    }

        h2.cdEmailFriend a:hover {
            text-decoration: underline;
        }

    h2.cdEmailFriend span {
        font-size: 2em;
        vertical-align: -4px;
        margin-left: 2px;
        color: #cc6633;
    }

#cdItinInfo {
    position: relative;
    float: right;
    width: 235px;
}

    #cdItinInfo h2 {
        margin: 4px 0;
        font-size: 1em;
    }

    #cdItinInfo div.rates {
        margin: 15px 0;
        padding: 2px 6px;
        font-weight: bold;
        background-color: #fdfed6;
        border: solid 2px #cc6633;
        border-radius: 5px;
    }

        #cdItinInfo div.rates span.price {
            color: #a35229;
            font-size: 1.1em;
        }

        #cdItinInfo div.rates a {
            font-weight: normal;
            float: left;
        }

    #cdItinInfo img.map {
        width: 100%;
    }

        #cdItinInfo img.map:hover {
            width: auto;
            position: absolute;
        }

/* Sailing Itinerary Section */
#cdItinDetails {
}

    #cdItinDetails button.zzSlider {
        background: #3292c9 url('https://ttcm.s3.amazonaws.com/Images/Template/icon_menu.png') 4%/20px no-repeat;
    }

    #cdItinDetails > div {
        height: 330px;
        overflow: auto;
        margin-top: 5px;
        margin-right: 255px;
    }

    #cdItinDetails table {
        width: 100%;
        *width: 96%; /* IE7 compatibility */
        border-bottom: solid 1px #224273;
        border-left: solid 1px #224273;
    }

    #cdItinDetails tr.top {
        background-image: linear-gradient(#ffffff,#f8f8f8);
        background-image: -webkit-linear-gradient(top,#ffffff,#f8f8f8);
    }

    #cdItinDetails tr.bot {
        background-image: linear-gradient(#f8f8f8,#dedede);
        background-image: -webkit-linear-gradient(top,#f8f8f8,#dedede);
        background-color: #f4f4f4;
    }

    #cdItinDetails td {
        padding: 2px 4px;
    }

    #cdItinDetails tr.top td {
        border-top: solid 1px #224273;
    }

        #cdItinDetails tr.top td.day {
            border-top-color: #979797;
        }

    #cdItinDetails td.day {
        text-align: center;
        padding: 0;
        color: white;
        background-color: #224273;
    }

    #cdItinDetails td.port,
    #cdItinDetails td.port a {
        color: #224273;
        font-weight: bold;
    }

        #cdItinDetails td.port span {
            font-weight: normal;
            font-size: .9em;
        }

            #cdItinDetails td.port span.icon {
                cursor: help;
            }

    #cdItinDetails div.mouseover {
        display: none;
        position: absolute;
        right: 465px;
        color: black;
        font-weight: normal;
        padding: 3px;
        background-color: #ffffcc;
        border: solid 1px black;
    }

#cdItinNote {
    margin-top: 5px;
    font-size: .9em;
}
/* Passenger Information Section */
#cdPaxBox {
    clear: right;
    margin: 25px 0;
    padding: 10px;
    background-color: #FDFDEE;
    border: solid 1px #999999;
    font-size: 12px;
    overflow: hidden;
}

    #cdPaxBox input,
    #cdPaxBox select {
        font-size: 1em;
    }

    #cdPaxBox h2 {
        margin: 4px 0;
    }

div.cdPaxSelect {
    float: right;
    width: 30%;
}

    div.cdPaxSelect h2 {
        text-align: center;
    }

    div.cdPaxSelect h3 {
        margin: 4px 0;
    }

    div.cdPaxSelect div.paxType > div {
        margin: 5px 0;
    }

    div.cdPaxSelect div.paxType select {
        float: left;
        margin-right: 4px;
    }

    div.cdPaxSelect div.buttonBox {
        margin-top: 10px;
        text-align: center;
    }

div.cdChildAges {
    display: none;
    text-align: center;
}

    div.cdChildAges p {
        color: #cc6633;
        margin: 2px 10px;
    }

    div.cdChildAges div.controls > div {
        display: inline-block;
        margin: 0 3px;
    }

div.cdAgeRules {
    margin-top: 10px;
    text-align: center;
}

div.cdBestRate {
    width: 66%;
    margin-right: 32%;
    padding-right: 10px;
    border-right: solid 1px #999;
}

    div.cdBestRate div.buttonBox {
        clear: right;
        text-align: center;
        margin-top: 10px;
    }

    div.cdBestRate p {
        margin: 4px 0;
        font-size: 11px;
    }

div.cdPaxQual {
    float: right;
}

    div.cdPaxQual span {
        vertical-align: 2px;
    }

div.cdResidencyGroup,
div.cdVendorPromo {
    margin-right: 30%;
}

    div.cdResidency label,
    div.cdDepAirport label,
    div.cdVendorPromo label {
        color: #224373;
        font-weight: bold;
        font-size: 12px;
    }

    div.cdResidencyGroup > div {
        margin-bottom: 2px;
    }

    div.cdResidencyGroup select {
        width: 60%;
    }

div.cdVendorPromo {
    overflow: hidden;
}

    div.cdVendorPromo select {
        margin-left: 5px;
    }


#cdTabArea {
    margin: 20px 0 8px 0;
}

    #cdTabArea > ul {
        padding: 0;
        margin-bottom: 2px;
    }

        #cdTabArea > ul li {
            display: inline;
            list-style-type: none;
            padding: 2px;
            margin: 0 1px;
            font-weight: bold;
            background-color: white;
            border: solid 1px #224273;
            border-bottom: 0;
            cursor: pointer;
        }

        #cdTabArea > ul li {
            color: #224273;
        }

            #cdTabArea > ul li.selected {
                background-color: #224273;
                color: white;
            }

            #cdTabArea > ul li.bookNow {
                color: #a35229;
                background-color: #FDFED6;
            }

    #cdTabArea div.tab {
        background-color: #f3f3f3;
        border: solid 1px #224273;
        overflow: hidden;
    }

/* Rates/Dates Tab */
#cdSailingRates {
    font-size: 12px;
    padding: 10px;
}

    #cdSailingRates h3 {
        display: none;
    }

    #cdSailingRates div.row {
        overflow: hidden;
    }

        #cdSailingRates div.row.selected {
            background-color: #ffffcc;
        }

        #cdSailingRates div.row.more {
            display: none;
        }

    #cdSailingRates div[data-sid] {
        margin-top: 5px;
        padding: 5px 0;
        border-bottom: solid 1px #cccccc;
    }

    #cdSailingRates div.header > div,
    #cdSailingRates div.sailing > div {
        float: right;
    }

    #cdSailingRates div.header {
        font-weight: bold;
        text-transform: uppercase;
    }

    #cdSailingRates div.sailDate {
        width: 22%;
    }

    #cdSailingRates div.category {
        width: 28%;
        overflow: hidden;
        margin-left: 10px;
    }

        #cdSailingRates div.category > div {
            margin: 2px 2%;
            max-width: 200px;
            overflow: hidden;
            text-align: left;
        }

            #cdSailingRates div.category > div label {
                float: right;
                margin-left: 3px;
            }

    #cdSailingRates div.bonusOffers {
        width: 38%;
    }

    #cdSailingRates div.row > div.action {
        float: left;
    }

    #cdSailingRates span.currencyCode {
        font-size: .875em;
        margin-left: 1px;
    }

    #cdSailingRates span.price {
        font-weight: bold;
    }

        #cdSailingRates span.price.min {
            color: #a35229;
        }

    #cdSailingRates a {
        text-decoration: none;
    }

        #cdSailingRates a:hover {
            text-decoration: underline;
        }

    #cdSailingRates ul {
        margin: 0;
        padding-right: 14px;
        font-size: 11px;
    }

    #cdSailingRates li {
        margin: 2px 0;
    }

    #cdSailingRates div.showMore {
        margin-top: 4px;
        text-align: center;
        text-decoration: underline;
        color: #a35229;
        font-weight: bold;
        cursor: pointer;
    }

div.cdResidencyPopUp.ui-widget-content {
    background: #9DC4E5;
}

div.cdResidencyPopUp div.ui-dialog-buttonpane {
    margin: 5px 5px 0 5px;
    background: none;
    border-color: white;
}

#cdResidencyPopUp {
    display: none;
    text-align: center;
}

    #cdResidencyPopUp h1 {
        font-size: 14px;
        text-transform: uppercase;
        color: #cc0000;
    }

    #cdResidencyPopUp p {
        margin: 10px 20px;
        font-size: 13px;
        text-transform: uppercase;
        colors: #4e4e4e;
    }

    #cdResidencyPopUp h2 {
        font-weight: normal;
        font-size: 12px;
    }

#cdFooter {
    margin-right: 215px;
    padding: 2px;
    max-width: 780px;
}

    #cdFooter p.ftRateDisclaimer {
    }



/*   -  Home Port Search (ps) Style Classes  */
/*   ----------------------------------------------------  */
#psBody {
}

#psTopDiv {
}

#psMainBody h1 {
    margin: 5px 0 0 0;
    color: #CC6633;
}

#psMainBody form.selMap {
    margin-bottom: 5px;
    color: #224273;
    font-size: 14px;
    font-weight: bold;
    text-align: left;
}

#psMap {
    position: relative;
}

#psTitleBlock {
    position: absolute;
    padding: 4px 10px;
    background-color: #ffffee;
    opacity: .7;
    border-style: solid;
    border-radius: 10px;
    text-align: center;
    font: bold 13px verdana;
}

    #psTitleBlock.NAM {
        right: 490px;
        top: 15px;
    }

    #psTitleBlock.EUN {
        right: 200px;
        top: 15px;
    }

    #psTitleBlock.EUS {
        right: 300px;
        top: 400px;
    }

    #psTitleBlock.SAAF {
        right: 403px;
        top: 15px;
    }

    #psTitleBlock.ASIA {
        right: 403px;
        top: 15px;
    }

    #psTitleBlock.AUS {
        right: 630px;
        top: 15px;
    }

    #psTitleBlock span[class|=psMapTitle] {
        display: block;
        color: #CC0000;
        font-size: 22px;
        font-style: italic;
        text-shadow: -2px 2px white;
    }

#psMapLabels span {
    position: absolute;
    color: #ffffcc;
    font: bold 12px verdana;
    text-shadow: -1px 1px black;
}

#psCanvas {
    position: absolute;
    top: 0px;
}

[id|=psDot],
[id|=psTxt] {
    cursor: pointer;
}

    [id|=psDot].hover,
    [id|=psDot].default {
        fill: blue;
    }

    [id|=psTxt].hover,
    [id|=psTxt].default {
        fill: yellow;
    }

#psButtonBar {
    margin: 5px 0;
}

    #psButtonBar label {
        margin-left: 3px;
        color: #224273;
        font-size: 14px;
        font-weight: bold;
        text-transform: uppercase;
    }

        #psButtonBar label:not(:first-child) {
            margin-right: 12px;
        }

    #psButtonBar button {
        background-color: #006699;
        font-size: 12px;
        text-transform: none;
        padding: 2px 3px;
    }

        #psButtonBar button.selected {
            background-color: #990000;
            cursor: default;
        }

table#psPriceMatrix {
    border-collapse: collapse;
    border-spacing: 0px;
    text-align: center;
}

    table#psPriceMatrix th,
    table#psPriceMatrix td {
        border: solid 1px #224273;
        padding: 4px 2px;
    }

    table#psPriceMatrix th {
        color: white;
        background-color: #224273;
    }

        table#psPriceMatrix th:first-child {
            background-color: #006699;
            font-size: 1.2em;
        }

        table#psPriceMatrix th a {
            color: white;
        }

    table#psPriceMatrix span {
        display: block;
    }

    table#psPriceMatrix th.arrow {
        width: 50px;
    }

        table#psPriceMatrix th.arrow img {
            float: right;
            cursor: pointer;
        }

        table#psPriceMatrix th.arrow.right img {
            float: left;
        }

    table#psPriceMatrix tr.subheading,
    table#psPriceMatrix tr.subheading td:first-child {
        background-color: #ccccff;
        color: #4e4e4e;
        font-weight: normal;
    }

    table#psPriceMatrix td {
    }

        table#psPriceMatrix td:first-child {
            text-align: right;
            width: 24%;
            font-weight: bold;
            color: #000066;
        }

        table#psPriceMatrix td.price {
            color: #cc0000;
            font-weight: bold;
            cursor: pointer;
        }

            table#psPriceMatrix td.price:hover {
                background-color: yellow;
            }

        table#psPriceMatrix td img {
            height: 24px;
        }

#psDisclaimer {
    padding: 2px;
}


/*   - Cruise Compare Page (cc) Style Classes */
/*   ------------------------------------------------------- */
#ccBody {
}

#ccCustHdrFrame {
}

#ccTopDiv {
}

#ccMainBody {
    margin: 10px 10px 10px inherit;
}

    #ccMainBody h1 {
        color: #CC6633;
    }

        #ccMainBody h1 button {
            float: left;
        }

    #ccMainBody table {
        margin-right: 5px;
        border: solid 1px #224273;
    }

    #ccMainBody td {
        width: 150px;
        padding: 5px;
        border: solid 1px #224273;
        vertical-align: top;
        font-size: 10px;
    }

        #ccMainBody td:first-child {
            width: 100px;
            color: white;
            background-color: #224273;
            font-weight: bold;
            text-align: right;
            border-bottom-color: white;
        }

    #ccMainBody tr.spacerNext td:first-child {
        border-bottom-color: #224273;
    }

    #ccMainBody tr.spacer td {
        height: 12px;
        background-color: #CCD4DF;
        border-style: none;
        background-image: linear-gradient(#ffffff,#99A9C0);
    }

tr.ccVendorRow,
tr.ccDestinationRow,
tr.ccLengthRow,
tr.ccShipRow,
tr.ccButtonRow {
    color: #224273;
    font-weight: bold;
    text-align: center;
}

    tr.ccVendorRow img {
        margin: 5px 0;
    }

    tr.ccShipRow img {
        width: 90%;
        margin: 5px 0;
        *width: 135px; /* IE7 compatibility */
    }

tr.ccPricesRow td {
    text-align: center;
}

    tr.ccPricesRow td div {
        text-align: left;
        overflow: hidden;
    }

        tr.ccPricesRow td div span {
            float: right;
        }

            tr.ccPricesRow td div span.price {
                float: none;
                color: #a35229;
                font-weight: bold;
            }

tr.ccSpecialOffersRow ul {
    padding-right: 12px;
}

tr.ccSpecialOffersRow li {
    margin-right: 5px;
}

    tr.ccSpecialOffersRow li span {
        color: #4e4e4e;
    }

#ccMainBody tr.ccButtonRow td {
    padding: 7px 0;
}

tr.ccDepartRow,
tr.ccArriveRow {
    color: #224273;
    font-weight: bold;
}

tr.ccItinRow td div:first-child {
    height: 120px;
    position: relative;
}

tr.ccItinRow img {
    width: 100%;
}

    tr.ccItinRow img:hover {
        position: absolute;
        width: auto;
        z-index: 2;
    }

tr.ccShipDetailsRow h4 {
    margin-top: 2px;
    text-align: center;
    font-weight: bold;
    font-size: 1.1em;
}

tr.ccShipDetailsRow td > div {
    text-align: left;
}

    tr.ccShipDetailsRow td > div span {
        float: right;
    }

#ccCustFtrFrame {
}


/*   - Ship Dining/Public Areas (sub)Page (spa) Style Classes */
/*   ------------------------------------------------------- */
#spaBody {
    background-image: none;
}

#spaTopDiv {
    width: auto;
}

#spaMainBody {
    margin: 10px 0;
}

#spaDetailPane {
    float: right;
    width: 40%;
    margin-right: 10px;
    text-align: center;
}

    #spaDetailPane p {
        margin: 4px 0 0 0;
    }

    #spaDetailPane h2 {
        margin: 5px 0 10px 0;
    }

    #spaDetailPane h3 {
        font-size: 1.1em;
    }

    #spaDetailPane img.large {
        width: 100%;
        margin-bottom: 10px;
    }

#spaListings {
    margin-right: 43%;
    padding: 0 10px;
}

div.spaListing {
    padding: 10px 0;
    border-bottom: solid 1px;
    overflow: hidden;
}

    div.spaListing > div {
        float: right;
        width: 67%;
    }

    div.spaListing p {
        margin: 3px 0 3px 10px;
    }

    div.spaListing img {
        width: 30%;
        cursor: pointer;
    }


/*   - Ship Profile (sub)Page (spr) Style Classes */
/*   ------------------------------------------------------- */
#sprBody {
}

#sprTopDiv {
    width: auto;
}

#sprMainBody {
    padding: 10px;
}

    #sprMainBody .zzAltRow {
        background-color: #d6d6d6;
    }

    #sprMainBody div.table label,
    #sprMainBody div.table span {
        display: inline-block;
        vertical-align: middle;
    }

#sprTopRow {
    overflow: hidden;
    margin-bottom: 10px;
}

    #sprTopRow img.ship {
        float: right;
        width: 30%;
    }

    #sprTopRow > div {
        margin-right: 31%;
    }

    #sprTopRow div.table {
        margin-top: 10px;
        color: #224273;
        font-weight: bold;
    }

        #sprTopRow div.table label {
            width: 60%;
        }

#sprStats > div {
    padding: 2px 0;
}

    #sprStats > div > div {
        display: inline;
    }

#sprStats label {
    width: 22%;
}

#sprStats span {
    width: 10%;
}


/*   - Ship Ratings (sub)Page (sra) Style Classes */
/*   ------------------------------------------------------- */
#sraBody {
}

#sraTopDiv {
    width: auto;
}

#sraTitle a {
    color: white;
    font-weight: normal;
    margin: 0 10px;
}

#sraMainBody {
    padding: 10px;
    background-color: white;
}

#sraTopRow {
    font-weight: bold;
    overflow: hidden;
}

    #sraTopRow img.logo {
        float: right;
    }

    #sraTopRow h2 {
    }

    #sraTopRow > div {
        margin-right: 210px;
    }

    #sraTopRow span.rating {
        color: #CC6633;
        margin-right: 5px;
    }

div.sraNote {
    margin-top: 5px;
    padding-top: 5px;
    border-top: solid 1px #cccccc;
}

#sraRatingDetails {
    clear: right;
    margin-top: 10px;
    overflow: hidden;
}

    #sraRatingDetails h4 {
        background-color: #eeeeee;
        background-image: linear-gradient(to left,#CECECE,#f3f3f3);
    }

    #sraRatingDetails div.col {
        margin: 10px 1.5%;
        float: right;
        width: 30%;
    }

        #sraRatingDetails div.col > div {
            text-align: left;
            border-top: solid 1px #999999;
        }

        #sraRatingDetails div.col h4 + div {
            border-top: none;
        }

        #sraRatingDetails div.col > div label {
            float: right;
        }

        #sraRatingDetails div.col > div span {
            text-align: left;
            color: #CC6633;
            font-size: 1.2em;
        }




/*   - Deck Plan(sub)Page (dpl) Style Classes */
/*   ------------------------------------------------------- */
#dplBody {
    background-image: none;
}

#dplTopDiv {
    width: auto;
}

#dplTitle a {
    color: white;
    font-weight: normal;
    margin: 0 10px;
}

#dplMainBody {
    padding: 10px;
}

    /* Deck Image Block */
    #dplMainBody > button.zzSlider {
        order: 1;
        background-color: #4e4e4e;
    }

#dplRightPane {
    order: 2;
    float: left;
    margin-right: 10px;
    margin-bottom: 10px;
    *width: 300px;
    text-align: center;
}

    #dplRightPane img {
        max-width: 350px;
    }

        #dplRightPane img.legend {
            display: block;
            margin: 0 auto;
        }

#dplMainPane div.header {
    overflow: hidden;
}

#dplMainPane img.logo {
    float: right;
    margin-left: 10px;
    max-height: 70px;
}
/* Deck Selection Block */
#dplDeckSelection {
    width: 350px;
    *width: 335px;
    margin: 10px;
    padding: 10px 0;
    background: url( "https://ttcm.s3.amazonaws.com/Images/Template/deckbg.png" ) center no-repeat;
    text-align: center;
    font-size: 8pt;
    font-weight: bold
}

    #dplDeckSelection.small {
        background: url( "https://ttcm.s3.amazonaws.com/Images/Template/deckbgs.png" ) center no-repeat;
    }

    #dplDeckSelection div.box {
        margin: 0px 92px;
        background-color: #ffffff;
        border-bottom: solid 1px black;
    }

        #dplDeckSelection div.box > div {
            padding: 1px 10px;
            border: solid 1px black;
            border-bottom: 0px;
        }

            #dplDeckSelection div.box > div a {
                text-decoration: none;
            }

            #dplDeckSelection div.box > div:hover {
                background-color: white;
            }

            #dplDeckSelection div.box > div.selected {
                color: white;
                background-color: #224273;
            }
/* Cabin Categories Block */
#dplCategories {
}

div.dplCategory {
    margin: 7px 0;
    overflow: hidden;
}

    div.dplCategory img.cabin {
        float: right;
        width: 120px;
    }

    div.dplCategory > h3,
    div.dplCategory > p {
        margin-right: 130px;
    }

        div.dplCategory > h3 > span {
            margin: 0 4px;
        }

/*   -------------------------------------------------------  */
/*   Special Offers (pop-up) (sop) Style Classes */
#sopTopDiv {
}

    #sopTopDiv .buttonBox {
        margin: 10px;
        text-align: left;
    }

    #sopTopDiv > h1 {
        margin: 5px 10px;
        padding: 2px 0;
        color: #cc0000;
        background-color: #ffcc33;
        font-size: 14px;
        text-align: center;
        font-weight: normal;
        text-transform: uppercase;
    }

#sopMainBody {
    margin: 10px;
}

    #sopMainBody ul.tabs {
        padding: 0;
        margin-bottom: 5px;
    }

        #sopMainBody ul.tabs li {
            display: block;
            list-style-type: none;
            /*height:30px; width:90px; overflow:hidden;*/
            margin-top: 2px;
            padding: 2px;
            color: #224273;
            background-color: #ddd;
            border: solid 1px #224273;
            cursor: pointer;
        }

            #sopMainBody ul.tabs li.selected {
                background-color: #224273;
                color: #fff;
            }

    #sopMainBody div.zzSpecialOffer {
        display: none;
        margin-top: 1px;
    }

        #sopMainBody div.zzSpecialOffer.selected {
            display: block;
        }


/* --- Special Offers --- */
div.zzSpecialOffer div.image {
    text-align: center;
}

div.zzSpecialOffer img {
    max-width: 99%;
}

div.zzSpecialOffer h1 {
    margin: 8px 0;
    color: #CC6633;
    font-size: 14px;
}

div.zzSpecialOffer h2 {
    color: #224273;
    font-size: 13px;
}

div.zzSpecialOffer h3 {
    margin: 5px 0;
    font-size: .8em;
    font-weight: normal;
    color: #4e4e4e;
}

div.zzSpecialOffer hr {
    margin: 2px 0;
}

div.zzSpecialOffer span.dates {
    margin-right: 4px;
    letter-spacing: -1px;
    font-weight: normal;
}

    div.zzSpecialOffer span.dates span[class|=zzMonAbbr] {
        margin-left: 4px;
    }

div.zzSpecialOffer div.details {
    border: solid 1px #cccccc;
    padding: 5px;
}

div.zzSpecialOffer h4 {
    margin: 10px 0 5px;
    color: #CC6633;
    font-size: 12px;
}

div.zzSpecialOffer ul {
    color: #555;
    margin: 5px 15px 0 0;
    padding: 0;
}

div.zzSpecialOffer li {
    color: #4e4e4e;
    margin-bottom: 5px;
}

div.zzSpecialOffer div.code {
    font-size: 9px;
}

/* Email form - Cruise Information Request */
.zzEmailForm {
    padding: 5px;
}

    .zzEmailForm > div {
        margin: 5px 0;
    }

        .zzEmailForm > div > span {
            display: inline-block;
            width: 75px;
            vertical-align: top;
        }
/*--------------------- CBE Classes ----------------------*/
/* -- Common Styles -- */

/* Booking Summary Area */
div.zzBookingSummary div.box {
    background-color: #FDFDEE;
    border: solid 1px #999999;
    padding: 10px;
    overflow: hidden;
}

div.zzBookingSummary h2 {
    color: #a35229;
    font-size: 14px;
}

div.zzBookingSummary img {
    float: left;
    width: 198px;
}

div.zzBookingSummary div.box > div > div {
    margin: 4px 0;
}

div.zzBookingSummary label,
div.zzBookingSummary span[class|=zzSummary] {
    font-weight: bold;
}

div.zzBookingSailing {
    display: inline-block;
    min-width: 245px;
    width: 25%;
    padding-left: 10px;
    border-left: solid 1px #999999;
}

div.zzBookingSailing,
div.zzBookingHotel > div {
    clear: left;
}

    div.zzBookingSailing > div > div {
        float: left;
        width: 65%;
    }

div.zzBookingItinerary {
    padding: 5px 0;
    border-top: solid 1px #888;
    border-bottom: solid 1px #888;
}

div.zzBookingDetails {
    display: inline-block;
    width: 25%;
    vertical-align: top;
    padding: 0 10px;
    border-left: solid 1px #999999;
}

div.zzBookingPricing {
    display: inline-block;
    min-width: 200px;
    vertical-align: top;
    padding-right: 10px;
}

    div.zzBookingPricing > div {
        text-align: left;
        margin: 4px 0;
    }

        div.zzBookingPricing > div.total {
            font-weight: bold;
        }

        div.zzBookingPricing > div label,
        div.zzBookingPricing > div span.desc {
            float: right;
            padding-left: 35px;
        }

        div.zzBookingPricing > div.code {
            font-size: 7px;
        }

        div.zzBookingPricing > div.deposit {
            margin-top: 10px;
        }

    div.zzBookingPricing span.zzCurrencyCode {
        font-size: .8em;
        margin-left: 2px;
    }

div.zzBookingIntinerary {
    padding: 3px 0;
    margin: 3px 0;
    border-top: solid 1px #999999;
    border-bottom: solid 1px #999999;
}

div.zzBookingSummary div.bonus {
    margin: 10px 0;
    padding: 5px;
    background-color: #d3e8fe;
    border: solid 1px #428bca;
}

    div.zzBookingSummary div.bonus label {
        font-size: 1.2em;
        font-weight: bold;
        color: #224273;
    }

    div.zzBookingSummary div.bonus span {
        margin: 0 4px;
    }

    div.zzBookingSummary div.bonus a {
        color: #4e4e4e;
    }



/* Full page interstitial overlay with spinner */
div.zzInterstitialOverlay {
    z-index: 100;
    position: fixed;
    top: 0;
    height: 100%;
    width: 100%;
    padding: 10% 15px 0 15px;
    background-color: rgba(250,250,250,0.9);
    *background-color: white;
}

    div.zzInterstitialOverlay.default div.row1 {
        padding: 8px;
        text-align: center;
        border: 2px solid #538ac3;
        background-color: #E8E8E8;
    }

        div.zzInterstitialOverlay.default div.row1 img {
            width: 23%;
            margin: 0 .5%;
        }

    div.zzInterstitialOverlay.default div.row2 {
        padding: 10px;
        overflow: hidden;
        background-color: #538ac3;
        text-align: center;
    }

        div.zzInterstitialOverlay.default div.row2 p {
            float: right;
            width: 70%;
            margin-top: 8px;
            color: white;
            font-size: 16px;
            font-weight: bold;
            font-style: italic;
        }

        div.zzInterstitialOverlay.default div.row2 img {
            float: left;
            margin-left: 5%;
            width: 25%;
            max-width: 200px;
        }

    div.zzInterstitialOverlay.default div.spinner {
        position: absolute;
        width: 60px;
        height: 60px;
        top: 190px;
        right: 50%;
        margin-right: -38px;
        border: 8px solid #006394;
        border-left-color: transparent;
        border-radius: 50%;
        box-shadow: 0 0 25px 2px #fff;
        animation: spin 1s linear infinite;
    }

@keyframes spin {
    from {
        transform: rotate(0deg);
        opacity: 0.2;
    }

    50% {
        transform: rotate(-180deg);
        opacity: 1;
    }

    to {
        transform: rotate(-360deg);
        opacity: 0.2;
    }
}

@media only screen and (max-width: 599px) {
    div.zzInterstitialOverlay.default div.row1 img {
        width: 48%
    }

        div.zzInterstitialOverlay.default div.row1 img:nth-child(even) {
            display: none;
        }

    div.zzInterstitialOverlay.default div.row2 p,
    div.zzInterstitialOverlay.default div.row2 img {
        float: none;
        width: auto;
    }

    div.iSpinner {
        top: 140px;
    }
}


.zzInterstitialOverlayBox,
.zzModalOverlay {
    z-index: 100;
    position: fixed;
    top: 0;
    height: 100%;
    width: 100%;
    background-color: rgba(250,250,250,0.9);
    *background-color: white;
}

.zzModalOverlay {
    overflow-y: scroll;
}

.zzInterstitialOverlayBox {
    position: absolute;
    right: 0;
    background-color: rgba(240,240,240,0.6);
}

.zzInterstitialMsg {
    color: #000099;
    padding: 8px 5px;
    font-size: 14px;
    font-weight: bold;
    background: url('https://ttcm.s3.amazonaws.com/Images/Template/spinner_blue.gif') no-repeat right 130px top 50%;
}


div.zzHoldTimer {
    position: relative;
    margin: 10px 0;
    padding: 8px 5px;
    background-color: #fdfdad;
    color: #4e4e4e;
    font-weight: bold;
    font-size: 14px;
    border: solid 1px #999;
}

    div.zzHoldTimer span {
        vertical-align: middle;
    }

        div.zzHoldTimer span.time {
            color: #a35229;
            font-size: 16px;
            margin-right: 15px;
        }

span.zzCabinHoldExtendLink {
    float: left;
    margin-top: 2px;
    padding: 3px 5px;
    font-size: 12px;
    background-color: #3360aa;
    color: white;
    text-transform: uppercase;
    cursor: pointer;
}

    span.zzCabinHoldExtendLink:hover {
        background-color: #224273;
    }

div.zzFormBody {
    position: relative;
    overflow: hidden;
    padding-right: 150px;
}

div.zzPrettyPics {
    position: absolute;
    right: 0;
    width: 130px;
}

    div.zzPrettyPics img {
        margin-bottom: 10px;
    }

iframe.zzPrettyPics {
    position: absolute;
    right: 0px;
    width: 130px;
    height: 800px;
}

/* Customer Form - Common Style Classes */
div.zzCustomerForm {
    font-size: 12px;
}

    div.zzCustomerForm h2 {
    }

    div.zzCustomerForm > p {
        margin-bottom: 5px;
    }

    div.zzCustomerForm div.formSection {
        overflow: hidden;
    }

        div.zzCustomerForm div.formSection.name > div {
            display: inline-block;
        }

        div.zzCustomerForm div.formSection.addr {
            float: right;
            width: 60%;
        }

        div.zzCustomerForm div.formSection.phone {
            text-align: left;
        }

        div.zzCustomerForm div.formSection.passw {
            clear: right;
            border-top: solid 1px #cccccc;
            padding-top: 4px;
            margin-top: 10px;
        }

        div.zzCustomerForm div.formSection > p {
            margin-top: 10px;
        }

    div.zzCustomerForm div.formField {
        margin-top: 10px;
    }

    div.zzCustomerForm label {
        margin-left: 3px;
    }

    div.zzCustomerForm input,
    div.zzCustomerForm select {
        margin-left: 6px;
        font-size: 12px;
        background-color: white;
    }

        div.zzCustomerForm input[type=checkbox] {
            vertical-align: middle;
        }

        div.zzCustomerForm input.required,
        div.zzCustomerForm select.required {
            background-color: #ffffcc;
        }

    div.zzCustomerForm div.button {
        margin-top: 10px;
        text-align: left;
    }

div.zzCustForm > div {
    margin: 15px 0;
}

div.zzCustForm div.formGroup > div {
    display: inline-block;
    margin-left: 10px;
}

    div.zzCustForm div.formGroup > div:first-child label {
        display: inline-block;
        width: 80px;
    }

div.zzCustForm input.required,
div.zzCustForm select.required {
    background-color: #ffffcf;
}


div.zzCustFormXX div.formGroup > div {
    display: block;
    margin: 10px 0;
}

    div.zzCustFormXx div.formGroup > div label {
        display: inline-block;
        width: 80px;
    }



/* Passenger Form - Common Style Classes */
div.zzPaxForm {
    border: solid 1px #224273;
    background-color: #f0f0f0;
    font-size: 12px;
    margin-bottom: 10px;
}

    div.zzPaxForm h3 {
        font-weight: normal;
        padding: 4px 6px;
        text-align: left;
    }

        div.zzPaxForm h3 span.title {
            float: right;
        }

        div.zzPaxForm h3 select {
            margin: 3px 0;
        }

        div.zzPaxForm h3 strong {
            font-size: 13px;
            text-transform: uppercase;
        }

    div.zzPaxForm div.formSection {
        overflow: hidden;
        padding: 0 4px;
    }

        div.zzPaxForm div.formSection > div {
            margin: 10px 0;
        }

        div.zzPaxForm div.formSection.name {
            margin-top: 10px;
            border-bottom: solid 1px #cccccc;
        }

            div.zzPaxForm div.formSection.name > div {
                display: inline-block;
                margin-left: 2px;
            }

            div.zzPaxForm div.formSection.name div input {
                width: 170px;
            }

            div.zzPaxForm div.formSection.name div:nth-child(3) input {
                width: 90px;
            }

        div.zzPaxForm div.formSection.addr1 {
            float: right;
            width: 50%;
        }

        div.zzPaxForm div.formSection.notSame > div {
            float: right;
            margin-left: 5px;
        }

        div.zzPaxForm div.formSection.passport {
            clear: right;
            padding-top: 8px;
            border-top: solid 1px #cccccc;
        }

            div.zzPaxForm div.formSection.passport > div {
                width: 50%;
                float: right;
            }

    div.zzPaxForm label {
        margin-left: 3px;
    }

    div.zzPaxForm input,
    div.zzPaxForm select {
        max-width: 95%;
        margin: 0 2px;
    }

        div.zzPaxForm input.required,
        div.zzPaxForm select.required {
            background-color: #ffffcc;
        }

    div.zzPaxForm div.same {
        display: none;
    }


/* -- JQuery Dialog Box -- */
div.ui-dialog {
    font-size: 12px;
    padding: 0;
    max-width: 100%;
}

    div.ui-dialog div.ui-dialog-content {
        padding: 0;
        margin: 0;
    }

div.ui-dialog-titlebar {
    font-size: 1.2em;
    border: none;
    border-radius: 0;
    color: white;
    background: #224273;
}

    div.ui-dialog-titlebar button.ui-button {
        color: #4e4e4e;
        background-image: none;
    }

        div.ui-dialog-titlebar button.ui-button:before {
            /*content:'X';*/
        }

div.ui-dialog-buttonpane {
    font-size: 1.1em;
}

div.ui-widget button.submit {
    color: white;
    background: #cc6633;
    font-weight: bold;
}



/* -- Category Availability Page (ca) Style Defintions -- */
#caBody {
}

#caCustHdrFrame {
}

#caTopDiv {
}

#caMainBody {
}
/* Top-of-page Message Area */
#caMessageArea {
    font-size: 10px;
    margin: 4px;
}

    #caMessageArea h1 {
        text-align: center;
        font-size: 16px;
        font-weight: normal;
    }

/* Category List Area */
#caCategoryList {
    margin: 20px 0;
}

    #caCategoryList div.tabs {
        padding-bottom: 2px;
        border-bottom: solid 1px #224273;
    }

        #caCategoryList div.tabs > span {
            display: inline-block;
            text-align: center;
            color: #224273;
            font-weight: bold;
            border: solid 1px #224273;
            border-bottom: none;
            margin-left: 5px;
            padding: 2px 4px;
            cursor: pointer;
        }

        #caCategoryList div.tabs span.selected {
            color: white;
            background-color: #224273;
        }

    #caCategoryList div.tab {
        display: none;
    }

        #caCategoryList div.tab#caCategoryListInside, /*old*/
        #caCategoryList div.tab#caTabBody0 {
            display: block;
        }

div.caCategoryListing {
    padding: 10px;
    border: solid 1px #224273;
    border-top: none;
    min-height: 135px;
}

    div.caCategoryListing:after {
        content: "";
        clear: both;
        display: table;
    }

    div.caCategoryListing div.image {
        float: right;
        width: 16%;
        font-size: .9em;
        position: relative;
    }

        div.caCategoryListing div.image img {
            width: 100%;
            margin-bottom: 2px;
        }

            div.caCategoryListing div.image img:hover {
                position: absolute;
                z-index: 2;
                width: 300px;
            }

        div.caCategoryListing div.image span {
            font-weight: bold;
        }

    div.caCategoryListing > h2 {
        margin-right: 17%;
        font-size: 1.1em;
        padding: 3px 6px;
        background-color: #224273;
        color: white;
    }

        div.caCategoryListing > h2 span.special {
            float: left;
            color: yellow;
            font-size: .9em;
        }

    div.caCategoryListing div.description {
        order: 1;
        margin-right: 17%;
    }

    div.caCategoryListing div.decks {
        margin-top: 10px;
    }

    div.caCategoryListing div.priceBox {
        order: 2;
        position: relative;
        float: left;
        max-width: 20%;
        margin: 10px 5px 0 5px;
        padding: 5px;
        text-align: center;
        background-color: #f3f3f3;
        border: solid 1px #999999;
    }

        div.caCategoryListing div.priceBox.air {
            width: 25%;
            max-width: none;
            top: -2px;
        }

        div.caCategoryListing div.priceBox.special {
            top: -3px;
            background-color: #FDFED6;
        }

        div.caCategoryListing div.priceBox.air.special {
            top: -8px;
        }

        div.caCategoryListing div.priceBox strong {
            color: #a35229;
        }

        div.caCategoryListing div.priceBox > div.cruiseOnly {
            float: right;
            width: 50%;
            position: relative;
            border-left: solid 1px #cccccc;
        }

        div.caCategoryListing div.priceBox > div.air {
            margin-right: 50%;
        }

        div.caCategoryListing div.priceBox div.price {
            font-weight: bold;
            font-size: 1.35em;
            white-space: nowrap;
        }

        div.caCategoryListing div.priceBox div.label {
            font-size: .9em;
        }

        div.caCategoryListing div.priceBox div.mot {
            color: #224273;
            font-weight: bold;
        }

            div.caCategoryListing div.priceBox div.mot.air {
                width: 80%;
                margin: 30px auto 0 auto;
            }

        div.caCategoryListing div.priceBox img.noDetails {
            cursor: pointer;
        }

        div.caCategoryListing div.priceBox div.buttonBox {
            margin: 4px 0;
        }

        div.caCategoryListing div.priceBox div.zzBookingPricing {
            display: none;
        }

    div.caCategoryListing div.zzBookingPricing {
        position: absolute;
        left: -10px;
        z-index: 10;
        width: 200px;
        padding: 5px 5px 0 5px;
        background-color: #FFFED2;
        border: solid 1px #999999;
    }

    div.caCategoryListing div.priceBox h2 {
        font-size: 1em;
    }

    div.caCategoryListing div.priceBox strong.norefund {
        color: #D00;
        font-weight: normal;
    }

#caFooter {
}

#caCustFtrFrame {
}

#caTagData {
}


/* -- Category/Fare Availability Page (fc) Style Defintions -- */
#fcBody {
}

#fcCustHdrFrame {
}

#fcTopDiv {
}

#fcMainBody {
}
/* Top-of-page Message Area */
#fcMessageArea {
    font-size: 10px;
    margin: 4px;
}

    #fcMessageArea h1 {
        text-align: center;
        font-size: 16px;
        font-weight: normal;
    }

/* Category List Area */
#fcCategoryList {
    margin: 20px 0;
}

    #fcCategoryList div.tabs {
        padding-bottom: 2px;
        border-bottom: solid 1px #224273;
    }

        #fcCategoryList div.tabs > span {
            display: inline-block;
            text-align: center;
            color: #224273;
            font-weight: bold;
            border: solid 1px #224273;
            border-bottom: none;
            margin-left: 5px;
            padding: 2px 4px;
            cursor: pointer;
        }

        #fcCategoryList div.tabs span.selected {
            color: white;
            background-color: #224273;
        }

    #fcCategoryList div.tab {
        display: none;
    }

        #fcCategoryList div.tab#fcTabBody0 {
            display: block;
        }

#fcTCOverlay {
    padding: 4px;
}

div.fcCategoryListing {
    padding: 10px;
    border: solid 1px #224273;
    border-top: none;
    /*min-height:135px;*/
    position: relative;
    overflow: hidden;
}

    div.fcCategoryListing h2 {
        font-size: 1.1em;
        margin-bottom: 4px;
        padding: 3px 6px;
        background-color: #224273;
        color: white;
    }

    div.fcCategoryListing span.frPrice {
        float: left;
        color: yellow;
        font-size: 14px;
    }

        div.fcCategoryListing span.frPrice > span {
            font-size: .7em;
        }

    div.fcCategoryListing div.catInfo {
    }

        div.fcCategoryListing div.catInfo:after {
            content: "";
            clear: both;
            display: table;
        }

        div.fcCategoryListing div.catInfo img {
            float: right;
            width: 16%;
        }

            div.fcCategoryListing div.catInfo img.cabinImg:hover {
                position: absolute;
                z-index: 2;
                width: 300px;
            }

        div.fcCategoryListing div.catInfo div.description {
            margin-right: 17%;
        }

        div.fcCategoryListing div.catInfo div.decks {
            margin-top: 10px;
        }

    div.fcCategoryListing div.fareInfo {
        display: flex;
        flex-wrap: wrap;
    }

        div.fcCategoryListing div.fareInfo > div {
            width: 48%;
        }

            div.fcCategoryListing div.fareInfo > div:nth-child(even) {
                border-right: solid 1px #aaa;
                margin-right: 1.5%;
                padding-right: 1.5%;
            }

            div.fcCategoryListing div.fareInfo > div > div {
                border-top: solid 1px #aaa;
                padding: 10px 0;
            }

            div.fcCategoryListing div.fareInfo > div:first-child > div,
            div.fcCategoryListing div.fareInfo > div:nth-child(2) > div {
                border-top: none;
            }

            div.fcCategoryListing div.fareInfo > div > div {
                border-top: solid 1px #aaa;
                padding: 10px 0;
            }

            div.fcCategoryListing div.fareInfo > div:first-child > div,
            div.fcCategoryListing div.fareInfo > div:nth-child(2) > div {
                border-top: none;
            }

        div.fcCategoryListing div.fareInfo h3 { /* fare title*/
            color: #a35229;
            font-size: 14px;
            text-transform: uppercase;
        }

            div.fcCategoryListing div.fareInfo h3 span { /* fare title price*/
                display: none;
                float: left;
                color: #224273;
            }

                div.fcCategoryListing div.fareInfo h3 span:after {
                    float: left;
                    margin-right: 8px;
                    transform: scale(1.5,1);
                    content: "\25bc";
                    color: #666;
                }

        div.fcCategoryListing div.fareInfo h4 { /* cabin price*/
            color: #224373;
        }

            div.fcCategoryListing div.fareInfo h4.special {
                color: #a35229;
            }

            div.fcCategoryListing div.fareInfo h4.norefund {
                color: #D00;
                font-weight: normal;
            }

        div.fcCategoryListing div.fareInfo h5 { /* special offers*/
            margin: 8px 0 3px;
            color: #3c71aa;
            font-size: 12px;
        }


        div.fcCategoryListing div.fareInfo div.amGroup {
            font-size: .9em;
        }

        div.fcCategoryListing div.fareInfo ul {
            padding-right: 15px;
        }

        div.fcCategoryListing div.fareInfo li {
            color: #4e4e4e;
            font-size: .9em;
            font-size: 12px;
        }


    div.fcCategoryListing div.priceBox {
        order: 2;
        position: relative;
        float: left;
        margin: 0 5px;
        padding: 5px;
        text-align: center;
        background-color: #f3f3f3;
        border: solid 1px #999999;
    }

        div.fcCategoryListing div.priceBox.air {
            width: 25%;
            max-width: none;
            top: -2px;
        }

        div.fcCategoryListing div.priceBox.special {
            top: -3px;
            background-color: #FDFED6;
        }

        div.fcCategoryListing div.priceBox.air.special {
            top: -8px;
        }

        div.fcCategoryListing div.priceBox div.cruiseOnly {
            float: right;
            width: 50%;
            position: relative;
            border-left: solid 1px #cccccc;
        }

        div.fcCategoryListing div.priceBox div.price {
            font-weight: bold;
            font-size: 1.35em;
            white-space: nowrap;
        }

        div.fcCategoryListing div.priceBox div.label {
            font-size: .9em;
        }

        div.fcCategoryListing div.priceBox div.mot {
            color: #224273;
            font-weight: bold;
        }

        div.fcCategoryListing div.priceBox img.noDetails {
            cursor: pointer;
        }

        div.fcCategoryListing div.priceBox div.buttonBox {
            margin: 4px 0;
        }

        div.fcCategoryListing div.priceBox button[disabled] {
            background-color: #aaa;
        }

        div.fcCategoryListing div.priceBox div.zzBookingPricing {
            display: none;
            position: absolute;
            left: 55px;
            top: 15px;
            z-index: 10;
            width: 200px;
            padding: 5px 5px 0 5px;
            background-color: #FFFED2;
            border: solid 1px #999999;
        }

.onefare .fareInfo div.priceBox {
    float: left !important;
    margin-top: 4px !important;
}

#fcFooter {
}

#fcCustFtrFrame {
}

#fcTagData {
}


/* -- Cabin Selection Page (cs) Style Defintions -- */

#csBody {
}

#csCustHdrFrame {
}

#csTopDiv {
}

#csMainBody {
    overflow: hidden;
}

#csMsgBox {
    text-align: center;
    FONT-SIZE: 14px;
    FONT-WEIGHT: bold;
    padding: 5px 100px;
}

    #csMsgBox a {
        color: Red;
    }

#csMainBody > button.zzSlider {
    order: 1;
    background-color: #4e4e4e;
}
/* ---- Deck Image Section ---- */
#csDeckPlan {
    float: left;
    margin-right: 5px;
    text-align: center;
    order: 2;
}

    #csDeckPlan div.image {
        position: relative; /*padding-right:17px;*/
        height: 450px;
        overflow: auto;
        margin-bottom: 10px;
    }

    #csDeckPlan img.csDeckFlashImg {
        WIDTH: 13px;
        HEIGHT: 13px;
        Z-INDEX: 2;
        POSITION: absolute;
        CURSOR: pointer;
    }

/* ---- Main Section ---- */
#csMainSection {
    min-height: 425px;
    padding: 10px;
    border: solid 1px #224273;
    background-color: #F3F3F3;
    overflow: hidden;
}

    #csMainSection > h2 {
        margin-bottom: 20px;
        color: #a35229;
        font-size: 13px;
    }

        #csMainSection > h2 img {
            vertical-align: -10px;
            margin-left: 5px;
            max-width: 170px;
        }

        #csMainSection > h2 span.cat {
            color: #4e4e4e;
            font-size: .8em;
        }


/* Catetgory Upgrade Section */
div.csCategoryUpgradeSection {
    float: left;
    width: 60%;
    padding: 10px;
    position: relative;
    background-color: white;
    border: solid 1px #999999;
    overflow: hidden;
    order: 1;
}

    div.csCategoryUpgradeSection h3 {
        margin-bottom: 5px;
    }

div.csCategoryUpgradeItem {
    float: right;
    width: 45%;
    padding-top: 5px;
    margin-left: 5%;
    border-top: solid 1px #999999;
}

    div.csCategoryUpgradeItem span.category {
    }

    div.csCategoryUpgradeItem span.zzCatColor {
        vertical-align: -5px;
    }

    div.csCategoryUpgradeItem span.catCode,
    div.csCategoryUpgradeItem span.price {
        font-size: 1.1em;
        font-weight: bold;
        cursor: pointer;
    }

    div.csCategoryUpgradeItem span.price {
        float: left;
        color: #a35229;
    }

    div.csCategoryUpgradeItem p {
        font-size: .9em;
    }

/* ---- Cabin Select Section ---- */
div.csCabinSelectSection {
    width: 33%;
}
/* Cabin Image Bock */
div.csCabinImage {
    margin-bottom: 10px;
    position: relative;
}

    div.csCabinImage > img {
        width: 100%;
    }

    div.csCabinImage div.zzCabinOverlay > div {
        right: 150px;
    }

    div.csCabinImage > p {
        margin: 8px 0;
        font-size: .9em;
    }

div.csCabinNumbers {
    margin-bottom: 10px;
    padding-bottom: 10px;
    /*border-bottom:solid 1px #999999;*/
    font-size: .9em;
}

    div.csCabinNumbers h2 {
        margin: 1px 0 0 0;
        padding: 2px 4px;
        background: #224273 url('https://ttcm.s3.amazonaws.com/Images/Template/T4/triangle-dn.png') 5% 50% no-repeat;
        color: white;
        font-size: 10px;
        font-weight: normal;
        cursor: pointer;
    }

        div.csCabinNumbers h2.open {
            background-image: url('https://ttcm.s3.amazonaws.com/Images/Template/T4/triangle-up.png');
        }

    div.csCabinNumbers div.deck {
        display: none;
        background-color: white;
        border: solid 1px #999999;
        padding: 6px;
    }

    div.csCabinNumbers h3 {
    }

    div.csCabinNumbers div.list {
        overflow: hidden;
    }

        div.csCabinNumbers div.list > div {
            width: 49%;
            float: right;
        }

            div.csCabinNumbers div.list > div input {
                margin-left: 5px;
            }

    div.csCabinNumbers div.buttonBox {
        margin-top: 5px;
        text-align: center;
    }

    div.csCabinNumbers span.upgrade {
        margin-right: 5px;
        color: red;
    }

    div.csCabinNumbers div.legend {
        margin: 10px 2px 0 0;
    }

        div.csCabinNumbers div.legend > div {
            text-transform: uppercase;
        }

        div.csCabinNumbers div.legend span.star {
            color: red
        }

        div.csCabinNumbers div.legend p {
            margin-top: 5px;
            padding-top: 3px;
            border-top: solid 1px #999999;
        }

            div.csCabinNumbers div.legend p.cssmode2 {
                font-size: 14px;
                font-weight: bold;
            }

                div.csCabinNumbers div.legend p.cssmode2 a {
                    color: #cc0000;
                }

#csCustFtrFrame {
}

#csTagData {
}


/* -- Login/Registration Page (lg) Style Defintions -- */
#lgBody {
}

#lgCustFtrFrame {
}

#lgTopDiv {
}

#lgHeader {
}

#lgMainBody {
    overflow: hidden
}

/* Login Type Selection Box */
#lgLoginTypeSelectBox {
    float: right;
    font-size: 14px;
}

    #lgLoginTypeSelectBox > div {
        margin: 5px 2px;
    }

        #lgLoginTypeSelectBox > div.selected {
            color: #a35229;
            font-weight: bold;
        }

        #lgLoginTypeSelectBox > div input {
            vertical-align: middle;
            cursor: pointer;
        }

#lgCustomerFormBox {
    margin-right: 33%;
}

div.lgLoginOption {
    border: solid 1px #999;
    background-color: #f0f0f0;
    padding: 10px;
    overflow: hidden;
}

    div.lgLoginOption a {
        display: block;
        margin-top: 5px;
        color: #2667ad;
    }

    div.lgLoginOption div.formSection.name > div:first-child {
        display: block;
    }

    div.lgLoginOption div.button > div {
        margin-top: 5px;
    }

    div.lgLoginOption.exist > div:first-of-type div.formField {
        display: inline;
    }


div.lgSNButtons {
    margin-top: 10px;
    text-align: center;
}

    div.lgSNButtons img {
        margin: 4px;
    }

#lgMsgBox {
    margin-top: 4px;
    font-size: 12px;
}

#lgForgotPwdBox {
    padding: 4px;
}

#lgFooter {
}


/* -- Customer Profile Page (cp) Style Defintions -- */
#cpBody {
}

#cpCustHdrFrame {
}

#cpTopDiv {
}

#cpMainBody {
}

div.cpCustomerForm {
    max-width: 800px;
    margin: 30px auto;
    border: solid 1px #999;
    background-color: #f0f0f0;
    padding: 10px 15px;
}

    div.cpCustomerForm div.formSection.name label {
        display: block;
    }

    div.cpCustomerForm div.button {
        padding-bottom: 6px;
    }

        div.cpCustomerForm div.button a {
            float: right;
        }

#cpMsgBox {
    margin-top: 10px;
    font-size: 12px;
}

/* --------- Travelers Form Overlay --------- */

#cpBody div.ui-dialog {
    width: 760px !important;
    max-width: 90%;
}

#cpBody div.ui-dialog-buttonset {
    width: 100%;
}

#cpBody button.ui-button {
    color: white;
}

    #cpBody button.ui-button.new {
        background: #008000;
    }

    #cpBody button.ui-button.delete {
        background: #ce0000;
    }

    #cpBody button.ui-button.close {
        background: #aaaaaa;
    }

    #cpBody button.ui-button.submit,
    #cpBody button.ui-button.close {
        float: left;
    }

form.zzTravelerOverlay {
    padding: 5px 10px;
    background-color: #f0f0f0;
    border-right: solid 1px #999999;
    border-left: solid 1px #999999;
}

    form.zzTravelerOverlay h1 {
        margin: 3px 0 10px 0;
        color: #cc6633;
        font-size: 14px;
    }

    form.zzTravelerOverlay h2 {
        color: black;
        text-transform: uppercase;
    }

        form.zzTravelerOverlay h2 input {
            margin-left: 5px;
        }

    form.zzTravelerOverlay h3 {
        padding-bottom: 1px;
        color: #337ab7;
        font-size: 14px;
        border-bottom: solid 1px #888;
    }

    form.zzTravelerOverlay span.sectionButton {
        display: none;
        float: left;
        margin-left: 5px;
    }

/* Traveler Form Box */
section.zzTravelerBox {
    margin-bottom: 10px;
}

    section.zzTravelerBox div.formField {
        margin-top: 10px;
    }

    section.zzTravelerBox div.required input,
    section.zzTravelerBox div.required select {
        background: #ffffcc;
    }

    section.zzTravelerBox section {
        margin: 5px 0 15px 0;
        overflow: hidden;
    }

        section.zzTravelerBox section.name > div {
            float: right;
            margin-left: 20px;
        }

            section.zzTravelerBox section.name > div:last-child {
                margin-left: 0;
            }

            section.zzTravelerBox section.name > div label {
                display: block;
            }

        section.zzTravelerBox section.address div.formField {
            float: right;
            width: 50%;
            height: 25px;
        }

    section.zzTravelerBox div.addrSame {
        margin-bottom: 5px;
    }

    section.zzTravelerBox section.citizenship div.formField {
        height: 25px;
    }

    section.zzTravelerBox div.zzPastPaxBox {
        float: left;
        width: 50%;
    }

        section.zzTravelerBox div.zzPastPaxBox h4 {
            font-size: 12px;
        }

            section.zzTravelerBox div.zzPastPaxBox h4 button {
                margin-right: 15px;
            }

        section.zzTravelerBox div.zzPastPaxBox > div span {
            display: inline-block;
            width: 49%;
            vertical-align: top;
        }

    section.zzTravelerBox img {
        cursor: pointer;
    }


#cpFooter {
}

#cpCustFtrFrame {
}

#cpTagData {
}

/* -- Passenger Info (px) Style Definitions -- */
#pxBody {
}

#pxCustFtrFrame {
}

#pxTopDiv {
}

#pxPageHeader {
}

#pxMainBody {
}

#pxLoginInfo {
    margin-bottom: 15px;
}

    #pxLoginInfo h2 {
        color: #008000;
    }

#pxFormBody {
}

    #pxFormBody h2 {
        display: none
    }

#pxMsgBox p.warningItem {
    color: Orange;
    margin: 0;
}

#pxMsgBox p.warningItem2 {
    color: Green;
    margin: 4px 0;
}

#pxServicesForm select {
    margin-bottom: 5px;
}

#pxServicesForm div.formField > span,
#pxServicesForm div.specialServices > span {
    display: inline-block;
}

#pxServicesForm div.specialServices {
    position: relative;
    width: 85%;
    float: right;
    margin: 10px 0;
}

#pxDisclaimerArea {
    font-size: 10px;
}

#pxFooter {
}


/* Special Service Overlay */
#pxBody div.ui-dialog {
    min-width: 300px;
    max-width: 440px;
}

#pxBody div.ui-dialog-buttonpane {
    background-color: #ddd;
}

#pxBody div.ui-dialog-buttonset {
    float: none;
    text-align: center;
}

.pxSpServiceOverlay {
    padding: 0 5px;
}

    .pxSpServiceOverlay input,
    .pxSpServiceOverlay select {
        vertical-align: middle;
        color: inherit;
    }

    .pxSpServiceOverlay h2 {
        color: #cc6633;
        font-size: 11px;
        background-color: transparent;
        padding-top: 8px;
    }

    .pxSpServiceOverlay h3 {
        margin: 3px 0;
    }

    .pxSpServiceOverlay div.formSubsection {
        clear: right;
        overflow: hidden;
    }

    .pxSpServiceOverlay div.formField {
        float: right;
        width: 50%;
        margin-bottom: 2px;
    }

        .pxSpServiceOverlay div.formField label {
            display: inline-block;
            max-width: 190px;
            overflow: hidden;
            vertical-align: middle;
        }

    .pxSpServiceOverlay div.formField1 {
        clear: right;
    }

        .pxSpServiceOverlay div.formField1 > span {
            display: inline-block;
            margin: 0 10px 5px 0;
        }

    .pxSpServiceOverlay span.price {
        margin-right: 5px;
    }



/* -- Payment page (pm) Style Definitions -- */
#pmBody {
}

#pmCustFtrFrame {
}

#pmTopDiv {
}

#pmHeader {
}

#pmMainBody {
}

    #pmMainBody h2 {
    }

    #pmMainBody div.zzBookingSailing,
    #pmMainBody div.zzBookingDetails {
        width: 47%;
    }

        #pmMainBody div.zzBookingDetails > div > div {
            width: 65.7%;
            float: left;
        }

div.pmsButtonBox {
    border-top: solid 1px #999999;
    margin-top: 4px;
    padding-top: 4px;
}

div.pmsTotals {
    float: left;
    margin-bottom: 10px;
    text-align: left;
}

    div.pmsTotals > div label {
        margin-left: 5px;
    }

    div.pmsTotals div:first-child {
        font-weight: bold;
    }

        div.pmsTotals div:first-child span:first-child {
            margin-left: 5px;
            color: #224273;
            display: inline;
        }

    div.pmsTotals div.payment {
        margin: 3px 0;
    }

        div.pmsTotals span.price,
        div.pmsTotals div.payment > span {
            display: inline-block;
            width: 100px;
        }

    div.pmsTotals button {
    }


div.pmsDiningCabinDetails {
    margin: 3px 0;
    padding-top: 3px;
    border-top: solid 1px #999999;
}

    div.pmsDiningCabinDetails > div {
        display: inline-block;
        width: 30%;
        text-align: center;
    }

#pmPaxFareInfo,
#pmPaxFareInfo > div {
    width: 100%;
}

div.pmsDiningCabinDetails > div:first-child {
    text-align: right;
}

div.pmsPaxFareInfo {
}

    div.pmsPaxFareInfo h3 {
        color: #a35229;
    }

    div.pmsPaxFareInfo span.sectionButton {
        display: none;
        float: left;
        margin-left: 5px;
    }

    div.pmsPaxFareInfo > div {
        margin: 8px 0;
        padding: 8px 0;
        border-top: solid 1px #999999;
        overflow: hidden;
    }

    div.pmsPaxFareInfo h4 {
        color: #224273;
        font-size: 12px;
        font-weight: bold;
        margin-top: 8px;
    }

div.pmsPaxDetails {
}

    div.pmsPaxDetails > div {
        float: right;
        width: 49%;
    }

        div.pmsPaxDetails > div:nth-child(even) {
            margin-left: 2%;
        }

        div.pmsPaxDetails > div span {
            margin-left: 5px;
            font-weight: bold;
        }

div.pmDocMailingAddr {
}

/* Statement Details */
div.pmsPaxFareInfo div.items div.iHdrRow,
div.pmsPaxFareInfo div.items a.item {
    display: none;
}

div.pmsPaxFareInfo div.items a.item {
    margin-top: 10px;
}

div.pmsPaxFareInfo div.items div.hdrRow {
    color: #224273;
}

div.pmsPaxFareInfo div.items label,
div.pmsPaxFareInfo div.items span {
    display: inline-block;
    vertical-align: top;
}

div.pmsPaxFareInfo div.items label {
    font-weight: bold;
}

    div.pmsPaxFareInfo div.items label.qty,
    div.pmsPaxFareInfo div.items span.qty {
        width: 6%;
    }

    div.pmsPaxFareInfo div.items label.item,
    div.pmsPaxFareInfo div.items span.item {
        width: 50%;
    }

    div.pmsPaxFareInfo div.items label.price,
    div.pmsPaxFareInfo div.items span.price {
        width: 20%;
        text-align: left;
    }

div.pmsPaxFareInfo div.items div.totalRow {
    font-weight: bold;
}

div.pmsPaxFareInfo div.buttonBox > p {
    margin-top: 5px;
    margin-left: 30%;
    font-size: 9px;
}

#pmFormBody h2 {
    background-color: #224273;
    color: white;
    font-size: 12px;
    text-transform: uppercase;
    padding: 2px 4px;
}

#pmTravelInsurBox,
#pmPointsBox,
#pmPaymentInfo,
.pmCreditCardForm,
#pmSubmitBox {
    margin-bottom: 10px;
    border: solid 1px #224273;
    background-color: #f3f3f3;
    overflow: hidden;
}

/* - Insurance Box - */
#pmTravelInsurBox {
}

div.pmInsFormNotices {
    margin: 5px;
    order: 1;
}

div.pmInsFormPrice {
    float: left;
    width: 215px;
    margin: 5px;
    padding: 5px 5px 0 0;
    text-align: center;
    border-right: solid 1px #999999;
    order: 2;
}

    div.pmInsFormPrice h3 label {
        color: #224273;
    }

    div.pmInsFormPrice h3 span {
        font-weight: normal;
        color: black;
    }

    div.pmInsFormPrice div.buttons {
        margin: 8px 0;
        font-weight: bold;
    }

        div.pmInsFormPrice div.buttons input {
        }

        div.pmInsFormPrice div.buttons span.pmInsuranceAccept {
            margin-left: 30px;
        }

    div.pmInsFormPrice p {
        font-size: 11px;
    }

/* Purchase with Points */
#pmPointsBox {
    overflow: hidden;
    margin: 10px 0;
    border-style: solid;
}

    #pmPointsBox > div {
        display: inline-block;
        width: 29%;
        margin: 5px;
    }

        #pmPointsBox > div:nth-child(3) {
            width: 39%;
        }

        #pmPointsBox > div > label {
            margin-left: 4px;
            font-weight: bold;
        }

    #pmPointsBox input {
        width: 60px;
        text-align: left;
    }

    #pmPointsBox > div.pbalance {
    }

    #pmPointsBox > div.pointsApplied {
    }

    #pmPointsBox > div.balanceDue {
    }


/* - Payment Box - */
#pmPaymentInfo {
}

    #pmPaymentInfo > div {
        padding: 5px 10px;
    }

div.pmPaymentOptions {
    padding-bottom: 5px;
    margin-bottom: 10px;
    border-bottom: solid 1px #999999;
}

    div.pmPaymentOptions > div {
        display: inline-block;
        margin: 0 0 3px 15px;
    }

    div.pmPaymentOptions label,
    div.pmPaymentInfo2 label {
        color: #224273;
        font-weight: bold;
        /*margin-right:4px;*/
    }

    div.pmPaymentOptions span.secure {
        color: green;
        float: left;
    }

        div.pmPaymentOptions span.secure img {
            vertical-align: middle;
        }

div.pmPaymentInfo2 div.deposit > div.amount {
    float: right;
}

div.pmPaymentInfo2 div.amount > span {
    display: inline-block;
    margin: 0 0 6px 7px;
}

div.pmPaymentInfo2 div.deposit > div.dueDate {
    float: left;
}

div.pmPaymentInfo2 div.deposit div.autopay {
    clear: both;
    margin: 5px 0;
    font-size: .9em;
}

div.pmPaymentInfo2 div.deposit > p {
    clear: both;
}

div.pmPaymentInfo2 div.split {
    margin-top: 4px;
    font-size: .9em;
}
/* - Credit Card Forms - */
div.pmCreditCardForm {
    margin-bottom: 10px;
    padding-bottom: 5px;
}

    div.pmCreditCardForm input[type=text] {
        max-width: 310px;
        margin-left: 5px;
    }

    div.pmCreditCardForm span.pmsCCard-Note {
        font-size: 11px;
        font-weight: normal;
        text-transform: none;
    }

    div.pmCreditCardForm div.formSection {
        margin: 2px 5px 0 0;
    }

        div.pmCreditCardForm div.formSection.addr {
            float: right;
            width: 45%;
            margin-left: 15px;
            border-left: solid 1px #999999;
        }

    div.pmCreditCardForm div.formRow.amountApplied {
        clear: right;
        margin-top: 25px;
    }

        div.pmCreditCardForm div.formRow.amountApplied > div {
            display: inline;
            margin-left: 15px;
        }

        div.pmCreditCardForm div.formRow.amountApplied input[readonly] {
            border: none;
            background-color: #f3f3f3;
            font-weight: bold;
        }

        div.pmCreditCardForm div.formRow.amountApplied > div > span {
            font-weight: bold;
        }

    div.pmCreditCardForm h3 {
        color: #4e4e4e;
    }

        div.pmCreditCardForm h3 span.sectionButton {
            display: none;
            float: left;
            margin-left: 5px;
        }

    div.pmCreditCardForm div.formRow {
        margin: 8px 4px;
    }

        div.pmCreditCardForm div.formRow > label {
            margin-left: 4px;
        }

            div.pmCreditCardForm div.formRow > label.zzFormLabel-Email {
                display: block;
            }

    div.pmCreditCardForm div.formSection.amount label:not(:first-child) {
        margin-right: 20px;
    }

    div.pmCreditCardForm div.formSection.amount span {
        font-weight: bold;
    }

    div.pmCreditCardForm .required {
        background-color: #ffffcc;
    }

#pmWarningBox {
    color: black;
    background-color: #ffad99;
    border-color: #ebccd1;
    padding: 7px 10px;
    border: 1px solid transparent;
    border-radius: 4px;
    margin-bottom: 10px;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif !important;
    font-size: 13px;
}


#pmSubmitBox {
    padding: 10px;
}

    #pmSubmitBox div {
        margin: 5px 0;
    }

        #pmSubmitBox div.button {
            float: left;
            margin-right: 20px;
        }

    #pmSubmitBox p {
        margin-bottom: 10px;
        font-weight: bold;
    }

    #pmSubmitBox input[type=checkbox] {
        float: right;
        margin-left: 8px;
    }

#pmPaymentDisclaimer {
    font-size: 9px
}



/* -- Confirmation page (co) Style Definitions -- */
#coBody {
}

#coCustFtrFrame {
}

#coTopDiv {
}

#coMainBody {
}

    #coMainBody h1 {
        font-size: 16px;
    }

div.coConfirmationText {
    font-size: 14px;
}

    div.coConfirmationText p {
        margin: 10px 0;
    }

div.coShareItin {
    margin: 10px 0;
    font-size: 14px;
    font-weight: bold;
}

    div.coShareItin button {
        background-color: #0099CC;
    }


#coConfSection div.panel2 {
    float: left;
    width: 300px;
    margin-right: 10px;
    padding-right: 10px;
    border-right: solid 1px #cccccc;
}

    #coConfSection div.panel2 h2 {
        color: #cc6633;
        font-size: 16px;
    }

    #coConfSection div.panel2 > div {
        font-size: 14px;
        font-weight: bold;
        padding-right: 10px;
    }

        #coConfSection div.panel2 > div > div {
            margin-top: 4px;
        }

    #coConfSection div.panel2 iframe {
        width: 100%;
        height: 130px;
        margin-top: 10px;
        border: none;
    }

#coWarningMessages {
    width: 80%;
    margin: 0 auto;
}

    #coWarningMessages > div {
        margin: 10px 0;
        padding: 5px 70px 5px 5px;
        background: #FDFED6 url("https://ttcm.s3.amazonaws.com/Images/Template/T4/exclamation.png") no-repeat right 10px top 50%;
        border: solid 1px #cccccc;
    }

    #coWarningMessages h2 {
        color: #cc0000;
        font-size: 12px;
    }


/* - Insurance Box - */
#coTravelInsurBox {
    margin: 10px 0;
    border: solid 1px #224273;
    background-color: #f3f3f3;
    font-size: 12px;
}

    #coTravelInsurBox h2 {
        background-color: #224273;
        color: white;
        font-size: 13px;
        text-transform: uppercase;
        /*white-space:nowrap; overflow:hidden;*/
        padding: 2px 4px;
        cursor: pointer;
    }

    #coTravelInsurBox span.sectionButton {
        display: none;
        float: left;
        margin-left: 5px;
    }

    #coTravelInsurBox p {
        margin: 5px;
    }

#coMainBody div.zzBookingSailing,
#coMainBody div.zzBookingDetails {
    width: 47%;
}

    #coMainBody div.zzBookingDetails > div > div {
        width: 65.7%;
        float: left;
    }

/* - Hotel Section - */
#coHotelSection {
    margin-top: 20px;
}

    #coHotelSection p {
        margin: 5px 0;
    }

    #coHotelSection div.buttonBox {
        margin: 10px 0
    }


/*   - Advanced Search (as) Style Classes   */
/*   -------------------------------------  */
#asBody {
}

#asTopDiv {
}

#asMainBody {
}

    #asMainBody > h1 {
        color: #CC6633;
        font-size: 21px;
    }

form#asSelectCriteria {
}

#asSortBy {
    margin-bottom: 5px;
    text-align: left;
    color: #224273;
    font-size: 14px;
    font-weight: bold;
}

#asCriteriaMainPanel {
    padding: 8px;
    border: 1px solid #000000;
    background-color: #ccddff;
}

    #asCriteriaMainPanel > section {
        overflow: hidden;
    }

    #asCriteriaMainPanel section.top label {
        margin-left: 4px;
    }

    #asCriteriaMainPanel h2 {
        font-size: 14px;
        font-weight: bold;
        color: #4e4e4e;
        text-transform: uppercase;
    }

    #asCriteriaMainPanel div.formField {
        margin-bottom: 15px;
    }

    #asCriteriaMainPanel span.sectionButton {
        display: none;
        float: left;
        color: white;
        margin-left: 10px;
    }

    #asCriteriaMainPanel section.top > div:first-child {
        float: right;
        width: 50%;
        margin-left: 20px;
        border-left: solid 1px #888888;
    }

    #asCriteriaMainPanel section.top h2 {
        margin-bottom: 5px;
    }

    #asCriteriaMainPanel section.top > div > span {
        margin: 4px 0;
    }

    #asCriteriaMainPanel section.main > div {
        float: right;
        width: 25%;
        margin-right: 12px;
    }

        #asCriteriaMainPanel section.main > div:first-child {
            margin-right: 0;
        }

    #asCriteriaMainPanel ul {
        background-color: white;
        overflow-y: scroll;
        list-style-type: none;
        padding: 0;
        font-size: 12px;
        width: 100%;
        height: 250px;
        color: #4e4e4e;
    }

        #asCriteriaMainPanel ul > li:first-child {
            font-weight: bold;
            text-transform: uppercase;
        }

        #asCriteriaMainPanel ul > li.selected {
            color: #224273;
        }

        #asCriteriaMainPanel ul > li.dsbl {
            color: #888888;
        }

        #asCriteriaMainPanel ul > li.sub {
            margin-right: 18px;
            font-weight: normal;
        }

#asDestination > div {
    height: 250px;
    overflow-y: scroll;
}

#asDestination h2 {
    float: right;
    width: 20%;
}

#asDestination ul {
    font-weight: bold;
    columns: 3;
    -webkit-column-count: 3;
    -moz-column-count: 3;
    height: auto;
    overflow: visible;
}

section.main > div#asCruiselineType {
    max-width: 198px;
}

#asButtonBox {
    margin-top: 15px;
    text-align: center;
}

#asFooter div.images {
    text-align: center;
}

#asCustFooter {
}


/*   - Hotel - Common Style Classes   */
/*   -------------------------------------  */
div.zzAirMainBody,
div.zzHotelMainBody {
    background-color: #379bd3;
    padding: 10px;
}

    div.zzAirMainBody footer,
    div.zzHotelMainBody footer {
        height: 40px;
        text-align: center;
        color: white;
    }

div.zzAirMainBox,
div.zzHotelMainBox {
    margin-top: 10px;
    background-color: white;
    border-radius: 5px;
    overflow: hidden;
}

.zzHotelMainBox h2 {
    /*margin:10px 0 5px; */
    color: #224373;
    font-size: 16px;
}

/* styles for air/hotel/tour search critera box */
.zzSearchCityBox {
    padding: 15px;
    color: #224373;
    background-color: #f2f2f2;
    border: solid 1px #e6e7e7;
}

div.zzSearchCriteria1 {
    text-align: left;
    overflow: hidden;
}

    div.zzSearchCriteria1 > div {
        float: right;
        text-align: right;
        margin-bottom: 5px;
    }

        div.zzSearchCriteria1 > div > div:first-child {
            font-weight: bold;
        }

div.zzSearchCriteria2 > div:first-child {
    display: flex;
    justify-content: space-between;
}

div.zzSearchCriteria2 label {
    font-weight: bold;
}

div.zzSearchCriteria2 > div {
    margin-bottom: 10px;
}
/* styles for add-on search box only */
div.zzSearchCriteria2 span.pax {
    display: inline-block;
    width: 150px;
}

div.zzSearchCriteria2 > div.buttonBox {
    text-align: center;
}

    div.zzSearchCriteria2 > div.buttonBox > div {
        display: none;
        float: right;
        font-weight: bold;
    }

    div.zzSearchCriteria2 > div.buttonBox label {
        font-weight: normal;
    }
/* styles for stand-alone search box only */
div.zzSearchCriteria2 > div:first-child > span > input {
    margin-right: 5px;
}

div.zzSearchCriteria2 div.paxRooms {
    overflow: hidden;
    position: relative;
}

    div.zzSearchCriteria2 div.paxRooms div.rooms {
        float: right;
    }

        div.zzSearchCriteria2 div.paxRooms div.rooms label {
            display: block;
            margin-bottom: 4px;
        }

    div.zzSearchCriteria2 div.paxRooms table {
        margin-right: 5px;
        float: right;
        text-align: center;
    }

    div.zzSearchCriteria2 div.paxRooms th {
        padding: 0 10px;
    }

    div.zzSearchCriteria2 div.paxRooms td:nth-child(4) {
        text-align: right;
    }

    div.zzSearchCriteria2 div.paxRooms select {
        width: 40px;
        margin: 3px 0;
    }

    div.zzSearchCriteria2 div.paxRooms button.zzSelectButton {
        position: absolute;
        left: 0;
        bottom: 0;
    }



/* styles for hotel booking summary box (add-on pages only)*/
div.zzTopDiv.hotel div.zzBookingSummary div.box {
    border: none;
}

div.zzTopDiv.hotel div.zzBookingSummary h3 {
    margin-top: 6px;
    cursor: pointer;
}

    div.zzTopDiv.hotel div.zzBookingSummary h3:after {
        content: '\25BC';
        display: none;
        float: left;
    }

div.zzTopDiv.hotel div.zzBookingSummary h4 {
    margin: 5px 0;
}

div.zzBookingHotel {
    display: inline-block;
    width: 33%;
    vertical-align: top;
    padding: 0 10px;
    border-left: solid 1px #999999;
}

    div.zzBookingHotel span {
        font-weight: bold;
    }

    div.zzBookingHotel > div > div {
        float: left;
        width: 65%;
    }


div.zzSession {
    padding: 10px;
    text-align: center;
}

div.zzMainPanelOverlay {
    display: none;
    position: absolute;
    top: 0;
    z-index: 10;
    width: 100%;
    height: 200%;
    background: #F0F0F0 url('https://ttcm.s3.amazonaws.com/Images/Template/spinner_blue.gif') no-repeat right 130px top 25%;
    *filter: alpha(opacity=50);
    background-color: rgba(240,240,240,0.6);
}

div.zzTopDiv.air button.zzSelectButton,
div.zzTopDiv.hotel button.zzSelectButton {
    padding: 5px 10px;
    color: white;
    background-color: #3c910e;
    font: normal 16px Helvetica;
    text-align: center;
    border-radius: 5px 5px 5px 5px;
    cursor: pointer;
}

div.zzTopDiv.hotel div.zzErrorText {
    margin: 10px 0;
}

#srTopDiv {
    background-color: #379bd3;
    padding: 10px;
}

    #srTopDiv .zzPageTitle {
        position: static;
        margin: 0 0 10px;
        color: #224273;
    }


/*   - Add Hotel Search Widget page   */
/*   -------------------------------------  */
#hsBody {
    background-color: #f2f2f2;
}

#hsTopDiv {
    max-width: 800px;
    margin: 0 10px;
    padding: 10px 10px 0 10px;
    border: solid 1px #888;
}

    #hsTopDiv .zzPageTitle {
        margin-top: 0;
        color: #224273;
    }



/*   - Add Hotel Results page   */
/*   -------------------------------------  */
div.hrLeftPanel {
    float: right;
    width: 234px;
    margin: 25px 15px 1px 15px;
}

div.hrSortOptions {
    margin-bottom: 10px;
    padding: 10px;
    border: solid 1px #29abe2;
}

    div.hrSortOptions select {
        margin-right: 4px;
        width: 152px;
        color: #f26722;
    }

/* Results Filter box */
h3.filters {
    display: none;
    margin-top: 10px;
    padding: 4px 6px;
    font-size: 14px;
    background-color: #379bd3;
    color: white;
    text-transform: uppercase;
    cursor: pointer;
}
/*h3.filters:after { content:'\2630'; float:right; font-size:1.25em; margin-top:-4px;}*/

.hrFiltersBox {
    overflow: hidden;
    padding-right: 20px;
    border: solid 1px #29abe2;
    font-size: 12px;
}

    .hrFiltersBox > div {
        margin: 20px 0;
    }

        .hrFiltersBox > div h4 {
            margin-bottom: 3px;
        }

        .hrFiltersBox > div input {
            margin-left: 5px;
        }

    .hrFiltersBox div.hrHotelChain {
        margin-right: 19px;
    }

        .hrFiltersBox div.hrHotelChain input {
            margin-right: -19px;
        }

div.hrPriceRange {
    width: 80%;
}

    div.hrPriceRange label {
        color: #3c910e;
        font-size: 1.1em;
        font-weight: bold;
    }

        div.hrPriceRange label.maxPrice {
            float: left;
        }

    div.hrPriceRange .ui-slider {
        margin: 2px 5px 0 0;
    }

    div.hrPriceRange .ui-slider-range {
        background: #29abe2;
    }

    div.hrPriceRange .ui-slider-handle {
        background: #224373;
        color: white;
        text-decoration: none;
        font-weight: bold;
        padding-right: 2px;
    }

    div.hrPriceRange a.ui-slider-handle:nth-child(2):after {
        content: "\25C0";
    }

    div.hrPriceRange a.ui-slider-handle:nth-child(3):after {
        content: "\25BA";
    }


main.hrMainPanel {
    margin: 15px 292px 0 15px;
}

div.hrShowHideMap img {
    height: 16px;
}

div.hrMapCanvas {
    display: none;
    height: 400px;
    margin-top: 21px;
    border: solid 1px #7F7F7F;
    box-shadow: 0px 0px 8px rgba(127,127,127,0.5),0px 0px 8px rgba(127,127,127,0.5);
    ;
}

section.hrHotelListings {
    position: relative;
}

    section.hrHotelListings h2 {
        font-size: 14px;
        margin: 15px 0;
        color: #cc6633;
        text-align: center;
    }

    section.hrHotelListings h3 {
        text-align: left;
    }

div.hrHotelListing {
    overflow: hidden;
    margin: 10px 0;
    padding: 12px;
    border: solid 1px #7F7F7F;
    box-shadow: 0px 0px 8px rgba(127,127,127,0.5),0px 0px 8px rgba(127,127,127,0.5);
    ;
}

    div.hrHotelListing div.priceBox {
        float: left;
        margin-left: 5px;
        padding: 8px;
        border: solid 1px #7F7F7F;
        box-shadow: 0px 0px 8px rgba(127,127,127,0.5),0px 0px 8px rgba(127,127,127,0.5);
        ;
        font: bold 12px arial;
        text-align: center;
    }

        div.hrHotelListing div.priceBox span {
            display: block;
            margin: 3px 0;
        }

            div.hrHotelListing div.priceBox span.price {
                color: #ce4300;
                font: bold 22px verdana;
            }

            div.hrHotelListing div.priceBox span.rateType {
                color: #cc0000;
            }

    div.hrHotelListing div.imageBox {
        float: right;
        width: 20%;
        height: 150px;
        overflow: hidden;
    }

        div.hrHotelListing div.imageBox img {
            width: 100%;
            max-width: 400px;
        }

    div.hrHotelListing div.hotelInfoBox {
        position: relative;
        min-height: 150px;
        margin: 0 22% 0 170px;
    }

        div.hrHotelListing div.hotelInfoBox div.line1 {
            margin-bottom: 2px;
            color: #224373;
            font-size: 14px;
            font-weight: bold;
        }

            div.hrHotelListing div.hotelInfoBox div.line1 span.stars {
                color: #cc6633;
                font-size: 1.3em
            }

        div.hrHotelListing div.hotelInfoBox div.line4 {
            position: absolute;
            bottom: 0;
        }

        div.hrHotelListing div.hotelInfoBox div.meal {
            margin-bottom: 5px;
            color: #3c910e;
            font-weight: bold;
        }

/*   - Hotel Details page   */
/*   -------------------------------------  */

.hdHotelListing {
    margin: 15px;
    padding: 10px;
    overflow: hidden;
}

    .hdHotelListing div.hotelInfo div.line1 {
        font-weight: bold;
        font-size: 16px;
    }

        .hdHotelListing div.hotelInfo div.line1 span.name {
            color: #0071bc;
        }

        .hdHotelListing div.hotelInfo div.line1 span.stars {
            margin-right: 4px;
            color: #cc6633;
            font-size: 1.3em;
        }

    .hdHotelListing div.priceBox {
        float: left;
        text-align: left;
        font-weight: bold;
    }

        .hdHotelListing div.priceBox span.price {
            color: #ce4300;
            font-size: 24px;
        }

        .hdHotelListing div.priceBox > div {
            margin: 5px 0;
        }

.hdHotelGenInfo {
    overflow: hidden;
    margin: 15px;
}

.hdPhotoGallery {
    float: right;
    width: 50%;
    text-align: center;
}

    .hdPhotoGallery > figure {
        position: relative;
        display: block;
        max-width: 500px;
        max-height: 400px;
        overflow: hidden;
        margin: 0 auto;
        padding: 3px 0;
    }

        .hdPhotoGallery > figure img {
            width: 100%;
        }

        .hdPhotoGallery > figure a {
            position: absolute;
            top: 50%;
            margin-top: -20px;
            padding: 5px;
            background-color: #444;
            color: white;
            font-weight: bold;
            font-size: 18px;
            transition: 0.6s ease;
            cursor: pointer;
            text-decoration: none;
        }

        .hdPhotoGallery > figure figcaption {
            color: #cc6633;
        }

        /* Position the "next button" to the right */
        .hdPhotoGallery > figure .next {
            left: 0;
        }

    .hdPhotoGallery div.thumbnails {
        margin: 10px auto;
        padding: 10px 0;
        overflow: hidden;
    }

        .hdPhotoGallery div.thumbnails figure {
            float: right;
            width: 16.5%;
            margin: 4px 0;
            cursor: pointer;
        }

            .hdPhotoGallery div.thumbnails figure img {
                display: block;
                height: 60px;
                width: 60px;
                margin: 0 auto;
            }


.hdHotelDesc {
    width: 45%;
    margin: 1px 52% 0 0;
    font-size: 14px;
}

.hdHotelLocation {
    margin-right: 52%;
    font-size: 14px;
}

    .hdHotelLocation a {
        color: green;
    }

        .hdHotelLocation a img {
            width: 25px;
        }

.hdHotelAmenities {
    margin-right: 52%;
    font-size: 14px;
}

    .hdHotelAmenities ul {
        margin: 0;
        padding-right: 16px;
    }

.hdHotelRoomDetails {
    margin: 15px;
    padding: 10px;
    overflow: hidden;
    border: 1px solid #7f7f7f;
    box-shadow: 0px 0px 8px rgba(127,127,127,0.5),0px 0px 8px rgba(127,127,127,0.5)
}

    .hdHotelRoomDetails div.roomListing {
        margin: 10px;
        padding: 10px;
        overflow: hidden;
        border: 1px solid #0071bc;
    }

        .hdHotelRoomDetails div.roomListing h4 {
            color: #0071bc;
            font-size: 14px;
        }

        .hdHotelRoomDetails div.roomListing div.priceBox {
            float: left;
            text-align: left;
            font-weight: bold;
        }

            .hdHotelRoomDetails div.roomListing div.priceBox span.price {
                color: #ce4300;
                font-size: 16px;
            }

            .hdHotelRoomDetails div.roomListing div.priceBox div.rateType {
                color: #cc0000;
            }

            .hdHotelRoomDetails div.roomListing div.priceBox > div {
                margin: 5px 0;
            }

        .hdHotelRoomDetails div.roomListing div.roomInfo {
            margin-left: 200px;
        }

        .hdHotelRoomDetails div.roomListing p {
            margin-top: 5px;
        }

            .hdHotelRoomDetails div.roomListing div.priceBox div.selectButton label,
            .hdHotelRoomDetails div.roomListing p.meal {
                color: #3c910e;
                font-weight: bold;
            }

    .hdHotelRoomDetails button.zzSelectButton {
        float: left;
        margin-left: 10px;
    }

    .hdHotelRoomDetails h3 {
        padding: 10px;
        margin: 5px;
        border-radius: 5px;
        color: white;
        background-color: #0c5796;
        cursor: pointer;
    }

        .hdHotelRoomDetails h3:after {
            content: '\25BC';
            float: left;
        }


.hdMapCanvas {
    margin: 15px;
    padding: 10px;
    overflow: hidden;
    border: 1px solid #7f7f7f;
    box-shadow: 0px 0px 8px rgba(127,127,127,0.5),0px 0px 8px rgba(127,127,127,0.5)
}

    .hdMapCanvas > div {
        height: 400px;
    }


.hdHotelContactInfo {
    display: none;
    margin: 0 25px;
    padding: 10px 0;
}

    .hdHotelContactInfo span {
        margin-left: 10px;
    }



/*Hotel Payment Page*/
.zzHotelSection-Room h3 {
    color: #0071bc;
}

.zzHotelSection-Room h4 {
    margin: 2px 0;
}

    .zzHotelSection-Room h4 > span label {
        margin-right: 10px;
    }

.zzHotelSection-Room span.price {
    float: left;
    margin-left: 20px;
}

.zzHotelSection-Room span.guest {
    display: inline-block;
    width: 100px;
}

.zzHotelSection-Room section.CancelPolicy {
    border-color: #cc0000;
}

.zzHotelSection-Room div.penaltyDetails p {
    margin-top: 10px;
    font-weight: bold;
}

.zzHotelSection-Room div.penaltyDetails table {
    margin-right: 10px;
}

.zzHotelSection-Room div.penaltyDetails th {
    font-weight: normal;
    padding-left: 10px;
}

.zzHotelSection-Login.loggedin > h2 {
    cursor: pointer;
}

    .zzHotelSection-Login.loggedin > h2:after {
        content: '\25BC';
        float: left;
    }

.zzHotelSection-Login.loggedin > div {
    display: none;
}

div.hpHotelPayment {
}

    div.hpHotelPayment section {
        overflow: hidden;
        margin: 15px;
        padding: 10px;
        border: solid 1px #7f7f7f;
        box-shadow: 0px 0px 8px rgba(127,127,127,0.5),0px 0px 8px rgba(127,127,127,0.5)
    }

    div.hpHotelPayment div.buttonBox {
        margin: 15px;
        overflow: hidden;
    }

        div.hpHotelPayment div.buttonBox input {
            float: right;
        }

        div.hpHotelPayment div.buttonBox p {
            margin-right: 25px;
            color: #cc0000;
            font-weight: bold;
        }

    div.hpHotelPayment button.zzSelectButton {
        float: left;
        margin-left: 15px;
    }

        div.hpHotelPayment button.zzSelectButton:not(.selected) {
            background-color: #ccc;
        }

    div.hpHotelPayment div.rOptions div {
        display: inline-block;
    }

    div.hpHotelPayment button.zzContinueButton {
        float: left;
    }



div.hpConfirmation h3 {
    margin: 4px 0;
    font-size: 1.2em;
}

div.hpConfirmation label {
    font-weight: bold;
    margin-left: 4px;
}

/*Hotel Confirmation Page*/
div.hcHotelConfirmation section {
    margin: 15px;
    padding: 10px;
    border: solid 1px #7f7f7f;
    box-shadow: 0px 0px 8px rgba(127,127,127,0.5),0px 0px 8px rgba(127,127,127,0.5)
}

section.hcConfirmation label {
    margin-left: 5px;
}

section.hcConfirmation span.price {
    float: left;
    margin-left: 20px;
}

div.hcButtonBox {
    margin: 10px;
}

span.hcBookAnotherHotel > span {
    display: none;
}

span.hcBookAnotherHotel:hover > span {
    display: inline;
}


/** Tour Pages  **/

body.tour div.ui-dialog-titlebar {
    background: #379bd3;
}

body.tour div.ui-widget button.submit {
    background: #3c910e;
}


div.zzTopDiv.tour button.zzSelectButton {
    padding: 4px 8px;
    color: white;
    background-color: #3c910e;
    font: normal 14px Helvetica;
    text-align: center;
    border-radius: 5px 5px 5px 5px;
    cursor: pointer;
}

div.zzTopDiv.tour div.zzErrorText {
    margin: 10px 0;
}

div.zzTopDiv.tour div.zzBookingSummary div.box {
    border: none;
}

div.zzTopDiv.tour div.zzBookingSummary h3 {
    margin-top: 6px;
    cursor: pointer;
}

    div.zzTopDiv.tour div.zzBookingSummary h3:after {
        content: '\25BC';
        display: none;
        float: left;
    }

div.zzTourMainBody {
    background-color: #379bd3;
    padding: 10px;
}

    div.zzTourMainBody footer {
        height: 40px;
        text-align: center;
        color: white;
    }

div.zzTourMainBox {
    margin-top: 10px;
    background-color: white;
    border-radius: 5px;
    overflow: hidden;
}

    div.zzTourMainBox h2 {
        margin: 10px 0 5px;
        color: #224373;
        font-size: 16px;
    }


div.zzBookingTour {
    display: inline-block;
    width: 60%;
    vertical-align: top;
    padding: 0 10px;
    /*width:70%; border-right:solid 1px #999999;*/
}
    /*
div.zzBookingTour>div{
    margin-top:5px;
}
div.zzBookingTour>div>div{
    margin-left:15px;
}*/
    div.zzBookingTour table {
        width: 95%;
        margin-bottom: 10px;
    }

    div.zzBookingTour td {
        padding-top: 6px;
        padding-left: 10px;
        vertical-align: top;
        font-weight: bold;
    }

        div.zzBookingTour td > div {
            font-weight: normal;
        }

        div.zzBookingTour td.price {
            text-align: left;
        }

            div.zzBookingTour td.price button {
                padding: 1px 3px;
                font-size: 10px;
                background-color: #555;
                border: none;
            }

    div.zzBookingTour span.zzCurrencyCode {
        font-size: .8em;
        margin-left: 2px;
    }

/*   - Tours Results page   */
/*   -------------------------------------  */

#trModalDialog {
    text-align: center;
}

    #trModalDialog select {
        margin-top: 10px;
        width: 90%;
    }

main.trMainPanel {
    margin: 15px 292px 0 15px;
}

div.trLeftPanel {
    float: right;
    width: 234px;
    margin: 25px 15px 1px 15px;
}

div.trItineraryBox > div {
    margin: 5px 0;
    padding: 2px;
    border: solid 1px #888;
}

div.trItineraryBox div.date {
    display: table-cell;
    width: 20%;
    padding-left: 2px;
    vertical-align: middle;
    text-align: center;
    color: #224373;
    font-weight: bold;
}

div.trItineraryBox div.port {
    display: table-cell;
    padding-right: 4px;
    border-right: solid 1px #224373;
}

    div.trItineraryBox div.port > div {
        margin-bottom: 2px;
    }

div.trItineraryBox div.name {
    font-weight: bold;
}

div.trItineraryBox button {
    font-weight: normal;
    font-size: .9em;
}

div.trSortOptions {
    margin-bottom: 10px;
    /*padding:10px;
    border:solid 1px #29abe2;*/
}

    div.trSortOptions select {
        margin-right: 4px;
        width: 152px;
        color: #f26722;
    }

.trFiltersBox {
    overflow: hidden;
    padding-right: 20px;
    border: solid 1px #29abe2;
    font-size: 12px;
}

    .trFiltersBox > div {
        margin: 20px 0;
    }

        .trFiltersBox > div h4 {
            margin-bottom: 3px;
        }

        .trFiltersBox > div input {
            margin-left: 5px;
        }

div.trPriceRange {
    width: 80%;
}

    div.trPriceRange label {
        color: #3c910e;
        font-size: 1.1em;
        font-weight: bold;
    }

        div.trPriceRange label.maxPrice {
            float: left;
        }

    div.trPriceRange .ui-slider {
        margin: 2px 5px 0 0;
    }

    div.trPriceRange .ui-slider-range {
        background: #29abe2;
    }

    div.trPriceRange .ui-slider-handle {
        background: #224373;
        color: white;
        text-decoration: none;
        font-weight: bold;
        padding-right: 2px;
    }

    div.trPriceRange a.ui-slider-handle:nth-child(2):after {
        content: "\25C0";
    }

    div.trPriceRange a.ui-slider-handle:nth-child(3):after {
        content: "\25BA";
    }



section.trTourListings {
    position: relative;
}

    section.trTourListings h2 {
        font-size: 14px;
        margin: 15px 0;
        color: #cc6633;
        text-align: center;
    }

    section.trTourListings h3 {
        text-align: left;
    }

div.trTourListing {
    overflow: hidden;
    margin: 10px 0;
    padding: 12px;
    border: solid 1px #7F7F7F;
    box-shadow: 0px 0px 8px rgba(127,127,127,0.5),0px 0px 8px rgba(127,127,127,0.5);
    ;
}

    div.trTourListing div.priceBox {
        float: left;
        margin-left: 5px;
    }

        div.trTourListing div.priceBox > div {
            width: 140px;
            margin-top: 5px;
            padding: 5px;
            border: solid 1px #7F7F7F;
            box-shadow: 0px 0px 8px rgba(127,127,127,0.5),0px 0px 8px rgba(127,127,127,0.5);
            ;
            font: bold 12px arial;
            text-align: center;
        }

        div.trTourListing div.priceBox span {
            display: block;
            margin: 2px 0;
        }

            div.trTourListing div.priceBox span.price {
                color: #ce4300;
                font: bold 22px verdana;
            }

            div.trTourListing div.priceBox span.rateType {
                color: #cc0000;
            }

            div.trTourListing div.priceBox span.special {
                color: #3c910e;
            }

    div.trTourListing div.imageBox {
        float: right;
        width: 20%;
        height: 150px;
        overflow: hidden;
    }

        div.trTourListing div.imageBox img {
            width: 100%;
        }

    div.trTourListing div.infoBox {
        position: relative;
        min-height: 150px;
        margin: 0 22% 0 170px;
    }

        div.trTourListing div.infoBox div.line1 {
            margin-bottom: 2px;
            color: #224373;
            font-size: 14px;
            font-weight: bold;
        }

            div.trTourListing div.infoBox div.line1 span.stars {
                color: #cc6633;
                font-size: 1.3em
            }

        div.trTourListing div.infoBox div.bottom {
            position: absolute;
            bottom: 5px;
            margin-top: 5px;
        }

            div.trTourListing div.infoBox div.bottom span {
                font-weight: bold;
                color: #3c910e;
            }



/*   - Tour Details page   */
/*   -------------------------------------  */

.tdTourListing {
    margin: 5px 10px 0 10px;
    padding: 10px;
    overflow: hidden;
}

    .tdTourListing div.tourInfo div.line1 {
        margin-top: 5px;
        font-weight: bold;
        font-size: 16px;
    }

        .tdTourListing div.tourInfo div.line1 span.name {
            color: #0071bc;
        }

    .tdTourListing div.priceBox {
        float: left;
        width: 20%;
        margin-top: 10px;
        text-align: left;
        font-weight: bold;
    }

        .tdTourListing div.priceBox span.price {
            color: #ce4300;
            font-size: 24px;
        }


.tdTourDetails {
    overflow: hidden;
    margin: 0 15px;
}

.tdLeftPanel {
    float: right;
    width: 40%;
    margin: 10px 0 0 20px;
}

    .tdLeftPanel > img {
        width: 95%;
    }

.tdTourDepartures {
    margin: 15px;
    padding: 10px;
    overflow: hidden;
    border: 1px solid #7f7f7f;
    box-shadow: 0px 0px 8px rgba(127,127,127,0.5),0px 0px 8px rgba(127,127,127,0.5)
}

    .tdTourDepartures div.departure {
        margin: 10px;
        padding: 10px;
        overflow: hidden;
        border: 1px solid #0071bc;
    }

        .tdTourDepartures div.departure h4 {
            color: #0071bc;
            font-size: 14px;
        }

            .tdTourDepartures div.departure h4 span {
                margin-right: 5px;
                font-size: .875em;
                font-weight: normal;
                color: black;
            }

        .tdTourDepartures div.departure > div {
            margin-left: 200px;
        }

        .tdTourDepartures div.departure p {
            margin-top: 5px;
        }

    .tdTourDepartures button.zzSelectButton {
        float: left;
        margin-left: 10px;
    }

#tdModalDialog {
    text-align: center;
    padding: 5px 0;
    font-size: 14px;
}

/*Tour Payment Page*/
div.tpTourPayment {
}

    div.tpTourPayment > section {
        overflow: hidden;
        margin: 15px;
        padding: 10px;
        border: solid 1px #7f7f7f;
        box-shadow: 0px 0px 8px rgba(127,127,127,0.5),0px 0px 8px rgba(127,127,127,0.5)
    }

    div.tpTourPayment section.tpCancelPolicy {
        border-color: #cc0000;
    }

section.tpCancelPolicy div.penaltyDetails p {
    margin: 10px 0;
    font-weight: bold;
}

section.tpCancelPolicy table {
    float: right;
    margin-right: 10px;
}

section.tpCancelPolicy caption {
    text-align: right;
    color: #224373;
    font-weight: bold;
}

section.tpCancelPolicy th {
    font-weight: normal;
    padding-left: 10px;
}

div.tpTourPayment div.buttonBox {
    margin: 15px;
    overflow: hidden;
}

    div.tpTourPayment div.buttonBox input {
        float: right;
    }

    div.tpTourPayment div.buttonBox p {
        margin-right: 25px;
    }

div.tpTourPayment button.zzSelectButton {
    float: left;
    margin-left: 15px;
}

    div.tpTourPayment button.zzSelectButton:not(.enabled) {
        background-color: #ccc;
    }


.zzCreditCardForm {
    padding: 10px;
    margin: 10px 0;
    border: solid 1px #e6e7e7;
}

    .zzCreditCardForm h4 {
        font-size: 12px;
    }

        .zzCreditCardForm h4 span {
            font-weight: normal;
        }

    .zzCreditCardForm div.formRow {
        margin: 10px 0;
    }

        .zzCreditCardForm div.formRow label {
            margin: 0 10px 0 5px;
        }

            .zzCreditCardForm div.formRow label:first-child {
                display: inline-block;
                width: 90px;
                margin-right: 0;
                text-align: left;
            }

        .zzCreditCardForm div.formRow input {
            max-width: 95%;
            margin-bottom: 10px;
            padding: 5px;
            vertical-align: middle;
            color: #333333;
            font-size: 14px;
            border: 1px solid #cccccc;
        }

        .zzCreditCardForm div.formRow select {
            max-width: 95%;
            margin-bottom: 10px;
            padding: 5px;
            color: #333333;
            font-size: 14px;
            border: 1px solid #cccccc;
        }

        .zzCreditCardForm div.formRow .Required {
            background-color: #ffffec;
        }

/*Tour Confirmation Page*/
#tcTopDiv div.zzBookingSummary {
    border: 1px solid #ccc;
}

#hcMainBody > section {
    margin: 15px;
}

    #hcMainBody > section h2 {
        margin-bottom: 5px;
    }

section.tcConfirmation > div,
.tcTourInfo section {
    padding: 10px;
    border: solid 1px #7f7f7f;
    box-shadow: 0px 0px 8px rgba(127,127,127,0.5),0px 0px 8px rgba(127,127,127,0.5)
}

.tcTourInfo h4 {
    margin-top: 10px;
}

.tcTourInfo section {
    margin-bottom: 10px;
}

div.tcButtonBox {
    margin: 10px;
}

span.tcBookAnotherHotel > span {
    display: none;
}

span.tcBookAnotherHotel:hover > span {
    display: inline;
}


/*************************************
-- InvoiceLogin --
**************************************/

#ilTopDiv {
}

#ilTopDiv {
}

#ilMainBody {
    margin: 15px auto;
    padding: 15px;
    background-color: #F6F6F6;
    border-radius: 5px;
}

    #ilMainBody img.banner {
        width: 100%
    }

    #ilMainBody h1 {
        color: #cc6633;
        font-size: 24px;
    }

    #ilMainBody h2 {
        color: #0066cc;
        font-size: 16px;
        margin-bottom: 10px;
    }

    #ilMainBody div.box > div {
        width: 50%;
    }

    #ilMainBody div.notes {
        float: left;
    }

        #ilMainBody div.notes > div {
            width: 80%;
            margin: 0 auto;
        }

        #ilMainBody div.notes p {
            font-size: 14px;
            margin-bottom: 10px;
        }

        #ilMainBody div.notes u {
            margin: 0 20px;
        }

        #ilMainBody div.notes li {
            color: #333;
            margin: 2px 0;
        }

    #ilMainBody form {
        padding: 5px;
        background-color: #f0f0f0;
        border: solid 1px #e3e3e3;
        border-radius: 5px;
    }

        #ilMainBody form > div {
            margin: 15px;
        }

        #ilMainBody form label {
            display: inline-block;
            width: 140px;
            font-weight: bold;
            text-transform: uppercase;
        }

        #ilMainBody form input {
            width: auto;
            padding: 6px 12px;
            background-color: #fffdd8;
            border: solid 1px #ccc;
            border-radius: 5px;
        }

        #ilMainBody form button {
            background-color: #428bca;
            padding: 4px 12px;
            font-weight: normal;
        }


/*************************************
-- InvoiceView --
**************************************/

#ivTopDiv {
}

#ivMainBody {
    margin: 15px 7% 55px;
    padding: 15px;
    background-color: #F6F6F6;
    border-radius: 5px;
}

    #ivMainBody h1 {
        color: #cc6633;
        margin-top: 0;
    }

.ivMainBox > section {
    background-color: white;
    margin: 0 0 10px;
    overflow: hidden;
}

    .ivMainBox > section > div {
        margin: 10px 15px;
    }

.ivMainBox label {
    font-weight: bold;
    margin-left: 5px;
}

h2.ivSectionSlider {
    width: 98%;
    padding: 10px;
    margin: 0;
    background: #2980b9 url('https://ttcm.s3.amazonaws.com/Images/Template/icon-expand.png') no-repeat left 20px center;
    color: white;
    text-align: right;
    font-size: 1.25em;
    font-weight: normal;
    text-transform: uppercase;
    border-radius: 0;
    cursor: pointer;
}

    h2.ivSectionSlider.important {
        background-color: #cc0000;
    }

div.ivAgentInfo {
    float: left;
    width: 30%;
    margin-left: 10px;
    padding: 5px 10px;
    background-color: #ffffd8;
    border: solid 1px #ccc;
}

    div.ivAgentInfo h3 {
        color: #2980b9;
        text-transform: uppercase;
        padding-top: 0;
    }

    div.ivAgentInfo div {
        margin: 4px 0;
    }

div.ivBookingInfo {
    font-size: 12px;
    padding-bottom: 10px;
}

    div.ivBookingInfo div {
        margin: 4px 0;
    }

.ivDetails h3 {
    margin: 0 0 5px 0;
    padding-top: 15px;
    text-transform: uppercase;
    text-align: center;
}

.ivDetails table {
    width: 90%;
}

    .ivDetails table th {
        padding: 5px 0;
        border-bottom: solid 1px #999;
        text-align: right;
        background-color: #efefef;
        text-transform: uppercase;
    }

    .ivDetails table tr.newRow td {
        padding-top: 8px;
    }

    .ivDetails table td label {
        font-weight: bold;
        margin-left: 3px;
        ;
    }

.ivDetails span.Approved {
    color: green;
}

.ivDetails span.Declined {
    color: red;
}

.ivDetails span.InProcess {
    color: orange;
}

.ivFareBreakdown table td {
    padding: 3px;
}

.ivDetails table tr.detail td {
    font-size: .9em;
    padding-top: 0;
}

    .ivDetails table tr.detail td:nth-child(2) {
        padding-right: 18px;
    }

.ivDetails table tr.totals td {
    padding: 5px 0;
    border-top: solid 1px #999;
    color: #cc6633;
    background-color: #ffffd8;
    font-weight: bold;
    text-transform: uppercase;
}

.ivFareBreakdown table th:nth-child(3),
.ivFareBreakdown table td:nth-child(3) {
    text-align: left;
}

.ivFareBreakdown table th:nth-child(4),
.ivFareBreakdown table td:nth-child(4) {
    text-align: left;
    font-weight: bold;
}

.ivDisclaimers {
    margin: 10px 0;
    font-weight: bold;
}

    .ivDisclaimers strong {
        color: red;
    }

.ivMainBox > section > div > section {
    margin: 10px 0;
    overflow: hidden;
}

    .ivMainBox > section > div > section h3 {
        margin-bottom: 5px;
        text-decoration: underline;
        text-transform: uppercase;
    }

    .ivMainBox > section > div > section.ivTermsConditions h3 {
        color: #2980b9;
        font-size: 14px;
        text-decoration: none;
        text-transform: none;
        cursor: pointer;
        padding-right: 20px;
        background: url('https://ttcm.s3.amazonaws.com/Images/Template/icon-info.png') no-repeat;
    }

.ivInsuranceAdvice h4,
section.ivTermsConditions h4 {
    margin: 10px 0 3px;
    font-size: 13px;
}

section.ivTermsConditions p {
    margin-bottom: 8px;
}

section.ivTermsConditions ul {
    color: inherit;
}

section.ivTermsConditions li {
    margin: 5px 0;
}

.ivMainBox > section > div > section div {
    margin: 3px 0;
}

.ivMainBox > section > div > section.terms > div {
    padding-top: 4px;
    border-top: solid 1px #ddd;
}

section.ivPassenger {
    overflow: hidden;
}

    section.ivPassenger > section {
        float: right;
        width: 50%;
        margin-top: 5px;
        padding-bottom: 4px;
        border-bottom: solid 1px #ddd;
    }

    section.ivPassenger h4 {
        width: 80%;
        padding: 3px;
        color: #cc6633;
        background-color: #efefef;
    }

.ivCruiseDetails > div > section.itinerary {
    float: left;
    width: 50%;
}

.ivCruiseDetails > div > section.dining {
    float: left;
    width: 50%;
}

.ivMainBox > section section.ivSegment {
    background-color: #efefef;
}

    .ivMainBox > section section.ivPassenger > div,
    .ivMainBox > section section.ivSegment > div {
        margin-bottom: 15px;
    }

        section.ivPassenger > div:first-child label,
        .ivMainBox > section section.ivSegment > div:first-child label {
            color: #2980b9
        }

.ivAirTransportation p.note {
    color: #ce0000;
    font-weight: bold;
}

#ivFooter {
    position: fixed;
    bottom: 0;
    width: 100%;
    background-color: #224273;
    text-align: center;
}

    #ivFooter div.buttonBox {
        max-width: 1140px;
        padding: 10px 15px 5px;
        margin: 0 7%;
        display: flex;
        flex-direction: row;
        justify-content: space-around;
    }

    #ivFooter button {
        padding: 4px 12px;
        background-color: #cc6633;
        text-transform: none;
        font-weight: normal;
    }

        #ivFooter button[disabled] {
            background-color: #aaa;
            cursor: default;
        }

    #ivFooter .zzCopyrightNotice {
        color: white;
        margin: 5px 0;
    }


#ivInsuranceOverlay {
    font: normal 12px Verdana, Arial, Helvetica, sans-serif;
    margin: 5px 10px;
}

.ivFormSelectPax {
    margin-bottom: 10px;
}

    .ivFormSelectPax > div {
        margin: 0 10px;
    }

    .ivFormSelectPax h2, .ivFormPayment h2, .ivFormPaySegments h2 {
        padding: 2px;
        color: white;
        background-color: #1289A7;
    }

    .ivFormSelectPax > div > span {
        display: inline-block;
        width: 30%;
        margin: 5px 0;
    }

    .ivFormSelectPax label {
        font-weight: bold;
    }

    .ivFormSelectPax button {
        font-weight: normal;
        text-transform: none;
        padding: 4px 12px;
    }


#ivPaymentOverlay {
    font: normal 12px Verdana, Arial, Helvetica, sans-serif;
    margin: 5px 10px;
}

.ivFormPaySegments h3 {
    margin: 10px 0;
}

.ivFormPaySegments fieldset {
    border: none;
}

.ivFormPaySegments legend {
    font-weight: bold;
    margin-left: 5px;
}

.ivFormPaySegments div.segments {
    margin: 10px 0;
}

    .ivFormPaySegments div.segments table {
        width: 100%
    }

    .ivFormPaySegments div.segments th {
        text-align: right;
    }

    .ivFormPaySegments div.segments td {
        padding: 5px 0;
    }

.ivFormPaySegments span.currency {
    font-size: 9px;
    margin-left: 2px;
}

.ivFormPaySegments div.segments input {
    padding: 3px 6px;
    border: solid 1px #ccc;
    border-radius: 5px;
    font-size: 14px;
}

    .ivFormPaySegments div.segments input[readonly] {
        border: none;
    }

.ivFormPaySegments div.segments tr.total td {
    color: #cc6633;
    font-weight: bold;
}

.ivFormPaySegments div.segments tr.balDue td {
    font-weight: bold;
}

.ivFormPaySegments div.segments td.balDue {
    color: #ce0000;
}

.ivFormPaySegments div.segments > p {
    max-width: 600px;
}

.ivFormPayment > div {
    margin: 10px auto;
}

    .ivFormPayment > div > span > span {
        margin-right: 5px;
    }

.ivFormPayment span.tokens {
    float: left;
    margin-right: 10px;
}

.ivFormPayment .zzCreditCardForm div.formRow {
    overflow: hidden;
}

    .ivFormPayment .zzCreditCardForm div.formRow > div {
        float: right;
        margin-left: 2%;
        max-width: 98%;
    }

    .ivFormPayment .zzCreditCardForm div.formRow label:first-child {
        display: block;
        width: auto;
        text-align: right;
    }

.ivFormPayment div.buttonBox button {
    background-color: #BF0000;
    font-weight: normal;
    text-transform: none;
    padding: 4px 12px;
}

.ivFormPayment div.buttonBox p {
    color: #ce0000;
}

.ivFormPayment div.totAmount > span > span {
    font-size: .8em;
    margin: 0 8px 0 2px;
}

.ivFormPayment footer {
    margin-top: 10px;
    text-align: center;
    font-size: 10px;
}


/*   - Air Flight Search Widget page   */
/*   -------------------------------------  */
#fsBody {
    background-color: #f2f2f2;
}

#fsTopDiv {
    /*max-width:800px; */
    margin: 0 10px;
    padding: 10px 10px 0 10px;
    font-size: 13px;
}

    #fsTopDiv i.fa {
        color: orange;
        font-size: 1.25em;
    }

.zzAirSearchForm a {
    text-decoration: none;
    font-weight: bold;
}

.zzSearchCityBox .zzAirSearchForm a.close {
    float: left;
}

.zzAirSearchForm > div {
    margin: 25px 0;
}

.zzAirSearchForm label {
    font-weight: bold;
}

.zzAirSearchForm > div > span {
    margin-left: 10px;
}

.zzAirSearchForm button {
    float: left;
}


#fsTopDiv .zzAirSearchForm input {
    border: none;
}

#fsTopDiv .zzAirSearchForm select {
    border-radius: 5px;
    padding: 5px;
}

#fsTopDiv .zzAirSearchForm span.container {
    background-color: white;
    padding: 7px 7px 7px 0;
    border-radius: 5px;
}


/*   Air Flight Results page   */
/*   -------------------------------------  */
#arBody {
}

#arTopDiv {
}

div.zzAirMainBox h2 {
    color: #224373;
    font-size: 16px;
    /*text-align:center;*/
}


.zzAirSearchSummary div.flight {
    margin-bottom: 10px;
}

    .zzAirSearchSummary div.flight div:first-child span {
        font-weight: bold;
    }

.zzAirSearchSummary div.details span {
    margin-right: 10px;
}

.zzAirSearchSummary button {
    float: left;
}


section.zzAirSelections {
    padding: 15px;
    background-color: #fdfdee;
}

    section.zzAirSelections h2 a {
        float: left;
        font-size: smaller;
    }

.zzAirSelections section.flights {
    overflow: hidden;
}

.zzAirSelections div.flight {
    margin: 5px 0;
    padding: 10px 10px 10px 2px;
    border: solid 1px #7F7F7F;
    box-shadow: 0px 0px 8px rgba(127,127,127,0.5),0px 0px 8px rgba(127,127,127,0.5);
    ;
}

.zzAirSelections div.details {
    margin: 3px 0;
}

    .zzAirSelections div.details > span {
        display: inline-block;
        width: 27%;
        vertical-align: top;
    }

        .zzAirSelections div.details > span:nth-child(4) {
            width: auto;
        }

        .zzAirSelections div.details > span > span {
            display: inline-block;
            margin-right: 4px;
        }

    .zzAirSelections div.details img {
        width: 20px;
        float: right;
        margin-top: 3px;
    }

.zzAirSelections section.fare {
    float: left;
    margin: 5px 10px 0 0;
    padding: 5px;
    border: solid 1px #7F7F7F;
    box-shadow: 0px 0px 8px rgba(127,127,127,0.5),0px 0px 8px rgba(127,127,127,0.5);
    ;
}

    .zzAirSelections section.fare tr:nth-child(odd) td {
        font-weight: bold;
        padding-top: 5px;
    }

    .zzAirSelections section.fare td:nth-child(2) {
        text-align: left;
        padding-right: 10px;
    }


header.arMainPanel {
    overflow: hidden;
}

    header.arMainPanel h1 {
        float: right;
    }
/*header.arMainPanel>div{
    float:right; margin:10px 10px 0 0;
}*/

nav.arMainPanel {
    float: right;
    width: 234px;
    margin: 1px 15px;
}

    nav.arMainPanel h3 {
        display: block;
    }

.arFiltersBox > div {
    margin: 10px;
}

header.arMainPanel {
    margin-right: 10px;
}

main.arMainPanel {
    margin-right: 265px;
    padding-top: 10px;
}

div.arSortOptions {
    float: left;
    margin-left: 10px;
}

div.arFlightListings {
    position: relative;
}

div.arFlightListing {
    overflow: hidden;
    margin: 10px 0;
    padding: 12px;
    border: solid 1px #7F7F7F;
    box-shadow: 0px 0px 8px rgba(127,127,127,0.5),0px 0px 8px rgba(127,127,127,0.5);
    ;
}

    div.arFlightListing div.priceBox {
        float: left;
        margin-left: 5px;
        padding: 8px;
        border: solid 1px #7F7F7F;
        box-shadow: 0px 0px 8px rgba(127,127,127,0.5),0px 0px 8px rgba(127,127,127,0.5);
        ;
        font: bold 12px arial;
        text-align: center;
    }

        div.arFlightListing div.priceBox span {
            display: block;
            margin: 3px 0;
        }

            div.arFlightListing div.priceBox span.price {
                color: #ce4300;
                font: bold 22px verdana;
            }

            div.arFlightListing div.priceBox span.rateType {
                color: #cc0000;
            }


    div.arFlightListing div.depArrTimes {
        float: right;
        margin-left: 20px;
    }

    div.arFlightListing span.dayCng {
        font-size: smaller;
        color: red;
    }

    div.arFlightListing div.depArrTimes img {
        width: 40px;
        vertical-align: middle;
        margin-left: 5px;
    }

    div.arFlightListing div.depArrTimes > div:first-child {
        font-weight: bold;
        font-size: 14px;
        color: #224373
    }

    div.arFlightListing div.depArrTimes > div {
        margin-bottom: 5px;
    }

    div.arFlightListing div.duration {
        font-size: larger;
    }

        div.arFlightListing div.duration > div {
            margin-bottom: 10px;
        }

    div.arFlightListing div.details {
        clear: right;
    }

        div.arFlightListing div.details > div {
            margin-bottom: 5px;
        }

        div.arFlightListing div.details span {
            margin-left: 10px;
        }

    div.arFlightListing span.cities {
        display: block;
        font-weight: bold;
    }

    div.arFlightListing span.flno {
        display: inline-block;
        width: 55px;
    }

    div.arFlightListing span.times {
        display: inline-block;
        width: 180px;
    }

    div.arFlightListing span.cclass {
        display: inline-block;
        width: 110px;
    }
    /*div.arFlightListing span.equip:before{
    content: "\a"; white-space: pre;
}*/
    div.arFlightListing span.equip {
        display: inline-block;
        width: 100px;
    }
/*   Air Flight Details page   */
/*   -------------------------------------  */
main.adMainPanel {
    margin-right: 15px;
}

.adTravelerInfo div.traveler {
    margin-bottom: 15px;
}

.adTravelerInfo input,
.adTravelerInfo select {
    padding: 4px;
    border-radius: 4px;
    border: solid 1px #888;
}

.adTravelerInfo select {
    padding: 3px;
}

.adTravelerInfo div.traveler > div {
    display: inline-block;
    margin: 0 10px 3px 0;
}

.adTravelerInfo div.traveler label {
    display: block;
}

.adTravelerInfo button {
    float: left;
    margin: 10px 0 0 20px;
}

#adDisclaimerText {
    margin: 10px;
    color: black;
}


/*   Air Payment page   */
/*   -------------------------------------  */
.apPaymentDetails {
    margin-right: 15px;
}

    .apPaymentDetails div.buttonBox input {
        float: right;
        margin-top: 1px
    }

    .apPaymentDetails div.buttonBox p {
        margin-right: 24px;
    }

    .apPaymentDetails button {
        float: left;
        margin: 10px 0 0 20px;
    }

/*   Air Confirmation page   */
/*   -------------------------------------  */
main.acConfirmationInfo {
    padding: 15px;
}

div.acConfirmBox > div {
    margin: 4px 0;
    font-weight: bold;
}

div.acConfirmBox button {
    float: left;
}

div.acConfirmBox > div label {
    margin-left: 5px;
}
/**************************************
ADJUSTMENTS FOR SMALLER SCREEN SIZES
*/

@media only screen and (max-width: 1149px) {
    /*.zzMainBody,.zzFooter { max-width:800px;}*/
    div.zzBookingSummary img, .zzPrettyPics {
        display: none;
    }

    div.zzBookingSailing, div.zzBookingDetails, div.zzBookingPricing {
        width: 25%;
    }

    div.zzFormBody {
        padding-right: 0
    }

    div.crCompareLink,
    div.crPrices div.perDay {
        display: none
    }

    #crMainBody, #crFooter, #cdMainBody, #cdFooter {
        max-width: 620px;
    }

    #cdTabArea > ul li {
        margin: 0;
        font-size: 11px;
    }

    #cdSailingRates div.category {
        width: 35%;
    }

        #cdSailingRates div.category > div {
            float: right;
            width: 46%;
            text-align: right;
        }

            #cdSailingRates div.category > div span:first-child {
                display: block;
                float: none;
            }

    div.cdPaxQual {
        float: none;
        display: flex;
        justify-content: space-between;
        margin: 10px 0;
    }

    div.cdResidencyGroup, div.cdVendorPromo {
        margin: 5px 0 0 0;
    }

        div.cdResidencyGroup > div {
            display: inline-block;
            width: 49%;
        }

        div.cdResidencyGroup select {
            width: 90%;
        }

    #spaDetailPane {
        float: none;
        width: auto;
    }

        #spaDetailPane img.large {
            display: none;
        }

    div.spaListing > div {
        width: 50%
    }

    div.spaListing img {
        width: 50%
    }

    #spaListings {
        margin-right: 0
    }

        #spaListings img {
            cursor: default;
        }

    #caMainBody div.zzBookingSummary img {
        display: inline
    }

    #csMainSection > h2 img {
        max-width: 160px
    }

    div.lgLoginOption.exist > div:first-of-type div.formField {
        display: block;
    }

    #lgTopDiv div.zzCustomerForm div.formSection.name > div {
        display: block;
    }

    #lgTopDiv div.zzCustomerForm div.formSection.addr {
        float: none;
    }

    #lgTopDiv div.zzCustomerForm div.formSection.phone {
        text-align: right;
    }

    section.zzTravelerBox div.formField {
        margin: 10px 10px 0 10px;
    }

        section.zzTravelerBox div.formField:last-child {
            margin-bottom: 10px;
        }

    section.zzTravelerBox h3 {
        margin: 5px 10px 0 10px;
    }

    section.zzTravelerBox section {
        background-color: white;
    }

        section.zzTravelerBox section.address div.formField,
        section.zzTravelerBox section.citizenship div.formField {
            height: 35px;
        }

        section.zzTravelerBox section div.formField label {
            display: block;
        }

    #coConfSection div.panel2 {
        width: 250px;
    }

    section.main > div#asCruiselineType {
        max-width: 157px;
    }

    #asFooter div.images {
        display: none;
    }

    #psTopDiv .zzMainBody, #psTopDiv .zzFooter#psFooter {
        max-width: 900px;
    }
}


@media only screen and (max-width: 1099px) {
    #psTopDiv .zzAdSpace-Right {
        display: none;
    }
}

@media only screen and (max-width: 1023px) {
    .zzAdSpace-Right {
        display: none;
    }

    #crMainBody, #crFooter {
        margin-right: 265px;
    }

    .lfTopDiv {
        width: 250px;
    }

    div.crPaging {
        text-align: center
    }

    div.crBonusOffers {
        display: none
    }

    div.crListingIcons {
        display: block;
    }

    .crShipImage {
        width: 31%;
    }

    div.crCruiseBox {
        margin-right: 32%;
    }

    div.crPrices div.price {
        font-size: 1.1em;
    }

    #cdMainBody, #cdFooter {
        margin-right: 265px;
    }

    #cdItinInfo {
        width: 200px;
    }

    #cdItinDetails > div {
        height: 300px;
        margin-right: 220px;
    }

    #cdPaxBox {
        margin: 10px 0;
    }

    div.cdPaxSelect div.paxType {
        display: flex;
        justify-content: space-between;
    }

    div.cdBestRate {
        float: none;
        width: auto;
        border-left: none;
    }

        div.cdBestRate div.title {
            float: none;
            width: auto;
            border: none;
        }

    div.cdResidencyGroup {
        margin-top: 10px;
    }

    div.cdVendorPromo {
        padding-top: 0px;
        border-top: none;
    }

        div.cdVendorPromo h3 {
            display: block;
        }

    div.cdPaxSelect {
        float: none;
        width: auto;
    }

    div.cdBestRate {
        width: auto;
        margin: 10px 0 0 0;
        padding: 5px 0 0 0;
        border-right: none;
        border-top: solid 1px #999;
    }

    #cdTabArea > ul li {
        display: block;
        margin: 0;
        font-size: 14px;
    }


    #cdSailingRates div.header {
        display: none
    }

    #cdSailingRates div.sailing > div {
        float: none;
        width: auto;
    }

    #cdSailingRates div.category {
        width: 35%;
    }

        #cdSailingRates div.category > div {
            text-align: left;
        }

            #cdSailingRates div.category > div span:first-child {
                float: right;
            }

    #cdSailingRates div.bonusOffers {
        margin-top: 3px;
    }

    #dplMainBody {
        display: flex;
        flex-direction: column;
    }

        #dplMainBody button.zzSlider {
            display: block;
        }

    #dplRightPane {
        display: none;
        float: none;
    }

        #dplRightPane img {
            max-width: none;
            width: 100%;
        }

    #dplDeckSelection {
        margin: 10px auto;
    }

    #sraRatingDetails div.col {
        float: none;
        width: auto;
    }

    form.zzTravelerOverlay span.sectionButton {
        display: inline;
    }

    section.zzTravelerBox h3 {
        margin: 0;
        padding: 2px 5px;
        background-color: #337ab7;
        color: white;
        cursor: pointer;
    }

    section.zzTravelerBox section > div {
        display: none;
    }

    section.zzTravelerBox section.name > div {
        float: none;
    }

        section.zzTravelerBox section.name > div input {
            width: 95%;
        }

    div.fcCategoryListing div.fareInfo > div > div > div {
        display: flex;
        flex-direction: column;
    }

    div.fcCategoryListing div.priceBox {
        float: none;
        margin-top: 10px;
    }

    #pxServicesForm div.specialServices {
        float: none;
    }

    span.zzServicesSpecialSvcLink {
        color: #2667ad;
    }

    #asCriteriaMainPanel ul {
        height: 190px;
    }
    /* not in Sandra spec */
    #asDestination ul {
        columns: 2;
        -webkit-column-count: 2;
        -moz-column-count: 2;
        height: auto;
    }

    #asCriteriaMainPanel section.main > div {
        float: right;
        width: 48%;
        margin-right: 22px
    }

    section.main > div#asCruiselineType {
        max-width: none;
    }

    section.main > div#asCruiseline {
        margin-right: 0
    }

    div.zzSearchCriteria1 {
        text-align: center;
    }

        div.zzSearchCriteria1 > div {
            float: none
        }

    div.zzTopDiv.hotel div.zzBookingSummary h3:after, div.zzTopDiv.tour div.zzBookingSummary h3:after {
        display: inline;
    }

    div.zzTopDiv.hotel div.zzBookingSailing, div.zzTopDiv.tour div.zzBookingSailing {
        display: block;
        width: auto;
        padding: 0;
        border: none;
        border-bottom: solid 1px #999999;
    }

        div.zzTopDiv.hotel div.zzBookingSailing > div > div, div.zzBookingHotel > div > div {
            width: auto;
        }

    div.zzBookingHotel {
        display: block;
        width: auto;
        border: none;
        border-bottom: solid 1px #999999;
        padding: 0
    }

    div.zzTopDiv.hotel div.zzBookingPricing {
        display: block;
        width: auto;
        padding: 0;
    }

    div.zzTopDiv.hotel div.zzBookingSummary div.box > div > div,
    div.zzTopDiv.tour div.zzBookingSummary div.box > div > div {
        display: none;
    }

    div.zzBookingTour {
        display: block;
        width: auto;
        padding: 0
    }

        div.zzBookingTour table {
            width: 100%;
        }

    div.hrHotelListing div.imageBox {
        float: none;
        width: auto;
        max-height: 150px;
        margin-left: 180px;
    }

    div.hrHotelListing div.hotelInfoBox {
        margin: 0;
        min-height: auto;
    }

        div.hrHotelListing div.hotelInfoBox div.line1 span.stars {
            display: block;
        }

        div.hrHotelListing div.hotelInfoBox div.line4 {
            position: static;
            margin-top: 5px;
        }

    div.trTourListing div.imageBox {
        float: none;
        width: auto;
        max-height: 150px;
        margin-left: 180px;
    }

    div.trTourListing div.infoBox {
        margin: 0;
        min-height: auto;
    }

        div.trTourListing div.infoBox div.bottom {
            position: static;
            margin-top: 5px;
        }

    .hdPhotoGallery, .hdHotelDesc, .hdHotelLocation, section.hdHotelAmenities {
        float: none;
        width: auto;
        margin: 0
    }

        .hdPhotoGallery div.thumbnails {
            display: none;
        }

        .hdHotelDesc > div, .hdHotelLocation > div, .hdHotelAmenities > ul {
            display: none
        }

    .hdHotelDetails h2.collapse {
        padding: 3px 6px;
        background-color: #224373;
        color: white;
        text-align: center;
        cursor: pointer;
    }

        .hdHotelDetails h2.collapse:after {
            content: '\25BC';
            float: left;
        }

    .hdHotelRoomDetails h2, .hdMapCanvas h2 {
        text-align: center;
    }

    div.zzCustForm div.formGroup > div {
        display: block;
        margin: 10px 0;
    }

        div.zzCustForm div.formGroup > div label {
            display: inline-block;
            width: 80px;
        }

    /*.hpImportantInformation>p, .hpPaymentDetails>section, .tpPaymentDetails>section{display:none; }
    div.hpHotelPayment h2.collapse, div.tpTourPayment h2.collapse{ cursor:pointer; }
    div.hpHotelPayment h2.collapse:after, div.tpTourPayment h2.collapse:after{ content:'\25BC';  float:right; }*/
    .zzCreditCardForm div.formRow label:first-child {
        text-align: right;
    }

    .zzCreditCardForm div.formRow > span {
        display: block
    }

    #ivMainBody {
        margin: 0 0 55px;
        padding: 10px 5px;
    }

    #ivFooter div.buttonBox {
        margin: 0;
    }

    .ivFormPayment .zzCreditCardForm div.formRow > div {
        float: none
    }

    div.fcCategoryListing div.priceBox div.zzBookingPricing {
        top: 50px;
    }

    div.fcCategoryListing.onefare div.priceBox {
        margin-top: 12px;
        float: right !important;
    }
}

@media only screen and (min-width:768px) and (max-width: 1023px) {
    .crShipImage {
        text-align: center;
    }

        .crShipImage img.vlogo {
            float: none;
            display: block;
        }

    #cdSailingRates div.sailing {
        float: right;
        width: 80%;
    }

    #cdSailingRates div.category, #cdSailingRates div.bonusOffers {
        margin-right: 20px;
    }

    #csMainSection > h2 > span {
        display: inline-block;
    }

        #csMainSection > h2 > span > span {
            display: block;
        }

    #csMainSection > h2 span.cat > span {
        display: none;
    }

    section.zzCreditCardForm div.formRow > span > span > label:first-child {
        display: inline;
        margin-right: 10px;
    }
}

@media only screen and (max-width: 895px) and (min-width:768px) {
    .lfTopDiv {
        width: 200px;
    }

    #crMainBody, #crFooter, #cdMainBody, #cdFooter {
        margin-right: 220px;
    }
}


@media only screen and (min-width:768px) {
    div.hrHotelListing div.imageBox img:hover,
    div.trTourListing div.imageBox img:hover {
        position: absolute;
        z-index: 10;
        margin-top: -50px;
        height: auto;
        width: auto;
        min-height: 150px;
        padding: 3px;
        background-color: white;
        border: solid 1px #7F7F7F;
    }
}

@media only screen and (max-width: 767px) {
    .lfTopDiv form, .lfBestDealBox, .lfTopDiv .adSpace {
        display: none;
    }

    .lfTopDiv {
        margin: 0 2px;
        float: none;
        width: auto;
    }

    button.zzSlider {
        display: block;
    }

    .lfButtonBox > div {
        display: inline-block;
        width: 30%;
    }

    .zzPageTitle {
        margin: 8px 0;
        color: #224273;
    }

    .zzMainBody {
        margin: 0 2px;
    }

    #crTopDiv .zzPageTitle {
        color: #cc6633;
    }

    #crMainBody, #crFooter {
        max-width: none;
        margin: 0 2px;
    }

    #crCruiseListings > h2 {
        display: block
    }

    .crShipImage {
        float: none;
        width: auto;
    }

        .crShipImage > img {
            display: none
        }

        .crShipImage img.vlogo {
            width: auto;
            max-width: 47%
        }

    div.crCruiseBox {
        margin-right: 0px;
    }

    div.crPrices div.price {
        font-size: 1.25em;
    }

    #cdMainBody, #cdFooter {
        max-width: none;
        margin: 0 2px;
        magin-bottom: 5px;
    }

    #cdItinInfo {
        float: none;
        width: auto;
    }

        #cdItinInfo img.map {
            display: none;
            position: static;
        }

            #cdItinInfo img.map:hover {
                width: 100%;
            }

    #cdItinDetails h2.cdEmailFriend {
        display: none;
    }

    #cdItinDetails > div {
        display: none;
        height: auto;
        margin-right: 0;
    }

    div.dplCategory img.cabin {
        float: none;
        width: 100%
    }

    div.dplCategory > h3, div.dplCategory > p {
        margin: 10px 0 0 0;
    }


    div.cdPaxQual {
        display: block;
        overflow: hidden;
    }

        div.cdPaxQual > div {
            float: right;
            margin-left: 5px;
        }

    div.cdResidencyGroup > div {
        display: block;
        width: auto;
    }

    div.cdResidencyGroup select {
        width: auto;
    }

    #cdSailingRates div.row > div.action {
        float: none;
        margin-top: 5px;
    }

    #cdSailingRates div.category > div {
        max-width: none;
    }

    #sprTopRow {
        text-align: center
    }

        #sprTopRow img.ship {
            float: none;
            width: 100%;
            max-width: 330px;
        }

        #sprTopRow > div {
            margin: 5px 0;
        }

            #sprTopRow > div > div {
                text-align: right;
            }

    #sprStats > div > div {
        display: block;
    }

    #sprStats label {
        width: 66%;
    }

    #sprStats span {
        width: 33%;
    }

    #sraTopRow img.logo {
        float: none;
    }

    #sraTopRow > div {
        margin-right: 0;
    }

    #caMainBody div.zzBookingSummary img {
        display: none
    }

    #fcCategoryList div.tabs > span {
        display: block;
        width: auto;
        margin-left: 0
    }

    div.fcCategoryListing h2 {
        cursor: pointer;
    }

        div.fcCategoryListing h2 span.frPrice:after {
            content: "\25bc";
            float: left;
            margin-right: 8px;
            transform: scale(1.5,1);
            color: white;
        }

    div.fcCategoryListing div.catInfo, div.fcCategoryListing div.fareInfo {
        display: none;
    }

    div.fcCategoryListing div.catInfo {
        height: auto;
    }

        div.fcCategoryListing div.catInfo img.cabinImg {
            position: static;
            float: none;
            width: 100%;
        }

            div.fcCategoryListing div.catInfo img.cabinImg:hover {
                position: static;
                width: 100%;
            }

        div.fcCategoryListing div.catInfo div.description {
            margin: 5px 0 0 0;
        }

    div.fcCategoryListing div.fareInfo > div {
        width: auto;
        margin: 10px 0;
        padding: 0 5px;
        background-color: #FDFED6;
        border: solid 1px #000;
    }

        div.fcCategoryListing div.fareInfo > div:nth-child(even) {
            margin-right: 0;
            padding: 0 5px;
            border: solid 1px #000;
        }

        div.fcCategoryListing div.fareInfo > div > div {
            border: none;
        }

    div.fcCategoryListing div.fareInfo h3 {
        cursor: pointer
    }

        div.fcCategoryListing div.fareInfo h3 span {
            display: inline
        }

    div.fcCategoryListing div.fareInfo > div > div > div {
        display: none;
    }

    div.fcCategoryListing div.priceBox,
    div.fcCategoryListing div.priceBox.special {
        background-color: white;
    }

    #pmMainBody div.zzBookingSailing,
    #coMainBody div.zzBookingSailing,
    div.zzBookingSailing {
        display: block;
        width: auto;
        border-left: none;
        border-bottom: solid 1px #999999;
        padding: 0
    }

        div.zzBookingSailing > div > div {
            width: auto;
        }

    #pmMainBody div.zzBookingDetails,
    #coMainBody div.zzBookingDetails,
    div.zzBookingDetails {
        display: block;
        width: auto;
        padding: 4px 0;
        border: none;
    }

    div:not(:last-child).zzBookingDetails {
        border-bottom: solid 1px #999999;
    }

    #pmMainBody div.zzBookingDetails,
    #coMainBody div.zzBookingDetails {
        border: none;
    }

    div.zzBookingSummary div.bonus span {
        display: block;
    }

    div.zzBookingPricing {
        display: block;
        width: auto;
        padding: 4px 0;
    }

    div.pmsDiningCabinDetails > div {
        display: block;
        width: auto;
        text-align: right;
    }


    #caCategoryList div.tabs > span {
        width: 120px;
    }

    div.caCategoryListing div.priceBox.air {
        width: 33%;
    }

    div.caCategoryListing div.priceBox h3.norefund {
        font-size: .875em
    }

    #csDeckPlan {
        display: none;
        float: none;
    }

    #csMainBody, #csMainSection {
        display: flex;
        flex-direction: column;
    }

        #csMainSection > h2 {
            text-align: center;
        }

            #csMainSection > h2 > span {
                display: block;
                margin-top: 10px;
            }

            #csMainSection > h2 img {
                max-width: none
            }

    div.csCategoryUpgradeSection {
        float: none;
        width: auto;
    }

    div.csCabinSelectSection {
        width: auto;
    }

    #csDeckPlan div.image {
        display: inline-block;
        height: auto;
    }

    #lgLoginTypeSelectBox {
        float: none;
    }

    #lgCustomerFormBox {
        margin-right: 0;
    }

    div.cpCustomerForm div.formSection.name > div {
        display: block;
    }

    div.cpCustomerForm div.formSection.addr {
        float: none;
    }

    div.cpCustomerForm div.formSection.phone {
        text-align: right;
    }

    #cpBody div.ui-dialog-buttonset {
        float: none;
        text-align: center;
    }

    #cpBody button.ui-button.new, #cpBody button.ui-button.delete {
        display: block;
        margin: 10px auto 4px auto;
    }

    #cpBody button.ui-button.submit, #cpBody button.ui-button.close {
        float: none;
    }

    section.zzTravelerBox section.address div.formField {
        float: none;
        width: auto;
        height: auto;
    }

    section.zzTravelerBox section.citizenship {
        display: flex;
        flex-direction: column;
    }

        section.zzTravelerBox section.citizenship div.formField {
            height: auto
        }

    section.zzTravelerBox div.zzPastPaxBox {
        float: none;
        width: auto;
        margin-top: 10px;
        order: 2
    }

    div.zzPaxForm div.formSection.name > div {
        display: block;
    }

    div.zzPaxForm div.formSection.addr1,
    div.zzPaxForm div.formSection.notSame > div,
    div.zzPaxForm div.formSection.passport > div {
        float: none;
        width: auto;
    }

    div.zzPaxForm div.zzTitleBox {
        text-align: right;
    }

        div.zzPaxForm div.zzTitleBox label {
            float: none;
        }

    div.pmsPaxFareInfo h3 {
        cursor: pointer;
    }

    div.pmsPaxFareInfo span.sectionButton {
        display: inline;
    }

    div.pmsPaxFareInfo div.items {
        display: none
    }

    div.pmsPaxFareInfo div.buttonBox > p {
        margin-left: 0;
        clear: left;
    }

    #pmPointsBox > div, #pmPointsBox > div:nth-child(3) {
        display: block;
        width: auto;
    }

    div.pmPaymentOptions > div {
        display: block;
        margin: 10px 0;
    }

    div.pmPaymentInfo2 div.deposit > div.amount,
    div.pmPaymentInfo2 div.deposit > div.dueDate {
        float: none;
    }

    div.pmCreditCardForm h3 {
        cursor: pointer;
    }

        div.pmCreditCardForm h3 span.sectionButton {
            display: inline;
        }

    div.pmCreditCardForm div.formRow {
        display: none;
    }

        div.pmCreditCardForm div.formRow input {
            max-width: 95%;
        }

        div.pmCreditCardForm div.formRow:not(.amountApplied) label {
            display: block;
        }

    div.pmCreditCardForm div.formSection.addr {
        float: none;
        width: auto;
        margin: 15px 5px 0 0;
        border-left: none;
    }

    div.pmCreditCardForm div.formSection:not(:first-child) {
        margin-top: 15px;
    }

    div.pmCreditCardForm div.formRow.amountApplied {
        margin-top: 15px;
    }

        div.pmCreditCardForm div.formRow.amountApplied > div {
            display: block;
            margin: 10px 0;
        }

    #pmSubmitBox {
        display: flex;
        flex-direction: column;
    }

        #pmSubmitBox div.button {
            float: none;
            order: 2;
            margin: 10px 0 0 0;
            text-align: center;
        }

    div.coThankYouText {
        font-size: 12px;
    }

    #coConfSection {
        display: flex;
        flex-direction: column;
    }

        #coConfSection div.panel1 {
            padding: 0 5px;
        }

        #coConfSection div.panel2 {
            float: none;
            width: auto;
            margin: 0;
            padding: 5px 0 0 0;
            border: none;
            border-top: solid 1px #cccccc;
            order: 2
        }

    #coWarningMessages {
        width: 100%;
    }

    #coTravelInsurBox p {
        display: none
    }

    #coTravelInsurBox span.sectionButton {
        display: inline;
    }

    #coHotelSection {
        padding: 0 5px;
    }

    #asTopDiv .zzPageTitle {
        display: none;
    }

    #asCriteriaMainPanel > section.top > div > span {
        display: block
    }

        #asCriteriaMainPanel > section.top > div > span > label {
            display: inline-block;
            width: 30px;
            text-align: left
        }

    #asDestination h2 {
        float: none;
        width: auto;
    }

    #asDestination ul {
        width: auto;
        margin-right: 0;
    }

    div.zzSearchCriteria2 > div:first-child {
        display: block;
    }

        div.zzSearchCriteria2 > div:first-child > span {
            display: block;
            margin: 10px 0;
        }

    div.zzSearchCriteria2 div.paxRooms div.rooms {
        float: none;
    }

    div.zzSearchCriteria2 div.paxRooms table {
        margin-right: 0;
    }

    div.zzSearchCriteria2 div.paxRooms th {
        padding: 0 5px
    }

    div.hrLeftPanel {
        float: none;
        width: auto;
    }

    main.hrMainPanel, main.trMainPanel {
        margin-right: 15px;
    }

    h3.filters {
        display: block;
    }

    .hrFiltersBox, .trFiltersBox {
        display: none;
    }

    .hdHotelListing {
        display: flex;
        flex-direction: column;
    }

        .hdHotelListing div.priceBox {
            float: none;
            margin-top: 10px;
            text-align: center;
            order: 2
        }

        .hdHotelListing div.hotelInfo {
            text-align: center;
        }

            .hdHotelListing div.hotelInfo span.stars {
                display: block
            }

            .hdHotelListing div.hotelInfo a {
                display: none
            }

    .hdHotelRoomDetails h3.collapse {
        cursor: pointer;
    }

        .hdHotelRoomDetails h3.collapse:after {
            content: '\25BC';
            float: left;
        }

    .hdHotelRoomDetails div.roomListing {
        display: flex;
        flex-direction: column;
    }

        .hdHotelRoomDetails div.roomListing div.priceBox {
            float: none;
            text-align: center;
            order: 2
        }

        .hdHotelRoomDetails div.roomListing div.roomInfo {
            margin: 0;
        }

            .hdHotelRoomDetails div.roomListing div.roomInfo > div {
                display: none;
            }

    .zzHotelSection-Room h4 span {
        display: block;
        margin: 2px 0;
    }

    .zzHotelSection-Room h4 > span label {
        display: inline-block;
        width: 30px;
    }

    .zzCreditCardForm div.formRow > span > span {
        display: block
    }
}


@media only screen and (min-width:600px) and (max-width:767px) {
    .lfSelectCriteria > div {
        float: none;
        display: inline-block;
        width: 49%;
        margin-right: 0;
    }

    #lgTopDiv div.zzCustomerForm div.formSection.addr {
        float: right;
    }

    #lgTopDiv div.zzCustomerForm div.formSection.phone {
        text-align: left;
    }
}

@media only screen and (max-width: 599px) {
    .zzPageHeader span.phone {
        font-size: .9em;
    }

    .crCruiseListing {
        padding: 4px;
    }

    .crPrices div.prices {
        font-size: 1em;
    }

    .lfButtonBox > div.button {
        width: 80%;
    }

    div.zzErrorText {
        text-align: center;
    }

    h2.cdEmailFriend {
        text-align: center;
    }

    div.cdPaxSelect div.paxType {
        display: block;
    }

    div.spaListing > div {
        float: none;
        width: auto;
    }

    div.spaListing img {
        width: 100%;
    }

    #leTabMain div.linkBox {
        float: none;
        width: auto;
        text-align: center;
    }

    #leTabMain div.media figure {
        margin: 10px 10px 0 10px;
    }

    #leTabFacts div.col1 {
        float: none;
        width: 95%;
        margin: 0 auto 5px auto;
    }

    #leTabFacts div.col2 {
        margin-right: 0;
        padding: 0;
    }

    #leTabWeather section.averages > div > div {
        display: none;
    }

    #leWeatherWidget div.current {
        float: none;
    }

        #leWeatherWidget div.current figure {
            width: 50%
        }

    #leWeatherWidget div.forecast {
        margin: 10px 0 0 0;
        clear: right
    }

    #leTabWeather section.averages > div > div > div {
        display: inline-block;
        width: 30%;
    }

    #caCategoryList div.tabs > span {
        display: block;
        width: auto;
        margin-left: 0
    }

    div.caCategoryListing {
        display: flex;
        flex-direction: column;
    }

        div.caCategoryListing div.image {
            float: none;
            width: auto;
            text-align: center
        }

            div.caCategoryListing div.image img {
                width: auto;
                max-width: 100%;
            }

                div.caCategoryListing div.image img:hover {
                    position: static;
                    width: auto
                }

        div.caCategoryListing div.priceBox {
            float: none;
            max-width: none;
        }

            div.caCategoryListing div.priceBox.air {
                width: auto;
            }

        div.caCategoryListing > h2, div.caCategoryListing div.description {
            margin-right: 0
        }

    #csMainSection > h2 > span > span {
        display: block;
    }

    #csMainSection > h2 span.cat > span {
        display: none;
    }

    div.lgLoginOption.exist div.formField span.formField {
        display: block;
    }

    div.cpCustomerForm div.button {
        text-align: center;
        padding: 0;
    }

        div.cpCustomerForm div.button a {
            float: none;
        }

        div.cpCustomerForm div.button > span {
            display: block;
            float: none;
            margin-top: 8px;
        }

    .pxSpServiceOverlay div.formField {
        float: none;
        width: auto;
    }

    .pxSpServiceOverlay div.formField1 > span {
        display: block;
        margin: 0 25px 5px 0;
    }

    div.pmPaxDetails > div {
        float: none;
        width: auto;
    }

    div.pmsPaxFareInfo div.items div.hdrRow,
    div.pmsPaxFareInfo div.items span.item {
        display: none;
    }

    div.pmsPaxFareInfo div.items div.iHdrRow,
    div.pmsPaxFareInfo div.items a.item {
        display: block;
    }

    div.pmsPaxFareInfo div.items label.price,
    div.pmsPaxFareInfo div.items span.price {
        width: 40%;
    }

    div.pmsPaxFareInfo div.items div.totalRow {
        text-align: center;
        margin-top: 10px;
    }

        div.pmsPaxFareInfo div.items div.totalRow span {
            display: inline;
            margin: 0 3px;
            vertical-align: baseline;
        }

    #pmTravelInsurBox {
        display: flex;
        flex-direction: column;
    }

    div.pmInsFormPrice {
        float: none;
        width: auto;
        border-right: none;
        border-top: solid 1px #999999;
    }

    #asCriteriaMainPanel ul {
        display: none;
        height: 200px;
    }

    #asCriteriaMainPanel span.sectionButton {
        display: inline;
    }

    #asCriteriaMainPanel section.top > div:first-child {
        float: none;
        width: auto;
        margin: 0 0 5px 0;
        padding-bottom: 5px;
        border-left: none;
        border-bottom: solid 1px #888888;
    }

    #asCriteriaMainPanel section.main h2,
    #asDestination h2 {
        background-color: #224373;
        color: white;
        padding: 2px 5px;
        cursor: pointer;
    }

    #asCriteriaMainPanel section.main > div {
        float: none;
        width: auto;
        margin-right: 0
    }

    #asDestination h2 {
        float: none;
        width: auto;
    }

    #asDestination > div {
        height: auto;
        overflow: hidden
    }

    #asDestination ul {
        columns: auto;
        -webkit-column-count: auto;
        -moz-column-count: auto;
        overflow-y: scroll
    }

    #ivMainBody {
        margin: 0 0 70px;
    }

    #ivFooter button {
        padding: 4px 15px
    }

    /*div.zzSearchCriteria2 span.ages {display:block; margin:15px 0; text-align:center;}*/
    div.zzSearchCriteria2 div.paxRooms button.zzSelectButton {
        position: static
    }

    div.zzSearchCriteria2 div.paxRooms table {
        margin-bottom: 5px;
        float: none;
    }

    div.hrHotelListing {
        display: flex;
        flex-direction: column;
    }

        div.hrHotelListing div.imageBox {
            margin: 0;
            height: auto;
            max-height: 320px;
        }

        div.hrHotelListing div.priceBox {
            float: none;
            margin: 10px 0 0 0;
            order: 3;
        }

            div.hrHotelListing div.priceBox span.price {
                font-size: 24px;
            }

    div.trTourListing {
        display: flex;
        flex-direction: column;
    }

        div.trTourListing div.imageBox {
            margin: 0;
            height: auto;
            max-height: 320px;
        }

        div.trTourListing div.priceBox {
            float: none;
            margin: 10px 0 0 0;
            order: 3;
        }

            div.trTourListing div.priceBox span.price {
                font-size: 24px;
            }

    div.hpHotelPayment section {
        margin: 15px 5px;
    }

    section.zzHotelSection-Login div.rOptions div {
        display: block;
    }

    section.zzCreditCardForm div.formRow label,
    section.zzCreditCardForm div.formRow label:first-child {
        display: block;
        margin-right: 0;
    }

    div.hcButtonBox button {
        display: block;
        margin-bottom: 10px;
    }

    #ilMainBody div.box > div {
        width: auto;
    }

    #ilMainBody div.notes {
        display: none;
    }
}

@media only screen and (max-width: 479px) {
    #dwSelectCriteria > div {
        float: none;
        width: auto;
        margin-left: 0;
    }

    div#dwDate, div#dwDays {
        float: right;
        width: 48%;
    }

    div#dwDate {
        margin-left: 4%;
    }

    div.coShareItin label {
        display: block;
    }

    #zzAddPPaxRow span {
        display: block;
        width: auto;
        margin-bottom: 5px;
    }

    .ivFormPaySegments div.segments td > span.currency {
        display: none;
    }
}

@media only screen and (max-height: 475px) {
    #dwSelectCriteria h2 {
        font-size: 13px;
    }

    #dwSelectCriteria select, #dwButtonBox {
        font-size: .9em;
    }

    #dwPort {
        display: none;
    }
}

/*************************************
ADJUSTMENTS FOR PRINTING
*/
@media print {
    nav.lfTopDiv, aside.zzAdSpace-Right {
        display: none;
    }

    #crMainBody, #crFooter, #cdMainBody, #cdFooter {
        max-width: none;
        margin-right: 0
    }
}



/* - Insurance Box New CSS- */

.pmInsFormPrice button {
    background-color: #3566b1;
    text-transform: initial;
}

.ui-widget-header .ui-icon {
    background-color: white !important;
}

.ui-dialog-titlebar button {
    background-color: white !important;
}

div.ui-dialog-titlebar {
    background: #1074b4 !important;
}

div.m_gaOverlay article {
    font: 13px verdana;
    padding: 20px 12px;
    box-shadow: 0px 0px 2px #333, inset 0px 0px 2px #333;
}

div.m_gaOverlay div.result-card__icon {
    float: right;
}

    div.m_gaOverlay div.result-card__icon img {
        width: 40px;
        margin-top: -5px;
    }

div.m_gaOverlay div.result-card__info {
    margin-right: 50px;
}

    div.m_gaOverlay div.result-card__info div.row {
        text-align: left;
        padding: 2px 0;
        overflow: hidden;
    }

        div.m_gaOverlay div.result-card__info div.row h3,
        div.m_gaOverlay div.result-card__info div.row a {
            float: right;
            margin: 0;
        }

    div.m_gaOverlay div.result-card__info span {
        font-weight: bold;
    }

div.m_gaOverlay div.result-card__contents {
    display: none;
    overflow: hidden;
    margin-top: 10px;
    padding-top: 10px;
    border-top: solid 1px #aaa;
}

article.open div.result-card__contents {
    display: flex;
}

div.m_gaOverlay div.result-card__additional-info {
    width: 90%;
    float: right;
}

    div.m_gaOverlay div.result-card__additional-info p {
        margin: 0;
    }

div.m_gaOverlay div.result-card__actions {
    display: inline-block;
    width: 10%;
    float: right;
}

article.last div.result-card__actions {
    float: left;
}

div.m_gaOverlay div.result-card__actions button {
    padding: 6px 10px;
    border: 0;
    border-radius: 5px;
    color: white;
    background-color: #094EC0;
}

.text-start {
    text-align: right !important
}

.text-end {
    text-align: left !important
}

.text-center {
    text-align: center !important
}

.p-sm-2 {
    padding: .5rem !important
}

.align-items-center {
    align-items: center !important
}

.d-flex {
    display: flex !important
}

.fw-semibold {
    font-weight: 600 !important
}

.fw-bold {
    font-weight: 700 !important
}

.mr-2 {
    margin-left: 0.5rem;
}

.text-primary {
    color: rgba(13,110,253,1) !important
}

.text-secondary {
    color: rgba(108,117,125,1) !important
}

.text-success {
    color: rgba(25,135,84,1) !important
}

.text-info {
    color: rgba(13,202,240,1) !important
}

.text-warning {
    color: rgba(255,193,7,1) !important
}

.text-danger {
    color: rgba(220,53,69,1) !important
}

.text-light {
    color: rgba(248,249,250,1) !important
}

.text-dark {
    color: rgba(33,37,41,1) !important
}

.text-black {
    color: rgba(0,0,0,1) !important
}

.text-muted {
    color: rgba(33, 37, 41, 0.75) !important
}

.zzivAmountForm {
    padding: 2rem;
    margin: 10px 0;
    border-radius: 0.25rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
}


/*.row {
    --bs-gutter-x: 1.5rem;
    --bs-gutter-y: 0;
    display: flex;
    flex-wrap: wrap;
    margin-top: calc(-1 * var(--bs-gutter-y));
    margin-right: calc(-.5 * var(--bs-gutter-x));
    margin-left: calc(-.5 * var(--bs-gutter-x))
}

    .row > * {
        flex-shrink: 0;
        width: 100%;
        max-width: 100%;
        padding-right: calc(var(--bs-gutter-x) * .5);
        padding-left: calc(var(--bs-gutter-x) * .5);
        margin-top: var(--bs-gutter-y)
    }*/

.col {
    flex: 1 0 0%
}

.row-cols-auto > * {
    flex: 0 0 auto;
    width: auto
}

.row-cols-1 > * {
    flex: 0 0 auto;
    width: 100%
}

.row-cols-2 > * {
    flex: 0 0 auto;
    width: 50%
}

.row-cols-3 > * {
    flex: 0 0 auto;
    width: 33.33333333%
}

.row-cols-4 > * {
    flex: 0 0 auto;
    width: 25%
}

.row-cols-5 > * {
    flex: 0 0 auto;
    width: 20%
}

.row-cols-6 > * {
    flex: 0 0 auto;
    width: 16.66666667%
}

.col-auto {
    flex: 0 0 auto;
    width: auto
}

.col-1 {
    flex: 0 0 auto;
    width: 8.33333333%
}

.col-2 {
    flex: 0 0 auto;
    width: 16.66666667%
}

.col-3 {
    flex: 0 0 auto;
    width: 25%
}

.col-4 {
    flex: 0 0 auto;
    width: 33.33333333%
}

.col-5 {
    flex: 0 0 auto;
    width: 41.66666667%
}

.col-6 {
    flex: 0 0 auto;
    width: 50%
}

.col-7 {
    flex: 0 0 auto;
    width: 58.33333333%
}

.col-8 {
    flex: 0 0 auto;
    width: 66.66666667%
}

.col-9 {
    flex: 0 0 auto;
    width: 75%
}

.col-10 {
    flex: 0 0 auto;
    width: 83.33333333%
}

.col-11 {
    flex: 0 0 auto;
    width: 91.66666667%
}

.col-12 {
    flex: 0 0 auto;
    width: 100%
}


/*   - Popup Style Classes Reach an Agent Button. */
.popup {
    display: none;
    position: fixed;
    top: 0px;
    margin-top: 80px;
    right: 0;
    width: 100vw;
    height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000;
}

.popup-content {
    background: white;
    padding: 30px;
    border-radius: 15px;
    width: 300px;
    margin: auto;
    position: relative;
    text-align: right;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
}

    .popup-content h2 {
        margin-top: 0;
    }

    .popup-content input {
        background-color: #f5f5f5;
        color: #4a4a4a;
        border: 1px solid #ccc;
        border-radius: 8px;
        padding: 8px;
        margin-bottom: 12px;
        width: 100%;
        box-sizing: border-box;
        font-size: 14px;
        font-family: inherit;
    }

.popup-label-title {
    font-family: 'Mukta', sans-serif;
    color: #566A7F;
    font-weight: bold;
    font-size: 18px;
    text-decoration: underline;
}

.popup-label {
    font-family: 'Mukta', sans-serif;
    color: #566A7F;
    font-weight: normal;
    font-size: 14px;
}

.popup-close {
    position: absolute;
    top: 10px;
    left: 10px;
    font-size: 20px;
    color: #333;
    cursor: pointer;
    width: 30px;
    height: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    transition: background-color 0.2s;
}

    .popup-close:hover {
        background-color: #f0f0f0;
        color: #000;
    }

.close-btn {
    position: absolute;
    top: 10px;
    left: 15px;
    font-size: 20px;
    color: #333;
    cursor: pointer;
    transition: 0.2s;
}

.send-btn {
    background-color: #007BFF;
    color: white;
    padding: 10px 20px;
    border: none;
    border-radius: 10px;
    font-size: 16px;
    cursor: pointer;
    display: inline-block;
    width: auto;
    text-align: center;
    margin: 10px auto;
}

.button-container {
    display: flex;
    justify-content: center;
    /* Centers the button container */
}

.send-btn:hover {
    background-color: #0056b3;
}

.message-container {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 20px;
}

.success-message {
    background-color: #d4edda; /* Light green for success */
    padding: 20px; /* Consistent padding */
    border-radius: 10px; /* Matches popup-content border-radius */
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.3); /* Subtle shadow */
    text-align: center; /* Center the text */
    font-family: 'Mukta', sans-serif; /* Consistent font */
    color: #155724; /* Dark green text for contrast */
    font-size: 16px; /* Readable size */
    line-height: 1.5; /* Better spacing between lines */
    position: relative; /* Allows positioning of close button if added */
    /*width: 100%;*/ /* Full width of popup-content */
    display: inline-block;
    width: auto;
    align-items: center;
}

.error-message {
    background-color: #fd9a9a; /* Light red for failure */
    padding: 20px; /* Consistent padding */
    border-radius: 10px; /* Matches popup-content border-radius */
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.3); /* Subtle shadow */
    text-align: center; /* Center the text */
    font-family: 'Mukta', sans-serif; /* Consistent font */
    color: #cc0000; /* Dark red text for contrast */
    font-size: 16px; /* Readable size */
    line-height: 1.5; /* Better spacing between lines */
    position: relative; /* Allows positioning of close button if added */
    /*width: 100%;*/ /* Full width of popup-content */
    display: inline-block;
    width: auto;
    align-items: center;
}
/* -------------------------------------------- */