@charset "UTF-8";
/*! Choate Rosemary Hall - Redesign 2021
	https://www.choate.edu/
	Developer: Todd Jaser 
	webmaster@choate.edu 
*/
/* Stylesheet to amend/override Finalsite styles */
/* CSS Custom Properties (variables) */
:root {
  --spacing: 2rem;
  --black: #00152c;
  --letter-spacing: 1.8px;
}

/* COLORS */
/* Background colors */
.bg-primary {
  background-color: var(--primary-color);
}

.bg-primary-accent {
  background-color: var(--primary-accent);
}

.bg-secondary {
  background-color: var(--secondary-color);
}

.bg-secondary-accent {
  background-color: var(--secondary-accent);
}

.bg-success {
  background-color: var(--success-color);
}

.bg-warning {
  background-color: var(--warning-color);
}

.bg-alert,
.bg-danger {
  background-color: var(--alert-color);
}

.bg-info {
  background-color: var(--light-gray);
}

.bg-white {
  background-color: var(--white);
}

.bg-black {
  background-color: var(--black);
}

.bg-light-gray {
  background-color: var(--light-gray);
}

.bg-medium-gray {
  background-color: var(--medium-gray);
}

.bg-dark-gray {
  background-color: var(--dark-gray);
}

/* Text colors */
.color-primary,
.primary-color {
  color: var(--primary-color);
}

.primary-accent {
  color: var(--primary-accent);
}

.color-secondary,
.secondary-color {
  color: var(--secondary-color);
}

.text-black,
.black {
  color: var(--black);
}

.text-white,
.white {
  color: var(--white);
}

.text-success,
.text--success {
  color: var(--success-color);
}

.text-warning,
.text--warning {
  color: var(--warning-color);
}

.text-alert,
.text--alert {
  color: var(--alert-color);
}

/* Utility classes */
.clearfix::after,
.fs_style_125 {
  content: "";
  clear: both;
  display: block;
}

/* Spacing Utilities (margin & padding) */
.margin-0,
.m-0 {
  margin: 0 !important;
}

.padding-0,
.p-0 {
  padding: 0 !important;
}

.noBorder,
.no-border,
.border-none {
  border: 0 !important;
}

table.border-none td {
  border: 0 !important;
}

