/***********************************************/
/* CSS @imports must be at the top of the file */
/* Add them above this section                 */
/***********************************************/
@import url('https://fonts.googleapis.com/css2?family=Alatsi&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap');

/*****************************************/
/* Start your style declarations here    */
/*****************************************/

/* Styles Library */
/* @import url('http://example.com/example_style.css'); */

/***********************************************/
/* CSS @imports must be at the top of the file */
/* Add them above this section                 */
/***********************************************/

/*****************************************/
/* Start your style declarations here    */
/*****************************************/


/*****************************************/
/* General Variables */
/*****************************************/
:root {
  /* Colors */
  /* Greys */
  --grey-1000: #000000;
  --grey-900: #1A1A1A;
  --grey-800: #333333;
  --grey-600: #444444;
  --grey-500: #666666;
  --grey-400: #737373;
  --grey-300: #8E8E8E;
  --grey-250: #979797;
  --grey-200: #CCCCCC;
  --grey-100: #DBDEE7;
  --grey-75: #E6E6E6;
  --grey-50: #F2F2F2;
  --grey-0: #FFFFFF;
  
  --grey-1000-a-20: #0003;

  /* Blues */
  --brand-blue: #2945C0;
  --brand-bright-blue: #0045FF;
  --brand-lighter-blue: #F5F9FD;
  --brand-light-blue: #DAE9F9;
  --brand-dark-blue: #013E77;
  --brand-navy: #0D2E4F;
  --transparent-blue: #013E7766;
  
  /* Other colors */
  --success-green: #00AC4F;
  
  /* Border radius */
  --border-radius-small: 0.375rem;
  --border-radius-medium: 0.625rem;
  --border-radius-large: 1.25rem;
  --border-radius-full: 90rem;

  /* Typography */
  /* Font weights */
  --fw-black: 900;
  --fw-bolder: 800;
  --fw-bold: 700;
  --fw-semibold: 600;
  --fw-medium: 500;
  --fw-normal: 400;
  --fw-light: 300;
  --fw-extra-light: 200;
  --fw-thin: 100;

  /* Display 1 */
  --display-1: var(--fw-normal) 4.375rem/4.875rem 'Alatsi', sans-serif;
  --display-1-tablet-landscape: var(--fw-normal) 3.5rem/4rem 'Alatsi', sans-serif;
  --display-1-tablet-portrait: var(--fw-normal) 3.25rem/3.75rem 'Alatsi', sans-serif;
  --display-1-mobile: var(--fw-normal) 3rem/3.5rem 'Alatsi', sans-serif;
  /* H1 */
  --h1: var(--fw-normal) 3.5rem/4.25rem 'Alatsi', sans-serif;
  --h1-tablet-landscape: var(--fw-normal) 3rem/3.75rem 'Alatsi', sans-serif;
  --h1-tablet-portrait: var(--fw-normal) 2.75rem/3.5rem 'Alatsi', sans-serif;
  --h1-mobile: var(--fw-normal) 2.5rem/3.25rem 'Alatsi', sans-serif;
  /* H2 */
  --h2: var(--fw-normal) 3rem/3.75rem 'Alatsi', sans-serif;
  --h2-tablet-landscape: var(--fw-normal) 2.5rem/3.25rem 'Alatsi', sans-serif;
  --h2-tablet-portrait: var(--fw-normal) 2.25rem/3rem 'Alatsi', sans-serif;
  --h2-mobile: var(--fw-normal) 2rem/2.75rem 'Alatsi', sans-serif;
  /* H3 */
  --h3: var(--fw-normal) 2.5rem/3.25rem 'Alatsi', sans-serif;
  --h3-tablet-landscape: var(--fw-normal) 2rem/2.75rem 'Alatsi', sans-serif;
  --h3-tablet-portrait: var(--fw-normal) 1.75rem/2.5rem 'Alatsi', sans-serif;
  --h3-mobile: var(--fw-normal) 1.5rem/2.25rem 'Alatsi', sans-serif;
  /* h4 */
  --h4: var(--fw-normal) 2.25rem/3rem 'Alatsi', sans-serif;
  --h4-tablet-landscape: var(--fw-normal) 1.75rem/2.5rem 'Alatsi', sans-serif;
  --h4-tablet-portrait: var(--fw-normal) 1.5rem/2.25rem 'Alatsi', sans-serif;
  --h4-mobile: var(--fw-normal) 1.25rem/2rem 'Alatsi', sans-serif;
  /* h5 */
  --h5: var(--fw-normal) 2rem/2.75rem 'Alatsi', sans-serif;
  --h5-tablet-landscape: var(--fw-normal) 1.625rem/2.375rem 'Alatsi', sans-serif;
  --h5-tablet-portrait: var(--fw-normal) 1.375rem/2.125rem 'Alatsi', sans-serif;
  --h5-mobile: var(--fw-normal) 1.125rem/1.875rem 'Alatsi', sans-serif;
  /* h6 */
  --h6: var(--fw-normal) 1.875rem/2.625rem 'Alatsi', sans-serif;
  --h6-tablet-landscape: var(--fw-normal) 1.5rem/2.25rem 'Alatsi', sans-serif;
  --h6-tablet-portrait: var(--fw-normal) 1.25rem/2rem 'Alatsi', sans-serif;
  --h6-mobile: var(--fw-normal) 1rem/1.75rem 'Alatsi', sans-serif;
  /* body-1 */
  --body-1: var(--fw-normal) 1.5rem/2rem 'Inter', sans-serif;
  --body-1-tablet-landscape: var(--fw-normal) 1.25rem/1.75rem 'Inter', sans-serif;
  --body-1-tablet-portrait: var(--fw-normal) 1.125rem/1.675rem 'Inter', sans-serif;
  --body-1-mobile: var(--fw-normal) 1rem/1.75rem 'Inter', sans-serif;
  /* body-2 */
  --body-2: var(--fw-normal) 1.25rem/1.75rem 'Inter', sans-serif;
  --body-2-tablet-landscape: var(--fw-normal) 1.125rem/1.675rem 'Inter', sans-serif;
  --body-2-tablet-portrait: var(--fw-normal) 1rem/1.5rem 'Inter', sans-serif;
  --body-2-mobile: var(--fw-normal) 0.875rem/1.375rem 'Inter', sans-serif;
  /* body-3 */
  --body-3: var(--fw-normal) 1.125rem/1.625rem 'Inter', sans-serif;
  --body-3-tablet-landscape: var(--fw-normal) 1rem/1.5rem 'Inter', sans-serif;
  --body-3-tablet-portrait: var(--fw-normal) 0.875rem/1.375rem 'Inter', sans-serif;
  --body-3-mobile: var(--fw-normal) 0.75rem/1.25rem 'Inter', sans-serif;
  /* body-4 */
  --body-4: var(--fw-normal) 18px/30px 'Inter', sans-serif;
  /* micro */
  --micro: var(--fw-normal) 0.75rem/1.125rem 'Inter', sans-serif;
  --micro-tablet-landscape: var(--fw-normal) 0.75rem/1.125rem 'Inter', sans-serif;
  --micro-tablet-portrait: var(--fw-normal) 0.75rem/1.125rem 'Inter', sans-serif;
  --micro-mobile: var(--fw-normal) 0.625rem/1rem 'Inter', sans-serif;
  /* Forms labels */
  --label: var(--fw-semibold) 1.125rem/1.625rem 'Inter', sans-serif;
  --label-tablet-landscape: var(--fw-semibold) 1rem/1.5rem 'Inter', sans-serif;
  --label-tablet-portrait: var(--fw-semibold) 0.875rem/1.375rem 'Inter', sans-serif;
  --label-mobile: var(--fw-semibold) 0.75rem/1.25rem 'Inter', sans-serif;

  /* Spacings and paddings */
  /* Spacing 0 */
  --spacing-0: 0;
  /* Spacing 100 */
  --spacing-100: 0.25rem;
  --spacing-100-tablet-landscape: 0.25rem;
  --spacing-100-tablet-portrait: 0.25rem;
  --spacing-100-mobile: 0.25rem;
  /* Spacing 200 */
  --spacing-200: 0.5rem;
  --spacing-200-tablet-landscape: 0.5rem;
  --spacing-200-tablet-portrait: 0.5rem;
  --spacing-200-mobile: 0.5rem;
  /* Spacing 300 */
  --spacing-300: 1rem;
  --spacing-300-tablet-landscape: 1rem;
  --spacing-300-tablet-portrait: 0.75rem;
  --spacing-300-mobile: 0.75rem;
  /* Spacing 400 */
  --spacing-400: 1.5rem;
  --spacing-400-tablet-landscape: 1.5rem;
  --spacing-400-tablet-portrait: 1rem;
  --spacing-400-mobile: 1rem;
  /* Spacing 500 */
  --spacing-500: 2rem;
  --spacing-500-tablet-landscape: 2rem;
  --spacing-500-tablet-portrait: 1.5rem;
  --spacing-500-mobile: 1.5rem;
  /* Spacing 600 */
  --spacing-600: 3rem;
  --spacing-600-tablet-landscape: 2.5rem;
  --spacing-600-tablet-portrait: 2rem;
  --spacing-600-mobile: 2rem;
  /* Spacing 700 */
  --spacing-700: 4rem;
  --spacing-700-tablet-landscape: 3rem;
  --spacing-700-tablet-portrait: 2.5rem;
  --spacing-700-mobile: 2.5rem;
  /* Spacing 800 */
  --spacing-800: 5rem;
  --spacing-800-tablet-landscape: 4rem;
  --spacing-800-tablet-portrait: 3rem;
  --spacing-800-mobile: 3rem;
  /* Spacing 900 */
  --spacing-900: 6.5rem;
  --spacing-900-tablet-landscape: 5rem;
  --spacing-900-tablet-portrait: 4rem;
  --spacing-900-mobile: 3rem;
  /* Spacing 1000 */
  --spacing-1000: 8rem;
  --spacing-1000-tablet-landscape: 6rem;
  --spacing-1000-tablet-portrait: 5rem;
  --spacing-1000-mobile: 4rem;
  /* Spacing 1200 */
  --spacing-1200: 9rem;
  --spacing-1200-tablet-landscape: 7rem;
  --spacing-1200-tablet-portrait: 6rem;
  --spacing-1200-mobile: 5rem;
  /* Spacing 1400 */
  --spacing-1400: 10rem;
  --spacing-1400-tablet-landscape: 8rem;
  --spacing-1400-tablet-portrait: 7rem;
  --spacing-1400-mobile: 6rem;
  /* Spacing 1600 */
  --spacing-1600: 11rem;
  --spacing-1600-tablet-landscape: 9rem;
  --spacing-1600-tablet-portrait: 8rem;
  --spacing-1600-mobile: 7rem;
  /* Spacing 1800 */
  --spacing-1800: 12rem;
  --spacing-1800-tablet-landscape: 10rem;
  --spacing-1800-tablet-portrait: 9rem;
  --spacing-1800-mobile: 8rem;

  /* Padding 0 */
  --padding-0: 0;
  /* Padding 100 */
  --padding-100: 0.25rem;
  --padding-100-tablet-landscape: 0.25rem;
  --padding-100-tablet-portrait: 0.25rem;
  --padding-100-mobile: 0.25rem;
  /* Padding 200 */
  --padding-200: 0.5rem;
  --padding-200-tablet-landscape: 0.5rem;
  --padding-200-tablet-portrait: 0.5rem;
  --padding-200-mobile: 0.5rem;
  /* Padding 300 */
  --padding-300: 1rem;
  --padding-300-tablet-landscape: 1rem;
  --padding-300-tablet-portrait: 0.75rem;
  --padding-300-mobile: 0.75rem;
  /* Padding 400 */
  --padding-400: 1.5rem;
  --padding-400-tablet-landscape: 1.5rem;
  --padding-400-tablet-portrait: 1rem;
  --padding-400-mobile: 1rem;
  /* Padding 500 */
  --padding-500: 2rem;
  --padding-500-tablet-landscape: 2rem;
  --padding-500-tablet-portrait: 1.5rem;
  --padding-500-mobile: 1.5rem;
  /* Padding 600 */
  --padding-600: 2.5rem;
  --padding-600-tablet-landscape: 2.5rem;
  --padding-600-tablet-portrait: 2rem;
  --padding-600-mobile: 2rem;
}

