/* wth_cms_wwwfrontierairlinescruises.css -- Brand styles for CMS components */
/**
* [Table of Contents]
* Custom Properties (Variables)
* Global Styles
* Buttons
* Header
* Mega Menu
* Mobile Menu
* Footer
* Uncategorized
* Javascript Dependent Styles
* Media Queries
*/

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

/******************************************************************************/
/* https://www.color-hex.com/color-names.html */
:root {
	/* Brand Palette -- if updating, copy changes to desktop_{brand}.css */
	--brand-black: #000 !important;
	--brand-green: #006643 !important;
	--brand-lightgreen: #a1d5bf !important;
	--brand-lightgray: #63757e !important;
	--brand-white: #fff !important;
	--brand-blue: #00acec !important;

	/* Brand Fonts*/
	--brand-heading-font: Montserrat, Helvetica, sans-serif !important;
	--brand-body-font: Montserrat, Helvetica, sans-serif !important;

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

	/* WTH-site-header padding set in wth_cms.css. added here for reference or to edit at the brand level */
	--WTH-site-header__content-container-padding-bottom: 1.5rem;
	--WTH-site-header__content-container-padding-left: 1rem;
	--WTH-site-header__content-container-padding-right: 1rem;
	--WTH-site-header__content-container-padding-top: 1.5rem;

	/* Brand Tokens */
	/* https://medium.com/eightshapes-llc/naming-tokens-in-design-systems-9e86c7444676 */
	/* naming convention: brand-element-variant-property-category-state */
	/* Button */
	--brand-button-background-color: var(--brand-green);
	--brand-button-border-color: var(--brand-green);
	--brand-button-border-radius: 0.188rem;
	--brand-button-box-shadow:  2px 2px 3px #aaaaaa;
	--brand-button-text-color: var(--brand-white);
	--brand-button-font-family: var(--brand-body-font);
	--brand-button-font-size: 1rem;
	--brand-button-font-weight: bold;
	--brand-button-padding-bottom: 1.063rem;
	--brand-button-padding-left: 0.5rem;
	--brand-button-padding-right: 0.5rem;
	--brand-button-padding-top: 1.063rem;
	--brand-button-text-transform: uppercase;
	--brand-button-text-shadow: 0px -1px 0px var(--brand-green);
	--brand-button-animation-transition: none;
	/* Currently unused variables
	--brand-button-border-style: ;
	--brand-button-border-width: ;
	*/

	/* Button: Hover/Focus */
	--brand-button-background-color-hover: var(--brand-lightgreen);
	--brand-button-border-color-hover: var(--brand-lightgreen);
	--brand-button-box-shadow-hover:var(--brand-button-box-shadow);
	--brand-button-text-color-hover: var(--brand-black);
	/* Currently unused variables
	--brand-button-outline-hover: ;
	--brand-button-text-decoration-hover: ;
	*/

	/* Button: Active */
	--brand-button-text-decoration-active: none;
	/* Currently unused variables
	--brand-button-background-color-active: var( );
	--brand-button-text-color-active: var( );
	*/
}

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

/**
* [Global Styles]
*/

/******************************************************************************/
header {}

header,
footer {}

header a.ui-link,
header a.ui-link:visited {}

/* reset link styles */
/******************************************************************************/

/**
* [Buttons]
*/

/******************************************************************************/
.wth4-mobile-menu-button {}

/*** Button attributes are located above in Brand Tokens section -- starting with line 41 ***/
.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 {}

/* 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 {}

.wth4-button:active,
.ui-page-theme-a .wth4-button:active,
a.wth4-button:active {}

/* button sizes */
.wth4-button--small,
.ui-page-theme-a .wth4-button--small,
a.wth4-button--small {}

