/* wth_cms_wwwcruises.css -- Brand styles for CMS components */
/**
* [Table of Contents]
* Custom Properties (Variables)
* Buttons
* Header
* Mega Menu
* Footer
* Account Popup
* Uncategorized
* Media Queries
*/

/**
* [Custom Properties (Variables)]
*/

/******************************************************************************/
/* https://www.color-hex.com/color-names.html */
:root {
	/* Brand Palette -- if updating, copy changes to desktop_w.css */
	--BRAND-black: #000 !important;
	--BRAND-gray20: #333 !important;
	--BRAND-gray51: #828282 !important;
	--BRAND-gray87: #dedede !important;
	--BRAND-lightblue: #63acff !important;
	--BRAND-navy: #032559 !important;
	--BRAND-orange: #f2561d !important;
	--BRAND-purple: #460ecf !important;
	--BRAND-white: #fff !important;
	--BRAND-yellow: #f0a227 !important;

	--BRAND-heading-font: 'Josefin Sans', sans-serif;
	--BRAND-body-font: 'Open Sans', sans-serif;

	/* site setup  */
	--WTH-site-max-width: 1504px;

	--WTH-site-header__content-container-padding-bottom: 1rem;
	--WTH-site-header__content-container-padding-left: 1rem;
	--WTH-site-header__content-container-padding-right: 1rem;
	--WTH-site-header__content-container-padding-top: 1rem;
}

/******************************************************************************/

/**
* [Buttons]
*/

/******************************************************************************/
.wth4-button,
.wth4-button:visited,
.ui-page-theme-a .wth4-button,
.ui-page-theme-a .wth4-button:visited,
a.wth4-button,
a.wth4-button:visited {
	--background: var(--BRAND-yellow);
	--border-color: var(--BRAND-yellow);
	--border-radius: 16px;
	--padding-bottom: 1rem;
	--padding-left: 2rem;
	--padding-right: 2rem;
	--padding-top: 1rem;
}

/* button states */
.wth4-button:hover,
.wth4-button:focus,
.wth4-button:focus-visible,
.ui-page-theme-a .wth4-button:hover,
.ui-page-theme-a .wth4-button:focus,
.ui-page-theme-a .wth4-button:focus-visible,
a.wth4-button:hover,
a.wth4-button:focus,
a.wth4-button:focus-visible {
	--background: var(--BRAND-purple);
	--border-color: var(--BRAND-purple);
}

.wth4-button:active,
.ui-page-theme-a .wth4-button:active,
a.wth4-button:active {
	--background: var(--BRAND-orange);
	--border-color: var(--BRAND-orange);
}

/* mini circle icon button */
.wth4-button.wth4-button--icon-mini-circle,
.wth4-button.wth4-button--icon-mini-circle:visited,
.ui-page-theme-a .wth4-button.wth4-button--icon-mini-circle,
.ui-page-theme-a .wth4-button.wth4-button--icon-mini-circle:visited,
.ui-overlay-a .wth4-button.wth4-button--icon-mini-circle,
.ui-overlay-a .wth4-button.wth4-button--icon-mini-circle:visited,
a.wth4-button.wth4-button--icon-mini-circle,
a.wth4-button.wth4-button--icon-mini-circle:visited {
	--color: var(--BRAND-black);
}

.wth4-button.wth4-button--icon-mini-circle:hover,
.wth4-button.wth4-button--icon-mini-circle:focus,
.wth4-button.wth4-button--icon-mini-circle:focus-visible,
.ui-page-theme-a .wth4-button.wth4-button--icon-mini-circle:hover,
.ui-page-theme-a .wth4-button.wth4-button--icon-mini-circle:focus,
.ui-page-theme-a .wth4-button.wth4-button--icon-mini-circle:focus-visible,
.ui-overlay-a .wth4-button.wth4-button--icon-mini-circle:hover,
.ui-overlay-a .wth4-button.wth4-button--icon-mini-circle:focus,
.ui-overlay-a .wth4-button.wth4-button--icon-mini-circle:focus-visible,
a.wth4-button.wth4-button--icon-mini-circle:hover,
a.wth4-button.wth4-button--icon-mini-circle:focus,
a.wth4-button.wth4-button--icon-mini-circle:focus-visible {
	--color: var(--BRAND-black);
}