/* Display flex from both Foundation & Bootstrap */
.flex-container,
.d-flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.align-center {
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.align-middle {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

/* Preserve video ratio. Add the class below to the containing element (div). 
Source: https://css-tricks.com/fluid-width-video/ */
.flex-video {
  position: relative;
  padding-bottom: 56.25%;
  /* 16:9 */
  height: 0;
}

.flex-video iframe,
.flex-video embed,
.flex-video object {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

body.fsComposeMode .hide,
body.fsComposeMode .fsEmbed {
  position: relative;
  border: 3px dashed red !important;
}
body.fsComposeMode .hide::before,
body.fsComposeMode .fsEmbed::before {
  position: absolute;
  top: -21px;
  left: 0;
  font-size: 1rem;
  color: red;
}

.fsComposeMode .fsEmbed::before {
  content: "Element title hidden on front end";
}

.fsComposeMode .hide::before {
  content: "Hidden on front end";
}

/* Embed Element: Hide title from front-end to more clearly edit on backend. */
/* Reset box model */
.fsEmbed,
.fsEmbed > * {
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
}

/* Hide these only on the front end... */
body:not(.fsComposeMode) .hide,
body:not(.fsComposeMode) .fsEmbed .fsElementTitle {
  display: none;
}

/* body:not(.fsComposeMode) .hide,
body:not(.fsComposeMode) .fsEmbed {
	display: none;
} */
/* Print class to hide from screen */
/* .print-only, .hide-for-print {
	display: none;
} */
/* Add an obvious "Test Page" overlay */
.testPage {
  border: 10px solid red;
}
.testPage::before {
  z-index: 1000;
  opacity: 0.3;
  position: fixed;
  -webkit-transform: rotateZ(-90deg) translateX(-280px);
      -ms-transform: rotate(-90deg) translateX(-280px);
          transform: rotateZ(-90deg) translateX(-280px);
  -webkit-transform-origin: top left;
      -ms-transform-origin: top left;
          transform-origin: top left;
  content: "TEST PAGE";
  font-family: var(--sans);
  font-size: 2.5rem;
  font-weight: bold;
  line-height: 1;
  color: red;
}

/* Arrow pseudo-elements */
/* Down arrow */
.arrow-down {
  display: block;
  width: 0;
  height: 0;
  content: "";
  border: inset 0.7rem;
  border-bottom-width: 0;
  border-top-style: solid;
  border-color: #0a0a0a transparent transparent;
}

/* .responsiveTableWrapper {
	position: relative;
	overflow-x: auto;
	box-shadow: inset -10px 0 10px #fff;

	&::after {
		position: absolute;
		right: 0;
		width: 100%;
		height: 100%;
		background: linear-gradient(90deg, rgba(255, 255, 255, 0) 93%, rgb(255, 255, 255) 100%);
	}
} */
/* Effects classes */
.boxShadow,
.box-shadow {
  -webkit-box-shadow: 0 4px 8px rgba(180, 180, 180, 0.5);
          box-shadow: 0 4px 8px rgba(180, 180, 180, 0.5);
}

.textShadow,
.text-shadow {
  text-shadow: -1px 1px 1px rgba(0, 0, 0, 0.3);
}

.gradient-primary,
.gradient-blue,
.fs_style_122 {
  background: -o-radial-gradient(20%, circle, var(--primary-accent), var(--primary-color) 50%);
  background: radial-gradient(circle at 20%, var(--primary-accent), var(--primary-color) 50%);
}
.gradient-primary :is(p,
span,
h2,
h3,
h4,
h5,
h6),
.gradient-blue :is(p,
span,
h2,
h3,
h4,
h5,
h6),
.fs_style_122 :is(p,
span,
h2,
h3,
h4,
h5,
h6) {
  color: var(--white);
}

.gradient-secondary,
.gradient-gold,
.fs_style_123 {
  background: -o-radial-gradient(20%, circle, var(--secondary-accent), var(--secondary-color) 50%);
  background: radial-gradient(circle at 20%, var(--secondary-accent), var(--secondary-color) 50%); /* :is(p,
	span,
	h2,
	h3,
	h4,
	h5,
	h6) {
	color: var(--primary-color);
} */
}

.text-gradient--gold,
.fs_style_121 {
  background: -o-radial-gradient(20%, circle, var(--secondary-accent), var(--secondary-color) 50%);
  background: radial-gradient(circle at 20%, var(--secondary-accent), var(--secondary-color) 50%);
  -webkit-background-clip: text;
          background-clip: text;
  -webkit-text-fill-color: transparent;
}

.text-gradient--blue,
.fs_style_120 {
  background: -o-radial-gradient(20%, circle, var(--primary-accent), var(--primary-color) 50%);
  background: radial-gradient(circle at 20%, var(--primary-accent), var(--primary-color) 50%);
  -webkit-background-clip: text;
          background-clip: text;
  -webkit-text-fill-color: transparent;
}

/* TOOLTIPS START */
.tooltip {
  position: relative;
  /* making the .tooltip span a container for the tooltip text */
  border-bottom: 1px dashed var(--primary-accent);
  /* little indicater to indicate it's hoverable */
  /* Tooltip arrows */
}
.tooltip::before {
  content: attr(data-text);
  /* here's the magic */
  position: absolute;
  /* vertically center */
  top: 50%;
  -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
          transform: translateY(-50%);
  /* move to right */
  left: 100%;
  margin-left: 15px;
  /* and add a small left margin */
  /* basic styles */
  width: 200px;
  padding: 10px;
  border-radius: 5px;
  background: var(--black);
  font-size: 90%;
  font-family: var(--sans);
  color: var(--white);
  text-align: center;
}
.tooltip::after {
  content: "";
  position: absolute;
  /* position tooltip correctly */
  left: 100%;
  margin-left: -5px;
  /* vertically center */
  top: 50%;
  -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
          transform: translateY(-50%);
  /* the arrow */
  border: 10px solid var(--black);
  border-color: transparent var(--black) transparent transparent;
}
.tooltip::before, .tooltip::after {
  /* animation */
  opacity: 0;
  -webkit-transition: 0.3s opacity;
  -o-transition: 0.3s opacity;
  transition: 0.3s opacity;
}
.tooltip:hover:before, .tooltip:hover:after {
  display: block;
  opacity: 1;
}

/* TOOLTIPS END */
/* Icon styles using pseudo-elements */
/* Styles for Font Awesome icon: 
https://fontawesome.com/how-to-use/on-the-web/advanced/css-pseudo-elements */
/* Exclude these styles in Finalsite's Composer mode, which causes unexpected icon rendering in WYSIWYGs. Only apply to content inside the main page body (exclude header, nav, footer, etc.) */
/* BEGIN pseudo-element icon styles */
body:not(.fsComposeMode):not(.home) .fsPageBody {
  /* Common properties declaration. All required to make icons render reliably. Include any additional here.  

  	—The :is pseudo-class function keeps the CSS compact by not having to append the parent selectors for each. NOTE: Requires deprecated pseudo-class :any with certain Webkit. See docs: https://developer.mozilla.org/en-US/docs/Web/CSS/:is 
  	—The :not pseudo-class excludes icons, nav items, etc.
  */
  /* Note: Make sure to include the correct weight and unicode value for the icon */
}
body:not(.fsComposeMode):not(.home) .fsPageBody :is(.icon,
a[href^=mailto],
a[href*=".pdf"],
a[data-resource-type=Pdf i],
a[data-file-name$=pdf],
a[href^=http][target*=blank],
a[href^="/"][target*=blank]):not(.fsSharingLink):not(.fs_style_96):not(.fs_style_68)::after {
  display: inline-block;
  padding-left: 0.2em;
  font-family: "Font Awesome 5 Pro";
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  color: rgba(168, 168, 168, 0.8);
  -webkit-font-smoothing: antialiased;
}
body:not(.fsComposeMode):not(.home) .fsPageBody .no-icon {
  display: inherit;
  padding-left: inherit;
  font-family: inherit;
  font-style: inherit;
  font-variant: inherit;
  text-rendering: inherit;
}
body:not(.fsComposeMode):not(.home) .fsPageBody .no-icon::after {
  content: inherit !important;
  font-weight: inherit !important;
}
body:not(.fsComposeMode):not(.home) .fsPageBody .fsSharingLink::after,
body:not(.fsComposeMode):not(.home) .fsPageBody [title=Email]::after,
body:not(.fsComposeMode):not(.home) .fsPageBody .fsPrintButton::after,
body:not(.fsComposeMode):not(.home) .fsPageBody .nav-social a::after,
body:not(.fsComposeMode):not(.home) .fsPageBody .icon-cta a::after,
body:not(.fsComposeMode):not(.home) .fsPageBody .fsLiveMode .widen-your-world > footer .fsElementFooterContent a::after {
  content: normal !important;
  font-weight: inherit !important;
}
body:not(.fsComposeMode):not(.home) .fsPageBody .icon-external-link::after,
body:not(.fsComposeMode):not(.home) .fsPageBody a[href^=http][target*=blank]:not(.fs_style_96):not(.fs_style_68)::after,
body:not(.fsComposeMode):not(.home) .fsPageBody a[href^="/"][target*=blank]:not(.fs_style_96):not(.fs_style_68)::after {
  font-weight: 900;
  content: "\f35d";
  font-size: 80%;
}
body:not(.fsComposeMode):not(.home) .fsPageBody .icon-email:not(.fs_style_96):not(.fs_style_68)::after,
body:not(.fsComposeMode):not(.home) .fsPageBody a[href^=mailto]:not(.fs_style_96):not(.fs_style_68)::after {
  font-weight: 400;
  content: "\f0e0";
}
body:not(.fsComposeMode):not(.home) .fsPageBody .icon-pdf:not(.fs_style_96):not(.fs_style_68)::after,
body:not(.fsComposeMode):not(.home) .fsPageBody a[href*=".pdf"]:not(.fs_style_96):not(.fs_style_68)::after,
body:not(.fsComposeMode):not(.home) .fsPageBody a[data-resource-type=Pdf i]:not(.fs_style_96):not(.fs_style_68)::after,
body:not(.fsComposeMode):not(.home) .fsPageBody a[data-file-name$=pdf]:not(.fs_style_96):not(.fs_style_68)::after {
  font-weight: 400 !important;
  content: "\f1c1" !important;
}
body:not(.fsComposeMode):not(.home) .fsPageBody .icon-visited::after,
body:not(.fsComposeMode):not(.home) .fsPageBody a:visited::after {
  font-weight: 400;
  content: "\f00c" !important;
}

/* END pseudo-element icon styles */
/* Things to hide. */
.juicer-feed .j-filters.filters,
#fsPoweredByFinalsite {
  display: none !important;
}

/* TYPOGRAPHY */
body {
  color: var(--black);
  -webkit-font-smoothing: antialiased;
}

h1,
h2,
h3,
h4,
h5,
h6,
p {
  margin-top: 0;
}

h1,
.h1,
h2,
.h2,
h3,
.h3,
h4,
.h4,
h5,
.h5,
h6,
.h6 {
  margin-bottom: 1rem;
  font-family: var(--serif);
  line-height: 1.1;
  text-rendering: optimizeLegibility;
}

h1,
.h1 {
  font-size: 2.4rem;
}
h1.alt,
.h1.alt {
  font-family: var(--sans);
  font-weight: 600;
}

h2,
.h2 {
  font-size: 2rem;
}

h3,
.h3 {
  font-size: 1.7rem;
}

h4,
.h4 {
  font-size: 1.5rem;
}

h5,
.h5 {
  font-size: 1.25rem;
  line-height: 1.1;
  color: var(--black);
}

h6,
.h6 {
  font-size: 1.1rem;
  line-height: 1.1;
  color: var(--dark-gray);
}

figcaption {
  font-size: 0.875rem;
  color: var(--medium-gray);
  text-align: center;
}

/* Add a margin to any headings that are direct siblings. */
:is(h1, h2, h3, h4, h5, h6) + :is(h1, h2, h3, h4, h5, h6) {
  margin-top: var(--spacing);
}

/* Add a margin to any list directly below a heading. */
:is(h1, h2, h3, h4, h5, h6) + :is(ul, ol) {
  margin-top: calc(var(--spacing) * 0.75);
}

.font-alt, .display-5,
.fs_style_118, .display-4,
.fs_style_117, .display-3,
.fs_style_116, .display-2,
.fs_style_115, .display-1,
.fs_style_114, .subheader,
.fs_style_113,
.fs_style_112 {
  font-family: var(--sans);
  text-transform: uppercase;
  line-height: 1.025;
  letter-spacing: 0.1em;
}

.subheader,
.fs_style_113 {
  margin-top: 0.5rem;
  opacity: 0.4;
  font-weight: bold;
}

.lead-in,
.fs_style_95 {
  font-size: 125%;
  line-height: inherit;
}

/* Display headings */
.display-1,
.fs_style_114 {
  margin-bottom: 0.2em;
  font-weight: bold;
}
@media (max-width: 63.9375rem) {
  .display-1,
.fs_style_114 {
    font-size: 14.1vmin;
  }
}
@media (min-width: 64rem) {
  .display-1,
.fs_style_114 {
    font-size: 6.25rem;
  }
}

.display-2,
.fs_style_115 {
  margin-bottom: 0.2em;
  font-weight: bold;
}
@media (max-width: 63.9375rem) {
  .display-2,
.fs_style_115 {
    font-size: 13.2vmin;
  }
}
@media (min-width: 64rem) {
  .display-2,
.fs_style_115 {
    font-size: 5.5rem;
  }
}

.display-3,
.fs_style_116 {
  margin-bottom: 0.2em;
  font-weight: bold;
}
@media (max-width: 63.9375rem) {
  .display-3,
.fs_style_116 {
    font-size: 12.3vmin;
  }
}
@media (min-width: 64rem) {
  .display-3,
.fs_style_116 {
    font-size: 4.75rem;
  }
}

.display-4,
.fs_style_117 {
  margin-bottom: 0.2em;
  font-weight: bold;
}
@media (max-width: 63.9375rem) {
  .display-4,
.fs_style_117 {
    font-size: 11.4vmin;
  }
}
@media (min-width: 64rem) {
  .display-4,
.fs_style_117 {
    font-size: 4rem;
  }
}

.display-5,
.fs_style_118 {
  margin-bottom: 0.2em;
  font-weight: bold;
}
@media (max-width: 63.9375rem) {
  .display-5,
.fs_style_118 {
    font-size: 10.5vmin;
  }
}
@media (min-width: 64rem) {
  .display-5,
.fs_style_118 {
    font-size: 3.25rem;
  }
}

abbr[title] {
  cursor: help;
  text-decoration: none;
}

@media (hover: none) {
  abbr[title]::after {
    content: "(" attr(title) ")";
    padding-left: 0.4em;
    font-size: 80%;
    color: var(--medium-gray);
  }
}
/* Typography utility classes */
body:not(.fsComposeMode) .text-center,
body:not(.fsComposeMode) .text-center :is(td, th) {
  text-align: center !important;
}
body:not(.fsComposeMode) .text-left,
body:not(.fsComposeMode) .text-left :is(td, th) {
  text-align: left !important;
}
body:not(.fsComposeMode) .text-right,
body:not(.fsComposeMode) .text-right :is(td, th) {
  text-align: right !important;
}
body:not(.fsComposeMode) .text-justify,
body:not(.fsComposeMode) .text-justify :is(td, th) {
  text-align: justify !important;
}

.stat {
  font-size: 2.5rem;
  line-height: 1;
}

/* Remove custom anchor styles from these ($ matches ending string) */
a[class$=Icon] {
  background-image: inherit;
  background-size: inherit;
  background-position: inherit;
}

a.disabled,
button.disabled,
a.disabled:hover,
button.disabled:hover {
  opacity: 0.5;
  cursor: not-allowed;
}

.fsPageTitle {
  font-family: var(--sans), sans-serif;
  line-height: 1.2;
  font-weight: 700;
  /* .hero-info & {
  	// Reset mobile colors (To do: Debug cross-device)
  	color: var(--white);
  	background: transparent;
  	-webkit-text-fill-color: initial;
  } */
}
@media (min-width: 641px) {
  .fsPageTitle {
    font-size: 4rem;
  }
}
@media (max-width: 640px) {
  .fsPageTitle {
    font-size: 2.5rem;
  }
}

/* @media (max-width: 960px) {
	.hero-info .fsPageTitle {
		display: block;
	}
} */
/* .fsPageTitle.mobile {
	display: none;
} */
/* Hero subtext */
.fsResourceElement.hero-slideshow .hero-info .fsElementHeaderContent {
  font-size: 1.25rem;
}
@media (min-width: 641px) {
  .fsResourceElement.hero-slideshow .hero-info .fsElementHeaderContent {
    font-size: 1.5rem;
  }
}

/* .has-hero .fsPageTitle {
	text-shadow: 0px 3px 3px rgb(0 0 0 / 44%);
} */
.card h2 {
  line-height: inherit;
}

p > :last-child {
  margin-bottom: 0;
}

.card cite {
  color: var(--black);
}
.card.blue cite {
  color: var(--white);
}

/* Global notification bar */
.notification-bar a {
  color: var(--secondary-accent);
}
.notification-bar.gradient-gold a,
.notification-bar.gradient-gold footer button.close:before {
  color: var(--primary-color);
}

/* BUTTONS */
/* Override Finalsite styles */
/* Default, primary button */
.fs_style_96 {
  margin: 0 0 var(--spacing);
  padding: 1.1em 2em;
  letter-spacing: var(--letter-spacing);
}

/* Button with subtext */
.fs_style_96 .fs_style_111 {
  display: inline-block;
  margin-top: inherit;
  font-size: inherit;
  line-height: inherit;
}

/* Large button */
.fs_style_96.fs_style_100 {
  padding: var(--spacing);
  font-size: 105%;
}

/* Image Buttons (enhancement) */
.image-button-alt a {
  background-color: var(--secondary-accent);
  color: var(--primary-color);
}
.image-button-alt a::after {
  color: var(--primary-color);
}
.fsLiveMode .image-button-alt a:focus, .fsLiveMode .image-button-alt a:hover {
  background-color: var(--secondary-color);
}

/* START HOMEPAGE */
/* Make bg transparent */
body.fsLiveMode.opportunities-active .fsTabs.our-opportunities .fsPanel > .fsElementContent {
  background: transparent;
}

/* Display-styled headings (strong tag) */
.section-intro .fsElementHeaderContent strong {
  line-height: 1;
}

/* Scrolling heading */
.moving-text header h2.fsElementTitle {
  margin-top: 0;
}

/* Testimonial videos/questions */
.videos-wrapper .pop-up-videos {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  max-width: 80vw;
}

.fsLiveMode .videos-wrapper .pop-up-videos article.playing {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
}

.fsAccountBarVisible .videos-wrapper .pop-up-videos article video {
  max-height: 85vh;
}

/* Our Stories - Card headings */
.fsLiveMode .our-stories > .fsElementContent:not(.pop-up-slider) .fsContent header h2.fsElementTitle {
  margin-bottom: inherit;
}

/* Prevent the news/events drawer from scrolling content below it. */
body:not(.fsComposeMode) .news-drawer > .fsElementContent .fsTabs {
  -ms-scroll-chaining: none;
      overscroll-behavior: contain;
}

.news-drawer > .fsElementContent .fsPanel .fsCalendar > .fsElementContent {
  margin-top: 0;
}

.news-drawer > .fsElementContent .fsPanel > .fsElementContent {
  margin-top: var(--spacing);
}

.news-drawer .fsLocation::before {
  content: normal;
}

/* Events nav arrows */
.news-drawer > .fsElementContent .fsPanel .slick-arrow {
  bottom: -95px;
}

.news-drawer > .fsElementContent .fsPanel .fsCalendar > .fsElementContent {
  margin-bottom: var(--spacing);
}

.news-drawer > .fsElementContent .fsPanel .fsCalendar .fsElementFooterContent a.fs_style_96.fs_style_104 {
  display: initial;
}

.news-drawer > .fsElementContent .fsPanel .fsCalendar .slide article:last-child {
  margin-bottom: var(--spacing);
}

.news-drawer > .fsElementContent .fsPanel > .fsElementContent,
.our-opportunities .fsPanel > .fsElementContent {
  background: initial;
}

/* Footer CTAs */
.fsLayout.image-buttons-container .fsElementHeaderContent strong {
  margin-top: 0;
  font-size: 3.8rem;
}

@media (min-width: 641px) {
  .news-drawer > .fsElementContent .fsPanel .fsCalendar article {
    min-height: inherit;
  }
}
@media (min-width: 961px) {
  .news-drawer > .fsElementContent .fsTabs {
    padding: 60px;
  }
  .news-drawer > .fsElementContent .fsTabs .fsElementHeaderContent {
    top: 50px;
  }
  .news-drawer > .fsElementContent .fsTabs > header h2.fsElementTitle {
    font-size: 5vmax;
  }
  .news-drawer > .fsElementContent .fsPostElement .fsThumbnail {
    height: 360px;
  }
  .news-drawer > .fsElementContent .fsPanel .fsCalendar .fsElementFooterContent {
    margin-top: 0;
  }
  .fsLiveMode .fsTabs.our-opportunities .fsPanel .fsContent.slick-current h2.fsElementTitle {
    font-size: 6.5rem;
  }
}
/* END HOMEPAGE */
/* Page Pops should inherit normal dialog widths. */
.fsPagePopDialog {
  width: inherit;
}

/* Page Pop - "Don't Show Again" button */
#fsPagePopHideButton {
  font-size: 90%;
  opacity: initial;
  color: var(--primary-accent);
  cursor: pointer;
}

/* Constituent names (h3) in Directory view (list/grid) */
[class^=fsConstituentColumnLayout_] .fsFullName {
  margin-bottom: 0.2rem;
  font-size: 1.3rem;
}

/* Constituent labels */
.fsConstituentItem > * strong {
  font-family: var(--sans);
}

/* The Degrees field in the Constituent Mgr is repurposed for the team coached. */
.fsDegrees strong {
  font-size: 0;
}
.fsDegrees strong::after {
  content: "Coaches:";
  /* color: red; */
  font-size: 1.125rem;
}

/* Metadata not in tables. */
:not(.fsAthleticsDate):not(.fsAthleticsTime):not(.fsAthleticsEvent):not(.fsResultCustom):not(.fsEventTable tr) > :is(.fsAuthor, .fsDateTime, .fsExpireDateTime, .fsTimeRange, .fsAllDay, .fsUpdatedDateTime, .fsLocation, .fsAthleticsAdvantage, .fsAthleticsLocations, .fsAthleticsEventType) {
  font-size: 1rem;
  line-height: 1.2;
  letter-spacing: 1px;
  color: var(--medium-gray);
  font-family: var(--sans), sans-serif;
  font-weight: 600;
}

.fsExpireDateTime::before {
  content: "Due:";
}

.fsLoginForgotPasswordLink,
.fsLoginNewAccountLink,
.fsReadMoreLink {
  font-size: 85%;
}

/* LAYOUT AND COMPONENTS */
hr {
  clear: both;
  height: 0;
  max-width: 75rem;
  margin: calc(var(--spacing) * 1.5) auto;
  border-top: 0;
  border-right: 0;
  border-bottom: 1px solid #cacaca;
  border-left: 0;
}

ul ul,
ol ul,
ul ol,
ol ol {
  margin-bottom: 0;
}

address {
  font-style: normal;
  margin-bottom: var(--spacing);
}

.fsImage {
  margin-bottom: var(--spacing);
}
.fsElementHeaderContent .fsImage {
  margin-bottom: inherit;
}

.copyright {
  margin-right: auto;
}

/* Cell Borders */
table.fs_style_109 td {
  border: 1px solid #ddd;
}

/* Layout containers, e.g., half, thirds */
.fsElement.fsLayout {
  margin-bottom: var(--spacing);
}

/* Child div of layout container */
.fsLayout .fsDiv {
  margin-bottom: initial;
}

.fsStyleColumn > .fsElement {
  margin-bottom: var(--spacing);
}

/* Cards with titles. To do. */
/* .card>.fsElementContent,
.fsBanner .card .fsElementContent {} */
/* Column layouts with the .card class */
.fsLayout.card {
  padding: 2em 0;
}

/* Don't allow the background to scroll when the menu is expanded. No Safari support as of Aug '21. 
https://developer.mozilla.org/en-US/docs/Web/CSS/overscroll-behavior */
#fsMenu {
  -ms-scroll-chaining: none;
      overscroll-behavior: contain;
  max-height: 510px;
}