/* transparent */
.wth4-button--transparent,
.wth4-button--transparent:active,
.wth4-button--transparent:focus,
.wth4-button--transparent:hover,
.wth4-button--transparent:visited,
.ui-page-theme-a .wth4-button--transparent,
.ui-page-theme-a .wth4-button--transparent:active,
.ui-page-theme-a .wth4-button--transparent:focus,
.ui-page-theme-a .wth4-button--transparent:hover,
.ui-page-theme-a .wth4-button--transparent:visited,
a.wth4-button--transparent,
a.wth4-button--transparent:active,
a.wth4-button--transparent:focus,
a.wth4-button--transparent:hover,
a.wth4-button--transparent:visited {
	--color: var(--brand-green);
}

.wth4-button--transparent:active,
.wth4-button--transparent:focus,
.wth4-button--transparent:hover,
.ui-page-theme-a .wth4-button--transparent:active,
.ui-page-theme-a .wth4-button--transparent:focus,
.ui-page-theme-a .wth4-button--transparent:hover,
a.wth4-button--transparent:active,
a.wth4-button--transparent:focus,
a.wth4-button--transparent:hover {}

/* icon button */
.wth4-button--icon,
.wth4-button--icon:visited,
.ui-page-theme-a .wth4-button--icon,
.ui-page-theme-a .wth4-button--icon:visited,
a.wth4-button--icon,
a.wth4-button--icon:visited {}

/* mini mobile icon button */
/* chained selectors are to beat styles set in wth_cms_{brand}.css */
.wth4-button.wth4-button--icon-mini,
.wth4-button.wth4-button--icon-mini:visited,
.ui-page-theme-a .wth4-button.wth4-button--icon-mini,
.ui-page-theme-a .wth4-button.wth4-button--icon-mini:visited,
a.wth4-button.wth4-button--icon-mini,
a.wth4-button.wth4-button--icon-mini:visited {}


/* header-nav */
.wth4-header-nav-button,
.wth4-header-nav-button:visited,
a.wth4-header-nav-button,
a.wth4-header-nav-button:visited {
	--border-radius: 5px;
	--color: var(--brand-green);
	--font-size: 1.125rem;
	--font-weight: bold;
	--padding-bottom: 0.375rem;
	--padding-left: 0.5rem;
	--padding-right: 0.5rem;
	--padding-top: 0.375rem;
	--text-transform: uppercase;
}

.wth4-header-nav-button:focus-visible,
.wth4-header-nav-button:focus,
.wth4-header-nav-button:hover,
a.wth4-header-nav-button:focus-visible,
a.wth4-header-nav-button:focus,
a.wth4-header-nav-button:hover {
	--background: var(--brand-green);
	--color: var(--brand-white);
}

.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-green);
	--color: var(--brand-white);
}

/* full-width */
.wth4-button--full-width-flex,
.ui-page-theme-a .wth4-button--full-width-flex,
a.wth4-button--full-width-flex {}

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

/**
* [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-top-color: var(--brand-lightgray);
	--border-top-style: solid;
	--border-top-width: 20px;
}

.wth4-site-banner {}


.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 {}

.wth4-site-banner__countdown-container {}

.wth4-site-banner__countdown-text {}

.wth4-site-banner__countdown {}

/* .timer-unit-label doesn't fit naming convention because it targets an element in timer-promo.js */
.wth4-site-banner__countdown .timer-unit-label {}

.wth4-site-header__desktop-utility-links-container {}

/* used for mobile header */
.wth4-site-header__mobile-utility-links-container,
.wth4-utility-links-container {}

.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-green);
	--font-size: 1.125rem;
	--font-weight: bold;
	--text-transform: uppercase;
}

.wth4-utility-links-container__link:hover,
a.wth4-utility-links-container__link:hover,
.ui-page-theme-a .wth4-utility-links-container__link:hover {}

.wth4-utility-links-container__link:active,
a.wth4-utility-links-container__link:active,
.ui-page-theme-a .wth4-utility-links-container__link:active {}

.ui-page-theme-a .wth4-utility-links-container__link--partner-home,
.ui-page-theme-a .wth4-utility-links-container__link--partner-home:visited,
.wth4-utility-links-container__link--partner-home,
.wth4-utility-links-container__link--partner-home:visited,
a.wth4-utility-links-container__link--partner-home,
a.wth4-utility-links-container__link--partner-home:visited {}