/*****************************************/
/* Overrides */
/*****************************************/
h1, h2, h3, h4, h5, h6, p, label {
  margin-bottom: 0 !important;
}

/*****************************************/
/* Reusable classes */
/*****************************************/
.title-fsize { /* 46px */
  font-size: calc(var(--spacing-600) - var(--spacing-200)/1.125) !important;
}
.subtitle-fsize { /* 24px */
  font-size: calc(var(--spacing-300) + var(--spacing-200)/1.5) !important;
}
.display-1 {
  font: var(--display-1-mobile);
}
@media (min-width: 768px) {
  .display-1 {
    font: var(--display-1-tablet-portrait);
  }
}
@media (min-width: 1024px) {
  .display-1 {
    font: var(--display-1-tablet-landscape);
  }
}
@media (min-width: 1280px) {
  .display-1 {
    font: var(--display-1);
  }
}

.h1 {
  font: var(--h1-mobile);
}
@media (min-width: 768px) {
  .h1 {
    font: var(--h1-tablet-portrait);
  }
}
@media (min-width: 1024px) {
  .h1 {
    font: var(--h1-tablet-landscape);
  }
}
@media (min-width: 1280px) {
  .h1 {
    font: var(--h1);
  }
}

.h2 {
  font: var(--h2-mobile);
  line-height: 1.25;
}
@media (min-width: 768px) {
  .h2 {
    font: var(--h2-tablet-portrait);
    line-height: 1.25;
  }
}
@media (min-width: 1024px) {
  .h2 {
    font: var(--h2-tablet-landscape);
    line-height: 1.25;
  }
}
@media (min-width: 1280px) {
  .h2 {
    font: var(--h2);
    line-height: 1.25;
  }
}