.ui-overlay-a .wth4-button.wth4-button--icon-mini-circle:active,
.ui-overlay-a .wth4-button.wth4-button--icon-mini-circle.wth4-JS-account-button--active,
.ui-page-theme-a .wth4-button.wth4-button--icon-mini-circle:active,
.ui-page-theme-a .wth4-button.wth4-button--icon-mini-circle.wth4-JS-account-button--active,
.wth4-button.wth4-button--icon-mini-circle:active,
.wth4-button.wth4-button--icon-mini-circle.wth4-JS-account-button--active,
a.wth4-button.wth4-button--icon-mini-circle:active,
a.wth4-button.wth4-button--icon-mini-circle.wth4-JS-account-button--active {
	--border-color: var(--BRAND-yellow);
	--color: var(--BRAND-yellow);
}

/* header-nav */
.wth4-header-nav-button,
.wth4-header-nav-button:visited,
a.wth4-header-nav-button,
a.wth4-header-nav-button:visited {
	--font-family: var(--BRAND-heading-font);
	--padding-left: 2rem;
	--padding-right: 2rem;
}

.js-button-top-nav--active,
.js-button-top-nav--active:focus,
.js-button-top-nav--active:hover,
.wth4-header-nav-button:active,
a.wth4-header-nav-button:active {
	--background: var(--BRAND-navy);
	--color: var(--BRAND-white);
}

/******************************************************************************/

/**
* [Header]
*/

/******************************************************************************/
/* IMPORTANT: position of the mobile menu is based on the size
and position of the header element. Any changes to margin, padding,
etc. of the header element will affect the position mobile menu.
Be sure to test the mobile menu on all screen sizes after making changes.
*/
.wth4-site-header {
	--border-bottom-color: var(--BRAND-gray87);
	--border-bottom-style: solid;
	--border-bottom-width: 1px;
	--font-family: var(--BRAND-heading-font);
}

.wth4-site-banner {
	--background-color: var(--BRAND-yellow);
	--font-size: clamp(0.875rem, 2.5vw, 1rem);
	--margin-bottom: 0;
}

.wth4-site-banner__link-container {}

.wth4-site-banner__link,
a.wth4-site-banner__link,
.ui-page-theme-a a.wth4-site-banner__link,
.wth4-site-banner__link:visited,
a.wth4-site-banner__link:visited,
.ui-page-theme-a a.wth4-site-banner__link:visited {
	--color: var(--BRAND-navy);
	--font-size: clamp(0.875rem, 2.5vw, 1rem);
}

.wth4-site-banner__countdown-container {
	--color: var(--BRAND-navy);
}

.wth4-utility-links-container__link,
a.wth4-utility-links-container__link,
.ui-page-theme-a .wth4-utility-links-container__link,
.wth4-utility-links-container__link:visited,
a.wth4-utility-links-container__link:visited,
.ui-page-theme-a .wth4-utility-links-container__link:visited {
	--color: var(--BRAND-black);
	--font-size: 1rem;
}

.wth4-utility-links-container__link:hover,
a.wth4-utility-links-container__link:hover,
.ui-page-theme-a .wth4-utility-links-container__link:hover {
	color: var(--BRAND-gray51);
}

.wth4-utility-links-container__link:active,
a.wth4-utility-links-container__link:active,
.ui-page-theme-a .wth4-utility-links-container__link:active {
	--color: var(--BRAND-black)
}

.wth4-site-header__booking-header-content-container {
	--align-items: center;
	--padding-bottom: 1.25rem;
	--padding-top: 1.25rem;
}

/******************************************************************************/

/**
* [Mega Menu]
*/

/******************************************************************************/

.wth4-mega-menu-link,
a.wth4-mega-menu-link {
	--font-size: 1rem;
}

.wth4-mega-menu-link:hover,
a.wth4-mega-menu-link:hover,
.wth4-mega-menu-link:focus,
a.wth4-mega-menu-link:focus {
	--text-decoration: none;
}