.ui-page-theme-a .wth4-utility-links-container__link--partner-home:focus-visible,
.ui-page-theme-a .wth4-utility-links-container__link--partner-home:focus,
.ui-page-theme-a .wth4-utility-links-container__link--partner-home:hover,
.wth4-utility-links-container__link--partner-home:focus-visible,
.wth4-utility-links-container__link--partner-home:focus,
.wth4-utility-links-container__link--partner-home:hover,
a.wth4-utility-links-container__link--partner-home:focus-visible,
a.wth4-utility-links-container__link--partner-home:focus,
a.wth4-utility-links-container__link--partner-home:hover {}

.ui-page-theme-a .wth4-utility-links-container__link--partner-home:active,
.wth4-utility-links-container__link--partner-home:active,
a.wth4-utility-links-container__link--partner-home:active {}

.wth4-utility-links-container__button-container {}

.wth4-site-header__partner-container {}

.wth4-site-header__partner-container-link-list {}

.wth4-site-header__partner-container-link,
.ui-page-theme-a .wth4-site-header__partner-container-link,
.wth4-site-header__partner-container-link:visited,
.ui-page-theme-a .wth4-site-header__partner-container-link:visited {}

.wth4-site-header__partner-container-link:hover,
.ui-page-theme-a .wth4-site-header__partner-container-link:hover {}

.wth4-site-header__partner-container-link:focus,
.ui-page-theme-a .wth4-site-header__partner-container-link:focus,
.wth4-site-header__partner-container-link:focus-visible,
.ui-page-theme-a .wth4-site-header__partner-container-link:focus-visible {}

.wth4-site-header__content-container {}

.wth4-site-header__desktop-content-container {}

.wth4-site-header__desktop-nav-container {}

.wth4-site-header__mobile-content-container {}

.wth4-site-header__mobile-partner-home-link-container {}

.wth4-site-header__mobile-partner-home-link,
a.wth4-site-header__mobile-partner-home-link,
.ui-page-theme-a a.wth4-site-header__mobile-partner-home-link,
.wth4-site-header__mobile-partner-home-link:visited,
a.wth4-site-header__mobile-partner-home-link:visited,
.ui-page-theme-a a.wth4-site-header__mobile-partner-home-link:visited {}

.wth4-site-header__booking-header-content-container {}

.wth4-site-header__booking-header-link-list-container {}

/* Where the site logo and booking engine header home link are siblings */
.wth4-site-header__logo+.wth4-site-header__booking-header-link-list-container {}

.wth4-site-header__booking-header-logo-container {}

.wth4-site-header__logo {
	width: clamp(160px, 17vw, 260px);
}

.wth4-site-header__logo-link {}

.wth4-site-header__logo-image {
	--max-width: 260px;
}

.wth4-site-header__phone-container {}

.wth4-site-header__phone-container--label-after {}

.wth4-site-header__phone-icon {}

.ui-page-theme-a .wth4-site-header__phone-link,
.wth4-site-header__phone-link,
a.wth4-site-header__phone-link {}

.wth4-site-header__phone-label {}

.wth4-site-header__phone-link:hover,
.wth4-site-header__phone-link:focus,
.wth4-site-header__phone-link:focus-visible,
.ui-page-theme-a .wth4-site-header__phone-link:hover,
.ui-page-theme-a .wth4-site-header__phone-link:focus,
.ui-page-theme-a .wth4-site-header__phone-link:focus-visible,
a.wth4-site-header__phone-link:hover,
a.wth4-site-header__phone-link:focus,
a.wth4-site-header__phone-link:focus-visible {}

.wth4-site-header__phone-link:active,
.ui-page-theme-a .wth4-site-header__phone-link:active,
a.wth4-site-header__phone-link:active {}

.wth4-site-header__phone-label {}