.h3 {
  font: var(--h3-mobile);
}
@media (min-width: 768px) {
  .h3 {
    font: var(--h3-tablet-portrait);
  }
}
@media (min-width: 1024px) {
  .h3 {
    font: var(--h3-tablet-landscape);
  }
}
@media (min-width: 1280px) {
  .h3 {
    font: var(--h3);
  }
}

.h4 {
  font: var(--h4-mobile);
}
@media (min-width: 768px) {
  .h4 {
    font: var(--h4-tablet-portrait);
  }
}
@media (min-width: 1024px) {
  .h4 {
    font: var(--h4-tablet-landscape);
  }
}
@media (min-width: 1280px) {
  .h4 {
    font: var(--h4);
  }
}

.h5 {
  font: var(--h5-mobile);
}
@media (min-width: 768px) {
  .h5 {
    font: var(--h5-tablet-portrait);
  }
}
@media (min-width: 1024px) {
  .h5 {
    font: var(--h5-tablet-landscape);
  }
}
@media (min-width: 1280px) {
  .h5 {
    font: var(--h5);
  }
}

.h6 {
  font: var(--h6-mobile);
}
@media (min-width: 768px) {
  .h6 {
    font: var(--h6-tablet-portrait);
  }
}
@media (min-width: 1024px) {
  .h6 {
    font: var(--h6-tablet-landscape);
  }
}
@media (min-width: 1280px) {
  .h6 {
    font: var(--h6);
  }
}