/* FLOATS */
/* .fsStateFloatRight,
.fsStateFloatLeft {
	@extend .clearfix;
} */
.fsStateFloatRight {
  margin-left: var(--spacing);
}

.fsStateFloatLeft {
  margin-right: var(--spacing);
}

/* COLUMNS */
/* ONE-THIRD AND TWO-THIRD COLUMNS */
@media (min-width: 641px) {
  /* Reset widths. (Not needed when specifying flex values.) */
  :is(.fsElephantRightLayout, .fsElephantLeftLayout, .fsTwoColumnWideLeftLayout, .fsTwoColumnWideRightLayout) {
    gap: 3rem;
  }
  /* One-thirds columns */
  :is(.fsElephantRightLayout, .fsElephantLeftLayout) .fsStyleOneThird,
:is(.fsTwoColumnWideRightLayout, .fsTwoColumnWideLeftLayout) .fsStyleOneThird {
    -webkit-box-flex: 1;
        -ms-flex: 1 0 0%;
            flex: 1 0 0%;
  }
  /* Don't need padding if using flex gap. */
  :is(.fsElephantRightLayout, .fsTwoColumnWideLeftLayout) .fsStyleOneThird {
    padding: 0;
  }
  /* Don't need padding if using flex gap. */
  :is(.fsElephantLeftLayout, .fsTwoColumnWideRightLayout) .fsStyleOneThird {
    padding: 0;
  }
  /* Two-thirds columns */
  :is(.fsElephantRightLayout, .fsElephantLeftLayout) .fsStyleTwoThirds,
:is(.fsTwoColumnWideRightLayout, .fsTwoColumnWideLeftLayout) .fsStyleTwoThirds {
    -webkit-box-flex: 2;
        -ms-flex: 2 0 0%;
            flex: 2 0 0%;
  }
}
/* STICKY ELEMENTS */
/* For the sticky sub-nav to work, the #fsPageWrapper must not have a hidden overflow. (Will this break anything? Breaks footer CTA overflow, but setting overflow: hidden on #fsFooter fixes it.) */
/* Only add styles when the sidebar displays... */
@media (min-width: 641px) {
  /* Only override overflow in the following cases... */
  html,
body:not(.home),
:is(.fsHasLeftBanner, .hasSticky) #fsPageWrapper {
    overflow: initial;
  }
  /* Note: The direct parent of the sticky element must have a height of 100 %/vh. Adjust the top positioning based on the size of any overlaid header/menu. */
  .fsBannerLeft .fsBanner,
