@charset "UTF-8";
/**
 * Application-Specific Styles
 * DBS>Interactive
 *
 * @file style-app.css
 * @description This is the primary stylesheet for the appointment handling, user registration, and dashboard modules of the application, which reside and operate outside of the CMS. This stylesheet is responsible for look and feel of these areas of the application. It includes styles for typography, buttons, layout, forms, and module-specific components. The file is organized into sections for readability and maintainability, utilizing SCSS variables for consistency and media queries for responsiveness.
 * @author Danny Poit
 * @date 2025-04-04, updated 2025-07-03
 * @version 1.0
 * @license MIT
 * @see https://github.com/DBSInteractive/sns-shownoshow.com/blob/main/README.md
 */
/**
 * Global Mixins
 * DBS>Interactive
 */
/**
 * Helpful mixin for font size scaling.
 *
 * Decimal values should not be used here!
 * The results will not be what you'd expect.
 *
 * @usage
 * 		@include font-scale(-1) - smaller
 * 		@include font-scale(0) = 1em (.8em in mobile)
 * 		@include font-scale(1) - larger
 * 			etc...
 */
/**
 * Fixes clear bug in certain situations
 *
 * @group layout
 * @link http://fuseinteractive.ca/blog/understanding-humble-clearfix#.VJ853sAEo Understanding the humble clearfix
 * @example scss - Usage
 *   @extend clearFix; // That's It!
 */
.clearfix:before, .clearfix:after {
  content: "";
  display: table; }

.clearfix:after {
  clear: both; }

/**
 * An easy way to truncate text with an ellipsis. Requires the element to be block or inline-block.
 *
 * @group Typography
 * @link http://web-design-weekly.com/2013/05/12/handy-sass-mixins/ Handy Sass Mixins
 * @example scss - Usage
 *   .text-truncate {
 *	  @extend text-truncate;
 *   }
 */
/**
 * Hide On Breakpoint
 *
 * @param {Variable} $bp - Breakpoint variable, ie $largeScreen
 * @param {String} $determinate ('min') - Whether it is max-width or min-width based
 * @group General
 * @link https://github.com/GumbyFramework/Gumby/blob/master/sass/functions/_visibility.scss Gumby Framework
 * @example scss - Basic Usage
 *   .class{
 *	  @include hideOn($largeScreen);
 *   }
 *
 * @example scss - Reversed Determinate
 *   @include hideOn($baby, 'max');
 */
/**
 * Show On Breakpoint
 *
 * @param {Variable} $bp - Breakpoint variable, ie $largeScreen
 * @param {String} $determinate ('min') - Whether it is max-width or min-width based
 * @group General
 * @link https://github.com/GumbyFramework/Gumby/blob/master/sass/functions/_visibility.scss Gumby Framework
 * @example scss - Basic Usage
 *   .class{
 *	  @include showOn($largeScreen);
 *   }
 *
 * @example scss - Reversed Determinate
 *   @include showOn($baby, 'max');
 */
/**
 * Size mixin - Sets width and height.
 *
 * When only one argument is specified, both the height and width are set to the same value.
 *
 * @param width - required
 * @param height
 */
/**
 * REFLEX ISH GRID
 */
/**
 * Exponent function
 *
 * NOTE: This does NOT work for decimal values
 *
 *   @see: https://css-tricks.com/snippets/sass/power-function/
 */
/**
 * Object Fit
 *
 * If a browser supports object-fit it will use it with the params
 * given. Otherwise it will fall back on a more basic image centering method.
 *
 * @param size - required (cover, contain, auto, etc.)
 * @param position - required (center, left, right, top, bottom right, etc.)
 */
/**
 * Aspect Ratio
 *
 * Used to create a padding box that an image/video can be placed in.
 *
 * Example @include aspect-ratio(16, 9);
 */
/**
 * Slate Layout Mixins
 * DBS>Interactive
 */
/**
 * Default responsive padding mixin for layout content
 */
/**
 * Default responsive margin mixin for layout content
 */
/**
 * Used for mimicking the vertical space provided by the default-margin mixin, but
 * with padding for colored background layouts.
 */
/**
 * Mixin to keep space (either margin or padding) between cells consistent
 *
 * It takes 2 arguments:
 * 		@param $space_property = { 'margin'|'padding' }
 * 		@param $reverse = { true|false }
 */
/**
 * Responsive layout mixin to constrain a width to containSize.
 */
/**
 * Theme Variables - colors, font sizes, breakpoint etc.
 * All the variables will goes here based on project tech specification
 * DBS>Interactive
 */
/**
 * Fonts
 */
/**
 * Type style definitions
 */
.button, .button.green, .button.red, .button.green:not(.ghost), .bg-dark .button, .bg-dark-gradient .button,
.bg-dark-angled .button,
.white-on-black .button, html, body {
  color: #2D2C2F;
  font-family: "Golos Text", "Open Sans", "Verdana", "Helvetica", sans-serif;
  letter-spacing: 0.025em; }

.button, .button.green, .button.red, .button.green:not(.ghost), .bg-dark .button, .bg-dark-gradient .button,
.bg-dark-angled .button,
.white-on-black .button {
  font-weight: 600; }

nav, h1, h2, h3, h4, h5, h6 {
  color: #000000;
  font-family: "Golos Text", "Open Sans", "Verdana", "Helvetica", sans-serif;
  font-weight: 600;
  line-height: 1.2; }

/**
 * To add a new font:
 * DBS>Interactive
 *
 * Take the fonts and upload them here:
 * https://transfonter.org/
 *
 * Download the resulting files and copy the woff and woff2
 * files into the appropriate directory.
 *
 * Make sure that the font-weight and font-style match the appropriate font files.
 *
 * We generally remove all of the unnecessary glyphs from the font family to make the files as
 * small as possible. If the font is a Google Font, you can copy all of its available glyphs
 * by clicking the "Glyphs" tab on the font's page. Paste those into the "characters" field on 
 * Transfonter and delete all of the characters that are not typically going to be used on an  
 * English language site. When you do this correctly the files downloaded from Transfonter will
 * be prefixed with "subset-". If the site has multiple languages, then don't do that.
 */
@font-face {
  font-family: 'Golos Text';
  src: url("/fonts/golos-text/subset-GolosText-Regular.woff2") format("woff2"), url("/fonts/golos-text/subset-GolosText-Regular.woff") format("woff");
  font-display: swap;
  font-weight: 400;
  font-style: normal; }

@font-face {
  font-family: 'Golos Text';
  src: url("/fonts/golos-text/subset-GolosText-Medium.woff2") format("woff2"), url("/fonts/golos-text/subset-GolosText-Medium.woff") format("woff");
  font-weight: 500;
  font-display: swap;
  font-style: normal; }

@font-face {
  font-family: 'Golos Text';
  src: url("/fonts/golos-text/subset-GolosText-SemiBold.woff2") format("woff2"), url("/fonts/golos-text/subset-GolosText-SemiBold.woff") format("woff");
  font-weight: 600;
  font-display: swap;
  font-style: normal; }

@font-face {
  font-family: 'Open Sans';
  src: url("/fonts/open-sans/opensans-light-webfont.woff2") format("woff2"), url("/fonts/open-sans/opensans-light-webfont.woff") format("woff");
  font-display: swap;
  font-weight: 300;
  font-style: normal; }

@font-face {
  font-family: 'Open Sans';
  src: url("/fonts/open-sans/opensans-lightitalic-webfont.woff2") format("woff2"), url("/fonts/open-sans/opensans-lightitalic-webfont.woff") format("woff");
  font-weight: 300;
  font-display: swap;
  font-style: italic; }

@font-face {
  font-family: 'Open Sans';
  src: url("/fonts/open-sans/opensans-regular-webfont.woff2") format("woff2"), url("/fonts/open-sans/opensans-regular-webfont.woff") format("woff");
  font-weight: 400;
  font-display: swap;
  font-style: normal; }

@font-face {
  font-family: 'Open Sans';
  src: url("/fonts/open-sans/opensans-bold-webfont.woff2") format("woff2"), url("/fonts/open-sans/opensans-bold-webfont.woff") format("woff");
  font-weight: 700;
  font-display: swap;
  font-style: normal; }

/**
 * General styles and helpful classes
 * DBS>Interactive
 */
*,
*:after,
*:before,
input[type=search] {
  box-sizing: inherit; }

* {
  -webkit-tap-highlight-color: rgba(191, 4, 4, 0.3); }

::selection {
  background: rgba(191, 4, 4, 0.3); }