.body-1 {
  font: var(--body-1-mobile);
}
@media (min-width: 768px) {
  .body-1 {
    font: var(--body-1-tablet-portrait);
  }
}
@media (min-width: 1024px) {
  .body-1 {
    font: var(--body-1-tablet-landscape);
  }
}
@media (min-width: 1280px) {
  .body-1 {
    font: var(--body-1);
  }
}

.body-2 {
  font: var(--body-2-mobile);
}
@media (min-width: 768px) {
  .body-2 {
    font: var(--body-2-tablet-portrait);
  }
}
@media (min-width: 1024px) {
  .body-2 {
    font: var(--body-2-tablet-landscape);
  }
}
@media (min-width: 1280px) {
  .body-2 {
    font: var(--body-2);
  }
}

.body-3 {
  font: var(--body-3-mobile);
}
@media (min-width: 768px) {
  .body-3 {
    font: var(--body-3-tablet-portrait);
  }
}
@media (min-width: 1024px) {
  .body-3 {
    font: var(--body-3-tablet-landscape);
  }
}
@media (min-width: 1280px) {
  .body-3 {
    font: var(--body-3);
  }
}

.body-4 {
  font: var(--body-4);
  line-height: 30px;
}
@media (min-width: 768px) {
  .body-4 {
    font: var(--body-4);
    line-height: 30px;
  }
}
@media (min-width: 1024px) {
  .body-4 {
    font: var(--body-4);
    line-height: 30px;
  }
}
@media (min-width: 1280px) {
  .body-4 {
    font: var(--body-4);
    line-height: 30px;
  }
}

.micro {
  font: var(--micro-mobile);
}
@media (min-width: 768px) {
  .micro {
    font: var(--micro-tablet-portrait);
  }
}
@media (min-width: 1024px) {
  .micro {
    font: var(--micro-tablet-landscape);
  }
}
@media (min-width: 1280px) {
  .micro {
    font: var(--micro);
  }
}

.dark-blue-color {
  color: var(--brand-dark-blue) !important;
}
.blue-color {
  color: var(--brand-blue) !important;
}
.navy-color {
  color: var(--brand-navy) !important;
}

.fw-black {
  font-weight: var(--fw-black) !important;
}
.fw-bolder {
  font-weight: var(--fw-bolder) !important;
}
.fw-bold {
  font-weight: var(--fw-bold) !important;
}
.fw-semibold {
  font-weight: var(--fw-semibold) !important;
}
.fw-medium {
  font-weight: var(--fw-medium) !important;
}
.fw-normal {
  font-weight: var(--fw-normal) !important;
}
.fw-light {
  font-weight: var(--fw-light) !important;
}
.fw-extra-light {
  font-weight: var(--fw-extra-light) !important;
}
.fw-thin {
  font-weight: var(--fw-thint) !important;
}

/* Alatsi */
.alatsi-family {
  font-family: 'Alatsi', sans-serif !important;
}

/* Buttons */
/* Button base styles */
.furuno-btn, form input.hs-button {
  display: block;
  gap: var(--spacing-100-mobile);
  font: var(--body-2-mobile);

  padding: var(--padding-200-mobile) var(--padding-400-mobile);
  border-radius: var(--border-radius-small);
  border: 1px solid;
  
  transition: all 0.5s ease-out;
}
@media (min-width: 768px) {
  .furuno-btn, form input.hs-button {
    gap: var(--spacing-100-tablet-portrait);
    font: var(--body-2-tablet-portrait);
    padding: var(--padding-200-tablet-portrait) var(--padding-400-tablet-portrait);
  }
}
@media (min-width: 1024px) {
  .furuno-btn, form input.hs-button {
    gap: var(--spacing-100-tablet-landscape);
    font: var(--body-2-tablet-landscape);
    padding: var(--padding-200-tablet-landscape) var(--padding-400-tablet-landscape);
  }
}
@media (min-width: 1280px) {
  .furuno-btn, form input.hs-button {
    gap: var(--spacing-100);
    font: var(--body-2);
    padding: var(--padding-200) var(--padding-400);
  }
}

.furuno-btn:hover {
  transform: translateY(0.25rem);
  opacity: 0.75;
  cursor: pointer;
}
.furuno-btn:disabled {
  cursor: not-allowed;
  opacity: 0.85;
}
.furuno-btn.furuno-btn-no-animation:hover {
  transform: none !important;
  opacity: 1 !important;
}

/* Primary button */
.furuno-btn-primary, form input.hs-button {
  background-color: var(--brand-blue);
  border-color: var(--brand-blue);
  color: var(--grey-0);
  min-width: 10.3125rem;
}