.wth4-mega-menu__marketing-placement {
	--background-color: var(--VTL-mega-menu__banner-background-color, #022759A3);
	--background-image: var(--VTL-mega-menu__banner-background-image, url(/images_unique/megamenu/img/marketing_banner_background.jpg));
	--font-size: clamp(1rem, 2vw, 1.3rem);
}

.wth4-mega-menu__category-heading {
	--font-size: 1rem;
	--font-weight: 600;
	--text-transform: uppercase;
}

/******************************************************************************/

/**
* [Footer]
*/

/******************************************************************************/

/* Inner footer container */
.wth4-site-footer {
	--border-top-color: var(--BRAND-gray87);
	--border-top-style: solid;
	--border-top-width: 1px;
	--font-family: var(--BRAND-heading-font);
	--font-size: 1rem;
}

.wth4-site-footer__main-content-container {
	--background-color: var(--BRAND-white);
}

.wth4-site-footer__main-content {
	--border-top-style: none;
	--line-height: 1.5;
	--max-width: 1500px;
	--padding-top: 2rem;
}

.wth4-site-footer__legal-copy {
	--grid-row-start: 3;
	--font-size: 0.75rem;
	--border-top-style: none;
}

.wth4-site-footer__list--inline {
	--flex-direction: column;
}

.wth4-site-footer__link-groups-container--secondary {
	--justify-content: start;
}

.wth4-site-footer__list-heading {
	--font-size: 1rem;
	--font-weight: 600;
	--text-transform: uppercase;
	--white-space: nowrap;
}

.wth4-site-footer__icon-group {
	--font-size: 1.3rem;
}

.wth4-site-footer__email-signup-link:hover,
a.wth4-site-footer__email-signup-link:hover {
	--text-decoration: none;
}

.wth4-site-footer__link,
a.wth4-site-footer__link,
.wth4-site-footer__link:visited,
a.wth4-site-footer__link:visited {}

.wth4-site-footer__link:hover,
a.wth4-site-footer__link:hover,
.wth4-site-footer__link:focus,
a.wth4-site-footer__link:focus {
	--color: var(--WTH-gray51);
}

.wth4-site-footer__link:active,
a.wth4-site-footer__link:active {}

/******************************************************************************/

/**
* [Account Popup]
*/

/******************************************************************************/
.wth4-account-popup { }

.wth4-account-popup__heading { }

.wth4-account-popup__list-item { }

.wth4-account-popup__list-item i {
	--color: var(--BRAND-lightblue);
}

/******************************************************************************/

/**
* [Uncategorized]
*/

/******************************************************************************/
.wth4-divider {
	--border-color: var(--BRAND-yellow);
}

.wth4-vertical-divider {
	--border-color: var(--BRAND-gray87);
	--height: 2rem;
}

/******************************************************************************/

/**
/* [Media Queries]
*/

/******************************************************************************/
@media (min-width: 576px) {}

@media (min-width: 768px) {

	.wth4-site-footer__main-content,
	.wth4-site-footer__partner-content {
		--grid-template-columns: 45% 1fr;
	}

	.wth4-site-footer__legal-copy {
		--grid-column-end: -1;
		--grid-column-start: 1;
		--grid-row-start: 4;
	}

	.wth4-site-footer__list--inline {
		--flex-direction: row;
	}

	.wth4-site-footer__list-item--inline {
		--border-right-style: none;
		--padding-left: 0;
		--padding-right: 0;
	}

}

@media (min-width: 992px) {
	:root {
		--WTH-site-header__content-container-padding-bottom: 0;
		--WTH-site-header__content-container-padding-top: 0
	}

	.wth4-vertical-divider {
		--border-color: var(--BRAND-black);
		--height: 1rem;
	}

	.wth4-site-footer__legal-copy {
		--grid-column-end: 2;
		--grid-column-start: 1;
		--grid-row-start: 3;
	}

	.wth4-site-footer__link-groups-container--secondary {
		--grid-column-start: 2;
		--grid-row-start: 3;
		--justify-content: end;
	}
}

@media (min-width: 1200px) {

	.wth4-site-footer__link-groups-container--primary {
		--grid-column-start: 2;
		--grid-row-start: 1;
		margin-top: 1rem;
	}

	.wth4-site-footer__link-groups-container--secondary {
		--grid-column-start: 2;
		--grid-row-start: 2;
	}

	.wth4-site-footer__legal-copy {
		--grid-row-start: 2;
	}

	.wth4-site-footer__email-signup {
		--grid-column-end: 2;
	}
}

@media (min-width: 1600px) {}