.hasSticky .sticky {
    position: sticky;
    top: 7rem;
  }
  /* This fixes overflow issues when using overlow on #fsPageWrapper to properly display .sticky navbars. */
  #fsFooter {
    overflow: hidden;
  }
  /* Hide this if using sticky navs, otherwise causes overflow-x issues. */
  .scroll-tooltip {
    display: none;
  }
}
@media (min-width: 1060px) {
  .fsAccountBarVisible .fsBannerLeft .fsBanner,
.fsAccountBarVisible .hasSticky .sticky {
    top: 8rem;
  }
  .fsAccountBarVisible.scrolled .fsBannerLeft .fsBanner,
.fsAccountBarVisible .hasSticky .sticky {
    top: 4rem;
    -webkit-transition: top 300ms;
    -o-transition: top 300ms;
    transition: top 300ms;
  }
}
/* Margin below List Element headings. (Too much on Search Results page.) */
/* :is(.fsList, .fsToolsElement)>header {
	@include bp-above(sm) {
		margin-bottom: var(--spacing);
	}
} */
.fsTabs {
  margin-bottom: var(--spacing);
}

/* RESOURCES */
/* Move resource pagination arrows toward the center */
.fsSlideshow .fsNextButton.fsRightArrow:before,
.fsSlideshow .fsPrevButton.fsRightArrow:before {
  right: 30%;
}

