/* Font family variations
    ************************* */
/*Brand icons with "by Marriott". These brand Icons are used in uni nav brand portfolio card, search results, brand filters,favs page*/
/*These font icons are ONLY used in the brand ribbon.*/
/* Language Specific Font Variables
   ***********************************/
:root {
  --t-base-font-family: Swiss-721;
}

:lang(pl),
:lang(vi) {
  --t-base-font-family: UniversNextW1G,Helvetica,Arial,sans-serif;
  --t-font-family: UniversNextW1G,Helvetica,Arial,sans-serif;
}

:lang(ar-AE),
:lang(ar) {
  --t-base-font-family: JannaLT;
  --t-font-family: JannaLT;
}

/* Font size variations
    *********************** */
/* Line Height palette
    **************** */
/* Font weight variations
    ************************* */
/* Font Style variation
    ************************* */
/* Icons palette
***************** */
/* Portfolio Brand Icons
******************** */
/* Brand Logo Icons palette
******************** */
/* Marriott Bonvoy Escape icons
******************** */
/* Box Shadow variations
    ************************ */
/*****************************************************************************************
Name - master-config
Description - All the contextual global variables (brandable elements) used across the site should be defined here.
These variables can be overwritten from brand configs.
******************************************************************************************/
/*base styles*/
/* Eyebrow style */
/*typography*/
/* buttons styles*/
/*Button CheckBox*/
/*link styles*/
/* tertiary link */
/*nav link */
/* link icon styles */
/* action link styles */
/* icon button styles */
/* gallery button styles*/
/* filter button styles*/
/***
Header Styles
**/
/*icon variables*/
/*$icon-color-inverse-alt: TBD !default;*/
/*$icon-color-decorative-alt: TBD !default;*/
/*forms*/
/* Standard Tab Styles */
/* Switcher Tab Styles */
/* Dropdown styles */
/* Spinner styles */
/* Badge tokens */
/*Progress Tracker*/
/* ratings */
.trc-micro-interaction-v2 .m-button-primary, .trc-micro-interaction-v2 .m-button-secondary, .trc-micro-interaction-v2 .m-button-primary:hover, .trc-micro-interaction-v2 .m-button-secondary:hover {
  transition: all 1.2s !important;
}
.trc-micro-interaction-v2 .player-animation {
  transition: border-radius 1s, transform 1s, background-color 1s;
}
.trc-micro-interaction-v2 .player-animation__text {
  transition: transform 1s, color 1s;
}
.trc-micro-interaction-v2 .player-animation:hover {
  background-color: #ffffff !important;
  transform: rotate(90deg);
}
.trc-micro-interaction-v2 .player-animation:hover .player-animation__text {
  color: #1c1c1c;
  transform: rotate(-90deg);
}
.trc-micro-interaction-v2 .carousel-player-animation-wrapper .player-animation:hover {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) rotate(90deg) !important;
}
.trc-micro-interaction-v2 .v2-animation-controls .glide__arrow--left {
  color: inherit;
  opacity: 1;
  transition: opacity 1s;
}
.trc-micro-interaction-v2 .v2-animation-controls .glide__arrow--left:after {
  color: inherit;
}
.trc-micro-interaction-v2 .v2-animation-controls .glide__arrow--left:hover:after {
  text-decoration: none;
}
.trc-micro-interaction-v2 .v2-animation-controls .glide__arrow--left .icon-arrow-left {
  width: 30px;
  height: 30px;
  position: relative;
  color: inherit;
}
.trc-micro-interaction-v2 .v2-animation-controls .glide__arrow--left .icon-arrow-left:before {
  position: absolute;
  top: 4px;
  left: -5px;
  transition: left 1s ease-in-out;
  color: inherit;
}
.trc-micro-interaction-v2 .v2-animation-controls .glide__arrow--right {
  color: inherit;
  opacity: 1;
  transition: opacity 1s;
}
.trc-micro-interaction-v2 .v2-animation-controls .glide__arrow--right:before {
  color: inherit;
}
.trc-micro-interaction-v2 .v2-animation-controls .glide__arrow--right:hover:before {
  text-decoration: none;
}
.trc-micro-interaction-v2 .v2-animation-controls .glide__arrow--right .icon-arrow-right {
  width: 30px;
  height: 30px;
  position: relative;
  color: inherit;
}
.trc-micro-interaction-v2 .v2-animation-controls .glide__arrow--right .icon-arrow-right:before {
  position: absolute;
  top: 4px;
  right: -5px;
  transition: right 1s ease-in-out;
  color: inherit;
}
.trc-micro-interaction-v2 .v2-control-animation-start .v2-animation-controls .carouselControlType2 .temp-active:after {
  content: "";
  background-color: var(--t-accent-color);
  border-radius: 0;
  height: 0.3125rem;
  margin: 0;
  top: -0.125rem;
  left: 0;
  right: unset;
  transform: none;
  width: 100%;
  animation: v2BulletAfter 1s;
}
.trc-micro-interaction-v2 .v2-control-animation-start .v2-animation-controls .carouselControlType2 .temp-active.temp-active-rev:after {
  left: unset;
  right: 0;
}
.trc-micro-interaction-v2 .v2-control-animation-start .v2-animation-controls .carouselControlType2 .last-active:after {
  width: 0;
  left: unset;
  right: 0;
  background-color: var(--t-accent-color);
  animation: v2BulletBefore 1s;
}
.trc-micro-interaction-v2 .v2-control-animation-start .v2-animation-controls .carouselControlType2 .last-active.last-active-rev:after {
  left: 0;
  right: unset;
}
@keyframes v2BulletAfter {
  0% {
    width: 0;
  }
  25% {
    width: 25%;
  }
  50% {
    width: 50%;
  }
  70% {
    width: 75%;
  }
  100% {
    width: 100%;
  }
}
@keyframes v2BulletBefore {
  0% {
    width: 100%;
  }
  25% {
    width: 75%;
  }
  50% {
    width: 50%;
  }
  70% {
    width: 25%;
  }
  100% {
    width: 0;
  }
}
@media (hover: hover) {
  .trc-micro-interaction-v2 .v2-animation-controls .glide__arrow--left:hover {
    opacity: 0.2;
  }
  .trc-micro-interaction-v2 .v2-animation-controls .glide__arrow--left:hover:after {
    text-decoration: none;
  }
  .trc-micro-interaction-v2 .v2-animation-controls .glide__arrow--left:hover .icon-arrow-left:before {
    left: 0px;
  }
  .trc-micro-interaction-v2 .v2-animation-controls .glide__arrow--right:hover {
    opacity: 0.4;
  }
  .trc-micro-interaction-v2 .v2-animation-controls .glide__arrow--right:hover:before {
    text-decoration: none;
  }
  .trc-micro-interaction-v2 .v2-animation-controls .glide__arrow--right:hover .icon-arrow-right:before {
    right: 0px;
  }
}