.wth4-site-header__list,
.wth4-mobile-menu__list {}

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

/**
* [Mega Menu]
*/

/******************************************************************************/
.wth4-mega-menu {
	margin-left: auto;
}

.wth4-mega-menu-list-container {}

/*
This element houses the entire contents of the mega menu.
The direct children are the <li> elements that contain the top-level nav buttons.
Becareful when adding styles that may propage to other ancestor elements.
*/
.wth4-mega-menu__list {}

/* this element is the link list within the mega menu content panels */
.wth4-mega-menu__link-list {}

.wth4-mega-menu-link,
a.wth4-mega-menu-link {
	--color: var(--brand-green);
}

.wth4-mega-menu-link:hover,
a.wth4-mega-menu-link:hover,
.wth4-mega-menu-link:focus,
a.wth4-mega-menu-link:focus {
	--color: #3b4e55;
	--opacity: 1;
	--text-decoration: underline;
}

.wth4-mega-menu__content-panel {
	--border-bottom-left-radius: 0;
	--border-bottom-right-radius: 0;
}

.wth4-mega-menu__marketing-placement {
	--background-color: #e8e8e8;
	--color: var(--brand-black);
	--font-family: var(--brand-heading-font);
	--font-size: clamp(1rem, 2vw, 1.5rem);
	--font-weight: bold;
	text-transform: uppercase;
}

:where(.wth4-mobile-menu__slider) .wth4-mega-menu__marketing-placement {}

.wth4-mega-menu__marketing-placement-button-container {}

.wth4-mega-menu__category-heading {
	--color: var(--brand-black);
	--font-size: 1.125rem;
	--font-weight: bold;
	--text-transform: uppercase;
}

.wth4-mega-menu__button-container {}

.wth4-mega-menu-top-level-nav-button {}

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

/**
* [Mobile Menu]
*/

/******************************************************************************/
.wth4-mobile-menu {}

.wth4-mobile-menu__content-container {}

.wth4-mobile-menu__category-heading {
	--font-family: var(--brand-heading-font);
	--text-transform: uppercase;
	--font-weight: bold;
	--color: var(--brand-black);
}

.wth4-mobile-menu__slider {}

.wth4-mobile-menu__back-button-panel {}

.wth4-mobile-menu__back-button-container {}

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

/**
* [Footer]
*/

/******************************************************************************/
/* Outer footer container */
.wth-footer-dotcms {}

/* Inner footer container */
.wth4-site-footer {}

.wth4-site-footer--booking-footer {}

.wth4-site-footer__partner-container {}

.wth4-site-footer__main-content-container {}

.wth4-site-footer__main-content {}

/* See stack layout pattern */
.wth4-site-footer__link-group>*+* {}

/* See stack layout pattern */
.wth4-site-footer__list>*+* {}

.wth4-site-footer__heading {}

.wth4-site-footer__partner-content {}

.wth4-site-footer__legal-copy {
	--color: var(--brand-black);
	--font-size: 0.688rem;
}

.wth4-site-footer__list--inline {}

.wth4-site-footer__link-group-container,
.wth4-site-footer__link-groups-container {}

.wth4-site-footer__link-groups-container--primary {}

.wth4-site-footer__link-groups-container--secondary {}

.wth4-site-footer__email-signup {}

.wth4-site-footer__logo-container {}

.wth4-site-footer__list-heading {
	--color: #454545;
	--font-size: 1.125rem;
	--font-weight: bold;
	--text-transform: uppercase;
}

.wth4-site-footer__icon-group {}

.wth4-site-footer__email-signup {}

.wth4-site-footer__email-signup-heading {}

.wth4-site-footer__email-signup-copy {}

.wth4-site-footer__email-signup-link,
.wth4-site-footer__email-signup-link:visited,
a.wth4-site-footer__email-signup-link,
a.wth4-site-footer__email-signup-link:visited {}

.wth4-site-footer__email-signup-link:focus,
.wth4-site-footer__email-signup-link:hover,
a.wth4-site-footer__email-signup-link:focus,
a.wth4-site-footer__email-signup-link:hover {}