/* Secondary button */
.furuno-btn-secondary {
  background-color: var(--grey-0);
  border-color: var(--brand-blue);
  color: var(--brand-blue);
  min-width: 10.3125rem;
}

/* Transparent buttons */
.furuno-btn-transparent {
  background-color: transparent;
  border-color: transparent;
  color: var(--brand-blue);

  min-width: 10.3125rem;
}

/* Link button */
.furuno-btn-link {
  background-color: transparent;
  border-color: transparent;

  color: var(--brand-blue);
  text-decoration: underline;
  text-decoration-color: var(--brand-blue);
  text-underline-offset: 0.25rem;

  min-width: 10.3125rem;
}

/* Rounded button */
.furuno-btn-rounded {
  justify-content: center;

  padding: var(--padding-200-mobile);
  border-radius: var(--border-radius-full);

  width: 3.75rem;
  min-width: fit-content;
  height: 3.75rem;
}
@media (min-width: 768px) {
  .furuno-btn-rounded {
    padding: var(--padding-200-tablet-portrait);
  }
}
@media (min-width: 1024px) {
  .furuno-btn-rounded {
    padding: var(--padding-200-tablet-landscape);
  }
}
@media (min-width: 1280px) {
  .furuno-btn-rounded {
    padding: var(--padding-200);
  }
}

/* Greyed buttons */
.furuno-btn-primary.furuno-btn-greyed {
  background-color: var(--grey-300);
  border-color: var(--grey-300);
}
.furuno-btn-secondary.furuno-btn-greyed {
  color: var(--grey-300);
  border-color: var(--grey-300);
}
.furuno-btn-transparent.furuno-btn-greyed {
  color: var(--grey-300);
}
.furuno-btn-link.furuno-btn-greyed {
  color: var(--grey-300);
  text-decoration-color: var(--grey-300);
}

/* White button */
.furuno-btn-primary.furuno-btn-white {
  background-color: var(--grey-0);
  border: none;
  color: var(--grey-1000);
}

.furuno-btn-secondary.furuno-btn-grey-white {
  background-color: var(--grey-0);
  border: 1px solid var(--grey-100);
  color: var(--brand-navy);
}

/* Light blue buttons */
.furuno-btn-primary.furuno-btn-light {
  background-color: var(--brand-light-blue);
  border-color: var(--brand-light-blue);
}
.furuno-btn-secondary.furuno-btn-light {
  color: var(--brand-light-blue);
  border-color: var(--brand-light-blue);
}
.furuno-btn-transparent.furuno-btn-light {
  color: var(--brand-light-blue);
}
.furuno-btn-link.furuno-btn-light {
  color: var(--brand-light-blue);
  text-decoration-color: var(--brand-light-blue);
}

/* Bright blue buttons */
.furuno-btn-primary.furuno-btn-bright {
  background-color: var(--brand-bright-blue);
  border-color: var(--brand-bright-blue);
}
.furuno-btn-secondary.furuno-btn-bright {
  color: var(--brand-bright-blue);
  border-color: var(--brand-bright-blue);
}
.furuno-btn-transparent.furuno-btn-bright {
  color: var(--brand-bright-blue);
}
.furuno-btn-link.furuno-btn-bright {
  color: var(--brand-bright-blue);
  text-decoration-color: var(--brand-bright-blue);
}

/* Dark blue buttons */
.furuno-btn-primary.furuno-btn-dark {
  background-color: var(--brand-dark-blue);
  border-color: var(--brand-dark-blue);
}
.furuno-btn-secondary.furuno-btn-dark {
  color: var(--brand-dark-blue);
  border-color: var(--brand-dark-blue);
}
.furuno-btn-transparent.furuno-btn-dark {
  color: var(--brand-dark-blue);
}
.furuno-btn-link.furuno-btn-dark {
  color: var(--brand-dark-blue);
  text-decoration-color: var(--brand-dark-blue);
}

/* Navy buttons */
.furuno-btn-primary.furuno-btn-navy {
  background-color: var(--brand-navy);
  border-color: var(--brand-navy);
}
.furuno-btn-secondary.furuno-btn-navy {
  color: var(--brand-navy);
  border-color: var(--brand-navy);
}
.furuno-btn-transparent.furuno-btn-navy {
  color: var(--brand-navy);
}
.furuno-btn-link.furuno-btn-navy {
  color: var(--brand-navy);
  text-decoration-color: var(--brand-navy);
}

/* Brand Blue buttons */
.furuno-btn-primary.furuno-btn-brand-blue {
  color: #FFFFFF;
  background-color: var(--brand-blue);
}