body :focus {
  outline: none;
  box-shadow: 0 0 0 1px #000, 0 0 0 2px #fff; }

body .site-content:after {
  content: '';
  background-color: rgba(0, 0, 0, 0.7);
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  transition: opacity .25s linear;
  z-index: 1;
  visibility: hidden; }

body.opened-menu .site-content:after, body.accessibility-menu-opened .site-content:after {
  opacity: 1;
  transition: opacity .25s linear;
  visibility: visible; }

body.wp-admin :focus {
  box-shadow: none; }

html {
  box-sizing: border-box; }

address, ol, p, ul {
  margin: 0 0 1.5rem; }

ol ol, ol ul, ul ol, ul ul {
  margin: 0 0 1.5rem; }

hr {
  border: none;
  border-top: 1px solid #dadada;
  display: block;
  height: 1px;
  margin: 3rem 0;
  padding: 0; }

blockquote {
  border-left: 0.5rem solid #BF0404;
  font-style: normal;
  font-weight: 400;
  margin: 2.25rem auto;
  max-width: 90%;
  overflow: hidden;
  padding: 1em 0;
  position: relative;
  text-align: left; }
  @media screen and (min-width: 48em) {
    blockquote {
      max-width: 80%; } }
  blockquote img.alignnone {
    border-radius: 100%;
    display: block;
    margin: 0 auto;
    overflow: hidden;
    text-align: center; }
    @media screen and (min-width: 48em) {
      blockquote img.alignnone {
        display: inline-block;
        float: left;
        margin-right: 7%;
        max-height: 8em;
        max-width: 8em; } }
  blockquote p {
    margin-left: 2rem; }
  blockquote small {
    font-size: 0.64em;
    display: inline-block;
    margin: 0 0 0.8em 1.5em; }
    @media (min-width: 48em) {
      blockquote small {
        font-size: 0.8em; } }
    blockquote small:before {
      content: '\2014 \00A0'; }
  blockquote cite {
    font-weight: bold; }
  blockquote cite a {
    font-weight: normal; }

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

dl {
  margin: 0 0 0.75rem; }
  dl dt {
    font-weight: bold;
    margin: 0 0 0.75rem;
    padding-right: 1em; }
  dl dd {
    margin-bottom: 0.75rem;
    margin-left: 2em; }

mark {
  background-color: #e5e5e5; }

code, tt {
  font-size: 0.64em;
  background: #e5e5e5;
  border-radius: 2px;
  border: 1px solid #c1c1c1;
  font-family: Inconsolata, monospace, sans-serif;
  padding: 1px 3px;
  white-space: pre; }
  @media (min-width: 48em) {
    code, tt {
      font-size: 0.8em; } }

pre {
  font-size: 0.64em;
  background: #e5e5e5;
  border-radius: 3px;
  border: 1px solid #cccccc;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  font-family: Inconsolata, monospace, sans-serif;
  margin: 0 0 1.5rem;
  overflow: auto;
  padding: 1em 1.25em;
  white-space: pre;
  width: 100%; }
  @media (min-width: 48em) {
    pre {
      font-size: 0.8em; } }

pre code, tt {
  background: transparent;
  border: none;
  font-size: inherit;
  padding: 0;
  white-space: -moz-pre-wrap;
  white-space: pre-wrap; }

img, svg {
  height: auto;
  max-width: 100%; }

svg {
  width: 100%; }

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

/**
 * Helpful Re-usable Classes
 */
.site-logo {
  fill: #BF0404;
  transition: fill ease-in-out 0.25s; }
  .site-logo:hover {
    fill: #f10505; }

@media screen and (min-width: 48em) {
  .desktop-hidden {
    display: none !important; } }

@media screen and (max-width: 47.999em) {
  .mobile-hidden {
    display: none !important; } }

@media screen and (min-width: 48em) {
  .mobile-nav-visible {
    display: none !important; } }

@media screen and (max-width: 47.999em) {
  .mobile-nav-hidden {
    display: none !important; } }

.lazy-load {
  max-width: 100%; }

.linkclicker,
button,
input[type=submit] {
  cursor: pointer; }

.alignright {
  float: right;
  margin-left: 1.5rem;
  margin-bottom: 1.5rem; }

.alignleft {
  float: left;
  margin-right: 1.5rem;
  margin-bottom: 1.5rem; }

@media screen and (min-width: 48em) {
  .alignright.size-large,
  .alignleft.size-large {
    max-width: 50%; } }

.aligncenter, .center {
  margin: 1.5rem auto;
  display: block; }

.alignnone {
  margin: 0; }

.left {
  float: left; }

.right {
  float: right; }

.hidden,
.hide {
  display: none !important; }

.assistive,
.hide-text,
.screen-reader-text {
  height: 1px;
  width: 1px;
  border: 0;
  clip: rect(0 0 0 0);
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  background: #ffffff;
  color: #000000; }
  .assistive.show-on-focus:focus,
  .hide-text.show-on-focus:focus,
  .screen-reader-text.show-on-focus:focus {
    background-color: rgba(0, 0, 0, 0.9);
    border-radius: 1em;
    box-shadow: 0 0 3px 5px;
    color: #ffffff;
    clip: unset;
    display: inline-block;
    height: auto;
    left: 50%;
    padding: 6em;
    position: fixed;
    top: 50%;
    transform: translate(-50%, -50%);
    transition: background-color .25s linear;
    width: auto;
    z-index: 99999; }

.hide-text {
  text-indent: -9999px; }

@media screen and (min-width: 48em) {
  .two-column-list, .link-list.two-column {
    columns: 2;
    column-gap: 3rem; }
    .two-column-list li, .link-list.two-column li, .two-column-list__item {
      break-inside: avoid-column; } }

.embed-container {
  height: 0 !important;
  max-width: 100%;
  overflow: hidden;
  padding-bottom: 56.25%;
  position: relative;
  width: 100% !important; }
  .embed-container iframe {
    height: 100%;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0; }

@media screen and (min-width: 48em) {
  .two-column-list, .link-list.two-column {
    columns: 2;
    column-gap: 3rem; }
    .two-column-list li, .link-list.two-column li, .two-column-list__item {
      break-inside: avoid-column;
      position: relative;
      z-index: 2; } }

.link-list {
  list-style: none;
  margin: 0;
  padding: 0;
  position: relative; }
  .link-list:after {
    background: #ffffff;
    content: '';
    height: 1px;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%; }
  .link-list li {
    border-bottom: 1px solid #f0f0f0; }
    .link-list li a {
      display: block !important;
      padding: 1.5rem 3rem 1.5rem 0 !important; }

.steps {
  list-style: none;
  counter-reset: custom-counter;
  padding-left: 0;
  position: relative; }
  .steps li {
    position: relative;
    counter-increment: custom-counter;
    padding-left: 5rem; }
    .steps li:not(:last-of-type) {
      padding-bottom: 4.5rem; }
      .steps li:not(:last-of-type)::before {
        content: '';
        position: absolute;
        left: 1.5rem;
        top: 1.5rem;
        width: 1px;
        height: 100%;
        background: #BF0404;
        z-index: 0; }
    .steps li .marker {
      position: absolute;
      left: 0;
      top: 0.95rem;
      transform: translateY(-50%);
      width: 3rem;
      height: 3rem;
      border: 1px solid #BF0404;
      border-radius: 50%;
      background: #ffffff;
      text-align: center;
      line-height: 3rem;
      font-size: 1.25rem;
      color: #BF0404;
      z-index: 1; }
      .steps li .marker::before {
        content: counter(custom-counter);
        position: relative;
        left: 0.25rem;
        top: -0.1rem;
        z-index: 2; }

.check-list {
  list-style: none;
  padding-left: 0; }
  .check-list li {
    line-height: 1.35;
    margin-bottom: .5rem;
    padding-left: 1.5rem;
    position: relative; }
    .check-list li::before {
      background: url("/icons/check.svg") no-repeat center;
      background-size: contain;
      content: '';
      height: .75rem;
      position: absolute;
      top: .5rem;
      left: 0;
      width: .75rem; }

.fake-list p {
  position: relative;
  padding-left: 2rem;
  margin-bottom: .5rem; }
  .fake-list p::before {
    content: '●';
    position: absolute;
    top: 0;
    left: 0; }

/**
 * DBS>Interactive
 * General Theme Type classes
 * These classes are generic repeatable patterns of type styles that can be
 * extended by other classes to maintain consistency throughout the theme.
 *
 * Recommended usage:
 * 		@extend %button-type;
 */
/**
 * Default Typography
 */
html {
  font-size: 1em; }

body {
  font-size: 1em;
  font-weight: 400;
  line-height: 1.5; }

h1, h2, h3, h4, h5, h6 {
  margin-top: 0;
  margin-bottom: 1.5rem;
  text-rendering: optimizeLegibility; }
  h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
    text-decoration: none; }

.h1, h1 {
  font-size: 2.44141em; }
  @media (min-width: 48em) {
    .h1, h1 {
      font-size: 3.05176em; } }

.h2, h2 {
  font-size: 1.95312em; }
  @media (min-width: 48em) {
    .h2, h2 {
      font-size: 2.44141em; } }

.h3, h3 {
  font-size: 1.5625em; }
  @media (min-width: 48em) {
    .h3, h3 {
      font-size: 1.95312em; } }

.h4, h4 {
  font-size: 1.25em; }
  @media (min-width: 48em) {
    .h4, h4 {
      font-size: 1.5625em; } }

.h5, h5 {
  font-size: 1em; }
  @media (min-width: 48em) {
    .h5, h5 {
      font-size: 1.25em; } }

.h6, h6 {
  font-size: 0.8em; }
  @media (min-width: 48em) {
    .h6, h6 {
      font-size: 1em; } }

.eyebrow {
  color: #ffffff;
  font-size: .875rem;
  font-style: normal;
  font-weight: 700;
  letter-spacing: 1.5px;
  line-height: 1rem;
  margin-bottom: 1.5rem;
  text-transform: uppercase; }

a {
  color: #2D2C2F;
  font-weight: bold;
  text-decoration: underline;
  transition: color ease-in-out 0.25s; }
  a:hover, a:focus, a:active {
    color: #141315;
    text-decoration: none; }

.bg-dark a, .bg-dark-gradient a {
  color: #ffffff; }
  .bg-dark a:hover, .bg-dark-gradient a:hover, .bg-dark a:focus, .bg-dark-gradient a:focus, .bg-dark a:active, .bg-dark-gradient a:active {
    color: #e6e6e6; }

p {
  margin-top: 0;
  margin-bottom: 1.5rem; }

.dropcap {
  color: #BF0404;
  float: left;
  font-size: 6.25em;
  font-weight: 400;
  line-height: 90px;
  margin-bottom: -.031em;
  margin-top: .03em;
  padding-right: .5rem; }

.font_small,
small {
  font-size: 0.707em; }

.intro-text {
  font-size: 1.125rem; }

.white {
  color: #ffffff !important; }

.black {
  color: #000000 !important; }

.red {
  color: #BF0404 !important; }

.caps {
  text-transform: uppercase; }

.underline {
  text-decoration: underline; }

.text-center {
  text-align: center; }

.text-left {
  text-align: left; }

.text-right {
  text-align: right; }

.normal {
  font-weight: 400; }

.semi-bold {
  font-weight: 600; }

.bold {
  font-weight: 700; }

.extra-bold {
  font-weight: 900; }

/**
 * Slate contain Styles
 * DBS>Interactive
 *
 * This module contains the 3 different sized width contain classes.
 *
 * When givin a choice, prefer to use these classnames in the html rather than the constrained-width mixin. This will
 * help to keep the SCSS files less complicated and more efficient.
 *
 * 		contain-narrow
 * 		contain (contain or contain-medium)
 * 		contain-wide
 *
 * Use the layout classes on the layout div:
 * 		layout-narrow
 * 		layout-default
 * 		layout-wide
 *
 * The layout classes will work whether the contain element is the layout itself, or a child of the layout.
 */
.contain,
.layout-wide .contain,
.layout-wide.contain,
.contain-medium {
  margin-left: auto;
  margin-right: auto;
  max-width: 78rem; }

.layout-narrow .contain,
.layout-narrow.contain,
.contain-narrow {
  margin-left: auto;
  margin-right: auto;
  max-width: 65rem; }

.layout-more-narrow .contain,
.layout-more-narrow.contain,
.contain-more-narrow {
  margin-left: auto;
  margin-right: auto;
  max-width: 50rem; }

.layout-wide .contain,
.layout-wide.contain,
.contain-wide {
  margin-left: auto;
  margin-right: auto;
  max-width: 85rem; }

.contain-full-width,
.contain-full-width.contain {
  margin-left: 0;
  margin-right: 0;
  max-width: 100%; }

/**
 * Default layout styles
 * DBS>Interactive
 */
/**
 * Main site wrapper
 */
.site {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  min-height: 100vh;
  overflow: hidden;
  position: relative; }
  .site-content {
    clear: both; }

/**
 * Basic generic styles for all layouts
 */
.layout {
  margin: 3rem auto; }
  @media screen and (min-width: 48em) {
    .layout {
      margin: 4.5rem auto; } }
  .layout .contain {
    padding: 0 1.5rem; }
  .layout .cell {
    padding: 1.5rem; }
    @media screen and (min-width: 48em) {
      .layout .cell {
        padding: 0 1.5rem 1.5rem; } }
  @media screen and (min-width: 48em) {
    .layout [class*=bg-] .cell {
      padding: 1.5rem; } }
  .layout.columns,
  .layout .columns {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap; }
  .layout .column {
    position: relative; }

/**
 * Extended attribute classes for Flex Layouts
 * DBS>Interactive
 */
.bg-img {
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  overflow: hidden;
  position: relative; }
  .bg-img > .image-wrapper {
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%; }
    .bg-img > .image-wrapper img {
      height: auto;
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      width: 100%; }
      @supports (object-fit: contain) {
        .bg-img > .image-wrapper img {
          height: 100%;
          object-fit: cover;
          object-position: center; } }
  .bg-img > .contain {
    padding-bottom: 3rem;
    padding-top: 3rem; }
    @media screen and (min-width: 48em) {
      .bg-img > .contain {
        padding-bottom: 4.5rem;
        padding-top: 4.5rem; } }
  .bg-img h1, .bg-img h2, .bg-img h3, .bg-img h4, .bg-img h5, .bg-img h6, .bg-img p {
    color: #ffffff; }

.bg-dark, .bg-dark-gradient {
  background-color: #000000; }
  .bg-dark, .bg-dark-gradient, .bg-dark h1, .bg-dark-gradient h1, .bg-dark h2, .bg-dark-gradient h2, .bg-dark h3, .bg-dark-gradient h3, .bg-dark h4, .bg-dark-gradient h4, .bg-dark h5, .bg-dark-gradient h5, .bg-dark h6, .bg-dark-gradient h6 {
    color: #ffffff; }

.bg-dark-gradient {
  background: linear-gradient(to bottom, #2E0101, #000); }

.bg-dark-angled {
  background-color: #F7F6F0;
  position: relative; }
  .bg-dark-angled .contain {
    position: relative;
    z-index: 1; }
  .bg-dark-angled, .bg-dark-angled h1, .bg-dark-angled h2, .bg-dark-angled h3, .bg-dark-angled h4, .bg-dark-angled h5, .bg-dark-angled h6 {
    color: #ffffff; }
  .bg-dark-angled::before {
    background: linear-gradient(to bottom, #2E0101, #000);
    clip-path: polygon(0 0, 100% 12%, 100% 100%, 0% 100%);
    content: '';
    height: calc(100% - 3rem);
    position: absolute;
    top: 1.5rem;
    width: 100%; }
  @media (min-width: 48em) {
    .bg-dark-angled::after {
      background: #ffffff;
      content: '';
      height: calc(3rem + 2px);
      position: absolute;
      bottom: 0;
      width: 100%; } }
  @media screen and (max-width: 47.999em) {
    .bg-dark-angled {
      padding-bottom: 3rem; }
      .bg-dark-angled::before {
        height: 100%;
        top: 0; } }

.bg-light {
  background-color: #F7F6F0; }

.bg-dark.layout, .layout.bg-dark-gradient,
.bg-light.layout {
  padding-bottom: 3rem;
  padding-top: 3rem; }
  @media screen and (min-width: 48em) {
    .bg-dark.layout, .layout.bg-dark-gradient,
    .bg-light.layout {
      padding-bottom: 4.5rem;
      padding-top: 4.5rem; } }

.bg-overlay .cell, .bg-overlay .contain {
  position: relative;
  z-index: 1; }

.bg-overlay:after {
  background: rgba(0, 0, 0, 0.5);
  content: '';
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%; }

.no-bottom-margin {
  margin-bottom: 0 !important; }

.no-top-margin {
  margin-top: 0 !important; }

.thumbnail .column {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  padding: 1em; }
  @media screen and (min-width: 48em) {
    .thumbnail .column {
      padding: 0 1.5rem 1.5rem; } }
  .thumbnail .column > :first-child {
    margin-right: 1.5rem; }

.thumbnail .cell {
  -ms-flex: 1;
  flex: 1;
  padding: 0; }

.thumbnail .image-wrapper {
  height: 0;
  padding-top: 5em;
  overflow: hidden;
  position: relative;
  width: 6em; }
  .thumbnail .image-wrapper img {
    height: 100%;
    max-width: initial;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: auto; }

.image-card .image-wrapper {
  margin: 0 1.5rem 1.5rem 1.5rem;
  margin-right: 1.5rem;
  max-height: 20em;
  overflow: hidden; }
  .image-card .image-wrapper img {
    height: 100%; }

.vertical-padding {
  padding-bottom: 3rem;
  padding-top: 3rem; }
  @media screen and (min-width: 48em) {
    .vertical-padding {
      padding-bottom: 4.5rem;
      padding-top: 4.5rem; } }

.cta-box .cta-bottom {
  padding: 1.5rem 1.5rem 1.5rem 3rem; }
  .cta-box .cta-bottom ul {
    margin-top: 1rem;
    margin-bottom: 2.5rem;
    padding-left: 1.5rem; }
    .cta-box .cta-bottom ul li {
      list-style: none;
      position: relative; }
      .cta-box .cta-bottom ul li::after {
        background: no-repeat url("/icons/small-check.svg");
        content: '';
        height: 8px;
        position: absolute;
        left: -1.5rem;
        top: 50%;
        transform: translate(0, -50%);
        width: 10px; }
      .cta-box .cta-bottom ul li:not(:last-of-type) {
        margin-bottom: 1rem; }

.cta-box .cta-top {
  padding: 9rem 3rem 3rem; }
  .cta-box .cta-top .eyebrow {
    color: #949494;
    font-size: 1rem;
    font-weight: 400;
    margin-bottom: 0.5rem;
    letter-spacing: 0.44px; }
  .cta-box .cta-top.bg-dark, .cta-box .cta-top.bg-dark-gradient {
    background: linear-gradient(115deg, #2D2C2F 15.26%, #000000 140.23%); }

/**
 * Theme Buttons
 * DBS>Interactive
 */
/**
 * 	Button color variable
 *	$grayDarkest: #2d2d2d; —— See _vars.scss
 */
/**
 * Button mixin
 * @param $color1 - foreground color
 * @param $color2 - background color
 */
/**
 *
 *	CSS Classes (or how to apply the mixin declared above)
 *   	Overview:
 *  		There is a .button class
 *  		There is a modifying .button--ghost class
 *  			.button--ghost builds on .button by being included after the button class and applying a few overrides to the .button styling.
 *
 *  			HTML Example:
 *  			<a class="button button--ghost" href="#">Example Button</a>
 *
 *  	Additional styles can be added on a per project basis. When possible, use the .button--ghost class as an example
 *  	and build off of the .button class styles; avoid creating a separate class and using @include button(), for this
 *  	will cause (potential) unnecessary CSS bloat.
 */
/**
 *  Button Styling
 */
.button {
  background-color: #ffffff;
  border: 1px solid #ffffff;
  color: #ffffff;
  display: inline-block;
  font-weight: 600;
  padding: 0.75em 2.5em;
  text-decoration: none;
  transition: all .25s ease;
  -webkit-appearance: nowrap;
  white-space: nowrap;
  /**
	 *  Ghost Button Styling
	 */ }
  .button:hover, .button:active, .button:focus {
    background-color: #ffffff;
    border-color: #ffffff;
    color: #ffffff; }
  .button.arrow {
    padding-right: 3.5rem;
    position: relative; }
    .button.arrow:before, .button.arrow:after {
      content: '';
      height: 1.25rem;
      width: 1.25rem;
      position: absolute;
      top: 50%;
      right: 1.25rem;
      transform: translate(0, -50%);
      transition: .25s ease-in-out; }
    .button.arrow:before {
      background-image: url("/icons/arrow-right-white.svg");
      background-position: center;
      background-repeat: no-repeat;
      background-size: contain;
      opacity: 1; }
    .button.arrow:after {
      background-image: url("/icons/arrow-right.svg");
      background-position: center;
      background-repeat: no-repeat;
      background-size: contain;
      opacity: 0; }
    .button.arrow:hover:before, .button.arrow:hover:after, .button.arrow:focus:before, .button.arrow:focus:after {
      transform: translate(0.5rem, -50%); }
    .button.arrow:hover:before, .button.arrow:focus:before {
      opacity: 0; }
    .button.arrow:hover:after, .button.arrow:focus:after {
      opacity: 1; }
  .button.ghost {
    background-color: transparent;
    color: #000000;
    cursor: pointer;
    border-color: #000000; }
    .button.ghost:hover, .button.ghost:active, .button.ghost:focus {
      background-color: #000000;
      color: #ffffff; }
    .button.ghost.arrow {
      padding: .75rem 4.5rem .75rem 1.5rem; }
      .button.ghost.arrow::after, .button.ghost.arrow::before {
        background-image: url("/icons/arrow-bg-black-circled.svg");
        height: 30px;
        width: 30px; }
      .button.ghost.arrow.angled {
        border-color: #BF0404;
        color: #BF0404;
        font-size: .875rem;
        height: 2.75rem;
        overflow: hidden;
        padding: .75em 4em .75em 1em; }
        .button.ghost.arrow.angled::before {
          background-image: url("/icons/arrow-bg-red-angled.svg");
          background-position: center;
          background-repeat: no-repeat;
          background-size: contain;
          height: 2.75rem;
          right: 0;
          width: 3rem; }
        .button.ghost.arrow.angled:active, .button.ghost.arrow.angled:focus, .button.ghost.arrow.angled:hover {
          background-color: #BF0404;
          color: #F7F6F0; }
    .button.ghost.red {
      color: #BF0404 !important; }
  .button.green {
    background-color: #42BD42;
    border: 1px solid #42BD42;
    color: #ffffff;
    display: inline-block;
    font-weight: 600;
    padding: 0.75em 2.5em;
    text-decoration: none;
    transition: all .25s ease;
    -webkit-appearance: nowrap;
    white-space: nowrap; }
    .button.green:hover, .button.green:active, .button.green:focus {
      background-color: #ffffff;
      border-color: #42BD42;
      color: #42BD42; }
  .button.red {
    background-color: #BF0404;
    border: 1px solid #BF0404;
    color: #ffffff;
    display: inline-block;
    font-weight: 600;
    padding: 0.75em 2.5em;
    text-decoration: none;
    transition: all .25s ease;
    -webkit-appearance: nowrap;
    white-space: nowrap;
    color: #ffffff !important; }
    .button.red:hover, .button.red:active, .button.red:focus {
      background-color: #ffffff;
      border-color: #BF0404;
      color: #BF0404; }
    .button.red:active, .button.red:focus, .button.red:hover {
      color: #BF0404 !important; }
  .button.green:not(.ghost) {
    background-color: #42BD42;
    border: 1px solid #42BD42;
    color: #ffffff;
    display: inline-block;
    font-weight: 600;
    padding: 0.75em 2.5em;
    text-decoration: none;
    transition: all .25s ease;
    -webkit-appearance: nowrap;
    white-space: nowrap;
    color: #ffffff !important; }
    .button.green:not(.ghost):hover, .button.green:not(.ghost):active, .button.green:not(.ghost):focus {
      background-color: #ffffff;
      border-color: #42BD42;
      color: #42BD42; }
    .button.green:not(.ghost):active, .button.green:not(.ghost):focus, .button.green:not(.ghost):hover {
      color: #42BD42 !important; }
  .button.stripe {
    border: 1px solid #E4E5E7 !important;
    font-size: 1rem;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    font-weight: 700;
    margin-top: 1.5rem;
    margin-bottom: 2rem; }

/**
 *	Button styling on a dark background
 */
.bg-dark .button, .bg-dark-gradient .button,
.bg-dark-angled .button,
.white-on-black .button {
  background-color: #BF0404;
  border: 1px solid #BF0404;
  color: #ffffff;
  display: inline-block;
  font-weight: 600;
  padding: 0.75em 2.5em;
  text-decoration: none;
  transition: all .25s ease;
  -webkit-appearance: nowrap;
  white-space: nowrap; }
  .bg-dark .button:hover, .bg-dark-gradient .button:hover, .bg-dark .button:active, .bg-dark-gradient .button:active, .bg-dark .button:focus, .bg-dark-gradient .button:focus,
  .bg-dark-angled .button:hover,
  .bg-dark-angled .button:active,
  .bg-dark-angled .button:focus,
  .white-on-black .button:hover,
  .white-on-black .button:active,
  .white-on-black .button:focus {
    background-color: #ffffff;
    border-color: #BF0404;
    color: #BF0404; }
  .bg-dark .button.ghost, .bg-dark-gradient .button.ghost,
  .bg-dark-angled .button.ghost,
  .white-on-black .button.ghost {
    background-color: transparent;
    border-color: #ffffff;
    color: #ffffff; }
    .bg-dark .button.ghost:hover, .bg-dark-gradient .button.ghost:hover, .bg-dark .button.ghost:active, .bg-dark-gradient .button.ghost:active, .bg-dark .button.ghost:focus, .bg-dark-gradient .button.ghost:focus,
    .bg-dark-angled .button.ghost:hover,
    .bg-dark-angled .button.ghost:active,
    .bg-dark-angled .button.ghost:focus,
    .white-on-black .button.ghost:hover,
    .white-on-black .button.ghost:active,
    .white-on-black .button.ghost:focus {
      background-color: #ffffff;
      color: #000000; }
    .bg-dark .button.ghost.arrow, .bg-dark-gradient .button.ghost.arrow,
    .bg-dark-angled .button.ghost.arrow,
    .white-on-black .button.ghost.arrow {
      font-size: .875rem;
      height: 2.75rem;
      overflow: hidden;
      padding: .75em 4em .75em 1em; }
      .bg-dark .button.ghost.arrow:after, .bg-dark-gradient .button.ghost.arrow:after, .bg-dark .button.ghost.arrow:before, .bg-dark-gradient .button.ghost.arrow:before,
      .bg-dark-angled .button.ghost.arrow:after,
      .bg-dark-angled .button.ghost.arrow:before,
      .white-on-black .button.ghost.arrow:after,
      .white-on-black .button.ghost.arrow:before {
        background-image: url("/icons/arrow-bg-white-angled.svg");
        background-position: center;
        background-repeat: no-repeat;
        background-size: contain;
        height: 2.75rem;
        right: 0;
        width: 3rem; }
        @media screen and (max-width: 47.999em) {
          .bg-dark .button.ghost.arrow:after, .bg-dark-gradient .button.ghost.arrow:after, .bg-dark .button.ghost.arrow:before, .bg-dark-gradient .button.ghost.arrow:before,
          .bg-dark-angled .button.ghost.arrow:after,
          .bg-dark-angled .button.ghost.arrow:before,
          .white-on-black .button.ghost.arrow:after,
          .white-on-black .button.ghost.arrow:before {
            background-image: url("/icons/arrow-bg-white-circled.svg");
            height: 1.875rem;
            right: 1rem;
            width: 1.875rem; } }
      .bg-dark .button.ghost.arrow:active, .bg-dark-gradient .button.ghost.arrow:active, .bg-dark .button.ghost.arrow:focus, .bg-dark-gradient .button.ghost.arrow:focus, .bg-dark .button.ghost.arrow:hover, .bg-dark-gradient .button.ghost.arrow:hover,
      .bg-dark-angled .button.ghost.arrow:active,
      .bg-dark-angled .button.ghost.arrow:focus,
      .bg-dark-angled .button.ghost.arrow:hover,
      .white-on-black .button.ghost.arrow:active,
      .white-on-black .button.ghost.arrow:focus,
      .white-on-black .button.ghost.arrow:hover {
        background-color: transparent;
        color: #ffffff; }
        .bg-dark .button.ghost.arrow:active:after, .bg-dark-gradient .button.ghost.arrow:active:after, .bg-dark .button.ghost.arrow:active:before, .bg-dark-gradient .button.ghost.arrow:active:before, .bg-dark .button.ghost.arrow:focus:after, .bg-dark-gradient .button.ghost.arrow:focus:after, .bg-dark .button.ghost.arrow:focus:before, .bg-dark-gradient .button.ghost.arrow:focus:before, .bg-dark .button.ghost.arrow:hover:after, .bg-dark-gradient .button.ghost.arrow:hover:after, .bg-dark .button.ghost.arrow:hover:before, .bg-dark-gradient .button.ghost.arrow:hover:before,
        .bg-dark-angled .button.ghost.arrow:active:after,
        .bg-dark-angled .button.ghost.arrow:active:before,
        .bg-dark-angled .button.ghost.arrow:focus:after,
        .bg-dark-angled .button.ghost.arrow:focus:before,
        .bg-dark-angled .button.ghost.arrow:hover:after,
        .bg-dark-angled .button.ghost.arrow:hover:before,
        .white-on-black .button.ghost.arrow:active:after,
        .white-on-black .button.ghost.arrow:active:before,
        .white-on-black .button.ghost.arrow:focus:after,
        .white-on-black .button.ghost.arrow:focus:before,
        .white-on-black .button.ghost.arrow:hover:after,
        .white-on-black .button.ghost.arrow:hover:before {
          background-image: url("/icons/arrow-bg-white-angled.svg");
          height: 2.75rem;
          right: 0;
          width: 3rem; }
          @media screen and (max-width: 47.999em) {
            .bg-dark .button.ghost.arrow:active:after, .bg-dark-gradient .button.ghost.arrow:active:after, .bg-dark .button.ghost.arrow:active:before, .bg-dark-gradient .button.ghost.arrow:active:before, .bg-dark .button.ghost.arrow:focus:after, .bg-dark-gradient .button.ghost.arrow:focus:after, .bg-dark .button.ghost.arrow:focus:before, .bg-dark-gradient .button.ghost.arrow:focus:before, .bg-dark .button.ghost.arrow:hover:after, .bg-dark-gradient .button.ghost.arrow:hover:after, .bg-dark .button.ghost.arrow:hover:before, .bg-dark-gradient .button.ghost.arrow:hover:before,
            .bg-dark-angled .button.ghost.arrow:active:after,
            .bg-dark-angled .button.ghost.arrow:active:before,
            .bg-dark-angled .button.ghost.arrow:focus:after,
            .bg-dark-angled .button.ghost.arrow:focus:before,
            .bg-dark-angled .button.ghost.arrow:hover:after,
            .bg-dark-angled .button.ghost.arrow:hover:before,
            .white-on-black .button.ghost.arrow:active:after,
            .white-on-black .button.ghost.arrow:active:before,
            .white-on-black .button.ghost.arrow:focus:after,
            .white-on-black .button.ghost.arrow:focus:before,
            .white-on-black .button.ghost.arrow:hover:after,
            .white-on-black .button.ghost.arrow:hover:before {
              background-image: url("/icons/arrow-bg-white-circled.svg");
              height: 1.875rem;
              right: 1rem;
              width: 1.875rem; } }
  .bg-dark .button.arrow, .bg-dark-gradient .button.arrow,
  .bg-dark-angled .button.arrow,
  .white-on-black .button.arrow {
    padding-right: 3.5rem; }
    .bg-dark .button.arrow:after, .bg-dark-gradient .button.arrow:after,
    .bg-dark-angled .button.arrow:after,
    .white-on-black .button.arrow:after {
      background-image: url("/icons/arrow-right-white.svg");
      background-position: center;
      background-repeat: no-repeat;
      background-size: contain; }
    .bg-dark .button.arrow:before, .bg-dark-gradient .button.arrow:before,
    .bg-dark-angled .button.arrow:before,
    .white-on-black .button.arrow:before {
      opacity: 0; }
    .bg-dark .button.arrow:after, .bg-dark-gradient .button.arrow:after,
    .bg-dark-angled .button.arrow:after,
    .white-on-black .button.arrow:after {
      opacity: 1; }
    .bg-dark .button.arrow:hover:before, .bg-dark-gradient .button.arrow:hover:before, .bg-dark .button.arrow:focus:before, .bg-dark-gradient .button.arrow:focus:before,
    .bg-dark-angled .button.arrow:hover:before,
    .bg-dark-angled .button.arrow:focus:before,
    .white-on-black .button.arrow:hover:before,
    .white-on-black .button.arrow:focus:before {
      opacity: 1; }
    .bg-dark .button.arrow:hover:after, .bg-dark-gradient .button.arrow:hover:after, .bg-dark .button.arrow:focus:after, .bg-dark-gradient .button.arrow:focus:after,
    .bg-dark-angled .button.arrow:hover:after,
    .bg-dark-angled .button.arrow:focus:after,
    .white-on-black .button.arrow:hover:after,
    .white-on-black .button.arrow:focus:after {
      opacity: 0; }

/**
 *	Inline (Arrow) Button Styling
 */
.arrow-link, .link-list li a {
  color: #2D2C2F;
  padding-right: 2rem;
  position: relative;
  text-decoration: none; }
  .arrow-link:after, .link-list li a:after {
    background-image: url("/icons/arrow-right.svg");
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    content: '';
    display: inline-block;
    height: 1.25rem;
    position: absolute;
    top: 50%;
    right: -0;
    transform: translate(0, -50%);
    transition: transform .25s ease-in-out;
    width: 1.25rem; }
  .arrow-link:hover, .link-list li a:hover, .arrow-link:focus, .link-list li a:focus {
    color: #2D2C2F; }
    .arrow-link:hover:after, .link-list li a:hover:after, .arrow-link:focus:after, .link-list li a:focus:after {
      transform: translate(0.5em, -50%); }
  .arrow-link.back, .link-list li a.back {
    padding-left: 2rem; }
    .arrow-link.back:after, .link-list li a.back:after {
      left: 0;
      right: auto;
      transform: translate(0, -50%) rotate(180deg); }
    .arrow-link.back:hover:after, .link-list li a.back:hover:after, .arrow-link.back:focus:after, .link-list li a.back:focus:after {
      transform: translate(-0.5rem, -50%) rotate(180deg); }

.bg-dark .arrow-link, .bg-dark-gradient .arrow-link, .bg-dark .link-list li a, .link-list li .bg-dark a, .bg-dark-gradient .link-list li a, .link-list li .bg-dark-gradient a {
  color: #ffffff; }
  .bg-dark .arrow-link:hover, .bg-dark-gradient .arrow-link:hover, .bg-dark .link-list li a:hover, .link-list li .bg-dark a:hover, .bg-dark-gradient .link-list li a:hover, .link-list li .bg-dark-gradient a:hover, .bg-dark .arrow-link:focus, .bg-dark-gradient .arrow-link:focus, .bg-dark .link-list li a:focus, .link-list li .bg-dark a:focus, .bg-dark-gradient .link-list li a:focus, .link-list li .bg-dark-gradient a:focus {
    color: #ffffff; }
  .bg-dark .arrow-link:after, .bg-dark-gradient .arrow-link:after, .bg-dark .link-list li a:after, .link-list li .bg-dark a:after, .bg-dark-gradient .link-list li a:after, .link-list li .bg-dark-gradient a:after {
    background-image: url("/icons/arrow-right-white.svg"); }

.non-button {
  appearance: none;
  border: none;
  background: none;
  padding: 0;
  text-decoration: underline; }

/**
 * Cookie Popup styles
 * DBS>Interactive
 */
.cookie-popup {
  background: #ffffff;
  box-shadow: 0 0 1rem -0.5rem #000000;
  font-size: .9rem;
  overflow-y: auto;
  padding: 1em;
  position: fixed;
  left: 0;
  bottom: 0;
  width: 100%;
  z-index: 3000; }
  .cookie-popup .contain {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 0 1em; }
  .cookie-popup__heading {
    border-bottom: 1px solid #dadada;
    margin-bottom: 0.5rem;
    padding-bottom: .5rem; }
  .cookie-popup__content {
    line-height: 1.5;
    margin-bottom: 1.5rem; }
  .cookie-popup__learn-more {
    appearance: none;
    background: transparent;
    border: none;
    padding: 0;
    text-decoration: underline; }
  .cookie-popup__buttons {
    max-width: 20em; }
    .cookie-popup__buttons .button {
      background-color: #000000;
      border: 1px solid #000000;
      display: block;
      padding: .5em;
      width: 100%; }
      .cookie-popup__buttons .button:active, .cookie-popup__buttons .button:focus, .cookie-popup__buttons .button:hover {
        background-color: #ffffff;
        color: #000000; }
  @media screen and (min-width: 48em) {
    .cookie-popup .contain {
      -ms-flex-align: center;
      align-items: center;
      -ms-flex-direction: row;
      flex-direction: row;
      -ms-flex-pack: justify;
      justify-content: space-between; }
    .cookie-popup__buttons {
      width: 40%; }
    .cookie-popup__content {
      margin-bottom: 0;
      padding-right: 2em;
      width: 60%; } }

.flex {
  display: -ms-flexbox;
  display: flex; }

.flex-col {
  -ms-flex-direction: column;
  flex-direction: column; }

.flex-col-r {
  -ms-flex-direction: column-reverse;
  flex-direction: column-reverse; }

.flex-row {
  -ms-flex-direction: row;
  flex-direction: row; }

.flex-row-r {
  -ms-flex-direction: row-reverse;
  flex-direction: row-reverse; }

.wrap {
  -ms-flex-wrap: wrap;
  flex-wrap: wrap; }

.nowrap {
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap; }

.aic {
  -ms-flex-align: center;
  align-items: center; }

.aie {
  -ms-flex-align: end;
  align-items: flex-end; }

.asc {
  -ms-flex-item-align: center;
  -ms-grid-row-align: center;
  align-self: center; }

.ase {
  -ms-flex-item-align: end;
  align-self: flex-end; }

.ass {
  -ms-flex-item-align: start;
  align-self: flex-start; }

.jcc {
  -ms-flex-pack: center;
  justify-content: center; }

.jce {
  -ms-flex-pack: end;
  justify-content: flex-end; }

.jcsa {
  -ms-flex-pack: distribute;
  justify-content: space-around; }

.jcsb {
  -ms-flex-pack: justify;
  justify-content: space-between; }

.jcse {
  -ms-flex-pack: space-evenly;
  justify-content: space-evenly; }

.fb-25 {
  -ms-flex-preferred-size: 25%;
  flex-basis: 25%; }

.fb-50 {
  -ms-flex-preferred-size: 50%;
  flex-basis: 50%; }

.fb-75 {
  -ms-flex-preferred-size: 75%;
  flex-basis: 75%; }

@media screen and (max-width: 47.999em) {
  .flex-sm {
    display: -ms-flexbox;
    display: flex; }
  .flex-col-sm {
    -ms-flex-direction: column;
    flex-direction: column; }
  .flex-col-r-sm {
    -ms-flex-direction: column-reverse;
    flex-direction: column-reverse; }
  .flex-row-sm {
    -ms-flex-direction: row;
    flex-direction: row; }
  .flex-row-r-sm {
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse; }
  .wrap-sm {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap; }
  .nowrap-sm {
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap; }
  .aic-sm {
    -ms-flex-align: center;
    align-items: center; }
  .aie-sm {
    -ms-flex-align: end;
    align-items: flex-end; }
  .asc-sm {
    -ms-flex-item-align: center;
    -ms-grid-row-align: center;
    align-self: center; }
  .ase-sm {
    -ms-flex-item-align: end;
    align-self: flex-end; }
  .ass-sm {
    -ms-flex-item-align: start;
    align-self: flex-start; }
  .jcc-sm {
    -ms-flex-pack: center;
    justify-content: center; }
  .jce-sm {
    -ms-flex-pack: end;
    justify-content: flex-end; }
  .jcsa-sm {
    -ms-flex-pack: distribute;
    justify-content: space-around; }
  .jcsb-sm {
    -ms-flex-pack: justify;
    justify-content: space-between; }
  .jcse-sm {
    -ms-flex-pack: space-evenly;
    justify-content: space-evenly; }
  .fb-25-sm {
    -ms-flex-preferred-size: 25%;
    flex-basis: 25%; }
  .fb-50-sm {
    -ms-flex-preferred-size: 50%;
    flex-basis: 50%; }
  .fb-75-sm {
    -ms-flex-preferred-size: 75%;
    flex-basis: 75%; } }

@media screen and (min-width: 48em) {
  .flex-tab {
    display: -ms-flexbox;
    display: flex; }
  .flex-col-tab {
    -ms-flex-direction: column;
    flex-direction: column; }
  .flex-col-r-tab {
    -ms-flex-direction: column-reverse;
    flex-direction: column-reverse; }
  .flex-row-tab {
    -ms-flex-direction: row;
    flex-direction: row; }
  .flex-row-r-tab {
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse; }
  .aic-tab {
    -ms-flex-align: center;
    align-items: center; }
  .aie-tab {
    -ms-flex-align: end;
    align-items: flex-end; }
  .asc-tab {
    -ms-flex-item-align: center;
    -ms-grid-row-align: center;
    align-self: center; }
  .ase-tab {
    -ms-flex-item-align: end;
    align-self: flex-end; }
  .ass-tab {
    -ms-flex-item-align: start;
    align-self: flex-start; }
  .jcc-tab {
    -ms-flex-pack: center;
    justify-content: center; }
  .jce-tab {
    -ms-flex-pack: end;
    justify-content: flex-end; }
  .jcsa-tab {
    -ms-flex-pack: distribute;
    justify-content: space-around; }
  .jcsb-tab {
    -ms-flex-pack: justify;
    justify-content: space-between; }
  .jcse-tab {
    -ms-flex-pack: space-evenly;
    justify-content: space-evenly; }
  .wrap-tab {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap; }
  .nowrap-tab {
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap; }
  .fb-25-tab {
    -ms-flex-preferred-size: 25%;
    flex-basis: 25%; }
  .fb-50-tab {
    -ms-flex-preferred-size: 50%;
    flex-basis: 50%; }
  .fb-75-tab {
    -ms-flex-preferred-size: 75%;
    flex-basis: 75%; } }

@media screen and (min-width: 62em) {
  .flex-md {
    display: -ms-flexbox;
    display: flex; }
  .flex-col-md {
    -ms-flex-direction: column;
    flex-direction: column; }
  .flex-col-r-md {
    -ms-flex-direction: column-reverse;
    flex-direction: column-reverse; }
  .flex-row-md {
    -ms-flex-direction: row;
    flex-direction: row; }
  .flex-row-r-md {
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse; }
  .aic-md {
    -ms-flex-align: center;
    align-items: center; }
  .aie-md {
    -ms-flex-align: end;
    align-items: flex-end; }
  .asc-md {
    -ms-flex-item-align: center;
    -ms-grid-row-align: center;
    align-self: center; }
  .ase-md {
    -ms-flex-item-align: end;
    align-self: flex-end; }
  .ass-md {
    -ms-flex-item-align: start;
    align-self: flex-start; }
  .jcc-md {
    -ms-flex-pack: center;
    justify-content: center; }
  .jce-md {
    -ms-flex-pack: end;
    justify-content: flex-end; }
  .jcsa-md {
    -ms-flex-pack: distribute;
    justify-content: space-around; }
  .jcsb-md {
    -ms-flex-pack: justify;
    justify-content: space-between; }
  .jcse-md {
    -ms-flex-pack: space-evenly;
    justify-content: space-evenly; }
  .wrap-md {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap; }
  .nowrap-md {
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap; }
  .fb-25-md {
    -ms-flex-preferred-size: 25%;
    flex-basis: 25%; }
  .fb-50-md {
    -ms-flex-preferred-size: 50%;
    flex-basis: 50%; }
  .fb-75-md {
    -ms-flex-preferred-size: 75%;
    flex-basis: 75%; } }

@media screen and (min-width: 75em) {
  .flex-lg {
    display: -ms-flexbox;
    display: flex; }
  .flex-col-lg {
    -ms-flex-direction: column;
    flex-direction: column; }
  .flex-col-r-lg {
    -ms-flex-direction: column-reverse;
    flex-direction: column-reverse; }
  .flex-row-lg {
    -ms-flex-direction: row;
    flex-direction: row; }
  .flex-row-r-lg {
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse; }
  .aic-lg {
    -ms-flex-align: center;
    align-items: center; }
  .aie-lg {
    -ms-flex-align: end;
    align-items: flex-end; }
  .asc-lg {
    -ms-flex-item-align: center;
    -ms-grid-row-align: center;
    align-self: center; }
  .ase-lg {
    -ms-flex-item-align: end;
    align-self: flex-end; }
  .ass-lg {
    -ms-flex-item-align: start;
    align-self: flex-start; }
  .jcc-lg {
    -ms-flex-pack: center;
    justify-content: center; }
  .jce-lg {
    -ms-flex-pack: end;
    justify-content: flex-end; }
  .jcsa-lg {
    -ms-flex-pack: distribute;
    justify-content: space-around; }
  .jcsb-lg {
    -ms-flex-pack: justify;
    justify-content: space-between; }
  .jcse-lg {
    -ms-flex-pack: space-evenly;
    justify-content: space-evenly; }
  .wrap-lg {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap; }
  .nowrap-lg {
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap; }
  .fb-25-lg {
    -ms-flex-preferred-size: 25%;
    flex-basis: 25%; }
  .fb-50-lg {
    -ms-flex-preferred-size: 50%;
    flex-basis: 50%; }
  .fb-75-lg {
    -ms-flex-preferred-size: 75%;
    flex-basis: 75%; } }

/**
 * Form Styles
 * DBS>Interactive
 */
.form {
  /**
	* Field Widths/Wrapping
	*/ }
  .form ul {
    list-style: none;
    padding: 0; }
  .form label, .form legend {
    font-weight: bold; }
  .form__field {
    margin-bottom: 1em; }
  .form .error-text {
    border-bottom: 0.1em solid #dadada;
    color: #dadada;
    padding-bottom: 1em; }
  @media screen and (min-width: 48em) {
    .form {
      display: -ms-flexbox;
      display: flex;
      -ms-flex-wrap: wrap;
      flex-wrap: wrap;
      margin: 0 -.75rem; }
      .form__field-wrapper {
        padding: 0 .75rem;
        width: 100%; }
        .form__field-wrapper.width-25 {
          width: 25%; }
        .form__field-wrapper.width-33 {
          width: 33.33%; }
        .form__field-wrapper.width-50 {
          width: 50%; }
        .form__field-wrapper.width-66 {
          width: 66.66%; }
        .form__field-wrapper.width-75 {
          width: 75%; }
      .form .button {
        margin-left: .75rem; } }

fieldset > label.gfield_label_before_complex,
fieldset legend.gfield_label_before_complex,
.hidden_label > label.gfield_label_before_complex,
.hidden_label legend.gfield_label_before_complex,
.hide-label > label.gfield_label_before_complex,
.hide-label legend.gfield_label_before_complex {
  display: none; }

fieldset > label, fieldset legend,
.hidden_label > label,
.hidden_label legend,
.hide-label > label,
.hide-label legend {
  height: 1px;
  width: 1px;
  border: 0;
  clip: rect(0 0 0 0);
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute; }

/**
 * Input Field Styles
 */
input {
  background-color: #FDFDFD;
  border: 1px solid #E4E5E7;
  border-radius: .25rem;
  height: 3.5rem;
  letter-spacing: .25px;
  margin: 0 !important;
  width: 100%;
  /* Firefox (hides the default icon) */
  /* Edge */ }
  input[type="date"] {
    text-transform: uppercase; }
  input[type="date"], input[type="time"], input:-ms-input-placeholder {
    color: #848A95;
    font-size: .875rem; }
  input[type="date"], input[type="time"], input::placeholder {
    color: #848A95;
    font-size: .875rem; }
  input[type="date"], input[type="time"] {
    appearance: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important; }
  input[type="date"]::-webkit-calendar-picker-indicator, input[type="time"]::-webkit-calendar-picker-indicator {
    display: none;
    -webkit-appearance: none; }
  input[type="date"] {
    position: relative; }
  input[type="date"]::-ms-clear, input[type="date"]::-ms-reveal {
    display: none; }
  input[type="date"]::-moz-focus-inner {
    border: 0; }

input[type=radio] {
  margin-right: .5em; }

select {
  appearance: none !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  background-color: #FDFDFD;
  border: 1px solid #E4E5E7;
  border-radius: .25rem;
  cursor: pointer;
  font-size: 0.875rem;
  height: 3.5rem;
  letter-spacing: .25px;
  margin: 0 !important;
  min-width: 25%;
  padding: 10px;
  width: 100%; }
  select:-ms-input-placeholder {
    color: #848A95; }
  select::placeholder {
    color: #848A95; }

/* select {
	margin: 0;
} */
textarea {
  background-color: #FDFDFD;
  border: 1px solid #E4E5E7;
  border-radius: .25rem;
  border-radius: 10px;
  font-size: 1rem;
  height: 3.5rem;
  letter-spacing: .25px;
  margin: 0 !important;
  min-height: 11rem;
  padding: 1.25rem 1rem;
  width: 100%; }
  textarea:-ms-input-placeholder {
    color: #848A95; }
  textarea::placeholder {
    color: #848A95; }

/* textarea {
	min-height: 5em;
} */
textarea,
input[type=text]:not([id=search-input]),
input[type=email],
input[type=date],
input[type=number],
input[type=time],
input[type=week],
input[type=month],
input[type=tel],
input[type=search],
input[type=url],
.gfield select {
  display: block;
  border: 1px solid #dadada;
  margin: .333em 0;
  max-width: 100%;
  padding: .666em;
  width: 100%; }

fieldset {
  border: none;
  margin-bottom: 3rem;
  padding: 0 !important; }

/**
 * Validation and error message styling
 */
.error-text {
  color: red; }

/**
 * Animated Form Label
 *
 * Class must be added in the GForms admin
 */
.animate-label {
  position: relative; }
  .animate-label .ginput_complex > span {
    height: 100%;
    width: 100%;
    display: inline-block;
    position: relative; }
    .gform_validation_error .animate-label label, .gform_validation_error .animate-label legend, .animate-label .ginput_complex > span.active label, .animate-label .ginput_complex > span.active legend {
      transform: translateY(-2.25rem) scale(0.75); }
  .animate-label .ginput_complex.gfield_error label {
    transform: translateY(-2.25rem) scale(0.75); }
  .animate-label label, .animate-label legend {
    background: white;
    padding: 0 .25rem;
    position: absolute;
    top: 50%;
    left: .5rem;
    transition: .2s ease-in-out;
    transform: translateY(-50%);
    transform-origin: left; }
  .animate-label.select-field select {
    font-weight: 700;
    padding: 1.5rem .75rem; }
  .animate-label.text-area label {
    top: .5rem;
    transform: none; }
  .animate-label.text-area textarea {
    max-height: 12rem;
    padding-top: 3rem; }
  .animate-label.text-area.gfield_error label, .animate-label.text-area.gfield_error legend {
    transform: none; }
  .gform_validation_error .animate-label label, .gform_validation_error .animate-label legend, .animate-label.active label, .animate-label.active legend {
    transform: translateY(-2.25rem) scale(0.75); }

.add-icon {
  background: url("../icons/add-circle.svg") no-repeat center;
  height: 1.5rem;
  position: absolute;
  top: 1rem;
  right: 1rem;
  width: 1.5rem; }

.date-icon {
  background: url("../icons/calendar-month.svg") no-repeat center;
  height: 20px;
  width: 18px; }

.date-icon,
.time-icon {
  pointer-events: none; }

.date-icon,
.select-icon,
.time-icon {
  background-position: center;
  background-size: 100%;
  content: '';
  cursor: pointer;
  height: 2rem;
  position: absolute;
  top: 63%;
  right: 1rem;
  transform: translateY(-50%);
  width: 1.5rem; }

.field-wrapper {
  display: inline-block;
  margin-bottom: 1rem;
  padding-top: 1.5rem;
  position: relative;
  width: 100%; }
  .field-wrapper input:focus {
    box-shadow: none; }
  .field-wrapper input:-ms-input-placeholder {
    opacity: 0; }
  .field-wrapper input::placeholder {
    opacity: 0; }
  .field-wrapper input,
  .field-wrapper select {
    padding-right: 2.5rem; }
  .field-wrapper label {
    color: #8A8B8C;
    position: absolute;
    top: .75rem;
    left: 0;
    transition: transform .4s ease; }
  .field-wrapper ul {
    list-style: none;
    padding-left: 0; }
  .field-wrapper.floating-label {
    padding-top: 0; }
    .field-wrapper.floating-label label {
      position: absolute;
      top: 1rem;
      left: .75rem;
      z-index: 1; }
    .field-wrapper.floating-label.active label {
      font-size: .8rem;
      transform: translate(0, -1.1rem); }
  .field-wrapper.textarea-wrapper label {
    position: relative;
    top: 0; }

.select-icon {
  background: url("../icons/arrow-down-red.svg") no-repeat center;
  height: 7px;
  pointer-events: none;
  width: 14px; }

.tel-wrapper {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: start;
  justify-content: flex-start; }
  .tel-wrapper .custom-select-wrapper + .phone-wrapper label {
    left: 7rem; }
  .tel-wrapper .phone-wrapper {
    width: 100%; }
  .tel-wrapper .tel-select-wrapper {
    position: relative;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    height: 3.625rem; }
    .tel-wrapper .tel-select-wrapper #flag-icon {
      position: absolute;
      left: .25rem;
      top: 50%;
      transform: translateY(-50%);
      width: 28px;
      height: 17px;
      background-size: cover;
      background-position: center;
      margin-right: 0.5rem;
      z-index: 1; }
    .tel-wrapper .tel-select-wrapper select {
      appearance: none;
      border: 1px solid #ccc;
      padding: 0.5rem 2rem 0.5rem 0.5rem;
      font-size: 1rem;
      height: 100%;
      min-width: 12rem;
      background-color: white;
      background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 10 6' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%23666'/%3E%3C/svg%3E");
      background-repeat: no-repeat;
      background-position: right 0.5rem center;
      background-size: 0.65rem; }
  .tel-wrapper.tel-wrapper label {
    left: 1rem; }
  .tel-wrapper.tel-wrapper.active label {
    transform: translate(0, -1.2rem); }

.time-icon {
  background: url("../icons/schedule.svg") no-repeat center;
  height: 20px;
  width: 20px; }

.custom-select-wrapper {
  position: relative;
  width: 7rem;
  cursor: pointer;
  margin-right: 0.5rem; }
  .custom-select-wrapper .selected-flag-code {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 0.25rem;
    height: 3.625rem;
    border: 1px solid #ccc;
    border-radius: 4px;
    background-color: white;
    padding: .5rem; }
    .custom-select-wrapper .selected-flag-code img {
      width: 28px;
      height: 17px;
      margin-right: 0.5rem; }
    .custom-select-wrapper .selected-flag-code span {
      font-size: 0.875rem; }
  .custom-select-wrapper .custom-select-list {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 100;
    background: white;
    border: 1px solid #ccc;
    width: 25rem;
    max-height: 200px;
    overflow-y: auto;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1); }
    .custom-select-wrapper .custom-select-list li {
      padding: 0.5rem;
      display: -ms-flexbox;
      display: flex;
      -ms-flex-align: center;
      align-items: center;
      gap: 0.5rem;
      font-size: 0.875rem; }
      .custom-select-wrapper .custom-select-list li img {
        width: 20px;
        height: 12px; }
      .custom-select-wrapper .custom-select-list li:hover {
        background-color: #f0f0f0; }
  .custom-select-wrapper.open .custom-select-list {
    display: block; }

.constants-form label {
  color: #000000;
  display: block;
  font-weight: 600;
  margin-bottom: .25rem;
  position: static; }

.constants-form .field-wrapper {
  margin-bottom: .5rem; }

/**
 * Header styles
 * DBS>Interactive
 *
 * 		site-header - the page's main header element
 * 			site-header__branding - the company logo
 * 			site-header__navigation - the site navigation
 * 				NOTE: Put navigation styles in _navigation.scss.
 *
 * ************************************************************************
 * This file is for the general header/branding styles. For specific
 * menu/navigation files, use _navigation.scss.
 * ************************************************************************
 */
.site-header {
  background: #000000;
  position: relative;
  z-index: 1000;
  /**
	 * Company logo in site header
	 */ }
  .site-header h1 {
    padding-top: 1rem; }
  .site-header__container {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 0 1.5rem; }
  .site-header__branding {
    padding: .5rem 0;
    /**
		 * Anchor tag that wraps svg element (logo graphic) for site homepage link
		 */ }
    .site-header__branding img {
      width: 195px; }
    .site-header__branding a {
      display: block;
      line-height: 0;
      margin-left: -.25em;
      padding: .25em; }
  @media screen and (min-width: 48em) {
    .site-header__branding img {
      width: 274px; } }

/**
 * Slate Navigation Styles
 * DBS>Interactive
 *
 * ************************************************************************
 * This file is for the navigation menu in the header - both the mobile and
 * desktop menu. Keep header/branding specific styles in _header.scss.
 * ************************************************************************
 *
 * 		menu-toggle - the hamburger menu button
 * 			open - the class given when the toggle button is in the open state
 * 			menu-toggle__bar - the individual hamburger bars
 * 		submenu-toggle - a submenu toggle button
 * 			open - the class given when the toggle button is in the open state
 *
 * 		site-header__navigation - the header container for all site header
 * 			navigation.
 *
 * 			secondary-menu - the (nav element) container for the secondary menu
 * 			main-menu - the (nav element) container for the main menu
 *
 * 		menu - the container class for a menu ( ul element )
 * 			open - the class added to a ( mobile ) menu that is opened
 *
 * 			menu__item - a menu item ( li element )
 * 				menu__item--active - the active item ( current page )
 * 				menu__item--parent - an item that has a submenu
 *
 * 			menu__submenu - a submenu element ( ul element )
 * 				menu__submenu--l1 - a first level submenu
 * 				menu__submenu--l2 - etc...
 *
 */
/**
 * Hamburger Icon
 */
.menu-toggle {
  background-color: transparent;
  border: 0;
  display: block;
  height: 20px;
  padding: 0;
  width: 20px; }
  .menu-toggle__bar {
    background: #ffffff;
    border-radius: 1rem;
    display: block;
    height: 3px;
    margin: 0 auto 5.5px;
    opacity: 1;
    transition: transform 0.25s, width 0.25s;
    width: 100%; }
    .menu-toggle__bar:last-child {
      margin-bottom: 0; }
  .menu-toggle > .menu-toggle__bar:nth-child(1) {
    transform: translate(-3px, 0);
    width: 14px; }
  .menu-toggle > .menu-toggle__bar:nth-child(3) {
    width: 9px;
    transform: translate(-5.5px, 0); }
  .menu-toggle.open > .menu-toggle__bar:nth-child(1) {
    margin: 0 auto 6px;
    transform: translate(0, 9px) rotate(45deg);
    width: 20px; }
  .menu-toggle.open > .menu-toggle__bar:nth-child(2) {
    margin: 0 auto 6px;
    width: 0; }
  .menu-toggle.open > .menu-toggle__bar:nth-child(3) {
    transform: translate(0, -9px) rotate(-45deg);
    width: 20px; }
  @media screen and (min-width: 48em) {
    .menu-toggle {
      display: none; } }

/**
 * Submenu Toggle Icon
 */
.submenu-toggle {
  background-color: transparent;
  border: 0;
  height: 3.25rem;
  margin: 0;
  padding: 0;
  position: absolute;
  top: 0;
  right: 0;
  transition: transform 0.25s ease-in-out;
  transform: none;
  width: 3rem;
  z-index: 1; }
  .submenu-toggle svg {
    height: 2rem;
    width: .75rem;
    transition: transform .25s ease-in-out; }
  .submenu-toggle.open svg {
    transform: rotate(180deg); }
  @media screen and (min-width: 48em) {
    .submenu-toggle {
      height: 2rem;
      top: 50%;
      transform: translateY(-53%);
      right: -1.25rem;
      width: 2rem; }
      .submenu-toggle svg {
        height: 100%; }
      .menu__submenu > .menu__item > .submenu-toggle {
        opacity: 1;
        right: 0;
        transform: translateY(-50%) rotate(-90deg); } }

@media screen and (min-width: 48em) {
  .subitem .submenu-toggle {
    position: absolute;
    top: 50%; } }

/**
 * General Menu Styles
 *
 * These styles apply to both the mobile and the desktop menu.
 */
.site-header__navigation > nav {
  font-family: "Golos Text", "Open Sans", "Verdana", "Helvetica", sans-serif;
  z-index: 100; }
  .site-header__navigation > nav ul {
    list-style: none;
    margin: 0;
    padding: 0; }
  .site-header__navigation > nav a {
    color: #ffffff;
    display: block;
    font-size: 1em;
    font-weight: 600;
    text-decoration: none; }
    .site-header__navigation > nav a:hover, .site-header__navigation > nav a:active, .site-header__navigation > nav a:focus {
      color: #cccccc; }

/**
 * Mobile Menu Styles
 */
@media screen and (max-width: 47.999em) {
  .site-header__navigation {
    background-color: #000000;
    border-bottom: 1px solid rgba(255, 255, 255, 0.35);
    max-height: 100vh;
    position: absolute;
    top: 100%;
    left: 0;
    transform: translate3d(-100%, 0, 0);
    transition: transform .25s ease-in-out, visibility 0s .25s linear;
    visibility: hidden;
    width: 100vw;
    /**
		 * Styles for when the mobile menu is opened.
		 */ }
    .site-header__navigation > nav a {
      font-size: 1.5rem; }
    .site-header__navigation > nav ul {
      margin-bottom: 0.75rem;
      padding-left: 0.75rem;
      padding-right: 0.75rem; }
    .site-header__navigation.open {
      transform: translate3d(0, 0, 0);
      transition: transform .25s ease-in-out, visibility 0s 0s linear;
      visibility: visible; }
  .menu {
    /**
		 * Individual menu item
		 */
    /**
		 * Submenu
		 */ }
    .menu__item {
      display: block;
      padding: 1.5rem;
      position: relative; }
      .menu__item:not(:last-child) {
        border-bottom: 1px solid rgba(255, 255, 255, 0.35); }
    .menu__submenu {
      background-color: #f0f0f0;
      max-height: 0;
      overflow: hidden;
      /**
			 * Submenus when hovering parent
			 */
      /**
			 * Submenu item styles
			 */
      /**
			 * Sub-Submenus
			 */ }
      .open > .menu__submenu {
        max-height: none; }
      .menu__submenu .menu__item a {
        background-color: white;
        padding-left: 3rem;
        text-transform: none; }
      .menu__submenu .menu__submenu a {
        padding-left: 4.5rem; } }

/**
 * Desktop Menu Styles
 */
@media screen and (min-width: 48em) {
  .main-menu,
  .secondary-menu {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: end;
    justify-content: flex-end; }
  .secondary-menu {
    margin: 1rem 0; }
  .main-menu .login {
    margin-left: 1rem; }
  .main-menu .menu__item.toplevel a {
    padding: 1rem .5rem;
    text-align: center; }
  .menu {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-direction: row;
    flex-direction: row;
    -ms-flex-pack: end;
    justify-content: flex-end;
    position: relative;
    /**
		 * Individual menu item
		 */
    /**
		 * Submenu
		 */ }
    .menu__item {
      display: block;
      margin: 0 .5em;
      position: relative; }
      .menu__item a {
        padding: .25rem .5rem; }
    .menu__item--parent {
      display: -ms-flexbox;
      display: flex;
      -ms-flex-align: center;
      align-items: center; }
      .menu__item--parent .submenu-toggle svg {
        transition: .25s transform; } }
    @media screen and (min-width: 48em) and (min-width: 48em) {
      .menu__item--parent:hover > .submenu-toggle svg, .menu__item--parent:focus > .submenu-toggle svg {
        transform: rotate(180deg); } }

@media screen and (min-width: 48em) {
    .menu__submenu {
      background-color: #e5e5e5;
      opacity: 0;
      position: absolute;
      top: 100%;
      left: 0;
      transition: opacity .25s ease-in-out, visibility .25s ease-in-out;
      visibility: hidden;
      width: 16em;
      /**
			 * Submenus with open class and when hovering parent
			 */
      /**
			 * Submenu item styles
			 */
      /**
			 * Sub-Submenus
			 */ }
      .open > .menu__submenu,
      .menu__item--parent:hover > .menu__submenu {
        opacity: 1;
        transition: opacity .125s ease-in-out, visibility .125s ease-in-out;
        visibility: visible; }
      .menu__submenu .menu__item {
        margin: 0; }
        .menu__submenu .menu__item a {
          padding: .75em 1.25em;
          text-transform: none;
          width: 100%; }
          .menu__submenu .menu__item a:hover {
            background-color: white; }
      .menu__submenu .menu__submenu {
        border-left: 1px solid #3b4646;
        left: 100%;
        top: 0;
        transform: none; } }

@media (min-width: 48rem) and (max-width: 54.999rem) {
  .main-menu .menu__item {
    margin: 0; } }

/**
 * Header Search Form
 */
.search-form {
  -ms-flex-item-align: stretch;
  -ms-grid-row-align: stretch;
  align-self: stretch;
  border-top: 1px solid #e5e5e5;
  z-index: 1000; }
  .search-form__form {
    transition: .25s ease-in-out;
    width: 100%;
    z-index: 10; }
  .search-form__container {
    display: block;
    float: right;
    position: relative;
    width: 100%; }
  .search-form__field {
    background: #ffffff;
    border: none;
    display: block;
    height: 100%;
    width: 100%;
    padding: 1em; }
  .search-form__button {
    background: none;
    border: none;
    position: relative;
    top: -0.5em;
    padding: 0;
    width: 100%; }
  .search-form__button--open, .search-form__button--search, .search-form__button--close {
    background-color: transparent;
    background: url("/icons/search.svg") no-repeat center;
    background-repeat: no-repeat;
    background-position: right;
    background-size: 1.75em;
    border: none;
    display: block;
    height: 100%;
    transition: .5s;
    width: 2.5rem; }
    .search-form__button--open:focus, .search-form__button--open:hover, .search-form__button--search:focus, .search-form__button--search:hover, .search-form__button--close:focus, .search-form__button--close:hover {
      background-color: transparent;
      border: 0; }
  .search-form__button--search {
    background-position: center;
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%); }
  .search-form .search-form__button--close {
    display: none;
    background-image: url("/icons/close-symbol.svg");
    background-position: .5rem center;
    background-size: 2.5em;
    z-index: 1; }
  .search-form .search-form__button--open {
    display: none; }
  @media screen and (min-width: 48em) {
    .search-form {
      border: none; }
      .search-form__form {
        height: 0;
        overflow: hidden;
        position: absolute;
        top: 100%;
        right: 1rem;
        width: 20em; }
      .search-form .search-form__button--open {
        display: block; } }

.search-form--active .search-form__form {
  height: 100%; }

.search-form--active .search-form__button--open {
  display: none; }

.search-form--active .search-form__button--close {
  display: block; }

@media screen and (min-width: 48em) {
  .search-form--active .search-form__container {
    display: block;
    width: 100%; } }

/* Typography and Button Styles */
/* Heading Styles */
h1, .h1 {
  font-size: 1rem !important; }

h2, .h2 {
  font-size: 1.5rem !important;
  line-height: 1.5; }

h3, .h3 {
  font-size: 1.25rem !important;
  line-height: 1.6; }

h4, .h4, h5, .h5, h6, .h6 {
  font-size: 1rem; }

/* Eyebrow Styles */
.eyebrow {
  font-size: .625rem !important; }

/* Horizontal Rule */
hr {
  margin: 1rem 0; }

.divider-with-text {
  margin: 2rem auto 2rem auto;
  position: relative;
  width: fit-content; }
  .divider-with-text::before {
    background-color: #979797;
    content: '';
    display: inline-block;
    height: 1px;
    position: absolute;
    top: 50%;
    right: 2rem;
    transform: translateY(-50%);
    width: 4rem; }
  .divider-with-text::after {
    background-color: #979797;
    content: '';
    display: inline-block;
    height: 1px;
    position: absolute;
    top: 50%;
    left: 2rem;
    transform: translateY(-50%);
    width: 4rem; }

/* Button Styles */
.button {
  background-color: #BF0404;
  border-color: #BF0404;
  border-radius: 2rem;
  padding: 1rem 3.5rem;
  text-align: center;
  width: 100%; }
  .button.ghost {
    background-color: transparent;
    border: 2px solid #000000;
    font-weight: 400; }
    .button.ghost:hover, .button.ghost:focus, .button.ghost:active {
      border-color: #000000;
      color: #ffffff; }
    .button.ghost.red {
      border-color: #BF0404;
      color: #BF0404; }
      .button.ghost.red:hover, .button.ghost.red:focus, .button.ghost.red:active {
        background-color: #BF0404;
        color: #ffffff !important; }
      .button.ghost.red.bold {
        font-weight: 700 !important; }
  .button.disabled {
    background-color: rgba(138, 139, 140, 0.12);
    border-color: rgba(138, 139, 140, 0.12);
    color: #8A8B8C; }
  .button:hover, .button:focus, .button:active {
    border-color: #BF0404;
    color: #BF0404; }

.back-btn {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: center;
  justify-content: center;
  height: 5rem;
  width: 5rem; }

/* Layout */
body {
  position: relative; }

.invitation-header,
.main,
.footer {
  margin-left: auto;
  margin-right: auto;
  max-width: 50rem; }

/* Header */
.header {
  background-color: #000000;
  height: 5rem;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: justify;
  justify-content: space-between;
  position: relative;
  z-index: 10; }
  .header button {
    background-color: transparent;
    border: 0;
    cursor: pointer;
    height: 5rem;
    pointer-events: auto;
    position: relative;
    width: 5rem; }
    .header button img {
      cursor: pointer;
      pointer-events: auto;
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%); }
  .header .site-logo {
    margin-left: .625rem;
    /* nudges logo right to appear more centered in header */ }
  .header.login nav > ul {
    margin-left: auto;
    margin-right: auto;
    max-width: 50rem; }

/* Main */
.main {
  padding: 2rem 1.5rem 0; }
  .main section p {
    color: #202020; }
  .main section:hover::after .main section:focus::after .main section:active::after {
    transform: translateX(0.5rem);
    transition: transform .5s ease-in; }
  .main section:not(:last-of-type) {
    margin-bottom: 2rem; }

/* Footer */
.footer {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: justify;
  justify-content: space-between;
  padding-bottom: 3rem; }
  .footer a:not(.button) {
    color: #BF0404;
    font-weight: 400; }
    .footer a:not(.button):active, .footer a:not(.button):focus, .footer a:not(.button):hover {
      color: #fb2e2e; }
  .footer .button {
    width: fit-content; }

/* Navigation Styles */
nav {
  height: 2.5rem;
  overflow-x: scroll;
  position: absolute;
  bottom: -.25rem;
  left: 0;
  width: 100%; }
  nav ul {
    display: -ms-flexbox;
    display: flex;
    gap: .5rem;
    height: calc(100% - .25rem);
    list-style: none;
    margin-bottom: 0;
    padding-left: 1.5rem; }
    nav ul li {
      color: #EEEC0E;
      cursor: pointer;
      font-size: 0.875rem;
      padding: 0 1rem;
      text-decoration: none; }
      nav ul li a {
        color: #454B66; }
      nav ul li.active {
        border-bottom: 3px solid #EEEC0E;
        cursor: default; }
      nav ul li.active a:active,
      nav ul li.active a:focus,
      nav ul li.active a:hover {
        color: #EEEC0E; }

.close-btn {
  display: none; }

.menu {
  background-color: #000;
  height: 100%;
  min-height: 0;
  max-height: 0;
  overflow: hidden;
  position: absolute;
  top: 0;
  left: 0;
  transition: max-height .6s ease-in, min-height .6s ease-in;
  width: 100%;
  z-index: 1; }
  .menu nav {
    height: 100%;
    margin-top: 6rem;
    position: relative; }
    .menu nav ul {
      -ms-flex-direction: column;
      flex-direction: column;
      list-style: none;
      padding-left: 0.75rem;
      padding-right: 0.75rem; }
      .menu nav ul li {
        font-size: 1.5rem;
        line-height: 1;
        opacity: 0;
        padding: 1.5rem; }
        .menu nav ul li a {
          font-weight: 500;
          text-decoration: none; }
        .menu nav ul li:not(:last-of-type) {
          border-bottom: 1px solid rgba(255, 255, 255, 0.35); }
  .menu.open {
    min-height: 27rem;
    transition: max-height 1.2s ease-out, min-height 1.2s ease-out; }
    .menu.open nav ul li:nth-child(1) {
      transition: opacity .6s 0s ease-out; }
    .menu.open nav ul li:nth-child(2) {
      transition: opacity 1s .2s ease-out; }
    .menu.open nav ul li:nth-child(3) {
      transition: opacity 1.4s .4s ease-out; }
    .menu.open nav ul li:nth-child(4) {
      transition: opacity 1.8s .6s ease-out; }
  .menu:not(.open) nav ul li:nth-child(1) {
    transition: opacity .3s .3s ease-out; }
  .menu:not(.open) nav ul li:nth-child(2) {
    transition: opacity .3s .2s ease-out; }
  .menu:not(.open) nav ul li:nth-child(3) {
    transition: opacity .3s .1s ease-out; }
  .menu:not(.open) nav ul li:nth-child(4) {
    transition: opacity .3s 0s ease-out; }

.tab-panel {
  display: none; }
  .tab-panel.active {
    display: block; }

/* Module-Specific Styles */
.account hr {
  margin: 2rem 0 2rem calc(0.75rem * -1); }

.account .arrow-link::after, .account .link-list li a::after, .link-list li .account a::after {
  background-image: url("/icons/arrow-right-dark-blue.svg");
  background-size: contain;
  top: unset;
  bottom: .2rem;
  right: .5rem;
  height: .5rem;
  transform: none;
  width: .5rem; }

.account .arrow-link:hover:after, .account .link-list li a:hover:after, .link-list li .account a:hover:after, .account .arrow-link:focus:after, .account .link-list li a:focus:after, .link-list li .account a:focus:after {
  transform: translate(0.5rem, 0);
  transition: transform .4s ease-in; }

.account .header nav {
  height: 3.5rem;
  overflow: visible; }
  .account .header nav ul {
    padding-left: 0; }
    .account .header nav ul li {
      color: rgba(255, 255, 255, 0.5);
      font-size: 1.25rem;
      font-weight: 400;
      line-height: 2rem;
      text-align: center;
      width: 50%; }
      .account .header nav ul li a {
        color: rgba(255, 255, 255, 0.5);
        font-weight: 400;
        text-decoration: none; }
      .account .header nav ul li.active a {
        color: #EEEC0E; }

.account .main {
  margin: 0 auto 2rem;
  text-align: center; }
  .account .main h1 {
    font-size: 2rem !important; }

.account:not(.forgot-password):not(.reset-password):not(.profile) .header {
  -ms-flex-align: start !important;
  align-items: flex-start !important;
  height: 10.25rem;
  padding-top: 2rem; }

.account.create-acct .footer {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  padding: 1.5rem;
  text-align: center; }
  .account.create-acct .footer .button {
    font-size: 1rem;
    width: 100%; }
    .account.create-acct .footer .button.ghost {
      border: 1px solid #E4E5E7;
      display: -ms-flexbox;
      display: flex;
      -ms-flex-align: center;
      align-items: center;
      -ms-flex-pack: center;
      justify-content: center;
      font-weight: 700;
      margin-top: 1.5rem;
      margin-bottom: 2rem; }

.account.create-acct .header {
  text-align: center; }
  .account.create-acct .header nav {
    display: none; }
    .account.create-acct .header nav.visible {
      display: block; }
  .account.create-acct .header .wrapper {
    width: 100%; }

.account.create-acct .main {
  padding-top: 2.5rem;
  text-align: start; }
  .account.create-acct .main .custom-card-form {
    background: #f9f9f9;
    padding: 1.5rem;
    border: 1px solid #ddd;
    border-radius: 8px; }
  .account.create-acct .main .field-wrapper input {
    height: 3.625rem;
    padding: .5rem 1rem; }
  .account.create-acct .main .field-wrapper label {
    transition: transform .4s ease, font-size .4s ease, color .4s ease; }
  .account.create-acct .main .field-wrapper input,
  .account.create-acct .main .field-wrapper label {
    font-size: 0.875rem; }
  .account.create-acct .main .field-wrapper.tel-wrapper label {
    left: 7rem; }
  .account.create-acct .main .field-wrapper.tel-wrapper.active label {
    transform: translate(0, -1.2rem); }

.account.forgot-password .main .field-wrapper label {
  top: 50%;
  transform: translate(0, -50%); }

.account.forgot-password .main .field-wrapper ul {
  position: absolute;
  bottom: -3rem; }

.account.forgot-password .main .field-wrapper.active label {
  top: 50%;
  transform: translate(0, calc(-50% - 1.75rem)); }

.account.sign-in .main .field-wrapper label {
  top: 0; }

.account.sign-in .main .field-wrapper input {
  border: none;
  border-bottom: 1px solid #EAEAEA;
  color: #18224C;
  font-size: 1rem;
  padding: .666rem 2.5rem .666rem .666rem; }

.account.sign-up .main .button {
  border: 1px solid #E4E5E7;
  border-radius: 0.75rem;
  font-size: 0.875rem;
  font-weight: 500; }

.account.sign-up .main .field-wrapper input,
.account.forgot-password .main .field-wrapper input,
.account.reset-password .main .field-wrapper input {
  border-radius: 2rem;
  font-size: 1rem;
  padding-left: 1.75rem; }

.account.sign-up .main .field-wrapper label,
.account.forgot-password .main .field-wrapper label,
.account.reset-password .main .field-wrapper label {
  background-color: #fff;
  left: 1.5rem;
  padding: 0 .25rem; }

.account.sign-up .main h1,
.account.forgot-password .main h1,
.account.reset-password .main h1 {
  margin-top: 1rem; }

.account.sign-up .divider-with-text::after,
.account.sign-up .divider-with-text::before {
  background-color: #D6D6D6;
  width: 8rem; }

.account.subscription .footer {
  max-width: 50rem;
  margin-left: auto;
  margin-right: auto;
  padding: 0 1.5rem 3rem; }
  .account.subscription .footer .button {
    width: 100%; }

.account.subscription .main .description {
  padding-right: 4.5rem; }

.account.subscription .main .heading h2 {
  color: #282A3E;
  font-size: 2rem !important;
  margin-bottom: 2rem; }

.account.subscription .main .plan-header {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: justify;
  justify-content: space-between;
  margin-bottom: 1.5rem; }
  .account.subscription .main .plan-header h5 {
    margin-bottom: 0; }
  .account.subscription .main .plan-header .price {
    color: #18224C;
    font-size: 1.5rem;
    font-weight: 600; }
  .account.subscription .main .plan-header .font_small {
    color: #18224C;
    font-weight: 600; }

.account.subscription .main .plan-type {
  background-color: #F7F6F0;
  cursor: pointer;
  min-height: 15rem;
  margin-bottom: 1rem;
  padding: 1.5rem 1.5rem 3rem;
  position: relative;
  text-align: start; }
  .account.subscription .main .plan-type h5 {
    color: #18224C;
    font-size: 1.5rem; }
  .account.subscription .main .plan-type img {
    display: block;
    margin-left: -.75rem; }
  .account.subscription .main .plan-type p {
    color: #454B66; }
  .account.subscription .main .plan-type:hover::after, .account.subscription .main .plan-type:focus::after, .account.subscription .main .plan-type:active::after {
    transform: translateX(0.5rem);
    transition: transform .5s ease-in; }
  .account.subscription .main .plan-type::after {
    background: center/contain no-repeat url("/icons/arrow-right-dark-blue.svg");
    content: '';
    height: .75rem;
    position: absolute;
    right: 1rem;
    bottom: 1rem;
    transition: transform .5s ease-out;
    width: .75rem; }

.appointment form button {
  background-color: #F7F6F0;
  border-radius: .25rem;
  border: none;
  box-shadow: -1px -1px 4px 0px rgba(0, 0, 0, 0.08) inset;
  font-size: 0.875rem;
  height: 2.75rem;
  letter-spacing: 0.25px;
  padding: .5rem 1rem;
  text-align: start;
  width: 100%; }
  .appointment form button:active, .appointment form button.active {
    background-color: #efece0; }

.appointment form .collateral-btns {
  margin-bottom: 6rem; }

.appointment hr {
  width: calc(100% + 1.5rem); }

.appointment .cost-row {
  -ms-flex-align: center;
  align-items: center; }
  .appointment .cost-row .left h5 {
    margin-bottom: .25rem; }
  .appointment .cost-row .left p {
    font-size: 0.875rem;
    margin-bottom: 0; }
  .appointment .cost-row .right {
    font-family: Helvetica, sans-serif;
    font-size: 2.25rem;
    font-weight: 700; }

.appointment .footer {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 1rem;
  -ms-flex-pack: justify;
  justify-content: space-between;
  padding: 1rem 1.5rem 3rem; }
  .appointment .footer a {
    color: #282A3E;
    font-weight: 400;
    text-decoration: none; }
    .appointment .footer a:active, .appointment .footer a:focus, .appointment .footer a:hover {
      color: #585c88; }

.appointment .main {
  padding: 2rem 1.5rem 0; }
  .appointment .main section {
    background-color: #F7F6F0;
    cursor: pointer;
    padding: 2rem 1.5rem 3rem;
    position: relative; }
    .appointment .main section:active::after, .appointment .main section:focus::after, .appointment .main section:hover::after {
      transform: translateX(0.5rem);
      transition: transform .5s ease-in; }
    .appointment .main section:not(:last-of-type) {
      margin-bottom: 2rem; }
    .appointment .main section::after {
      background: center no-repeat url("../icons/arrow-right-red.svg");
      content: '';
      height: 1rem;
      position: absolute;
      right: 1rem;
      bottom: 1rem;
      transition: transform .5s ease-out;
      width: 1rem; }

.appointment-date {
  color: #4c5255; }

.appointment-title {
  font-weight: 600;
  line-height: 1.6;
  margin-bottom: 0; }

.appointment.changes hr, .appointment.change-suggestion hr {
  width: 100%; }

.appointment.changes .footer .button, .appointment.change-suggestion .footer .button {
  width: 100%; }

.appointment.changes .header, .appointment.change-suggestion .header {
  display: block; }
  .appointment.changes .header .contain-more-narrow, .appointment.change-suggestion .header .contain-more-narrow {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: justify;
    justify-content: space-between; }

.appointment.change-suggestion .hero {
  padding-bottom: 0; }
  .appointment.change-suggestion .hero hr {
    margin: 1rem 0.75rem; }
  .appointment.change-suggestion .hero h1 {
    font-size: 1.5rem !important;
    font-weight: 400;
    line-height: 1.6; }
    .appointment.change-suggestion .hero h1 .inviter {
      font-weight: 600; }

.appointments hr {
  width: calc(100% - 1.5rem); }

.appointments .change-suggestion h2 {
  max-width: 22rem; }

.appointments .cost-row {
  -ms-flex-align: center;
  align-items: center; }
  .appointments .cost-row .left h5 {
    margin-bottom: 0; }
  .appointments .cost-row .right {
    font-family: Helvetica, sans-serif;
    font-size: 2.25rem;
    font-weight: 700; }

.appointments .footer {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 1rem;
  -ms-flex-pack: justify;
  justify-content: space-between;
  padding: 1.5rem 1.5rem 3rem;
  padding-top: 1rem;
  /* ? */ }
  .appointments .footer a:not(.button) {
    text-decoration: underline; }

.appointments .header {
  display: block; }
  .appointments .header .contain-more-narrow {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: justify;
    justify-content: space-between; }

.appointments .main section {
  margin-top: 1.5rem;
  text-align: center; }

.appointments .past-appointments {
  margin: 5rem 0 0; }
  .appointments .past-appointments .appointment-row {
    position: relative; }
    .appointments .past-appointments .appointment-row:active::after, .appointments .past-appointments .appointment-row:focus::after, .appointments .past-appointments .appointment-row:hover::after {
      transform: translateX(0.5rem);
      transition: transform .5s ease-in; }
    .appointments .past-appointments .appointment-row::after {
      background: center no-repeat url("../icons/arrow-right-red.svg");
      content: '';
      height: 1rem;
      position: absolute;
      right: 1rem;
      bottom: 1rem;
      transition: transform .5s ease-out;
      width: 1rem; }

.appointments .upcoming-appointments {
  margin: 2.5rem 0; }
  .appointments .upcoming-appointments .upcoming-appointments .appointment-row {
    position: relative; }
    .appointments .upcoming-appointments .upcoming-appointments .appointment-row:active::after, .appointments .upcoming-appointments .upcoming-appointments .appointment-row:focus::after, .appointments .upcoming-appointments .upcoming-appointments .appointment-row:hover::after {
      transform: translateX(0.5rem);
      transition: transform .5s ease-in; }
    .appointments .upcoming-appointments .upcoming-appointments .appointment-row::after {
      background: center no-repeat url("../icons/arrow-right-red.svg");
      content: '';
      height: 1rem;
      position: absolute;
      right: 1rem;
      bottom: 1rem;
      transition: transform .5s ease-out;
      width: 1rem; }

.appointments.dispute .footer .button {
  width: 100%; }

.appointment-setup .footer-stripe {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  -ms-flex-align: center;
  align-items: center; }

.appointment-setup .connect-with-stripe {
  border: 1px solid #e4e5e7;
  border-radius: 2rem;
  width: 100%;
  text-decoration: none;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: center;
  justify-content: center;
  padding: 1rem;
  font-weight: bolder; }

.appointment-setup form #invitees .tel-wrapper {
  -ms-flex-align: start;
  align-items: flex-start;
  -ms-flex-direction: column;
  flex-direction: column; }

.appointment-setup form button:not(.gm-control-active):not(.gm-svpc) {
  background-color: #F7F6F0;
  border-radius: .625rem;
  border: none;
  box-shadow: -1px -1px 4px 0px rgba(0, 0, 0, 0.08) inset;
  font-size: 0.875rem;
  height: 3.75rem;
  letter-spacing: 0.25px;
  margin-bottom: 1rem;
  padding: .5rem 1rem;
  position: relative;
  text-align: start;
  width: 100%; }
  .appointment-setup form button:not(.gm-control-active):not(.gm-svpc)::after {
    background: center/contain no-repeat url("../icons/arrow-right-dark-blue.svg");
    content: '';
    height: .875rem;
    position: absolute;
    top: 50%;
    right: 1rem;
    transform: translateY(-50%);
    width: .875rem; }
  .appointment-setup form button:not(.gm-control-active):not(.gm-svpc):focus, .appointment-setup form button:not(.gm-control-active):not(.gm-svpc):hover {
    background-color: #efece0; }
  .appointment-setup form button:not(.gm-control-active):not(.gm-svpc)[type="submit"] {
    background-color: #BF0404;
    border: 1px solid #BF0404;
    border-radius: 2rem;
    font-size: 1rem;
    height: 3.3125rem;
    padding: 1.1rem 2.1rem;
    width: auto; }
    .appointment-setup form button:not(.gm-control-active):not(.gm-svpc)[type="submit"]:active, .appointment-setup form button:not(.gm-control-active):not(.gm-svpc)[type="submit"]:focus, .appointment-setup form button:not(.gm-control-active):not(.gm-svpc)[type="submit"]:hover {
      background-color: #ffffff;
      color: #BF0404; }
    .appointment-setup form button:not(.gm-control-active):not(.gm-svpc)[type="submit"]::after {
      display: none; }

.appointment-setup form .collateral-btns {
  margin-bottom: 6rem; }
  .appointment-setup form .collateral-btns label {
    z-index: 1; }
  .appointment-setup form .collateral-btns .field-wrapper {
    position: relative; }
    .appointment-setup form .collateral-btns .field-wrapper::after {
      background: center/contain no-repeat url("../icons/currency-exchange.svg");
      content: '';
      height: 1.5rem;
      position: absolute;
      top: 50%;
      right: 1rem;
      transform: translateY(-50%);
      width: 1.5rem; }

.appointment-setup textarea {
  border-radius: .25rem;
  font-size: 0.875rem; }

.appointment-setup .arrow-link.back::after, .appointment-setup .link-list li a.back::after, .link-list li .appointment-setup a.back::after {
  background-image: url("/icons/arrow-right-dark-blue.svg");
  height: .75rem;
  width: .75rem; }

.appointment-setup .banner {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: center;
  justify-content: center;
  height: 5rem;
  margin-bottom: 2.5rem;
  position: relative;
  text-align: center; }
  .appointment-setup .banner .menu-btn {
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%); }

.appointment-setup .cost-row .left h5 {
  margin-bottom: .25rem; }

.appointment-setup .cost-row .left p {
  font-size: 0.875rem;
  margin-bottom: 0; }

.appointment-setup .cost-row .right {
  font-family: Helvetica, sans-serif;
  font-size: 2.25rem;
  font-weight: 700; }
  .appointment-setup .cost-row .right h4 {
    font-weight: 700; }

.appointment-setup .eyebrow {
  color: #FFF;
  line-height: 1.6;
  letter-spacing: 1.5px;
  margin-bottom: 0.75rem;
  text-transform: uppercase; }

.appointment-setup .footer {
  /* not sure about this */
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: justify;
  justify-content: space-between;
  padding: 1rem 1.5rem 3rem; }
  .appointment-setup .footer a {
    color: #282A3E;
    font-weight: 400; }
    .appointment-setup .footer a:active, .appointment-setup .footer a:focus, .appointment-setup .footer a:hover {
      color: #585c88; }
  .appointment-setup .footer .button {
    width: auto; }

.appointment-setup .header {
  display: block;
  text-align: center; }
  .appointment-setup .header .contain-more-narrow {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: justify;
    justify-content: space-between; }

.appointment-setup .hero {
  height: 9.8125rem;
  overflow: hidden;
  padding-bottom: 0; }

.appointment-setup .main {
  padding: 1rem 1rem 3rem; }
  .appointment-setup .main label {
    color: #848A95;
    font-size: .875rem; }
  .appointment-setup .main #description, .appointment-setup .main #location, .appointment-setup .main #time, .appointment-setup .main #collateral, .appointment-setup .main #invitees {
    padding-top: 1rem; }
  .appointment-setup .main .intro {
    padding: 1rem 1rem 2rem; }
  .appointment-setup .main .option .description {
    margin-left: .75rem; }
  .appointment-setup .main .option::after {
    background: center no-repeat url("../icons/arrow-right-red.svg");
    content: '';
    height: 1rem;
    position: absolute;
    right: 1rem;
    bottom: 1rem;
    transition: transform .5s ease-out;
    width: 1rem; }
  .appointment-setup .main .option:active::after, .appointment-setup .main .option:focus::after, .appointment-setup .main .option:hover::after {
    transform: translateX(0.5rem);
    transition: transform .5s ease-in; }

.appointment-setup .send-footer {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 1rem; }

.appointment-setup .wrapper {
  height: 100%;
  position: relative; }

/* Miscellaneous Styles */
#check-in {
  position: absolute;
  bottom: 3rem;
  left: 50%;
  transform: translateX(-50%); }

#contract input {
  height: 100%;
  opacity: .001;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%; }

#contract .option {
  background-color: #F7F6F0;
  cursor: pointer;
  margin-bottom: 1rem;
  padding: 1.5rem;
  position: relative; }
  #contract .option h5 {
    font-size: 1.5rem; }
  #contract .option img {
    display: block;
    margin-left: -.75rem; }
  #contract .option p {
    color: #202020; }
  #contract .option:hover::after, #contract .option:focus::after, #contract .option:active::after {
    transform: translateX(0.5rem);
    transition: transform .5s ease-in; }

#country-code {
  height: 3.625rem;
  margin-right: 0.75rem !important;
  min-width: 0;
  padding: .25rem;
  position: relative;
  text-align: end;
  width: 3.75rem; }
  #country-code option[value="1"] {
    background-image: url("../images/flag.png"); }

#create-acct {
  border-radius: 2rem; }
  #create-acct:active, #create-acct:focus, #create-acct:hover {
    border-color: #BF0404; }

#invitees a.button {
  padding: 1rem 5rem 1rem 3.5rem;
  position: relative;
  width: fit-content; }
  #invitees a.button::after {
    background: center/contain no-repeat url("../icons/add-circle-white.svg");
    content: '';
    height: 1.25rem;
    position: absolute;
    top: 50%;
    right: 3rem;
    transform: translateY(-50%);
    width: 1.25rem; }
  #invitees a.button:active::after, #invitees a.button:focus::after, #invitees a.button:hover::after {
    background: center/contain no-repeat url("../icons/add-circle.svg"); }

#send a {
  width: fit-content; }

#send .description {
  color: #696969; }

#showPassBtn,
#hidePassBtn,
#showPassBtn-2,
#hidePassBtn-2 {
  cursor: pointer;
  position: absolute;
  right: 1rem;
  top: 50%;
  transition: opacity .2s ease-in; }

.create-account #showPassBtn,
.create-account #hidePassBtn,
.create-account #showPassBtn-2,
.create-account #hidePassBtn-2 {
  top: 35%; }

#showPassBtn,
#showPassBtn-2 {
  opacity: 1;
  z-index: 1; }

#stripe-card {
  max-width: 23.125rem;
  width: 100%; }

#hidePassBtn,
#hidePassBtn-2 {
  opacity: 0;
  z-index: 0; }

#phone-number {
  width: 100%; }

#sign-up-google:hover img {
  filter: grayscale(1) brightness(4); }

#sign-up-apple:hover img {
  filter: invert(1); }

.agree {
  display: -ms-flexbox;
  display: flex;
  padding: 2.25rem 0.75rem 3rem; }
  .agree input[type=checkbox] {
    height: 1.25rem;
    margin-top: .1rem !important;
    width: 1.25rem; }
  .agree label {
    color: #1c1818 !important;
    font-size: 1rem !important;
    margin-left: 0.75rem; }

.appointment-row {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: justify;
  justify-content: space-between; }
  .appointment-row h5 {
    margin-bottom: .25rem; }
  .appointment-row p {
    font-size: 0.875rem;
    margin-bottom: 0; }
  .appointment-row .date-and-time {
    color: #454B66;
    opacity: 0.64; }
  .appointment-row .left {
    margin-right: .5rem;
    width: 3rem; }
  .appointment-row .right {
    width: calc(100% - 3rem); }
  .appointment-row:not(:last-child) {
    margin-bottom: 1rem; }

.attendees-row {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: justify;
  justify-content: space-between; }
  .attendees-row .left h5 {
    margin-bottom: .25rem; }
  .attendees-row .left p {
    font-size: 0.875rem;
    margin-bottom: 0; }
  .attendees-row .right {
    color: #454B66;
    line-height: 1.5rem;
    text-align: end; }
  .attendees-row:not(:last-child) {
    margin-bottom: 1rem; }

.big-number {
  color: #EEEC0E;
  font-family: "Open Sans", "Verdana", "Helvetica", sans-serif;
  font-size: 3.25rem;
  font-weight: 700; }

.cost-row {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: justify;
  justify-content: space-between; }
  .cost-row .amount {
    font-family: "Open Sans", "Verdana", "Helvetica", sans-serif;
    font-size: 2.25rem;
    font-weight: 700; }
  .cost-row .collateral {
    line-height: 1.2;
    margin-bottom: 0; }

.handshake {
  height: 12.625rem;
  margin-left: calc(9.5rem - 50vw);
  margin-top: -1.5rem;
  position: relative;
  left: 0;
  width: 100vw; }
  .handshake img {
    height: auto;
    max-width: 40rem;
    mix-blend-mode: multiply;
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100vw; }

.hero {
  overflow: hidden;
  padding: 1.5rem 0;
  text-align: center; }
  .hero .info {
    margin: 1.5rem 4.5rem; }
    .hero .info.ghosted {
      display: -ms-flexbox;
      display: flex;
      margin: 1.5rem auto;
      max-width: 40rem; }
      .hero .info.ghosted .left {
        padding: 3rem 1.5rem 0.75rem;
        text-align: start;
        width: 60%; }
        .hero .info.ghosted .left a {
          font-weight: 400; }
      .hero .info.ghosted .right {
        position: relative;
        width: 40%; }
        .hero .info.ghosted .right img {
          height: 314px;
          position: absolute;
          top: 0;
          left: 0;
          width: 182px; }
  .hero .result {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    margin: 1.5rem auto;
    width: fit-content; }
    .hero .result h3 {
      display: inline;
      margin-bottom: 0;
      margin-left: 0.75rem; }
  .hero.bg-dark, .hero.bg-dark-gradient {
    background-color: #000000; }
    .hero.bg-dark .appointment-date, .hero.bg-dark-gradient .appointment-date {
      color: #ffffff; }

.invitation .cost-row .left h5 {
  margin-bottom: 0; }

.invitation .footer {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  padding: 1.5rem; }
  .invitation .footer .button {
    width: 100%; }
    .invitation .footer .button:not(:last-child) {
      margin-bottom: 0.75rem; }

.invitation .header {
  display: block; }
  .invitation .header .contain-more-narrow {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: justify;
    justify-content: space-between; }

.invitation .hero {
  padding-bottom: 0; }
  .invitation .hero hr {
    margin: 1rem 0.75rem; }
  .invitation .hero h1 {
    font-size: 1.5rem !important;
    font-weight: 400;
    line-height: 1.6; }
    .invitation .hero h1 .inviter {
      font-weight: 600; }

.invitation .main {
  padding-top: 0.75rem; }

.invitation-details {
  font-family: "Open Sans", "Verdana", "Helvetica", sans-serif;
  position: relative; }
  .invitation-details::after {
    background: center/contain no-repeat url("../icons/arrow-right-red.svg");
    content: '';
    height: .75rem;
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
    width: .75rem; }
  .invitation-details:active::after, .invitation-details:focus::after, .invitation-details:hover::after {
    transform: translate(0.5rem, -50%);
    transition: transform .4s ease-in; }

.invitation-header {
  overflow: hidden;
  padding: 1.5rem; }
  .invitation-header .appointment-date {
    color: white; }

.invitation-image {
  margin-bottom: .5rem; }

.invitation-location {
  margin: 0 auto 2rem;
  max-width: 43rem; }
  .invitation-location-address {
    color: #18224C;
    font-size: 15px; }
  .invitation-location-label {
    color: #696969;
    font-size: 13px;
    margin-bottom: 0;
    opacity: 0.64; }

.invitees-header {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: justify;
  justify-content: space-between; }
  .invitees-header a {
    color: #BF0404;
    font-size: 0.875rem;
    font-weight: 400; }
    .invitees-header a:active, .invitees-header a:focus, .invitees-header a:hover {
      color: #BF0404; }
  .invitees-header h5 {
    margin-bottom: 0; }
  .invitees-header p {
    color: #19191D;
    font-size: 0.875rem;
    margin-bottom: 0; }

.invitees-list {
  background-color: #F7F6F0;
  margin-top: 1rem; }
  .invitees-list hr {
    margin: 0; }
    .invitees-list hr:last-of-type {
      display: none; }
  .invitees-list p, .invitees-list .invitee-item {
    margin: 0;
    padding: 1rem;
    text-align: start; }

.large-grp-btn {
  color: #BF0404;
  font-size: .75rem;
  font-weight: 400;
  letter-spacing: 0.4px;
  margin-top: .5rem; }

.notice {
  margin-bottom: 1.5rem !important; }

.profile {
  padding: 1.5rem;
  text-align: start;
  margin-left: auto;
  margin-right: auto;
  max-width: 50rem; }
  .profile h1 {
    font-size: 2.5rem !important; }

.sand-clock {
  overflow: hidden;
  position: relative; }
  .sand-clock > * {
    position: relative;
    z-index: 1; }
  .sand-clock::after {
    background: center/contain no-repeat url("/images/sand-clock.svg");
    content: '';
    height: 343px;
    position: absolute;
    left: 50%;
    bottom: -1rem;
    width: 158px; }

.status {
  margin: 1.5rem auto;
  max-width: 19rem; }
  .status h3 {
    color: #282A3E;
    font-weight: 600;
    margin-bottom: .5rem; }
  .status p {
    color: #454B66; }

.text-red-600 {
  color: #BF0404; }

.text-sm {
  font-size: 0.875rem; }

.timer {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  margin-bottom: -3rem;
  position: relative; }
  .timer__left, .timer__right {
    text-align: center;
    width: 50%; }
  .timer__left {
    padding-bottom: 7.5rem; }
  .timer h3 {
    margin-bottom: 0; }
  .timer button.disabled {
    background-color: #374750;
    color: #d2d3c5; }
    .timer button.disabled:active, .timer button.disabled:focus, .timer button.disabled:hover {
      cursor: auto;
      background-color: #374750;
      border-color: rgba(138, 139, 140, 0.12);
      color: #d2d3c5; }

.upcoming-appointments .appointment-row {
  -ms-flex-align: start;
  align-items: flex-start;
  -ms-flex-direction: column;
  flex-direction: column; }

/* Media Queries */
@media (min-width: 30rem) {
  .appointment.change-suggestion h2,
  .appointments .change-suggestion h2 {
    max-width: none; } }

@media screen and (min-width: 48em) {
  h1 {
    font-size: 2.5rem !important; }
  h2 {
    font-size: 2rem !important; }
  h3 {
    font-size: 1.375rem !important; }
  .appointment-setup h1 {
    font-size: 1rem !important; }
  .appointment-setup .eyebrow {
    font-size: .625rem !important; }
  .eyebrow {
    font-size: 0.875rem !important; } }

@media (min-width: 50rem) {
  .appointment-setup .hero .wrapper nav {
    overflow-x: auto; }
    .appointment-setup .hero .wrapper nav ul {
      height: calc(100% - .25rem); } }

@media (min-width: 75rem) {
  h1 {
    font-size: 3.75rem !important; }
  h2 {
    font-size: 2.5rem !important; }
  h3 {
    font-size: 1.5625rem !important; }
  .eyebrow {
    font-size: 1rem !important; }
  .header nav ul li {
    font-size: 1rem; } }

@media (max-width: 49.999rem) {
  .appointment-setup .hero nav {
    bottom: 0; }
    .appointment-setup .hero nav ul {
      height: 100%; }
    .appointment-setup .hero nav::-webkit-scrollbar {
      display: none; } }

/** Mark Additions **/
#send #map-edit {
  pointer-events: none; }

.users__search form {
  display: -ms-flexbox;
  display: flex; }

.users__search select {
  width: 22em;
  margin-left: 1em !important;
  appearance: auto !important; }

.field-wrapper.floating-label label {
  position: absolute;
  top: 1em;
  left: .75rem;
  z-index: 1;
  transform: translate(0, -1.5rem) !important;
  background: #fff;
  padding: .2em; }