.fsSlideshow .fsNextButton.fsLeftArrow:before,
.fsSlideshow .fsPrevButton.fsLeftArrow:before {
  left: 30%;
}

/* POSTS */
.fsPostElement .fsTitle {
  font-size: inherit;
}
.fsPostElement.fsList article:not(:last-child) {
  margin-bottom: 1rem;
  padding-bottom: inherit;
  border-bottom: 2px dotted var(--medium-gray);
}
.fsPostElement .fsPostElement.fsList.card article:not(:last-child) {
  padding-bottom: 0;
}

.fsPost article > * {
  margin-bottom: 1rem;
  margin-left: inherit;
}

.fsListItems article > * {
  margin-bottom: 1rem;
}
.fsAthleticsEvent .fsListItems article > * {
  margin-bottom: initial;
}

/* Post categories AND tags */
.fsCategories .fsCategory,
.fsTags .fsTag {
  padding: 0.5em;
  font-size: 0.7rem;
  line-height: 1;
}

/* Post categories */
.fsCategories .fsCategory,
.fsTags .fsTag {
  color: var(--primary-color);
  background-color: var(--light-gray);
}
.card.light .fsCategories .fsCategory, .fsPanel .fsCategories .fsCategory,
.card.light .fsTags .fsTag,
.fsPanel .fsTags .fsTag {
  background-color: var(--white);
}

/* Post tags */
.card.light .fsTags .fsTag {
  background-color: var(--white);
}

:is(.fsThumbnailLarge, .fsThumbnailXLarge) img {
  margin-bottom: var(--spacing);
}

/* Post Tools (filters) */
.fsStateSelected .fsStyleDefaultButton {
  background: var(--secondary-color);
}

/* Label for featured post titles w/the class "new" */
.fsFeaturedPost.new .fsTitle::after {
  content: "NEW";
  padding: 0.15em 0.7em;
  margin-left: 5px;
  border-radius: 2px;
  background: -o-linear-gradient(114deg, var(--secondary-accent), var(--white));
  background: linear-gradient(336deg, var(--secondary-accent), var(--white));
  color: var(--black);
  vertical-align: middle;
  font-family: var(--sans);
  font-size: 0.75rem;
  font-weight: bold;
  letter-spacing: 1px;
}

/* Posts - Grid-card-shadow view */
/* Add this class to a wrapping container */
.grid--card-shadow {
  /* .fsElement.fsGrid>.fsElementContent article {
  	// box-shadow: 0px 2px 4px 0px #ddd;
  	// Alt shadow:
  	box-shadow: -2px 0 12px 0 rgba(0, 0, 0, 0.09);
  } */
}
.grid--card-shadow.fsPanelGroup .fsListItems > article {
  background-color: rgba(255, 255, 255, 0.7);
}
.grid--card-shadow .fsListItems {
  display: -ms-grid;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: 2rem;
  margin: 0 0 var(--spacing);
}
.grid--card-shadow .fsListItems > article {
  width: auto;
  padding: 1em;
  margin: 0;
  -webkit-box-shadow: -2px 0 12px 0 rgba(0, 0, 0, 0.09);
          box-shadow: -2px 0 12px 0 rgba(0, 0, 0, 0.09);
}

/* List items that are resources */
.fsListNav .fsListLevel1 > .fsResource {
  padding: 0;
  margin-bottom: 1rem;
  border-bottom: 0;
}

.fsAthleticsRosterList li,
.fsAthleticsRosterList li > * {
  margin: inherit;
  padding: inherit;
  margin-bottom: 1rem;
  padding-bottom: 1rem;
}