/* Icons in buttons */
.furuno-btn svg {
  height: 100%;
}
.furuno-btn-primary svg path {
  fill: var(--grey-0);
}
.furuno-btn-secondary svg path,
.furuno-btn-transparent svg path,
.furuno-btn-link svg path {
  fill: var(--brand-blue);
}
.furuno-btn-secondary .furuno-btn-greyed svg path,
.furuno-btn-transparent .furuno-btn-greyed svg path,
.furuno-btn-link .furuno-btn-greyed svg path {
  fill: var(--grey-300);
}
.furuno-btn-secondary .furuno-btn-light svg path,
.furuno-btn-transparent .furuno-btn-light svg path,
.furuno-btn-link .furuno-btn-light svg path {
  fill: var(--brand-light-blue);
}
.furuno-btn-secondary .furuno-btn-bright svg path,
.furuno-btn-transparent .furuno-btn-bright svg path,
.furuno-btn-link .furuno-btn-bright svg path {
  fill: var(--brand-bright-blue);
}
.furuno-btn-secondary .furuno-btn-dark svg path,
.furuno-btn-transparent .furuno-btn-dark svg path,
.furuno-btn-link .furuno-btn-btn-dark svg path {
  fill: var(--brand-dark-blue);
}
.furuno-btn-secondary .furuno-btn-navy svg path,
.furuno-btn-transparent .furuno-btn-navy svg path,
.furuno-btn-link .furuno-btn-btn-navy svg path {
  fill: var(--brand-navy);
}

.furuno-btn-disabled {
  cursor: not-allowed !important;
  pointer-events: none !important;
  opacity: 0.7 !important;
}

/* Forms */
/* Input base */
.furuno-input, body form.hs-form fieldset[class*=form-columns] .hs-input {
  padding: var(--padding-300-mobile) var(--padding-400-mobile);
  border: 1px solid;
  border-radius: var(--border-radius-small);

  font: var(--body-3-mobile);
  font-family: "Open Sans";
}
.furuno-input::placeholder, body form.hs-form fieldset[class*=form-columns] .hs-input::placeholder {
  font: var(--body-3-mobile);
  font-family: "Open Sans";
}
@media (min-width: 768px) {
  .furuno-input, body form.hs-form fieldset[class*=form-columns] .hs-input {
    padding: var(--padding-300-tablet-portrait) var(--padding-400-tablet-portrait);
    font: var(--body-3-tablet-portrait);
    font-family: "Open Sans";
  }
  .furuno-input::placeholder, body form.hs-form fieldset[class*=form-columns] .hs-input::placeholder {
    font: var(--body-3-tablet-portrait);
    font-family: "Open Sans";
  }
}
@media (min-width: 1024px) {
  .furuno-input, body form.hs-form fieldset[class*=form-columns] .hs-input {
    padding: var(--padding-300-tablet-landscape) var(--padding-400-tablet-landscape);
    font: var(--body-3-tablet-landscape);
    font-family: "Open Sans";
  }
  .furuno-input::placeholder, body form.hs-form fieldset[class*=form-columns] .hs-input::placeholder {
    font: var(--body-3-tablet-landscape);
    font-family: "Open Sans";
  }
}
@media (min-width: 1280px) {
  .furuno-input, body form.hs-form fieldset[class*=form-columns] .hs-input {
    padding: var(--padding-300) var(--padding-400);
    font: var(--body-3);
    font-family: "Open Sans";
  }
  .furuno-input::placeholder, body form.hs-form fieldset[class*=form-columns] .hs-input::placeholder {
    font: var(--body-3);
    font-family: "Open Sans";
  }
}

/* Transparent input */
.furuno-transparent-input {
  background-color: var(--grey-1000-a-20);
  border-color: var(--grey-0);
  color: var(--grey-0);
}
.furuno-transparent-input::placeholder {
  color: var(--grey-0);
}

/* Solid input */
.furuno-solid-input, body form.hs-form fieldset[class*=form-columns] .hs-input {
  background-color: var(--grey-0);
  border-color: var(--grey-100);
  color: var(--brand-navy);
}
.furuno-solid-input::placeholder, body form.hs-form fieldset[class*=form-columns] .hs-input::placeholder {
  color: var(--brand-navy);
}

/* Input with button */
.furuno-button-input-wrapper {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0;
  
  overflow: hidden;
}

.furuno-button-input-wrapper > .furuno-input {
  border-radius: var(--border-radius-small) 0 0 var(--border-radius-small);
}
.furuno-button-input-wrapper > .furuno-btn {
  min-width: 60px;
  height: 57px;
  
  border-radius: 0 var(--border-radius-small) var(--border-radius-small) 0;
}

/* Input wrappers */
.furuno-input-wrapper {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-200-mobile);

  font: var(--label-mobile);
  text-transform: uppercase;
}
form label {
  margin-bottom: var(--spacing-100) !important
}
form label span {
  font: var(--label-mobile);
  letter-spacing: 0.1px;
}
@media (min-width: 768px) {
  .furuno-input-wrapper {
    gap: var(--spacing-200-tablet-portrait);
    font: var(--label-tablet-portrait);
  }}
  form label span {
    font: var(--label-tablet-portrait);
  }
}
@media (min-width: 1024px) {
  .furuno-input-wrapper {
    gap: var(--spacing-200-tablet-landscape);
    font: var(--label-tablet-landscape);
  }
  form label {
    margin-bottom: var(--spacing-200) !important
  }
  form label span {
    font: var(--label-tablet-landscape);
  }
}
@media (min-width: 1280px) {
  .furuno-input-wrapper {
    gap: var(--spacing-200);
    font: var(--label);
  }
  form label span {
    font: var(--label);
  }
}