.wth4-site-footer__icon-group-link,
a.wth4-site-footer__icon-group-link,
.wth4-site-footer__icon-group-link:visited,
a.wth4-site-footer__icon-group-link:visited {}

.wth4-site-footer__icon-group-link:hover,
a.wth4-site-footer__icon-group-link:hover,
.wth4-site-footer__icon-group-link:focus,
a.wth4-site-footer__icon-group-link:focus {}

.wth4-site-footer__icon-group-link:active,
a.wth4-site-footer__icon-group-link:active {}

.wth4-site-footer__link,
a.wth4-site-footer__link,
.wth4-site-footer__link:visited,
a.wth4-site-footer__link:visited {
	--color: var(--brand-green);
	--text-decoration: underline;
}

.wth4-site-footer__link:hover,
a.wth4-site-footer__link:hover,
.wth4-site-footer__link:focus,
a.wth4-site-footer__link:focus {
	--color: #3b4e55;
	--text-decoration-line: none;
}

.wth4-site-footer__link:active,
a.wth4-site-footer__link:active {
	--color: #576e77;
	--text-decoration: underline;
}

.wth4-site-footer__logo-container {}

.wth4-site-footer__logo-container-copy {}

.wth4-site-footer__logo-image {}

.wth4-site-footer__feature-container {}

.wth4-site-footer__feature {}

.wth4-site-footer__feature-heading {}

.wth4-site-footer__feature-icon-list {}

.wth4-site-footer__feature-icon-list-item {}

.wth4-site-footer__feature-copy {}

.wth4-site-footer__feature-link,
a.wth4-site-footer__feature-link,
.ui-page-theme-a .wth4-site-footer__feature-link,
.wth4-site-footer__feature-link:visited,
a.wth4-site-footer__feature-link:visited,
.ui-page-theme-a .wth4-site-footer__feature-link:visited {}

.wth4-site-footer__feature-image {}

.wth4-site-footer__phone-container {}

.wth4-site-footer__phone-link,
.wth4-site-footer__phone-link:visited,
.ui-page-theme-a .wth4-site-footer__phone-link,
.ui-page-theme-a .wwth4-site-footer__phone-link:visited,
a.wth4-site-footer__phone-link,
a.wth4-site-footer__phone-link {}

.wth4-site-footer__phone-link:hover,
.wth4-site-footer__phone-link:focus,
.wth4-site-footer__phone-link:focus-visible,
.ui-page-theme-a .wth4-site-footer__phone-link:hover,
.ui-page-theme-a .wth4-site-footer__phone-link:focus,
.ui-page-theme-a .wth4-site-footer__phone-link:focus-visible,
a.wth4-site-footer__phone-link:hover,
a.wth4-site-footer__phone-link:focus,
a.wth4-site-footer__phone-link:focus-visible {}

.wth4-site-footer__phone-link:active,
.ui-page-theme-a .wth4-site-footer__phone-link:active,
a.wth4-site-footer__phone-link:active {}


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

/**
* [Uncategorized]
*/

/******************************************************************************/
.wth4-divider {
	--border-color: var(--brand-black);
}

.wth4-vertical-divider {}

.wth4-svg-icon {}

.wth4-img-icon {}

.wth4-icon-link-container {}

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

/**
* [Javascript Dependent Styles]
*/

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

.js-mobile-menu {}

.js-mobile-menu--open {}

.js-slider {}

.js-slider--open {}

.js-slider--closed {}

.js-mobile-menu__back-button-panel {}

.js-mobile-menu__back-button-panel--open {}

.js-mega-menu__content-panel {}

.js-mega-menu__content-panel--open {}


/******************************************************************************/
/* Media Queries */

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

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

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

@media (min-width: 1200px) {
	.wth4-mega-menu__content-panel {
		--left: 50%;
		--max-width: fit-content;
		--transform: translateX(-50%);	}
}

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