@charset "UTF-8";
/* New swatches! */
:export {
  D10: #162D3D;
  D20: #32536A;
  D30: #577083;
  D40: #7A92A5;
  D50: #B6C1CD;
  D55: #CBD3DC;
  D60: #DFE5EB;
  D70: #F0F4F7;
  D80: #FFFFFF;
  B00: #2B81CB;
  B05: #308DDD;
  B10: #3899EC;
  B20: #4EB7F5;
  B25: #A1D7FB;
  B27: #B3E0FB;
  B30: #C1E4FE;
  B40: #DAEFFE;
  B50: #EAF7FF;
  B60: #F4FAFE;
  F00: #AADBFC;
  P00: #8E21B1;
  P10: #AA4DC8;
  P20: #CD68ED;
  P30: #E5C9EE;
  P40: #EEDBF4;
  P50: #FAEEFF;
  P60: #FAF7FC;
  O00: #EA5F0E;
  O10: #FB7D33;
  O20: #FF9A48;
  R00: #D6453D;
  R05: #D8504C;
  R10: #EE5951;
  R20: #FF6666;
  R30: #FFD7D7;
  R40: #FFE1E1;
  R50: #FFEBEB;
  R60: #FFF5F5;
  G00: #44823F;
  G05: #61AD5A;
  G10: #60BC57;
  G20: #80C979;
  G30: #C9EEBC;
  G40: #DEF4D4;
  G50: #EDF9E5;
  G60: #F2FBEF;
  Y00: #C68801;
  Y05: #EDA200;
  Y10: #FDB10C;
  Y20: #FAC249;
  Y30: #FEF0BA;
  Y40: #FEF4CD;
  Y50: #FDF7DF;
  Y60: #FFFCF0; }

/*********************************************
*              DEPRECATED SECTION - START!
* TODO: The ALL variable below this message.
***********************************************/
/*********************************************
*              DEPRECATED SECTION - END!!
***********************************************/
/* New swatches! */
:export {
  D10: #162D3D;
  D20: #32536A;
  D30: #577083;
  D40: #7A92A5;
  D50: #B6C1CD;
  D55: #CBD3DC;
  D60: #DFE5EB;
  D70: #F0F4F7;
  D80: #FFFFFF;
  B00: #2B81CB;
  B05: #308DDD;
  B10: #3899EC;
  B20: #4EB7F5;
  B25: #A1D7FB;
  B27: #B3E0FB;
  B30: #C1E4FE;
  B40: #DAEFFE;
  B50: #EAF7FF;
  B60: #F4FAFE;
  F00: #AADBFC;
  P00: #8E21B1;
  P10: #AA4DC8;
  P20: #CD68ED;
  P30: #E5C9EE;
  P40: #EEDBF4;
  P50: #FAEEFF;
  P60: #FAF7FC;
  O00: #EA5F0E;
  O10: #FB7D33;
  O20: #FF9A48;
  R00: #D6453D;
  R05: #D8504C;
  R10: #EE5951;
  R20: #FF6666;
  R30: #FFD7D7;
  R40: #FFE1E1;
  R50: #FFEBEB;
  R60: #FFF5F5;
  G00: #44823F;
  G05: #61AD5A;
  G10: #60BC57;
  G20: #80C979;
  G30: #C9EEBC;
  G40: #DEF4D4;
  G50: #EDF9E5;
  G60: #F2FBEF;
  Y00: #C68801;
  Y05: #EDA200;
  Y10: #FDB10C;
  Y20: #FAC249;
  Y30: #FEF0BA;
  Y40: #FEF4CD;
  Y50: #FDF7DF;
  Y60: #FFFCF0; }

/*********************************************
*              DEPRECATED SECTION - START!
* TODO: The ALL variable below this message.
***********************************************/
/*********************************************
*              DEPRECATED SECTION - END!!
***********************************************/
/*
 * This file should contain mixins only (not actuall classes)
 */
/* New swatches! */
:export {
  D10: #162D3D;
  D20: #32536A;
  D30: #577083;
  D40: #7A92A5;
  D50: #B6C1CD;
  D55: #CBD3DC;
  D60: #DFE5EB;
  D70: #F0F4F7;
  D80: #FFFFFF;
  B00: #2B81CB;
  B05: #308DDD;
  B10: #3899EC;
  B20: #4EB7F5;
  B25: #A1D7FB;
  B27: #B3E0FB;
  B30: #C1E4FE;
  B40: #DAEFFE;
  B50: #EAF7FF;
  B60: #F4FAFE;
  F00: #AADBFC;
  P00: #8E21B1;
  P10: #AA4DC8;
  P20: #CD68ED;
  P30: #E5C9EE;
  P40: #EEDBF4;
  P50: #FAEEFF;
  P60: #FAF7FC;
  O00: #EA5F0E;
  O10: #FB7D33;
  O20: #FF9A48;
  R00: #D6453D;
  R05: #D8504C;
  R10: #EE5951;
  R20: #FF6666;
  R30: #FFD7D7;
  R40: #FFE1E1;
  R50: #FFEBEB;
  R60: #FFF5F5;
  G00: #44823F;
  G05: #61AD5A;
  G10: #60BC57;
  G20: #80C979;
  G30: #C9EEBC;
  G40: #DEF4D4;
  G50: #EDF9E5;
  G60: #F2FBEF;
  Y00: #C68801;
  Y05: #EDA200;
  Y10: #FDB10C;
  Y20: #FAC249;
  Y30: #FEF0BA;
  Y40: #FEF4CD;
  Y50: #FDF7DF;
  Y60: #FFFCF0; }

/*********************************************
*              DEPRECATED SECTION - START!
* TODO: The ALL variable below this message.
***********************************************/
/*********************************************
*              DEPRECATED SECTION - END!!
***********************************************/
/* Typography version 5 */
/* Heading */
/*---------*/
/* Text */
/*------*/
/* SIZE AND FONT-FAMILY */
/* COLORS */
/* TEXT */
.button {
  height: 36px;
  border-radius: 18px;
  padding: 0 23px;
  box-sizing: border-box;
  -webkit-font-smoothing: antialiased;
  text-align: center;
  border: 1px solid;
  cursor: pointer;
  outline: none;
  transition: all 100ms linear;
  /* HEIGHT */
  font-family: "HelveticaNeueW01-55Roma", "HelveticaNeueW02-55Roma", "HelveticaNeueW10-55Roma", "Helvetica Neue", "Helvetica", "Arial", "メイリオ, meiryo", "ヒラギノ角ゴ pro w3", "hiragino kaku gothic pro", "sans-serif";
  font-size: 16px;
  line-height: 24px; }
  .button.transparent {
    padding: 0px 24px; }
  .button.close-standard, .button.close-dark, .button.close-transparent {
    height: 18px;
    width: 18px;
    border-radius: 9px;
    padding: 0; }
  .button.icon-greybackground, .button.icon-standard, .button.icon-standardsecondary, .button.icon-white, .button.icon-whitesecondary {
    width: 36px;
    height: 36px;
    border-radius: 18px;
    padding: 0; }
  .button[data-focus-visible] {
    box-shadow: 0 0 0 3px #AADBFC; }

.heightx-large {
  font-size: 20px; }

.heightsmall {
  font-family: "HelveticaNeueW01-55Roma", "HelveticaNeueW02-55Roma", "HelveticaNeueW10-55Roma", "Helvetica Neue", "Helvetica", "Arial", "メイリオ, meiryo", "ヒラギノ角ゴ pro w3", "hiragino kaku gothic pro", "sans-serif";
  font-size: 14px;
  line-height: 18px; }

.heightx-small {
  font-family: "HelveticaNeueW01-65Medi", "HelveticaNeueW02-65Medi", "HelveticaNeueW10-65Medi", "Helvetica Neue", "Helvetica", "Arial", "メイリオ, meiryo", "ヒラギノ角ゴ pro w3", "hiragino kaku gothic pro", "sans-serif";
  font-size: 12px;
  line-height: 15px;
  line-height: 18px;
  /* tiny text has line-height:15 which is a problem centering */ }

.button > .inner {
  display: flex;
  width: 100%;
  height: 100%;
  justify-content: center;
  align-items: center; }

.button > .inner,
.button > div,
.button > .inner > div {
  font-family: inherit;
  font-size: inherit;
  color: inherit;
  line-height: inherit; }

.heightsmall {
  height: 30px;
  border-radius: 15px;
  padding: 0px 17px; }
  .heightsmall.transparent {
    padding: 0px 18px; }
  .heightsmall.icon-greybackground, .heightsmall.icon-standard, .heightsmall.icon-standardsecondary, .heightsmall.icon-white, .heightsmall.icon-whitesecondary {
    width: 30px;
    height: 30px;
    border-radius: 15px;
    padding: 0; }

.heightx-small {
  height: 24px;
  border-radius: 12px;
  padding: 0px 11px; }
  .heightx-small.transparent {
    padding: 0px 12px; }
  .heightx-small.icon-greybackground, .heightx-small.icon-standard, .heightx-small.icon-standardsecondary, .heightx-small.icon-white, .heightx-small.icon-whitesecondary {
    width: 24px;
    height: 24px;
    border-radius: 12px;
    padding: 0; }

.heightlarge {
  height: 42px;
  border-radius: 21px;
  padding: 0 29px; }
  .heightlarge.transparent {
    padding: 0 30px; }
  .heightlarge.icon-greybackground, .heightlarge.icon-standard, .heightlarge.icon-standardsecondary, .heightlarge.icon-white, .heightlarge.icon-whitesecondary {
    width: 42px;
    height: 42px;
    border-radius: 21px;
    padding: 0; }
  .heightlarge.close-standard, .heightlarge.close-dark, .heightlarge.close-transparent {
    height: 24px;
    width: 24px;
    border-radius: 12px;
    padding: 0; }

.heightx-large {
  height: 54px;
  border-radius: 27px;
  padding: 0px 35px;
  font-size: 20px; }
  .heightx-large.transparent {
    padding: 0px 30px; }
  .heightx-large.close-standard, .heightx-large.close-dark, .heightx-large.close-transparent {
    height: 26px;
    width: 26px;
    border-radius: 13px;
    padding: 0; }

.fullblue,
.icon-standard {
  color: #FFFFFF;
  background-color: #3899EC;
  border-color: #3899EC; }

.login {
  border-radius: 24px;
  height: 42px;
  font-size: 16px;
  background-color: #3899EC;
  border-color: #3899EC;
  color: #fff;
  min-width: 100px; }

.fullpurple {
  color: #FFFFFF;
  background-color: #AA4DC8;
  border-color: #AA4DC8; }

.fullgreen {
  color: #FFFFFF;
  background-color: #60BC57;
  border-color: #60BC57; }

.fullred {
  color: #FFFFFF;
  background-color: #EE5951;
  border-color: #EE5951; }

.emptygreen {
  color: #60BC57;
  background-color: #FFFFFF;
  border-color: #60BC57; }

.emptyred {
  color: #D6453D;
  background-color: transparent;
  border-color: #EE5951; }

.emptyblue {
  color: #3899EC;
  background-color: #FFFFFF;
  border-color: #5babef; }

.emptylogin {
  border-radius: 24px;
  height: 42px;
  font-size: 16px;
  background-color: #FFFFFF;
  border-color: #5babef;
  color: #3899EC;
  min-width: 100px; }

.emptypurple {
  color: #8E21B1;
  background-color: transparent;
  border-color: #AA4DC8; }

.close-transparent,
.transparent {
  color: #FFFFFF;
  background-color: rgba(22, 45, 61, 0.24);
  border: 0; }

.transparentblue,
.icon-standardsecondary {
  color: #3899EC;
  background-color: transparent;
  border-color: #3899EC; }

.emptybluesecondary,
.icon-greybackground,
.whiteblueprimary,
.icon-white,
.whiteblue {
  color: #3899EC;
  background-color: #FFFFFF;
  border-color: #FFFFFF; }

.whitebluesecondary,
.icon-whitesecondary {
  color: #FFFFFF;
  background-color: transparent;
  border-color: #FFFFFF; }

.close-standard {
  background-color: transparent;
  border-color: transparent;
  color: #3899EC; }

.close-dark {
  background-color: transparent;
  border-color: transparent;
  color: #162D3D; }

.fullgreen:hover,
.fullgreen.hover,
.emptygreen:hover,
.emptygreen.hover {
  color: #FFFFFF;
  background-color: #80C979;
  border-color: #80C979; }

.fullred:hover,
.fullred.hover,
.emptyred:hover,
.emptyred.hover {
  color: #FFFFFF;
  background-color: #FF6666;
  border-color: #FF6666; }

.icon-greybackground:hover,
.icon-greybackground.hover,
.icon-standard:hover,
.icon-standard.hover,
.fullblue:hover,
.fullblue.hover,
.emptyblue:hover,
.emptyblue.hover,
.icon-standardsecondary:hover,
.icon-standardsecondary.hover,
.transparentblue:hover,
.transparentblue.hover,
.whiteblue:hover,
.whiteblue.hover {
  color: #FFFFFF;
  background-color: #4EB7F5;
  border-color: #4EB7F5; }

.login:hover,
.login.hover {
  background-color: #4EB7F5;
  border-color: #4EB7F5; }

.emptylogin:hover,
.emptylogin.hover {
  background-color: #5babef;
  color: #fff; }

.icon-whitesecondary:hover,
.icon-whitesecondary.hover,
.whitebluesecondary:hover,
.whitebluesecondary.hover,
.icon-white:hover,
.icon-white.hover,
.whiteblueprimary:hover,
.whiteblueprimary.hover,
.emptybluesecondary:hover,
.emptybluesecondary.hover {
  color: #3899EC;
  background-color: #EAF7FF;
  border-color: #EAF7FF; }

.transparent:hover,
.transparent.hover,
.close-transparent:hover,
.close-transparent.hover {
  color: #FFFFFF;
  background-color: rgba(22, 45, 61, 0.3); }

.emptypurple:hover,
.emptypurple.hover,
.fullpurple:hover,
.fullpurple.hover {
  color: #FFFFFF;
  background-color: #CD68ED;
  border-color: #CD68ED; }

.close-standard:hover,
.close-standard.hover {
  background-color: transparent;
  border-color: transparent;
  color: #4EB7F5; }

.close-dark:hover,
.close-dark.hover {
  background-color: transparent;
  border-color: transparent;
  color: #32536A; }

.icon-greybackground:active,
.icon-greybackground.active,
.icon-standard:active,
.icon-standard.active,
.fullblue:active,
.fullblue.active,
.icon-standardsecondary:active,
.icon-standardsecondary.active,
.transparentblue:active,
.transparentblue.active,
.whiteblue:active,
.whiteblue.active,
.emptyblue:active,
.emptyblue.active {
  color: #FFFFFF;
  background-color: #3899EC;
  border-color: #3899EC; }

.login:active,
.login.active {
  background-color: #3899EC;
  border-color: #3899EC; }

.emptylogin:active,
.emptylogin.active {
  color: #fff;
  background-color: #5babef; }

.icon-white:active,
.icon-white.active,
.whiteblueprimary:active,
.whiteblueprimary.active,
.icon-whitesecondary:active,
.icon-whitesecondary.active,
.whitebluesecondary:active,
.whitebluesecondary.active {
  color: #3899EC;
  background-color: #DAEFFE;
  border-color: #DAEFFE; }

.emptybluesecondary:active,
.emptybluesecondary.active {
  color: #3899EC;
  background-color: #FFFFFF;
  border-color: #FFFFFF; }

.emptypurple:active,
.emptypurple.active,
.fullpurple:active,
.fullpurple.active {
  color: #FFFFFF;
  background-color: #AA4DC8;
  border-color: #AA4DC8; }

.fullgreen:active,
.fullgreen.active,
.emptygreen:active,
.emptygreen.active {
  color: #FFFFFF;
  background-color: #44823F;
  border-color: #44823F; }

.fullred:active,
.fullred.active,
.emptyred:active,
.emptyred.active {
  color: #FFFFFF;
  background-color: #EE5951;
  border-color: #EE5951; }

.transparent:active,
.transparent.active,
.close-transparent:active,
.close-transparent.active {
  color: #FFFFFF;
  background-color: rgba(22, 45, 61, 0.36); }

.close-standard:active,
.close-standard.active {
  background-color: transparent;
  border-color: transparent;
  color: #3899EC; }

.close-dark:active,
.close-dark.active {
  background-color: transparent;
  border-color: transparent;
  color: #162D3D; }

.button.no-border.disabled,
.button.dark-no-border.disabled,
.button.transparent.disabled,
.button.fullred.disabled,
.button.fullgreen.disabled,
.button.fullpurple.disabled,
.button.icon-greybackground.disabled,
.button.icon-standard.disabled,
.button.fullblue.disabled,
.button.login.disabled,
.button.emptylogin.disabled,
.button.icon-white.disabled,
.button.whiteblueprimary.disabled,
.button.close-transparent.disabled {
  color: #FFFFFF;
  cursor: default;
  background-color: #CBD3DC;
  border-color: #CBD3DC; }

.button.emptyred.disabled,
.button.emptygreen.disabled,
.button.emptybluesecondary.disabled,
.button.emptyblue.disabled,
.button.emptypurple.disabled,
.button.icon-standardsecondary.disabled,
.button.transparentblue.disabled,
.button.whiteblue.disabled,
.button.icon-whitesecondary.disabled,
.button.whitebluesecondary.disabled {
  font-family: "HelveticaNeueW01-55Roma", "HelveticaNeueW02-55Roma", "HelveticaNeueW10-55Roma", "Helvetica Neue", "Helvetica", "Arial", "メイリオ, meiryo", "ヒラギノ角ゴ pro w3", "hiragino kaku gothic pro", "sans-serif";
  font-size: 16px;
  line-height: 24px;
  color: #7A92A5;
  cursor: default;
  background-color: transparent;
  border-color: #CBD3DC; }
  .button.emptyred.disabled.heightsmall, .button.emptyred.disabled.heightx-small,
  .button.emptygreen.disabled.heightsmall,
  .button.emptygreen.disabled.heightx-small,
  .button.emptybluesecondary.disabled.heightsmall,
  .button.emptybluesecondary.disabled.heightx-small,
  .button.emptyblue.disabled.heightsmall,
  .button.emptyblue.disabled.heightx-small,
  .button.emptypurple.disabled.heightsmall,
  .button.emptypurple.disabled.heightx-small,
  .button.icon-standardsecondary.disabled.heightsmall,
  .button.icon-standardsecondary.disabled.heightx-small,
  .button.transparentblue.disabled.heightsmall,
  .button.transparentblue.disabled.heightx-small,
  .button.whiteblue.disabled.heightsmall,
  .button.whiteblue.disabled.heightx-small,
  .button.icon-whitesecondary.disabled.heightsmall,
  .button.icon-whitesecondary.disabled.heightx-small,
  .button.whitebluesecondary.disabled.heightsmall,
  .button.whitebluesecondary.disabled.heightx-small {
    color: #7A92A5; }

.button.close-standard.disabled,
.button.close-dark.disabled {
  cursor: default;
  background-color: transparent;
  border-color: transparent;
  color: #CBD3DC; }

.no-border {
  background: transparent;
  border: none;
  color: #162D3D; }
  .no-border:hover, .no-border.hover {
    color: #3899EC; }
  .no-border.heightsmall, .no-border.heightx-small {
    color: #32536A; }

.dark-no-border {
  background: transparent;
  border: none;
  color: #fff; }
  .dark-no-border:hover {
    color: #3899EC; }

.outlined {
  background: transparent;
  border: 1px solid #7A92A5;
  color: #162D3D; }
  .outlined:hover {
    background: #32536A;
    border-color: #32536A;
    color: #FFFFFF; }
  .outlined:focus, .outlined:active {
    background: #162D3D;
    border-color: #162D3D;
    color: #FFFFFF; }
  .outlined.disabled {
    background: #CBD3DC;
    border-color: #CBD3DC; }

/** Affixes **/
.button .inner .affixIcon {
  line-height: 0; }

.suffix {
  margin: 0 -12px 0 6px;
  width: 24px;
  height: 24px; }

:global(.rtl) .suffix, :global([dir='rtl']) .suffix {
  margin: 0 6px 0 -12px; }

.prefix {
  margin: 0 6px 0 -12px;
  line-height: 0;
  width: 24px;
  height: 24px; }

:global(.rtl) .prefix, :global([dir='rtl']) .prefix {
  margin: 0 -12px 0 6px; }

.heightx-small .suffix {
  margin: 0 -6px 0 3px;
  line-height: 0;
  width: 18px;
  height: 18px; }

:global(.rtl) .heightx-small .suffix, :global([dir='rtl']) .heightx-small .suffix {
  margin: 0 3px 0 -6px; }

.heightx-small .prefix {
  margin: 0 3px 0 -6px;
  line-height: 0;
  width: 18px;
  height: 18px; }

:global(.rtl) .heightx-small .prefix, :global([dir='rtl']) .heightx-small .prefix {
  margin: 0 -6px 0 3px; }

.heightsmall .suffix {
  margin: 0 -6px 0 6px;
  line-height: 0;
  width: 18px;
  height: 18px; }

:global(.rtl) .heightsmall .suffix, :global([dir='rtl']) .heightsmall .suffix {
  margin: 0 6px 0 -6px; }

.heightsmall .prefix {
  margin: 0 6px 0 -6px;
  line-height: 0;
  width: 18px;
  height: 18px; }

:global(.rtl) .heightsmall .prefix, :global([dir='rtl']) .heightsmall .prefix {
  margin: 0 -6px 0 6px; }

.heightlarge .suffix {
  margin: 0 -12px 0 12px;
  line-height: 0;
  width: 24px;
  height: 24px; }

:global(.rtl) .heightlarge .suffix, :global([dir='rtl']) .heightlarge .suffix {
  margin: 0 12px 0 -12px; }

.heightlarge .prefix {
  margin: 0 12px 0 -12px;
  line-height: 0;
  width: 24px;
  height: 24px; }

:global(.rtl) .heightlarge .prefix, :global([dir='rtl']) .heightlarge .prefix {
  margin: 0 -12px 0 12px; }

.heightx-large .suffix {
  margin: 0 -12px 0 12px;
  line-height: 0;
  width: 24px;
  height: 24px; }

:global(.rtl) .heightx-large .suffix, :global([dir='rtl']) .heightx-large .suffix {
  margin: 0 12px 0 -12px; }

.heightx-large .prefix {
  margin: 0 12px 0 -12px;
  line-height: 0;
  width: 24px;
  height: 24px; }

:global(.rtl) .heightx-large .prefix, :global([dir='rtl']) .heightx-large .prefix {
  margin: 0 -12px 0 12px; }