/* Select */
select.furuno-input, body form.hs-form fieldset[class*=form-columns] select.hs-input {
  -moz-appearance: none; /* Firefox */
  -webkit-appearance: none; /* Safari and Chrome */
  appearance: none;
  
  background-image: url("data:image/svg+xml,%3Csvg width='13' height='8' viewBox='0 0 13 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M12.5977 1.91557C12.9527 1.56054 12.9527 0.984937 12.5977 0.629914C12.2427 0.274892 11.6671 0.274892 11.3121 0.629914L6.50035 5.44164L1.68864 0.629914C1.33361 0.274892 0.758007 0.274892 0.402985 0.629914C0.0479632 0.984937 0.0479632 1.56054 0.402985 1.91557L5.85753 7.37011C6.21255 7.72513 6.78815 7.72513 7.14318 7.37011L12.5977 1.91557Z' fill='%230045FF'/%3E%3C/svg%3E%0A");
  background-repeat: no-repeat;
  background-size: auto;
  background-position-x: calc(100% - var(--spacing-400-mobile));
  background-position-y: 1.25rem;

  border: 1px solid #dfdfdf;
  border-radius: var(--border-radius-small);
  margin-right: var(--padding-500);
  padding: var(--padding-300);
  padding-right: var(--padding-500);
  
  cursor: pointer;
}
@media (min-width: 768px) {
  select.furuno-input, body form.hs-form fieldset[class*=form-columns] select.hs-input {
    background-position-x: calc(100% - var(--spacing-400-tablet-portrait));
  }
}

/* Checkbox */
/* The checkbox container */
label.furuno-checkbox-container {
  display: flex;
  align-items: center;
  height: 1.5625rem;

  position: relative;
  padding-left: var(--spacing-500);
  cursor: pointer;

  font: var(--body-3-mobile);
  font-family: "Open Sans";

  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  
  text-transform: none;
}
@media (min-width: 768px) {
  label.furuno-checkbox-container {
    font: var(--body-3-tablet-portrait);
    font-family: "Open Sans";
  }
}
@media (min-width: 1024px) {
  label.furuno-checkbox-container {
    font: var(--body-3-tablet-landscape);
    font-family: "Open Sans";
  }
}
@media (min-width: 1280px) {
  label.furuno-checkbox-container {
    font: var(--body-3);
    font-family: "Open Sans";
  }
}

/* Hide the browser's default checkbox */
label.furuno-checkbox-container input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

/* Create a custom checkbox */
label.furuno-checkbox-container .checkmark {
  position: absolute;
  top: 0;
  left: 0;

  height: 1.4375rem;
  width: 1.4375rem;

  border: 1px solid var(--grey-400);
  border-radius: var(--border-radius-small);
  background-color: var(--grey-100);
}

/* On mouse-over, add a grey background color */
label.furuno-checkbox-container:hover input ~ .checkmark {
  background-color: var(--grey-200);
}

/* When the checkbox is checked, add a blue background */
label.furuno-checkbox-container input:checked ~ .checkmark {
  background-color: var(--brand-bright-blue);
}

/* Create the checkmark/indicator (hidden when not checked) */
label.furuno-checkbox-container .checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the checkmark when checked */
label.furuno-checkbox-container input:checked ~ .checkmark:after {
  display: block;
}

/* Style the checkmark/indicator */
label.furuno-checkbox-container .checkmark:after {
  left: 10px;
  top: 5px;
  width: 5px;
  height: 12px;
  border: solid var(--grey-0);
  border-width: 0 2px 2px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}

/* Radio Button */
/* The container */
label.furuno-radio-container {
  display: flex;
  align-items: center;
  height: 1.5625rem;

  position: relative;
  cursor: pointer;
  padding-left: var(--spacing-500);

  font: var(--body-3-mobile);

  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
@media (min-width: 768px) {
  label.furuno-checkbox-container {
    font: var(--body-3-tablet-portrait);
  }
}
@media (min-width: 1024px) {
  label.furuno-checkbox-container {
    font: var(--body-3-tablet-landscape);
  }
}
@media (min-width: 1280px) {
  label.furuno-checkbox-container {
    font: var(--body-3);
  }
}

/* Hide the browser's default radio button */
label.furuno-radio-container input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
}

/* Create a custom radio button */
label.furuno-radio-container .checkmark {
  position: absolute;
  top: 0;
  left: 0;

  height: 1.4375rem;
  width: 1.4375rem;

  border: 1px solid var(--grey-400);
  border-radius: var(--border-radius-full);
  background-color: var(--grey-100);
}

/* On mouse-over, add a grey background color */
label.furuno-radio-container input ~ .checkmark {
  background-color: var(--grey-200);
}

/* When the radio button is checked, add a blue background */
label.furuno-radio-container input:checked ~ .checkmark {
  background-color: var(--brand-bright-blue);
  border-color: var(--brand-bright-blue);
}

/* Create the indicator (the dot/circle - hidden when not checked) */
label.furuno-radio-container .checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the indicator (dot/circle) when checked */
label.furuno-radio-container input:checked ~ .checkmark:after {
  display: block;
}