.fsStreamEventItem {
  margin-bottom: 0.5rem;
}
.fsStreamEventItem > * {
  display: block;
}

/* Add a colon after the word "Updated" */
.fsUpdatedDateTime > :first-child::before {
  content: ":";
  margin-left: -4px;
}

.fsAccordion .fsPanel > header h2,
.fsTabs .fsPanel > header h2,
.fsTabs .fsTabsNav li a,
.fsStyleDefaultButton.fsLoadMoreButton {
  letter-spacing: var(--letter-spacing);
}

/* Change Panel child element styles */
.fsAccordion .fsPanel > .fsElementContent,
.fsTabs .fsPanel > .fsElementContent {
  margin: inherit;
  padding: 2rem 1.5rem;
  /* background-color: var(--light-gray); */
  background: -o-linear-gradient(top, rgba(255, 255, 255, 0), var(--light-gray) 30px);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0), var(--light-gray) 30px);
}

/* Alternative panel headings. Add the class name to the Panel Element */
.fsAccordion.panelsLowercase .fsPanel > header h2,
.fsTabs.panelsLowercase .fsPanel > header h2,
.fsTabs.panelsLowercase .fsTabsNav li a {
  text-transform: none;
  letter-spacing: 0px;
  font-size: inherit;
}

/* MAIN NAV */
.nav-main > .fsElementContent .fsNavLevel2 li a {
  letter-spacing: var(--letter-spacing);
}

/* Nav's callout section button  */
.nav-main > .fsElementContent .fsNavPageDescription a {
  color: var(--primary-color);
  background-color: var(--secondary-accent);
}
.nav-main > .fsElementContent .fsNavPageDescription a::after {
  color: var(--primary-color);
}
.nav-main > .fsElementContent .fsNavPageDescription a:hover {
  color: var(--white);
  background-color: var(--primary-accent);
}
.nav-main > .fsElementContent .fsNavPageDescription a:hover::after {
  color: var(--white);
}

/* MOBILE NAV */
.nav-main-mobile ul ul {
  margin-left: 15px;
}
.nav-main-mobile ul ul a {
  padding: 9px 20px;
}

/* Header Utility Nav */
.nav-utility-header .fsNavLevel1 {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.nav-utility-header .fsNavLevel1 .fsNavPageInfo {
  padding: 10px 0;
}
.nav-utility-header .fsNavLevel1 .fsNavPageInfo a {
  margin-bottom: 0;
  padding: 0.7em 2em;
  line-height: 1.5;
  letter-spacing: var(--letter-spacing);
  background-image: none;
}

/* Inspire the Next Campaign nav item */
#fsMenu .nav-utility-header .fsNavLevel1 {
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}

#fsMenu .nav-utility-header .fsNavLevel1 li {
  -ms-flex-preferred-size: 30%;
      flex-basis: 30%;
}

li.inspire > a,
li.inspire > a:hover {
  content: "";
  text-indent: -9999em;
  margin: -10px 0 0 5px !important;
  background-image: url("https://www.choate.edu/fs/resource-manager/view/86d52c32-dce5-4a3e-a3e3-0769dd445899") !important;
  width: 160px;
  height: 22px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
  white-space: nowrap;
  overflow: hidden;
}

@media (max-width: 1059px) {
  li.inspire {
    padding-top: 0.6rem;
    border-top: 1px dashed var(--medium-gray);
  }
  li.inspire a {
    padding-bottom: 0;
  }
  li.inspire > a::before {
    width: 250px;
    height: 56px;
    background-image: url("https://www.choate.edu/fs/resource-manager/view/132ebaf8-5385-4408-b469-779efd07f6dd");
    /* background-size: contain; */
  }
}
/* SUBNAV */
/* Mobile Subnav */
.nav-sub.mobile {
  --nav-color: var(--secondary-color);
  --nav-color-accent: var(--secondary-accent);
  background-color: var(--nav-color);
}
.nav-sub.mobile h2.fsElementTitle {
  color: var(--primary-color);
}
body:not(.fsAccountBarVisible).fix-nav-sub .nav-sub.mobile h2.fsElementTitle {
  border-bottom: none;
}
.nav-sub.mobile .nav-sub-toggle::before {
  font-size: 1rem;
  color: var(--primary-color);
}
.nav-sub.mobile .fsNavLevel1 > li:not(:last-child) {
  border-color: var(--nav-color-accent);
}
.nav-sub.mobile ul li button:before {
  font-size: 2.7rem;
}
.nav-sub.mobile .fsNavLevel1 > li > .fsNavPageInfo:after {
  background-color: var(--nav-color-accent);
  width: 6px;
}
.nav-sub.mobile .fsNavLevel1 > li > a:hover {
  background-color: inherit;
}
.nav-sub.mobile .fsNavLevel2 {
  border-top-color: var(--nav-color-accent);
}
.nav-sub.mobile.active-nav h2.fsElementTitle {
  background-color: var(--nav-color);
}
.nav-sub.mobile.active-nav .nav-sub-toggle:before {
  font-size: 0.35rem;
}
.nav-sub.mobile .fsNavLevel1 {
  padding: 0 1em 1em;
}

.nav-sub .fsNavLevel1 > li > a {
  letter-spacing: var(--letter-spacing);
}

@media (min-width: 961px) {
  .nav-sub ul li a {
    word-break: initial;
    overflow-wrap: initial;
    -webkit-hyphens: initial;
        -ms-hyphens: initial;
            hyphens: initial;
  }
  .nav-sub .fsNavLevel1 > li > a:hover:after {
    background-color: transparent;
  }
}
/* Level 2 nav */
.nav-sub .fsNavLevel2 > li a {
  padding-top: 0.3em;
  padding-bottom: 0.3em;
  line-height: 1.4;
  font-weight: normal;
}

.nav-sub .fsNavLevel2 > li button {
  top: 3px;
}

/* Level 3 nav anchors */
.nav-sub .fsNavLevel3 > li > a {
  padding-top: 0.5em;
  padding-bottom: 0.5em;
  padding-left: 3em;
}

/* Level 3 nav indicators/bullets */
.nav-sub .fsNavLevel3 > li > a:before {
  opacity: 0.3;
  top: 16px;
}

/* Level 4 nav */
.nav-sub ul li .fsNavLevel4 a {
  padding: 7px 0 7px 65px;
  line-height: 1.5;
}

/* CALENDARS & EVENTS */
/* Add various punctuation to dates until Finalsite fixes */
.fsMonth::after {
  content: " ";
}

/* If the time follows a date, add the word "at" before it.  */
.fsDate + .fsTime::before {
  content: " at ";
}

/* MONTH VIEW */
.fsCalendar.fsGrid .fsNotes {
  font-size: 85%;
}

/* Style the dialog Notes field */
.fsDialog .fsNotes {
  padding: 1em;
  font-size: 90%;
  background: var(--light-gray);
}
.fsDialog .fsNotes::before {
  content: "Notes:";
  display: block;
  margin-bottom: 1rem;
  font-style: italic;
}