/* Style the indicator (dot/circle) */
label.furuno-radio-container .checkmark:after {
  top: 5px;
  left: 5px;
  
  height: 15px;
  width: 15px;
	border-radius: 50%;
	background: var(--grey-0);
}

/* Switch */
label.furuno-switch-container {
  position: relative;
  display: inline-block;
  width: 4.75rem;
  height: 2rem;
}

label.furuno-switch-container input { 
  opacity: 0;
  width: 0;
  height: 0;
}

label.furuno-switch-container .slider {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;

  border: solid 1px var(--grey-100);
  border-radius: 34px;
  background-color: var(--grey-0);

  cursor: pointer;
  -webkit-transition: .4s;
  transition: .4s;
}

label.furuno-switch-container .slider:before {
  content: "";

  position: absolute;
  left: 6px;
  bottom: 5px;

  height: 24px;
  width: 24px;

  border-radius: var(--border-radius-full);
  background-color: var(--brand-bright-blue);

  -webkit-transition: .4s;
  transition: .4s;
}

label.furuno-switch-container input:checked + .slider:before {
  -webkit-transform: translateX(48px);
  -ms-transform: translateX(48px);
  transform: translateX(48px);
}

/* Form structure */
.furuno-form {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: var(--spacing-200-mobile);
}
@media (min-width: 768px) {
  .furuno-form {
    gap: var(--spacing-200-tablet-portrait);
  }
}
@media (min-width: 1024px) {
  .furuno-form {
    gap: var(--spacing-200-tablet-landscape);
  }
}
@media (min-width: 1280px) {
  .furuno-form {
    gap: var(--spacing-200);
  }
}

.furuno-input-wrapper.full-width {
  width: 100%;
}
.furuno-input-wrapper.half-width {
  width: calc(50% - var(--spacing-200));
}

.furuno-form .disclaimer-text, label.furuno-checkbox-container.disclaimer-text, form .legal-consent-container > p {
  color: var(--grey-250);
}

.furuno-form .furuno-form-submit-btn, form input.hs-button {
  display: block;
  width: fit-content;
  min-width: 10.3125rem;
  text-align: center;
  
  margin: 0 auto;
}
form input.hs-button {
  text-transform: capitalize;
}
form .actions {
  display: flex;
  justify-content: center;
  align-items: center;
}

/* Media */
.furuno-img {
  height: 100%;
  width: 100%;
  object-position: center;
}
.furuno-cover-img {
  object-fit: cover;
}
.furuno-contain-img {
  object-fit: contain;
}

/* Alignment */
.furuno-alignment-left {
  margin-left: 0;
  margin-right: auto;
}
.furuno-alignment-center {
  margin-left: auto;
  margin-right: auto;
}
.furuno-alignment-right {
  margin-left: auto;
  margin-right: 0;
}

.furuno-hide {
  display: none !important;
}

/* Loading screen */
/* HTML: <div class="loader"></div> */
.furuno-loader--wrapper {
  position: fixed;
  z-index: 1000;
  top: 0;
  left: 0;

  background-color: var(--grey-0);

  width: 100vw;
  height: 100vh;

  display: flex;
  align-items: center;
  justify-content: center;
}
.furuno-loader {
  width: 60px;
  aspect-ratio: 2;
  --_g: no-repeat radial-gradient(circle closest-side, var(--brand-blue) 90%,#0000);
  background: 
    var(--_g) 0%   50%,
    var(--_g) 50%  50%,
    var(--_g) 100% 50%;
  background-size: calc(100%/3) 50%;
  animation: l3 1s infinite linear;
}
@keyframes l3 {
    20%{background-position:0%   0%, 50%  50%,100%  50%}
    40%{background-position:0% 100%, 50%   0%,100%  50%}
    60%{background-position:0%  50%, 50% 100%,100%   0%}
    80%{background-position:0%  50%, 50%  50%,100% 100%}
}

.furuno-checks-list {
  margin: 0;
  padding: 0;
  list-style: none;
}
.furuno-checks-list > li {
  display: flex;
  align-items: flex-start;
  gap: 1rem;
}
.furuno-checks-list > li > img,
.furuno-checks-list > li > svg {
  width: 22px;
  height: 27px !important;
  object-fit: contain;
  object-position: center;
}
/* @import url('http://example.com/example_style.css'); */

/***********************************************/
/* CSS @imports must be at the top of the file */
/* Add them above this section                 */
/***********************************************/

/*****************************************/
/* Start your style declarations here    */
/*****************************************/
.furuno-footer {
  padding: 0 !important;
}

.full-width-area {
  padding: 0 !important;
}

.row-fluid .span6 {
  width: 100% !important;
}

@media (min-width: 768px) {
  .row-fluid .span6 {
    width: 50% !important;
    margin-left: 0 !important;
  }
}

.body-wrapper .container-fluid {
  padding: 0;
}


/* Wrapper */
.body-wrapper {
  padding-top: 3.5rem;
}

@media (min-width: 1024px) {
  .body-wrapper {
    padding-top: 5.25rem;
  }
}