/* Add a max-height & scrollbar to days with multiple events. */
.fsGrid .fsCalendarDaybox {
  /* .fsCalendarDate {
  	position: sticky;
  	top: 0;
  } */
}
.fsGrid .fsCalendarDaybox.fsStateHasEvents {
  max-height: 350px;
  overflow-y: auto;
}

/* CONSTITUENTS */
.fsConstituent .fsConstituentItem {
  margin-bottom: calc(var(--spacing) * 1.5);
}

/* START: Style the name & photo of a Constituent Element -> Profile */
.quotePhoto {
  /* The wrapper of the constituent data */
  /* Certain modern iOS webkit browsers don't support flex gap, so use a l/r margin on the children. */
  /* The image wrapper */
  /* The image (as a bg image) */
  /* Full name (ideally, add the class .subheader) */
  /* Add text before the name */
  /* Add text after the name */
  /* Extra constituent data */
}
.quotePhoto .fsConstituentProfile.fsHasPhoto {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  margin-left: 1em;
}
@media (max-width: 30rem) {
  .quotePhoto .fsConstituentProfile.fsHasPhoto {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
}
.quotePhoto .fsProfileImage.fsThumbnail {
  max-width: 100px;
  margin-bottom: 0;
  margin-right: 1rem;
}
.quotePhoto .fsCroppedImage {
  border-radius: 50%;
}
.quotePhoto .fsFullName {
  font-size: 0.875rem;
}
.quotePhoto .fsFullName::before {
  content: "—";
}
.quotePhoto .fsFullName::after {
  content: ", Department Head";
  margin-left: -5px;
}
.quotePhoto .fsProfileSection {
  display: none;
}

/* END: Style the name & photo of a Constituent Element -> Profile */
/* ATHLETICS MANAGER */
/* Coaches */
.fsCoaches {
  /* .fsRosterTitle, [id^="fsEmail"] {
  	display: inline-block;
  } */
}
.fsCoaches .fsRosterName {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}
.fsCoaches li > * {
  padding-bottom: 0;
}
.fsCoaches .fsCoachImage {
  max-width: 200px;
  display: inherit;
}

/* FINALSITE ELEMENT OVERRIDES */
dialog {
  max-height: 95vh;
}

/* A smaller max-height on dialogs/modals prevents them from clipping atop the viewport (see athletics events with recaps) */
@media (min-width: 640px) {
  dialog {
    max-height: 70vh;
  }
}
/* The inner, wrapping div of a dialog box (siblings w/the close button). Reset the application.css styles. */
.fsDialogContent {
  max-height: inherit;
}

/* Add relative positioning for proper pseudo-element positioning. */
dialog article {
  position: relative;
}

/* Custom panels (full-width) */
.fsLiveMode .panel.right .fsElementContent {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column;
          flex-flow: column;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
  text-align: right;
}
.fsLiveMode .panel > :last-child {
  margin-bottom: 0;
}

#fsAccountBar {
  -webkit-box-shadow: 0 0px 5px rgba(0, 0, 0, 0.3);
          box-shadow: 0 0px 5px rgba(0, 0, 0, 0.3);
}

/* Display label as block */
.fsPasskey {
  display: block;
}

/* Search Button */
/* .fsElementToolsSearchButton {
	padding: 0 2em;
} */
/* Input bar - clear icon */
.fsElementToolsKeyword .fsButtonClear,
.fsSearchElementKeyword .fsButtonClear {
  line-height: 1;
  cursor: pointer;
}

/* Weglot - Language Translation Tool */
/* Hide Weglot on mobile devices until positioning is addressed */
/* @media (max-width: 1059px) {
	.wg-default, 
	.fsLiveMode .wg-default .country-selector {
		display: none;
	}
} */
/* Position Weglot position atop the bottom nav when scrolling */
@media (max-width: 1059px) {
  .fsLiveMode .wg-default,
.fsLiveMode .wg-default .country-selector {
    -webkit-transition: all 300ms;
    -o-transition: all 300ms;
    transition: all 300ms;
    bottom: 79px;
  }
  .scrolled .wg-default,
.scrolled .wg-default .country-selector {
    bottom: 0;
  }
}
/* STYLES FOR EVERY THEME */
/* Global Theme Overrides. Styles to apply to all Finalsite themes on Choate's website & portals. */
/* Add a comma after the day, except on slideshows. */
.fsCalendar:not(.fsSlideshow) .fsDayName::after {
  content: ", ";
}

/* Add a comma before years (after dates) that are spelled out that don't already have a comma (separator). */
:not(.fsSeparator) + .fsYear::before {
  content: ", ";
  margin-left: -5px;
}

/* Read More link (the underline on legacy portals looks odd. Removing until redesign.) */
/* .fsReadMoreLink {
	display: block;
} */
/* Featured posts in lists & grids. Looks odd in various, styled feeds. */
/* .fsList:not(.card) .fsFeaturedPost,
.fsGrid:not(.card) .fsFeaturedPost {
	border: 2px solid var(--secondary-color);
} */
/* Posts with the tag "Action Required" */
.fsTag-271 .fsCategory {
  background: var(--secondary-color);
  color: var(--black);
}

/* SEARCH */
.search-container {
  -ms-scroll-chaining: none;
      overscroll-behavior: contain;
}

/* Search input */
.fsSearchElement.site-search input {
  padding: 1.4em 1em;
  font-size: 1rem;
  color: var(--white);
}
.fsSearchElement.site-search .tt-hint {
  color: var(--medium-gray);
}

/* SEARCH RESULTS */
.fsSearchElement .fsSummary::before,
.fsSearchElement .fsSummary::after {
  content: '"';
}

/* Search Suggestions */
/* Use important to override script positioning. */
.tt-menu {
  padding: 0.5em;
}
@media (max-width: 1059px) {
  .tt-menu {
    top: -237px !important;
  }
}

.tt-dataset {
  font-style: normal;
  /* 	.fsSummary {
  	color: var(--medium-gray);
  } */
}

.tt-suggestion {
  padding: 0.5em;
  border-top: 1px solid var(--light-gray);
}

.tt-highlight,
.fsSearchElement .fsSearchResultMatch {
  background-color: #fff8ab;
  font-weight: normal;
}

.fsSearchSuggestionURL,
.tt-dataset .fsSummary {
  font-size: 1rem;
  font-family: var(--sans);
  font-weight: normal;
}

.fsSearchSuggestionURL {
  font-size: 0.85rem;
  font-style: italic;
  color: var(--medium-gray);
}

.fsSearchResultURL {
  font-size: 90%;
  font-family: var(--sans);
  color: var(--medium-gray);
}

/* COOKIE CONSENT STYLES: https://www.osano.com/cookieconsent/ */
.cc-window {
  opacity: 1;
  -webkit-transition: opacity 1s ease;
  -o-transition: opacity 1s ease;
  transition: opacity 1s ease;
}

.cc-window.cc-invisible {
  opacity: 0;
}

.cc-animate.cc-revoke {
  -webkit-transition: transform 1s ease;
  -webkit-transition: -webkit-transform 1s ease;
  transition: -webkit-transform 1s ease;
  -o-transition: transform 1s ease;
  transition: transform 1s ease;
  transition: transform 1s ease, -webkit-transform 1s ease;
}

.cc-animate.cc-revoke.cc-top {
  -webkit-transform: translateY(-2em);
  -ms-transform: translateY(-2em);
      transform: translateY(-2em);
}

.cc-animate.cc-revoke.cc-bottom {
  -webkit-transform: translateY(2em);
  -ms-transform: translateY(2em);
      transform: translateY(2em);
}

.cc-animate.cc-revoke.cc-active.cc-top {
  -webkit-transform: translateY(0);
  -ms-transform: translateY(0);
      transform: translateY(0);
}

.cc-animate.cc-revoke.cc-active.cc-bottom {
  -webkit-transform: translateY(0);
  -ms-transform: translateY(0);
      transform: translateY(0);
}

.cc-revoke:hover {
  -webkit-transform: translateY(0);
  -ms-transform: translateY(0);
      transform: translateY(0);
}

.cc-grower {
  max-height: 0;
  overflow: hidden;
  -webkit-transition: max-height 1s;
  -o-transition: max-height 1s;
  transition: max-height 1s;
}

.cc-revoke,
.cc-window {
  position: fixed;
  overflow: hidden;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  font-family: Helvetica, Calibri, Arial, sans-serif;
  font-size: 16px;
  line-height: 1.5em;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
  z-index: 9999;
}

.cc-window.cc-static {
  position: static;
}

.cc-window.cc-floating {
  padding: 2em;
  max-width: 24em;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}

.cc-window.cc-banner {
  padding: 1em 1.8em;
  width: 100%;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
}

.cc-revoke {
  padding: 0.5em;
}

.cc-revoke:hover {
  text-decoration: underline;
}

.cc-header {
  font-size: 18px;
  font-weight: 700;
}

.cc-btn,
.cc-close,
.cc-link,
.cc-revoke {
  cursor: pointer;
}

.cc-link {
  opacity: 0.8;
  display: inline-block;
  padding: 0.2em;
  text-decoration: underline;
}

.cc-link:hover {
  opacity: 1;
}

.cc-link:active,
.cc-link:visited {
  color: initial;
}

.cc-btn {
  display: block;
  padding: 0.4em 0.8em;
  font-size: 0.9em;
  font-weight: 700;
  border-width: 2px;
  border-style: solid;
  text-align: center;
  white-space: nowrap;
}

.cc-highlight .cc-btn:first-child {
  background-color: transparent;
  border-color: transparent;
}

.cc-highlight .cc-btn:first-child:focus,
.cc-highlight .cc-btn:first-child:hover {
  background-color: transparent;
  text-decoration: underline;
}

.cc-close {
  display: block;
  position: absolute;
  top: 0.5em;
  right: 0.5em;
  font-size: 1.6em;
  opacity: 0.9;
  line-height: 0.75;
}

.cc-close:focus,
.cc-close:hover {
  opacity: 1;
}

.cc-revoke.cc-top {
  top: 0;
  left: 3em;
  border-bottom-left-radius: 0.5em;
  border-bottom-right-radius: 0.5em;
}

.cc-revoke.cc-bottom {
  bottom: 0;
  left: 3em;
  border-top-left-radius: 0.5em;
  border-top-right-radius: 0.5em;
}

.cc-revoke.cc-left {
  left: 3em;
  right: unset;
}

.cc-revoke.cc-right {
  right: 3em;
  left: unset;
}

.cc-top {
  top: 1em;
}

.cc-left {
  left: 1em;
}

.cc-right {
  right: 1em;
}

.cc-bottom {
  bottom: 1em;
}

.cc-floating > .cc-link {
  margin-bottom: 1em;
}

.cc-floating .cc-message {
  display: block;
  margin-bottom: 1em;
}

.cc-window.cc-floating .cc-compliance {
  -webkit-box-flex: 1;
  -ms-flex: 1 0 auto;
  flex: 1 0 auto;
}

.cc-window.cc-banner {
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.cc-banner.cc-top {
  left: 0;
  right: 0;
  top: 0;
}

.cc-banner.cc-bottom {
  left: 0;
  right: 0;
  bottom: 0;
}

.cc-banner .cc-message {
  display: block;
  -webkit-box-flex: 1;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  max-width: 100%;
  margin-right: 1em;
}

.cc-compliance {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-line-pack: justify;
  align-content: space-between;
}

.cc-floating .cc-compliance > .cc-btn {
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
}

.cc-btn + .cc-btn {
  margin-left: 0.5em;
}

@media print {
  .cc-revoke,
.cc-window {
    display: none;
  }
}
@media screen and (max-width: 900px) {
  .cc-btn {
    white-space: normal;
  }
}
@media screen and (max-width: 414px) and (orientation: portrait), screen and (max-width: 736px) and (orientation: landscape) {
  .cc-window.cc-top {
    top: 0;
  }
  .cc-window.cc-bottom {
    bottom: 0;
  }
  .cc-window.cc-banner,
.cc-window.cc-floating,
.cc-window.cc-left,
.cc-window.cc-right {
    left: 0;
    right: 0;
  }
  .cc-window.cc-banner {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
  }
  .cc-window.cc-banner .cc-compliance {
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
  }
  .cc-window.cc-floating {
    max-width: none;
  }
  .cc-window .cc-message {
    margin-bottom: 1em;
  }
  .cc-window.cc-banner {
    -webkit-box-align: unset;
    -ms-flex-align: unset;
    align-items: unset;
  }
  .cc-window.cc-banner .cc-message {
    margin-right: 0;
  }
}
.cc-floating.cc-theme-classic {
  padding: 1.2em;
  border-radius: 5px;
}

.cc-floating.cc-type-info.cc-theme-classic .cc-compliance {
  text-align: center;
  display: inline;
  -webkit-box-flex: 0;
  -ms-flex: none;
  flex: none;
}

.cc-theme-classic .cc-btn {
  border-radius: 5px;
}

.cc-theme-classic .cc-btn:last-child {
  min-width: 140px;
}

.cc-floating.cc-type-info.cc-theme-classic .cc-btn {
  display: inline-block;
}

.cc-theme-edgeless.cc-window {
  padding: 0;
}

.cc-floating.cc-theme-edgeless .cc-message {
  margin: 2em;
  margin-bottom: 1.5em;
}

.cc-banner.cc-theme-edgeless .cc-btn {
  margin: 0;
  padding: 0.8em 1.8em;
  height: 100%;
}

.cc-banner.cc-theme-edgeless .cc-message {
  margin-left: 1em;
}

.cc-floating.cc-theme-edgeless .cc-btn + .cc-btn {
  margin-left: 0;
}