/* Import Helpers */
/* Import Helpers in one location for styleurls */
/*************************************************
    Breakpoints
	Description: PX Breakpoints with @include-media npm.
**************************************************/
/* 
extraSmall: 320px
small: 420px
middle: 600px
medium: 800px
registration: 900px
twoStep: 1024px
base: 1280px
extraLarge: 1600px
*/
/*************************************************
	Colors Maps
	Description: Legal UX Color Palette
**************************************************/
/* SassScript Map */
/* Function */
/*************************************************
	Font Weights
	Description: Font weights for Source Sans Pro
**************************************************/
/* SassScript Map */
/* Function */
/*************************************************
	PX to REM converter
	Description: Changes pixel value to relative em units.
	Version: 1.0
**************************************************/
/*	Functions - Need to set html font-size to 62.5%
______________________________________*/
/*************************************************
	Grid
	Description: Grid component
	Examples:
    .example {
        @include grid-margin(right, 4);
        @include grid-padding(right, 8);
    }
    .example2 {
        @include grid-margin(32, 4);
        @include grid-padding(32, 4);
    }
    .example3 {
        @include grid-margin(8, 40, 24);
        @include grid-padding(8, 40, 24);
    }
    .example4 {
        @include grid-margin(8, 16, 24, 32);
        @include grid-padding(8, 16, 24, 32);
    }
    .example5 {
        @include grid-margin(8);
        @include grid-padding(8);
    }

**************************************************/
/*	Height calc
-------------------------------------------*/
/*	Site Widths
-------------------------------------------*/
/*	Text Formatting
-------------------------------------------*/
/*	Fonts
-------------------------------------------*/
/*	Colors
-------------------------------------------*/
/*************************************************
	Badge placeholders
	Description: Placeholders you can extend for badges.
	Version: 1.0

**************************************************/
.Badge, .Badge.Yellow {
  -webkit-border-radius: 2px;
  border-radius: 2px;
  padding: 0px 8px;
  padding: 0rem 0.6rem;
  border-width: 1px;
  border-style: solid;
  display: inline-block;
  line-height: 20px;
  line-height: 2rem;
}
@media (min-width: 50em) {
  .Badge, .Badge.Yellow {
    padding: 0px 8px;
    padding: 0rem 0.8rem;
  }
}
.Badge:first-child {
  margin: 0px 0px 0px 16px;
  margin: 0rem 0rem 0rem 1.2rem;
}
@media (min-width: 50em) {
  .Badge:first-child {
    margin: 0px 0px 0px 16px;
    margin: 0rem 0rem 0rem 1.6rem;
  }
}

/*************************************************
	Button placeholders
	Description: Placeholders you can extend for button types.
	Version: 1.0

**************************************************/
/* Buttons
______________________________________*/
.Button--flat, .ButtonLink--icon, .Button--raised, .Button--primary, .Button--raised--reversed, .Button--ghost, .Button--delete, button,
.Button {
  align-items: center;
  background-color: transparent;
  border: 1px solid transparent;
  -webkit-border-radius: 2px;
  border-radius: 2px;
  cursor: pointer;
  display: inline;
  font-size: 14px;
  font-size: 1.4rem;
  justify-content: center;
  line-height: 16px;
  line-height: 1.6rem;
  outline: none;
  padding: 4px 16px;
  vertical-align: middle;
  transition: background-color 0.15s cubic-bezier(0.42, 0, 0.58, 1), outline 0.15s cubic-bezier(0.42, 0, 0.58, 1), border 0.15s cubic-bezier(0.42, 0, 0.58, 1);
}
.Button--flat:hover, .ButtonLink--icon:hover, .Button--raised:hover, .Button--primary:hover, .Button--raised--reversed:hover, .Button--ghost:hover, .Button--delete:hover, button:hover,
.Button:hover, .Button--flat:focus, .ButtonLink--icon:focus, .Button--raised:focus, .Button--primary:focus, .Button--raised--reversed:focus, .Button--ghost:focus, .Button--delete:focus, button:focus,
.Button:focus {
  text-decoration: none;
}
.Button--flat:focus, .ButtonLink--icon:focus, .Button--raised:focus, .Button--primary:focus, .Button--raised--reversed:focus, .Button--ghost:focus, .Button--delete:focus, button:focus,
.Button:focus {
  outline: none;
}
.Button--flat:disabled, .ButtonLink--icon:disabled, .Button--raised:disabled, .Button--primary:disabled, .Button--raised--reversed:disabled, .Button--ghost:disabled, .Button--delete:disabled, button:disabled,
.Button:disabled, .Button--flat:disabled:hover, .ButtonLink--icon:disabled:hover, .Button--raised:disabled:hover, .Button--primary:disabled:hover, .Button--raised--reversed:disabled:hover, .Button--ghost:disabled:hover, .Button--delete:disabled:hover, button:disabled:hover,
.Button:disabled:hover, .Button--flat:disabled:active, .ButtonLink--icon:disabled:active, .Button--raised:disabled:active, .Button--primary:disabled:active, .Button--raised--reversed:disabled:active, .Button--ghost:disabled:active, .Button--delete:disabled:active, button:disabled:active,
.Button:disabled:active, .Button--flat:disabled:focus, .ButtonLink--icon:disabled:focus, .Button--raised:disabled:focus, .Button--primary:disabled:focus, .Button--raised--reversed:disabled:focus, .Button--ghost:disabled:focus, .Button--delete:disabled:focus, button:disabled:focus,
.Button:disabled:focus {
  background: none;
}
.Button--flat:active, .ButtonLink--icon:active, .Button--raised:active, .Button--primary:active, .Button--raised--reversed:active, .Button--ghost:active, .Button--delete:active, button:active,
.Button:active {
  box-shadow: none;
  outline: none;
  text-decoration: none;
}

.Button--extralarge {
  font-size: 21px;
  font-size: 2.1rem;
  line-height: 28px;
  line-height: 2.8rem;
  padding: 8px 20px;
}

.Button--large {
  font-size: 16px;
  font-size: 1.6rem;
  line-height: 20px;
  line-height: 2rem;
  padding: 8px 20px;
}

.Button--small {
  line-height: 12px;
  line-height: 1.2rem;
  padding: 4px 8px;
}

.Button--tiny {
  font-size: 13px;
  font-size: 1.3rem;
  line-height: 20px;
  line-height: 2rem;
  padding: 0;
}

/* Flat Button */
.Button--flat {
  color: #565656;
}
.Button--flat:hover {
  background-color: rgba(0, 0, 0, 0.12);
  border-color: rgba(0, 0, 0, 0.2);
  color: #262626;
}
.Button--flat:focus {
  background-color: transparent;
  color: #565656;
}
.Button--flat:active {
  background-color: rgba(0, 0, 0, 0.2);
  border-color: rgba(0, 0, 0, 0.5);
  color: #262626;
}
.Button--flat:disabled, .Button--flat:disabled:hover, .Button--flat:disabled:active, .Button--flat:disabled:focus {
  background-color: transparent;
  border-color: transparent;
}

/* Icon Link Button */
.ButtonLink--icon {
  padding: 4px 4px 4px 0px;
  padding: 0.3rem 0.3rem 0.3rem 0rem;
  position: relative;
}
@media (min-width: 50em) {
  .ButtonLink--icon {
    padding: 4px 4px 4px 0px;
    padding: 0.4rem 0.4rem 0.4rem 0rem;
  }
}
.ButtonLink--icon:hover {
  background-color: transparent;
  border-color: transparent;
}
.ButtonLink--icon:focus {
  background-color: transparent;
}
.ButtonLink--icon:active {
  background-color: transparent;
}
.ButtonLink--icon:disabled, .ButtonLink--icon:disabled:hover, .ButtonLink--icon:disabled:active, .ButtonLink--icon:disabled:focus {
  background-color: transparent;
  border-color: transparent;
}

/* Raised Button */
.Button--raised {
  background-color: white;
  border-color: #dadada;
  color: #0d77d6;
}
.Button--raised:hover, .Button--raised:focus, .Button--raised:visited:focus, .Button--raised:visited:active {
  background-color: #dadada;
  border-color: #dadada;
  color: #262626;
}
.Button--raised:disabled, .Button--raised:disabled:hover, .Button--raised:disabled:active, .Button--raised:disabled:focus {
  background-color: transparent;
  border-color: transparent;
}
.Button--raised:active {
  background-color: #c6c6c6;
  border-color: #6b6b6b;
  color: #262626;
}
.Button--raised:visited {
  background-color: white;
  border-color: #dadada;
  color: #0d77d6;
}

.Button--primary {
  background-color: #0d77d6;
  border-color: #0e568c;
  color: white;
}
.Button--primary:hover, .Button--primary:focus {
  background-color: #0e568c;
  border-color: #103a59;
  color: white;
}
.Button--primary:active {
  background-color: #103a59;
  border-color: #092856;
  box-shadow: none;
  color: white;
}
.Button--primary:visited {
  color: white;
}
.Button--primary:disabled, .Button--primary:disabled:hover, .Button--primary:disabled:active, .Button--primary:disabled:focus {
  background-color: #c6c6c6;
  border-color: #acacac;
  color: #acacac;
}

.Button--raised--reversed {
  background-color: #efefef;
  border-color: #c6c6c6;
  color: #565656;
}
.Button--raised--reversed:hover, .Button--raised--reversed:focus {
  background-color: #dadada;
  border-color: #dadada;
  color: #262626;
}
.Button--raised--reversed:disabled, .Button--raised--reversed:disabled:hover, .Button--raised--reversed:disabled:active, .Button--raised--reversed:disabled:focus {
  background-color: transparent;
  border-color: transparent;
}
.Button--raised--reversed:active {
  background-color: #c6c6c6;
  border-color: #6b6b6b;
  color: #262626;
}

/* Ghost Button */
.Button--ghost {
  background-color: transparent;
  border-color: white;
  border-width: 2px;
  color: white;
  font-size: 14px;
  font-size: 1.4rem;
  padding: 8px 20px;
}
.Button--ghost:hover, .Button--ghost:focus {
  background-color: #2b3647;
  border-color: black;
  color: white;
}
.Button--ghost:disabled, .Button--ghost:disabled:hover, .Button--ghost:disabled:active, .Button--ghost:disabled:focus {
  background-color: transparent;
  border-color: #d5d9e2;
  color: white;
}
.Button--ghost:active {
  background-color: #242a33;
  border-color: black;
  box-shadow: none;
  color: white;
}

/* Status */
.Button--delete {
  background-color: #a0251c;
  border-color: #661f1a;
  color: white;
}
.Button--delete:hover {
  background-color: #661f1a;
  border-color: #3d1916;
  color: white;
}
.Button--delete:focus {
  background-color: #a0251c;
  border-color: white;
  color: white;
}
.Button--delete:active {
  background-color: #3d1916;
  border-color: #3d1916;
  color: white;
}

.Button--comboBox {
  color: #0d77d6;
  line-height: 16px;
  line-height: 1.6rem;
  padding: 8px 12px 8px 48px;
  position: relative;
  text-align: left;
  width: 100%;
}
.Button--comboBox:hover, .Button--comboBox:focus {
  background: #e4ecf4;
  color: #262626;
  text-decoration: none;
}
.Button--comboBox .Icon-svg,
.Button--comboBox img {
  display: none;
  left: 20px;
  left: 2rem;
  margin-top: -2px;
  margin-top: -0.2rem;
  position: absolute;
}
@media (max-width: 50em) {
  .Button--comboBox .Icon-svg,
  .Button--comboBox img {
    left: 10px;
    left: 1rem;
  }
}
.is-selected.Button--comboBox {
  color: black;
}
.is-selected.Button--comboBox .Icon-svg, .ie8 .is-selected.Button--comboBox img {
  fill: black;
}

.Button-backToProduct {
  margin: 8px 0px 0px 0px;
  margin: 0.6rem 0rem 0rem 0rem;
}
@media (min-width: 50em) {
  .Button-backToProduct {
    margin: 8px 0px 0px 0px;
    margin: 0.8rem 0rem 0rem 0rem;
  }
}

.Button--cosiLinks {
  margin: 12px 0px 0px 0px;
  margin: 0.9rem 0rem 0rem 0rem;
  padding: 12px 0px;
  padding: 0.9rem 0rem;
  background: #597399;
  border: solid 1px #3e4d6b;
  color: white;
  display: block;
  text-align: center;
}
@media (min-width: 50em) {
  .Button--cosiLinks {
    margin: 12px 0px 0px 0px;
    margin: 1.2rem 0rem 0rem 0rem;
  }
}
@media (min-width: 50em) {
  .Button--cosiLinks {
    padding: 12px 0px;
    padding: 1.2rem 0rem;
  }
}
.Button--cosiLinks:visited {
  color: white;
}
.Button--cosiLinks:hover, .Button--cosiLinks:focus {
  background: #3e4d6b;
  border: solid 1px #2b3647;
}
.Button--cosiLinks:active {
  background: #2b3647;
  border: solid 1px #242a33;
  color: white;
}

/*************************************************
	Layout placeholders
	Description: Placeholders for layout.
	Version: 1.0
**************************************************/
.u-floatRight, .Button--floated {
  float: right;
}

.ie8 .Footer,
.ie9 .Footer, .hasFloatedButton:after, .Password-Requirements:after, .Select-custom-wrap:after, .Form-select-custom-wrap:after, .RememberMe:after, .Header > .Content-wrap:after, .GlobalHeader-secondaryMenu:after, .Clear:before, .PageHeader .Content-wrap:after, .ie8 .PageSubheaderWrapper:after,
.ie9 .PageSubheaderWrapper:after, .Content-wrap--twoColumn:after, .generatePasswordWrapper:after, .Recaptcha-input-wrapper:after {
  /* Must use this on an :after pseudo element ie. header[role=banner]:after { @extend %clearfix:after;} */
  content: '';
  display: table;
  clear: both;
}

.Button-backToProduct, .Cosi-signIn li, .ie8 .Dialog-closeButton img, .ie8 .GlobalFooter-logo img, .Form-textSelect .RadioButton--hasButton label, .Select-custom-wrap, .Select-custom, .EitherOr-divider > span, .ie8 .Button-rememberMe img, .ie8 .Marketing-image img, .ie8 .OnePass-logo img, .Button-backToVerify, .GlobalHeader-logo, .ie8 .GlobalHeader-logo img, .GlobalHeader-menu li a, .GlobalHeader-secondaryMenu li, .ie8 .modal-closeButton img, .Complete-circle {
  display: inline-block;
}

.Button--comboBox, .is-selected.Button--comboBox .Icon-svg, .ie8 .is-selected.Button--comboBox img, .Form-select-custom-wrap, .Form-select-custom, .EitherOr-divider, .Desk-wrapper .ButtonLink--icon,
.Desk-wrapper-small .ButtonLink--icon, .Informational, .ToggleSwitch .Switch:empty ~ label:before,
.ToggleSwitch .Switch:empty ~ label:after {
  display: block;
}

.InlineList li, .GlobalFooter-menu li, .Form-textSelect label.InlineLabel, .Form-textSelect .Form-inlineCheckbox label, .GlobalHeader-menu li, .GlobalHeader-productName a {
  display: inline;
}

/*************************************************
	Links
	Description: Placeholders for links.
	Version: 1.0
**************************************************/
.Button--flat:disabled, .ButtonLink--icon:disabled, .Button--raised:disabled, .Button--primary:disabled, .Button--raised--reversed:disabled, .Button--ghost:disabled, .Button--delete:disabled, button:disabled,
.Button:disabled, .Button--flat:disabled:hover, .ButtonLink--icon:disabled:hover, .Button--raised:disabled:hover, .Button--primary:disabled:hover, .Button--raised--reversed:disabled:hover, .Button--ghost:disabled:hover, .Button--delete:disabled:hover, button:disabled:hover,
.Button:disabled:hover, .Button--flat:disabled:active, .ButtonLink--icon:disabled:active, .Button--raised:disabled:active, .Button--primary:disabled:active, .Button--raised--reversed:disabled:active, .Button--ghost:disabled:active, .Button--delete:disabled:active, button:disabled:active,
.Button:disabled:active, .Button--flat:disabled:focus, .ButtonLink--icon:disabled:focus, .Button--raised:disabled:focus, .Button--primary:disabled:focus, .Button--raised--reversed:disabled:focus, .Button--ghost:disabled:focus, .Button--delete:disabled:focus, button:disabled:focus,
.Button:disabled:focus, a.disabled {
  color: #acacac;
  cursor: default;
  text-decoration: none;
}

/*************************************************
	Lists
	Description: Placeholders for unordered and ordered lists.
	Version: 1.0
**************************************************/
.u-bulletList {
  list-style-position: inside;
  list-style-type: disc;
}

.u-decimalList {
  list-style-position: inside;
  list-style-type: decimal;
}
.u-decimalList li {
  margin: 12px 0px 0px 0px;
  margin: 0.9rem 0rem 0rem 0rem;
}
@media (min-width: 50em) {
  .u-decimalList li {
    margin: 12px 0px 0px 0px;
    margin: 1.2rem 0rem 0rem 0rem;
  }
}

.u-alphaList {
  list-style-position: inside;
  list-style-type: lower-alpha;
}

/*************************************************
	Text placeholders
	Description: Placeholders for typography.
	Version: 1.0
**************************************************/
body {
  font-family: "Source Sans Pro", Arial, sans-serif;
}

h1,
.Heading1, h2.isLight,
.Heading2.isLight {
  font-weight: 300;
}

body, h2.isNormal,
.Heading2.isNormal, h3.isNormal,
.Heading3.isNormal, span, .Cosi-heading-form, .Dialog, .Form-textSelect input[type=date],
.Form-textSelect input[type=email],
.Form-textSelect input[type=password],
.Form-textSelect input[type=search],
.Form-textSelect input[type=tel],
.Form-textSelect input[type="text"],
.Recaptcha input[type="text"],
.Form-textSelect label select,
.Form-textSelect label textarea,
.Form-textSelect select,
.Form-textSelect textarea,
select,
textarea, .Form-textSelect.Form-radioButtonList label, .Form-textSelect label.radioButtonList, .Password-Requirements ul li, .Form-textSelect .Form-inlineCheckbox label, .Form-textSelect .Checkbox--inline label, .Form-select-custom select, .generatePasswordWrapper .paragraph--extraLarge, .Modal-title h1, .TwoStep-wrapper .ToggleSwitchEmpty h3 {
  font-weight: 400;
}

.Badge, .Badge.Yellow, .Button--primary, .Button--delete, .is-selected.Button--comboBox, .Button--cosiLinks, h2,
.Heading2, h3,
.Heading3, h4,
.Heading4, .bhawktestname, .Form-textSelect > div, .Form-textSelect label,
legend, .Password-Requirements ul li.is-fulfilled, .Select-custom-label, .EitherOr-divider > span, .Marketing-content p:first-child, .Toast a,
.Error a, .Toast-info span, .InlineError-message, .InlineError-message span, .Form-textSelect .validation-error, table caption, .ToggleSwitch .Switch:empty ~ label:before,
.ToggleSwitch .Switch:empty ~ label:after {
  font-weight: 600;
}

h5,
.Heading5, h6,
.Heading6, .TC-list span,
.TC-terms, .Informational span span {
  font-weight: 700;
}

h1,
.Heading1 {
  font-size: 32px;
  font-size: 3.2rem;
}

h2,
.Heading2, .formText--extraLarge {
  font-size: 24px;
  font-size: 2.4rem;
}

h2.isNormal,
.Heading2.isNormal, .Button--continueAction, .Cosi-heading-form, .Desk-message-large, .Modal-title h1 {
  font-size: 21px;
  font-size: 2.1rem;
}

.paragraph--extraLarge {
  font-size: 20px;
  font-size: 2rem;
}

h3,
.Heading3, .paragraph--large, .Sidebar-menu li a, .TwoStep-wrapper .ToggleSwitchEmpty h3 {
  font-size: 18px;
  font-size: 1.8rem;
}

h4,
.Heading4, p, table.bhawkrules td, .Form-textSelect label,
legend, input[type=checkbox] + label,
input[type=checkbox] + input[type=hidden] + label {
  font-size: 16px;
  font-size: 1.6rem;
}

.Button--cosiLinks {
  font-size: 15px;
  font-size: 1.5rem;
}

h5,
.Heading5, .paragraph--medium, .infoText-small, .Cosi-signIn, .Cosi-FormExtras, .GlobalHeader-secondaryMenu li a, .GlobalHeader-productName a, .GlobalHeader-userName, .InlineError-message, .Informational, .Recaptcha-wrapper {
  font-size: 14px;
  font-size: 1.4rem;
}

.Badge, .Badge.Yellow, h6,
.Heading6, .paragraph--small, .GlobalFooter-menu {
  font-size: 12px;
  font-size: 1.2rem;
}

/*************************************************
	Utility classes
	Description: Use classes sparingly if the item will always fit this style regarldess of screen size.
**************************************************/
/* TODO: refactor utilities */
.u-floatRight {
  padding-left: 5px;
}

.divider {
  border-top: 1px solid #acacac;
  margin: 32px 0px;
  margin: 2.4rem 0rem;
}
@media (min-width: 50em) {
  .divider {
    margin: 32px 0px;
    margin: 3.2rem 0rem;
  }
}

.divider.dotted {
  border-top-style: dotted;
}

.u-accessibilityText {
  display: block;
  height: 0;
  text-indent: -9999px;
}

.u-inline {
  display: inline;
}

.u-inlineBlock {
  display: inline-block;
}

.u-block {
  display: block;
}

.u-none {
  display: none;
}

.u-hiddenAnimation {
  opacity: 0 !important;
  position: absolute !important;
  visibility: hidden !important;
}

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

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

/*  List utilities */
.u-indentedList {
  margin: 12px 0px 16px 32px;
  margin: 0.9rem 0rem 1.2rem 2.4rem;
}
@media (min-width: 50em) {
  .u-indentedList {
    margin: 12px 0px 16px 32px;
    margin: 1.2rem 0rem 1.6rem 3.2rem;
  }
}

.list--hasPipe:before {
  margin: 0px 8px 0px 0px;
  margin: 0rem 0.6rem 0rem 0rem;
  color: #dadada;
  content: '|';
}
@media (min-width: 50em) {
  .list--hasPipe:before {
    margin: 0px 8px 0px 0px;
    margin: 0rem 0.8rem 0rem 0rem;
  }
}

/* Completely remove from the flow but leave available to screen readers. */
.u-hiddenVisually {
  border: 0 !important;
  clip: rect(1px, 1px, 1px, 1px) !important;
  height: 1px !important;
  overflow: hidden !important;
  padding: 0 !important;
  position: absolute !important;
  width: 1px !important;
}

/* Highlighting
______________________________________*/
.highlightField {
  background: #f9efc7 !important;
  border: 2px solid #ffe780 !important;
  color: #262626 !important;
  margin: -2px;
}

.highlightField [contenteditable] {
  background: #f9efc7 !important;
  color: #262626 !important;
}

.highlightText {
  background: #ffe780 !important;
  color: #262626 !important;
}

/* TODO remove from utilities */
/* Clear Input Button
______________________________________*/
.ClearButton {
  background: transparent;
  border: 0px;
  margin: 0px 0px 0px -29px;
  padding: 0px;
  position: absolute;
  /*Note: This removes it from the flow of the page so it doesn't push other elements around */
  transform: translateY(-2px);
}

[px-clearable-input] {
  padding-right: 25px;
}

/* Hides the IE clear button */
[px-clearable-input]::-ms-clear {
  display: none;
}

.Display-small {
  display: none;
}
@media (max-width: 50em) {
  .Display-small {
    display: block;
  }
}

.Display-smallInline {
  display: none;
}
@media (max-width: 64em) {
  .Display-smallInline {
    display: inline-block;
  }
}

.Display-large {
  display: block;
}
@media (max-width: 50em) {
  .Display-large {
    display: none;
  }
}

.Display-largeInline {
  display: inline;
}
@media (max-width: 50em) {
  .Display-largeInline {
    display: none;
  }
}

/* Import Utilities */
/*! normalize.css v4.1.1 | MIT License | github.com/necolas/normalize.css */
/**
 * 1. Change the default font family in all browsers (opinionated).
 * 2. Prevent adjustments of font size after orientation changes in IE and iOS.
 */
html {
  font-family: sans-serif;
  /* 1 */
  -ms-text-size-adjust: 100%;
  /* 2 */
  -webkit-text-size-adjust: 100%;
  /* 2 */
}

/**
 * Remove the margin in all browsers (opinionated).
 */
body {
  margin: 0;
}

/* HTML5 display definitions
   ========================================================================== */
/**
 * Add the correct display in IE 9-.
 * 1. Add the correct display in Edge, IE, and Firefox.
 * 2. Add the correct display in IE.
 */
article,
aside,
details,
figcaption,
figure,
footer,
header,
main,
menu,
nav,
section,
summary {
  /* 1 */
  display: block;
}

/**
 * Add the correct display in IE 9-.
 */
audio,
canvas,
progress,
video {
  display: inline-block;
}

/**
 * Add the correct display in iOS 4-7.
 */
audio:not([controls]) {
  display: none;
  height: 0;
}

/**
 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */
progress {
  vertical-align: baseline;
}

/**
 * Add the correct display in IE 10-.
 * 1. Add the correct display in IE.
 */
template,
[hidden] {
  display: none;
}

/* Links
   ========================================================================== */
/**
 * 1. Remove the gray background on active links in IE 10.
 * 2. Remove gaps in links underline in iOS 8+ and Safari 8+.
 */
a {
  background-color: transparent;
  /* 1 */
  -webkit-text-decoration-skip: objects;
  /* 2 */
}

/**
 * Remove the outline on focused links when they are also active or hovered
 * in all browsers (opinionated).
 */
a:active,
a:hover {
  outline-width: 0;
}

/* Text-level semantics
   ========================================================================== */
/**
 * 1. Remove the bottom border in Firefox 39-.
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */
abbr[title] {
  border-bottom: none;
  /* 1 */
  text-decoration: underline;
  /* 2 */
  text-decoration: underline dotted;
  /* 2 */
}

/**
 * Prevent the duplicate application of 'bolder' by the next rule in Safari 6.
 */
b,
strong {
  font-weight: inherit;
}

/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */
b,
strong {
  font-weight: bolder;
}

/**
 * Add the correct font style in Android 4.3-.
 */
dfn {
  font-style: italic;
}

/**
 * Correct the font size and margin on 'h1' elements within 'section' and
 * 'article' contexts in Chrome, Firefox, and Safari.
 */
h1 {
  font-size: 2em;
  margin: 0.67em 0;
}

/**
 * Add the correct background and color in IE 9-.
 */
mark {
  background-color: #ff0;
  color: #000;
}

/**
 * Add the correct font size in all browsers.
 */
small {
  font-size: 80%;
}

/**
 * Prevent 'sub' and 'sup' elements from affecting the line height in
 * all browsers.
 */
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

/* Embedded content
   ========================================================================== */
/**
 * Remove the border on images inside links in IE 10-.
 */
img {
  border-style: none;
}

/**
 * Hide the overflow in IE.
 */
svg:not(:root) {
  overflow: hidden;
}

/* Grouping content
   ========================================================================== */
/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd 'em' font sizing in all browsers.
 */
code,
kbd,
pre,
samp {
  font-family: monospace, monospace;
  /* 1 */
  font-size: 1em;
  /* 2 */
}

/**
 * Add the correct margin in IE 8.
 */
figure {
  margin: 1em 40px;
}

/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */
hr {
  box-sizing: content-box;
  /* 1 */
  height: 0;
  /* 1 */
  overflow: visible;
  /* 2 */
}

/* Forms
   ========================================================================== */
/**
 * 1. Change font properties to 'inherit' in all browsers (opinionated).
 * 2. Remove the margin in Firefox and Safari.
 */
button,
input,
select,
textarea {
  font: inherit;
  /* 1 */
  margin: 0;
  /* 2 */
}

/**
 * Restore the font weight unset by the previous rule.
 */
optgroup {
  font-weight: bold;
}

/**
 * Show the overflow in IE.
 * 1. Show the overflow in Edge.
 */
button,
input {
  /* 1 */
  overflow: visible;
}

/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */
button,
select {
  /* 1 */
  text-transform: none;
}

/**
 * 1. Prevent a WebKit bug where (2) destroys native 'audio' and 'video'
 *    controls in Android 4.
 * 2. Correct the inability to style clickable types in iOS and Safari.
 */
button,
html [type="button"],
[type="reset"],
[type="submit"] {
  -webkit-appearance: button;
  /* 2 */
}

/**
 * Remove the inner border and padding in Firefox.
 */
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
  border-style: none;
  padding: 0;
}

/**
 * Restore the focus styles unset by the previous rule.
 */
button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
  outline: 1px dotted ButtonText;
}

/**
 * Change the border, margin, and padding in all browsers (opinionated).
 */
fieldset {
  border: 1px solid #c0c0c0;
  margin: 0 2px;
  padding: 0.35em 0.625em 0.75em;
}

/**
 * 1. Correct the text wrapping in Edge and IE.
 * 2. Correct the color inheritance from 'fieldset' elements in IE.
 * 3. Remove the padding so developers are not caught out when they zero out
 *    'fieldset' elements in all browsers.
 */
legend {
  box-sizing: border-box;
  /* 1 */
  color: inherit;
  /* 2 */
  display: table;
  /* 1 */
  max-width: 100%;
  /* 1 */
  padding: 0;
  /* 3 */
  white-space: normal;
  /* 1 */
}

/**
 * Remove the default vertical scrollbar in IE.
 */
textarea {
  overflow: auto;
}

/**
 * 1. Add the correct box sizing in IE 10-.
 * 2. Remove the padding in IE 10-.
 */
[type="checkbox"],
[type="radio"] {
  box-sizing: border-box;
  /* 1 */
  padding: 0;
  /* 2 */
}

/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
  height: auto;
}

/**
 * 1. Correct the odd appearance in Chrome and Safari.
 * 2. Correct the outline style in Safari.
 */
[type="search"] {
  -webkit-appearance: textfield;
  /* 1 */
  outline-offset: -2px;
  /* 2 */
}

/**
 * Remove the inner padding and cancel buttons in Chrome and Safari on OS X.
 */
[type="search"]::-webkit-search-cancel-button,
[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}

/**
 * Correct the text style of placeholders in Chrome, Edge, and Safari.
 */
::-webkit-input-placeholder {
  color: inherit;
  opacity: 0.54;
}

/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to 'inherit' in Safari.
 */
::-webkit-file-upload-button {
  -webkit-appearance: button;
  /* 1 */
  font: inherit;
  /* 2 */
}

/*************************************************
	Text Formatting
	Description: Contains all of the font and text formatting rules for generic elements within a site.
	SCSS Source: utilities/_textFormatting.scss
	Example Page URL:
	Version: 1.0
	Dependancies: _variables.scss
**************************************************/
html {
  box-sizing: border-box;
  font-size: 62.5%;
}

/* Default Text Styles */
body {
  background: white;
  color: #6b6b6b;
  font-size: 16px;
  font-size: 1.6rem;
  line-height: 24px;
  line-height: 2.4rem;
}

/* Links */
a {
  color: #214acc;
  text-decoration: none;
}

a:visited {
  color: #214acc;
}

a:hover {
  text-decoration: underline;
}

a:focus {
  outline: none;
  text-decoration: underline;
}

a:active {
  color: #0e568c;
  outline: none;
  text-decoration: none;
}

/* Headings */
h1,
.Heading1,
h2,
.Heading2,
h3,
.Heading3,
h4,
.Heading4,
h5,
.Heading5,
h6,
.Heading6,
p {
  margin: 0px 0px 12px 0px;
  margin: 0rem 0rem 0.9rem 0rem;
}
@media (min-width: 50em) {
  h1,
  .Heading1,
  h2,
  .Heading2,
  h3,
  .Heading3,
  h4,
  .Heading4,
  h5,
  .Heading5,
  h6,
  .Heading6,
  p {
    margin: 0px 0px 12px 0px;
    margin: 0rem 0rem 1.2rem 0rem;
  }
}

h1,
.Heading1,
h2,
.Heading2,
h3,
.Heading3,
h4,
.Heading4,
h5,
.Heading5 {
  color: #262626;
}

h1.hasIcon,
.Heading1.hasIcon,
h2.hasIcon,
.Heading2.hasIcon,
h3.hasIcon,
.Heading3.hasIcon,
h4.hasIcon,
.Heading4.hasIcon,
h5.hasIcon,
.Heading5.hasIcon {
  padding-left: 50px;
  padding-left: 5rem;
  position: relative;
}
.ie8 h1.hasIcon, .ie8
.Heading1.hasIcon, .ie8
h2.hasIcon, .ie8
.Heading2.hasIcon, .ie8
h3.hasIcon, .ie8
.Heading3.hasIcon, .ie8
h4.hasIcon, .ie8
.Heading4.hasIcon, .ie8
h5.hasIcon, .ie8
.Heading5.hasIcon {
  padding: 0px;
  padding: 0rem;
}
@media (min-width: 50em) {
  .ie8 h1.hasIcon, .ie8
  .Heading1.hasIcon, .ie8
  h2.hasIcon, .ie8
  .Heading2.hasIcon, .ie8
  h3.hasIcon, .ie8
  .Heading3.hasIcon, .ie8
  h4.hasIcon, .ie8
  .Heading4.hasIcon, .ie8
  h5.hasIcon, .ie8
  .Heading5.hasIcon {
    padding: 0rem;
    padding: 0;
  }
}

h1.hasBorder,
.Heading1.hasBorder,
h2.hasBorder,
.Heading2.hasBorder,
h3.hasBorder,
.Heading3.hasBorder,
h4.hasBorder,
.Heading4.hasBorder,
h5.hasBorder,
.Heading5.hasBorder {
  margin: 0px 0px 20px 0px;
  margin: 0rem 0rem 1.5rem 0rem;
  padding: 0px 0px 20px 0px;
  padding: 0rem 0rem 1.5rem 0rem;
  border-bottom: solid 1px #dadada;
}
@media (min-width: 50em) {
  h1.hasBorder,
  .Heading1.hasBorder,
  h2.hasBorder,
  .Heading2.hasBorder,
  h3.hasBorder,
  .Heading3.hasBorder,
  h4.hasBorder,
  .Heading4.hasBorder,
  h5.hasBorder,
  .Heading5.hasBorder {
    margin: 0px 0px 20px 0px;
    margin: 0rem 0rem 2rem 0rem;
  }
}
@media (min-width: 50em) {
  h1.hasBorder,
  .Heading1.hasBorder,
  h2.hasBorder,
  .Heading2.hasBorder,
  h3.hasBorder,
  .Heading3.hasBorder,
  h4.hasBorder,
  .Heading4.hasBorder,
  h5.hasBorder,
  .Heading5.hasBorder {
    padding: 0px 0px 20px 0px;
    padding: 0rem 0rem 2rem 0rem;
  }
}

h1,
.Heading1 {
  line-height: 36px;
  line-height: 3.6rem;
}

h2,
.Heading2 {
  line-height: 28px;
  line-height: 2.8rem;
}

h3,
.Heading3 {
  color: #3d3d3d;
  line-height: 20px;
  line-height: 2rem;
}

h4,
.Heading4 {
  color: #3d3d3d;
  line-height: 20px;
  line-height: 2rem;
}

h4,
.Heading4 {
  text-transform: none;
}

h5,
.Heading5 {
  line-height: 16px;
  line-height: 1.6rem;
}

h6,
.Heading6 {
  color: #3d3d3d;
  line-height: 12px;
  line-height: 1.2rem;
}

.Heading-form {
  margin: 0px 0px 20px 0px;
  margin: 0rem 0rem 1.5rem 0rem;
}
@media (min-width: 50em) {
  .Heading-form {
    margin: 0px 0px 20px 0px;
    margin: 0rem 0rem 2rem 0rem;
  }
}

/* Paragraph Text */
p {
  line-height: 20px;
  line-height: 2rem;
}

.paragraph--extraLarge {
  line-height: 28px;
  line-height: 2.8rem;
}

.Form-textSelect .paragraph--extraLarge {
  color: #3d3d3d;
}

.paragraph--extraSpacing {
  margin: 12px 0px 16px 0px;
  margin: 0.9rem 0rem 1.2rem 0rem;
}
@media (min-width: 50em) {
  .paragraph--extraSpacing {
    margin: 12px 0px 16px 0px;
    margin: 1.2rem 0rem 1.6rem 0rem;
  }
}

.paragraph--large {
  line-height: 24px;
  line-height: 2.4rem;
}

.paragraph--medium {
  line-height: 18px;
  line-height: 1.8rem;
}

.paragraph--small {
  line-height: 16px;
  line-height: 1.6rem;
}

p.isDark {
  color: #262626;
}

.infoText-small {
  line-height: 20px;
  line-height: 2rem;
}

.italics {
  font-style: italic;
}

.optional {
  color: #bc291e;
}

/* Lists */
ol,
ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.InlineList li:before {
  margin: 0px 8px;
  margin: 0rem 0.6rem;
  color: #c6c6c6;
  content: '\2022';
}
@media (min-width: 50em) {
  .InlineList li:before {
    margin: 0px 8px;
    margin: 0rem 0.8rem;
  }
}

.InlineList li:first-child:before {
  margin: 0px;
  margin: 0rem;
  content: '';
}
@media (min-width: 50em) {
  .InlineList li:first-child:before {
    margin: 0rem;
    margin: 0;
  }
}

/* Images */
img {
  max-width: 100%;
}

/* Links directly following Header */
a.productLink {
  margin: -8px 0px 0px 0px;
  margin: -0.6rem 0rem 0rem 0rem;
  display: block;
}
@media (min-width: 50em) {
  a.productLink {
    margin: -8px 0px 0px 0px;
    margin: -0.8rem 0rem 0rem 0rem;
  }
}

.is-fulfilled {
  color: #158915;
}

/* Import Components */
.Badge {
  background: #efefef;
  border-color: #dadada;
  color: #3d3d3d;
}

.Badge.Yellow {
  background: #ffe780;
  border-color: transparent;
  color: #3d3d3d;
}

.Badge--hasIcon {
  padding: 0px 8px;
  padding: 0rem 0.6rem;
  position: relative;
}
@media (min-width: 50em) {
  .Badge--hasIcon {
    padding: 0px 8px;
    padding: 0rem 0.8rem;
  }
}

.ie8 .Badge--hasIcon {
  padding: 0px 8px;
  padding: 0rem 0.6rem;
}
@media (min-width: 50em) {
  .ie8 .Badge--hasIcon {
    padding: 0px 8px;
    padding: 0rem 0.8rem;
  }
}

.Badge--hasIcon .Icon-svg {
  position: absolute;
  top: -2px;
}

.Browserhawk {
  margin: 0 auto;
  max-width: 450px;
  text-align: left;
}
@media (max-width: 37.5em) {
  .Browserhawk {
    margin: 24px 0px 0px 0px;
    margin: 1.8rem 0rem 0rem 0rem;
    max-width: none;
  }
}
@media (max-width: 37.5em) and (min-width: 50em) {
  .Browserhawk {
    margin: 24px 0px 0px 0px;
    margin: 2.4rem 0rem 0rem 0rem;
  }
}

.bhawkrules {
  margin: 0px 0px 24px 0px;
  margin: 0rem 0rem 1.8rem 0rem;
}
@media (min-width: 50em) {
  .bhawkrules {
    margin: 0px 0px 24px 0px;
    margin: 0rem 0rem 2.4rem 0rem;
  }
}

table.bhawkrules td {
  vertical-align: top;
  width: 50%;
  word-break: normal;
}

.bhawkrules,
.bhawkrules tbody tr {
  border: none;
}
@media (max-width: 64em) {
  .bhawkrules,
  .bhawkrules tbody tr {
    margin: 8px 0px;
    margin: 0.6rem 0rem;
    padding: 0px 0px;
    padding: 0rem 0rem;
  }
}
@media (max-width: 64em) and (min-width: 50em) {
  .bhawkrules,
  .bhawkrules tbody tr {
    margin: 8px 0px;
    margin: 0.8rem 0rem;
  }
}
@media (max-width: 64em) and (min-width: 50em) {
  .bhawkrules,
  .bhawkrules tbody tr {
    padding: 0px 0px;
    padding: 0rem 0rem;
  }
}

.bhawkheader,
.bhawktestanswer {
  display: none;
}

.bhawkrules tbody td {
  padding: 8px 0px 0px 24px;
  padding: 0.6rem 0rem 0rem 1.8rem;
}
@media (min-width: 50em) {
  .bhawkrules tbody td {
    padding: 8px 0px 0px 24px;
    padding: 0.8rem 0rem 0rem 2.4rem;
  }
}
@media (max-width: 64em) {
  .bhawkrules tbody td {
    padding: 0px 0px;
    padding: 0rem 0rem;
  }
}
@media (max-width: 64em) and (min-width: 50em) {
  .bhawkrules tbody td {
    padding: 0px 0px;
    padding: 0rem 0rem;
  }
}

.bhawkrules tbody td:first-child {
  padding: 8px 12px 0px 0px;
  padding: 0.6rem 0.9rem 0rem 0rem;
}
@media (min-width: 50em) {
  .bhawkrules tbody td:first-child {
    padding: 8px 12px 0px 0px;
    padding: 0.8rem 1.2rem 0rem 0rem;
  }
}
@media (max-width: 64em) {
  .bhawkrules tbody td:first-child {
    padding: 0px 0px;
    padding: 0rem 0rem;
  }
}
@media (max-width: 64em) and (min-width: 50em) {
  .bhawkrules tbody td:first-child {
    padding: 0px 0px;
    padding: 0rem 0rem;
  }
}

.Browserhawk .ButtonLink--icon:hover {
  text-decoration: underline;
}

@media (max-width: 50em) {
  .Button--floated {
    margin: 0px 0px 24px 0px;
    margin: 0rem 0rem 1.8rem 0rem;
    float: none;
  }
}
@media (max-width: 50em) and (min-width: 50em) {
  .Button--floated {
    margin: 0px 0px 24px 0px;
    margin: 0rem 0rem 2.4rem 0rem;
  }
}

.ButtonLink--icon:hover span,
.ButtonLink--icon:focus span {
  text-decoration: underline;
}

.ButtonLink--icon span {
  padding: 0 0 0 4px;
}

.ie8 .ButtonLink--icon span,
.ie8 .ButtonLink--icon.Button--large span {
  padding: 0 !important;
}
@media (max-width: 50em) {
  .ie8 .ButtonLink--icon span,
  .ie8 .ButtonLink--icon.Button--large span {
    padding: 0 !important;
  }
}

.ButtonLink--icon .Icon-svg,
.Button--hasIcon .Icon-svg {
  position: absolute;
}

.ButtonLink--icon .Icon-svg {
  top: -2px;
}

.Button--hasIcon {
  position: relative;
}

.Button--hasIcon.Button--large {
  padding: 8px 20px;
}

.Button--hasIcon.Button--large .Icon-svg {
  left: -7px;
  top: -2px;
}

.Button--hasIcon.Button--small {
  padding: 8px 16px;
}

.Button--hasIcon.Button--small .Icon-svg {
  left: -5px;
  top: -3px;
}

.ie8 .Button--hasIcon.Button--small {
  padding: 8px 16px;
}

.Button--hasIcon.Button--tiny {
  padding: 0px 8px 0px 32px;
  padding: 0rem 0.6rem 0rem 2.4rem;
  padding: 0 8px 0 32px;
}
@media (min-width: 50em) {
  .Button--hasIcon.Button--tiny {
    padding: 0px 8px 0px 32px;
    padding: 0rem 0.8rem 0rem 3.2rem;
  }
}

.Button--hasIcon.Button--tiny .Icon-svg {
  height: 16px;
  left: 8px;
  top: 2px;
  width: 16px;
}

.Button--continueAction {
  padding: 16px 32px;
  padding: 1.2rem 2.4rem;
  background: #158915;
  color: white;
  position: relative;
  display: block;
  text-align: right;
}
@media (min-width: 50em) {
  .Button--continueAction {
    padding: 16px 32px;
    padding: 1.6rem 3.2rem;
  }
}
.Button--continueAction:hover, .Button--continueAction:visited {
  color: white;
}

.Button--continueAction .Icon-svg {
  fill: #39bc39;
  position: absolute;
  right: 0;
}

.ButtonBar {
  margin: 20px 0px 0px 0px;
  margin: 1.5rem 0rem 0rem 0rem;
}
@media (min-width: 50em) {
  .ButtonBar {
    margin: 20px 0px 0px 0px;
    margin: 2rem 0rem 0rem 0rem;
  }
}

.ButtonBar--hasLink {
  margin: 20px 0px 24px 0px;
  margin: 1.5rem 0rem 1.8rem 0rem;
}
@media (min-width: 50em) {
  .ButtonBar--hasLink {
    margin: 20px 0px 24px 0px;
    margin: 2rem 0rem 2.4rem 0rem;
  }
}

.ButtonBar-item:first-child {
  margin: 0px 16px 0px 0px;
  margin: 0rem 1.2rem 0rem 0rem;
}
@media (min-width: 50em) {
  .ButtonBar-item:first-child {
    margin: 0px 16px 0px 0px;
    margin: 0rem 1.6rem 0rem 0rem;
  }
}
@media (max-width: 20em) {
  .ButtonBar-item:first-child {
    margin: 0px 0px 16px 0px;
    margin: 0rem 0rem 1.2rem 0rem;
    display: block;
  }
}
@media (max-width: 20em) and (min-width: 50em) {
  .ButtonBar-item:first-child {
    margin: 0px 0px 16px 0px;
    margin: 0rem 0rem 1.6rem 0rem;
  }
}

.ButtonBar-item {
  display: inline-block;
}
@media (max-width: 20em) {
  .ButtonBar-item {
    margin: 0px 0px 16px 0px;
    margin: 0rem 0rem 1.2rem 0rem;
    display: block;
  }
}
@media (max-width: 20em) and (min-width: 50em) {
  .ButtonBar-item {
    margin: 0px 0px 16px 0px;
    margin: 0rem 0rem 1.6rem 0rem;
  }
}

.ButtonBar-item .Button {
  display: inline-block;
}
@media (max-width: 20em) {
  .ButtonBar-item .Button {
    display: block;
    text-align: center;
    width: 100%;
  }
}

.ButtonBar-doubleItem .Button {
  margin: 0px 0px 0px 16px;
  margin: 0rem 0rem 0rem 1.2rem;
}
@media (min-width: 50em) {
  .ButtonBar-doubleItem .Button {
    margin: 0px 0px 0px 16px;
    margin: 0rem 0rem 0rem 1.6rem;
  }
}
@media (max-width: 50em) {
  .ButtonBar-doubleItem .Button {
    margin: 0px 0px 16px 0px;
    margin: 0rem 0rem 1.2rem 0rem;
    display: block;
    text-align: center;
    width: 100%;
  }
}
@media (max-width: 50em) and (min-width: 50em) {
  .ButtonBar-doubleItem .Button {
    margin: 0px 0px 16px 0px;
    margin: 0rem 0rem 1.6rem 0rem;
  }
}

.ButtonBar--isSpread .Button,
.ButtonBar--isSingular .Button {
  float: right;
}
@media (max-width: 50em) {
  .ButtonBar--isSpread .Button,
  .ButtonBar--isSingular .Button {
    display: block;
    float: none;
    text-align: center;
    width: 100%;
  }
}

.ButtonBar--isSpread li:first-child .Button {
  float: none;
}

.ButtonBar--isSpread .ButtonBar-item {
  display: inline;
}
@media (max-width: 50em) {
  .ButtonBar--isSpread .ButtonBar-item {
    margin: 0px 0px 16px 0px;
    margin: 0rem 0rem 1.2rem 0rem;
    display: block;
    width: 100%;
  }
}
@media (max-width: 50em) and (min-width: 50em) {
  .ButtonBar--isSpread .ButtonBar-item {
    margin: 0px 0px 16px 0px;
    margin: 0rem 0rem 1.6rem 0rem;
  }
}

.ButtonBar-singleCentered .ButtonBar-item {
  display: block;
  text-align: center;
}

.ButtonBar-CodeLink {
  float: right;
}

.ButtonBar-CodeLink .Button {
  padding: 12px 0px;
  padding: 0.9rem 0rem;
  height: 38px;
}
@media (min-width: 50em) {
  .ButtonBar-CodeLink .Button {
    padding: 12px 0px;
    padding: 1.2rem 0rem;
  }
}

.cosi .Flex-wrap {
  padding: 0px 0px 48px 0px;
  padding: 0rem 0rem 3.6rem 0rem;
  max-width: 974px;
}
@media (min-width: 50em) {
  .cosi .Flex-wrap {
    padding: 0px 0px 48px 0px;
    padding: 0rem 0rem 4.8rem 0rem;
  }
}

.cosi .Content-wrap--small {
  max-width: 560px;
}

.cosi .Content-TC {
  max-width: 912px;
}

.Content-TC .Form-content {
  padding-left: 0;
  padding-right: 0;
  padding-top: 40px;
  padding-top: 4rem;
}
@media (max-width: 50em) {
  .Content-TC .Form-content {
    padding-top: 32px;
    padding-top: 3.2rem;
  }
}

.Cosi-TC-content {
  margin: 0px 88px;
  margin: 0rem 6.6rem;
}
@media (min-width: 50em) {
  .Cosi-TC-content {
    margin: 0px 88px;
    margin: 0rem 8.8rem;
  }
}
@media (max-width: 50em) {
  .Cosi-TC-content {
    margin-left: 32px;
    margin-left: 3.2rem;
    margin-right: 32px;
    margin-right: 3.2rem;
  }
}

.TC-form {
  margin: 36px 0px 0px 0px;
  margin: 2.7rem 0rem 0rem 0rem;
}
@media (min-width: 50em) {
  .TC-form {
    margin: 36px 0px 0px 0px;
    margin: 3.6rem 0rem 0rem 0rem;
  }
}

.TC-form .Form-textSelect--hasBorder {
  padding: 24px 88px 0px 88px;
  padding: 1.8rem 6.6rem 0rem 6.6rem;
}
@media (min-width: 50em) {
  .TC-form .Form-textSelect--hasBorder {
    padding: 24px 88px 0px 88px;
    padding: 2.4rem 8.8rem 0rem 8.8rem;
  }
}
@media (max-width: 50em) {
  .TC-form .Form-textSelect--hasBorder {
    padding-left: 32px;
    padding-left: 3.2rem;
  }
}

.TC-list {
  margin: 0px 0px 12px 0px;
  margin: 0rem 0rem 0.9rem 0rem;
}
@media (min-width: 50em) {
  .TC-list {
    margin: 0px 0px 12px 0px;
    margin: 0rem 0rem 1.2rem 0rem;
  }
}

.TC-list span,
.TC-terms {
  color: #3d3d3d;
}

.cosi .Page-wrapper .Flex-content {
  padding: 0px 0px 60px 0px;
  padding: 0rem 0rem 4.5rem 0rem;
}
@media (min-width: 50em) {
  .cosi .Page-wrapper .Flex-content {
    padding: 0px 0px 60px 0px;
    padding: 0rem 0rem 6rem 0rem;
  }
}

body.full .PageHeader.PageHeader--withLink {
  padding: 32px 0px 0px 0px;
  padding: 2.4rem 0rem 0rem 0rem;
}
@media (min-width: 50em) {
  body.full .PageHeader.PageHeader--withLink {
    padding: 32px 0px 0px 0px;
    padding: 3.2rem 0rem 0rem 0rem;
  }
}

.Cosi-logo img {
  display: none;
}

.ie8 .Cosi-logo img {
  display: block;
}

.cosi .OnePass-logo {
  margin-bottom: 24px;
  margin-bottom: 2.4rem;
}

.Cosi-header {
  margin-bottom: 0;
}

.Cosi-signIn {
  margin: 0px 0px 24px 0px;
  margin: 0rem 0rem 1.8rem 0rem;
}
@media (min-width: 50em) {
  .Cosi-signIn {
    margin: 0px 0px 24px 0px;
    margin: 0rem 0rem 2.4rem 0rem;
  }
}

.Cosi-signIn li {
  margin: 0px 0px 0px 16px;
  margin: 0rem 0rem 0rem 1.2rem;
}
@media (min-width: 50em) {
  .Cosi-signIn li {
    margin: 0px 0px 0px 16px;
    margin: 0rem 0rem 0rem 1.6rem;
  }
}

.Cosi-signIn li.list--hasPipe {
  margin: 0px 0px 0px 8px;
  margin: 0rem 0rem 0rem 0.6rem;
}
@media (min-width: 50em) {
  .Cosi-signIn li.list--hasPipe {
    margin: 0px 0px 0px 8px;
    margin: 0rem 0rem 0rem 0.8rem;
  }
}

.Cosi-signIn li:first-child {
  margin: 0;
}

.Cosi-signIn .Icon-svg {
  top: -4px;
}

.Cosi-FormExtras {
  padding: 20px 0px 0px 0px;
  padding: 1.5rem 0rem 0rem 0rem;
  border-top: solid 1px #dadada;
  display: grid;
  display: -ms-grid;
  grid-template-columns: 1fr 1fr;
  -ms-grid-columns: 1fr 10px 1fr 10px;
  grid-column-gap: 10px;
}
@media (min-width: 50em) {
  .Cosi-FormExtras {
    padding: 20px 0px 0px 0px;
    padding: 2rem 0rem 0rem 0rem;
  }
}
@media (max-width: 26.25em) {
  .Cosi-FormExtras {
    display: block;
  }
}
.Cosi-FormExtras li:first-child {
  -ms-grid-column: 1;
  -ms-grid-row: 1;
}
.Cosi-FormExtras li:nth-child(2) {
  -ms-grid-column: 3;
  -ms-grid-row: 1;
}
.Cosi-FormExtras li:nth-child(3) {
  -ms-grid-column: 1;
  -ms-grid-row: 2;
}
.Cosi-FormExtras li:nth-child(4) {
  -ms-grid-column: 3;
  -ms-grid-row: 2;
}
.Cosi-FormExtras li:nth-child(5) {
  -ms-grid-column: 1;
  -ms-grid-row: 3;
}
.Cosi-FormExtras li:nth-child(6) {
  -ms-grid-column: 3;
  -ms-grid-row: 2;
}

.Cosi-FormExtras li {
  line-height: 16px;
  line-height: 1.6rem;
  margin-bottom: 10px;
  margin-bottom: 1rem;
}

.Cosi-heading-form {
  margin: 24px 0px 12px 0px;
  margin: 1.8rem 0rem 0.9rem 0rem;
  color: #3d3d3d;
}
@media (min-width: 50em) {
  .Cosi-heading-form {
    margin: 24px 0px 12px 0px;
    margin: 2.4rem 0rem 1.2rem 0rem;
  }
}

.Cosi-message {
  margin: 0px 0px 32px 0px;
  margin: 0rem 0rem 2.4rem 0rem;
}
@media (min-width: 50em) {
  .Cosi-message {
    margin: 0px 0px 32px 0px;
    margin: 0rem 0rem 3.2rem 0rem;
  }
}

.cosi .Form--hasWrapper {
  margin: 16px 0px 0px 0px;
  margin: 1.2rem 0rem 0rem 0rem;
}
@media (min-width: 50em) {
  .cosi .Form--hasWrapper {
    margin: 16px 0px 0px 0px;
    margin: 1.6rem 0rem 0rem 0rem;
  }
}

.cosi .Page-wrapper .Flex-sidebar {
  margin: 108px 0px 0px 0px;
  margin: 8.1rem 0rem 0rem 0rem;
  padding: 0px 32px;
  padding: 0rem 2.4rem;
  background: transparent;
  border-left: solid 1px #dadada;
  color: #6b6b6b;
  -ms-flex: 0 1 auto;
  flex: 0 1 auto;
  max-width: 417px;
  min-width: 417px;
}
@media (min-width: 50em) {
  .cosi .Page-wrapper .Flex-sidebar {
    margin: 108px 0px 0px 0px;
    margin: 10.8rem 0rem 0rem 0rem;
  }
}
@media (min-width: 50em) {
  .cosi .Page-wrapper .Flex-sidebar {
    padding: 0px 32px;
    padding: 0rem 3.2rem;
  }
}
@media (max-width: 56.25em) {
  .cosi .Page-wrapper .Flex-sidebar {
    display: none;
  }
}

.ie8 .cosi .Page-wrapper .Flex-content,
.ie9 .cosi .Page-wrapper .Flex-content {
  width: 62%;
}
@media (max-width: 56.25em) {
  .ie8 .cosi .Page-wrapper .Flex-content,
  .ie9 .cosi .Page-wrapper .Flex-content {
    width: 100%;
  }
}

.ie8 .cosi .Page-wrapper .Flex-sidebar,
.ie9 .cosi .Page-wrapper .Flex-sidebar {
  width: 38%;
  min-width: 0;
}

body.full.cosi .Button-backToVerify {
  margin: 24px 0px 0px 0px;
  margin: 1.8rem 0rem 0rem 0rem;
  position: relative;
}
@media (min-width: 50em) {
  body.full.cosi .Button-backToVerify {
    margin: 24px 0px 0px 0px;
    margin: 2.4rem 0rem 0rem 0rem;
  }
}
@media (max-width: 50em) {
  body.full.cosi .Button-backToVerify {
    margin: 16px 0px 0px 0px;
    margin: 1.2rem 0rem 0rem 0rem;
  }
}
@media (max-width: 50em) and (min-width: 50em) {
  body.full.cosi .Button-backToVerify {
    margin: 16px 0px 0px 0px;
    margin: 1.6rem 0rem 0rem 0rem;
  }
}

body.full.cosi .Button-backToVerify--inForm {
  margin: -16px 0px 16px 0px;
  margin: -1.2rem 0rem 1.2rem 0rem;
  position: relative;
}
@media (min-width: 50em) {
  body.full.cosi .Button-backToVerify--inForm {
    margin: -16px 0px 16px 0px;
    margin: -1.6rem 0rem 1.6rem 0rem;
  }
}

.cosi .Informational-wrapper,
.cosi .Error {
  margin: 0px 0px 24px 0px;
  margin: 0rem 0rem 1.8rem 0rem;
}
@media (min-width: 50em) {
  .cosi .Informational-wrapper,
  .cosi .Error {
    margin: 0px 0px 24px 0px;
    margin: 0rem 0rem 2.4rem 0rem;
  }
}

.Form--additionalInformation {
  margin: 4px 0px 0px 0px;
  margin: 0.3rem 0rem 0rem 0rem;
}
@media (min-width: 50em) {
  .Form--additionalInformation {
    margin: 4px 0px 0px 0px;
    margin: 0.4rem 0rem 0rem 0rem;
  }
}

.Form--additionalInformation > div {
  display: none;
}

.Form--additionalInformation ul {
  margin: 20px 0px 0px 0px;
  margin: 1.5rem 0rem 0rem 0rem;
}
@media (min-width: 50em) {
  .Form--additionalInformation ul {
    margin: 20px 0px 0px 0px;
    margin: 2rem 0rem 0rem 0rem;
  }
}

.Cosi-ads img {
  max-width: 300px;
}

.Dialog-container {
  position: relative;
}

.Dialog {
  padding: 20px 28px 20px 12px;
  padding: 1.5rem 2.1rem 1.5rem 0.9rem;
  background: white;
  border: solid 1px #dadada;
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.15);
  color: #565656;
  font-size: 14px;
  font-size: 1.4rem;
  font-weight: normal;
  left: -4px;
  line-height: 20px;
  line-height: 2rem;
  position: absolute;
  top: 34px;
  width: 270px;
}
@media (min-width: 50em) {
  .Dialog {
    padding: 20px 28px 20px 12px;
    padding: 2rem 2.8rem 2rem 1.2rem;
  }
}
@media (max-width: 37.5em) {
  .Dialog {
    margin: 8px 0px 0px 0px;
    margin: 0.6rem 0rem 0rem 0rem;
    position: relative;
    left: auto;
    top: auto;
    width: auto;
  }
}
@media (max-width: 37.5em) and (min-width: 50em) {
  .Dialog {
    margin: 8px 0px 0px 0px;
    margin: 0.8rem 0rem 0rem 0rem;
  }
}

.Dialog span {
  font-weight: 600;
}

.Dialog:after {
  content: '';
  display: block;
  position: absolute;
  top: -7px;
  width: 12px;
  height: 12px;
  background: white;
  border-right: solid 1px #dadada;
  border-bottom: solid 1px #dadada;
  -moz-transform: rotate(-134deg);
  -webkit-transform: rotate(-134deg);
  transform: rotate(-134deg);
}
@media (max-width: 37.5em) {
  .Dialog:after {
    display: none;
  }
}

.ie8 .Dialog:after {
  display: none;
}

.Dialog-closeButton {
  padding: 4px 4px;
  padding: 0.3rem 0.3rem;
  line-height: 0;
  position: absolute;
  top: 4px;
  right: 4px;
}
@media (min-width: 50em) {
  .Dialog-closeButton {
    padding: 4px 4px;
    padding: 0.4rem 0.4rem;
  }
}
.Dialog-closeButton:hover, .Dialog-closeButton:focus {
  background: #dadada;
}

.Dialog-closeButton .Icon-svg {
  margin: 0px;
  margin: 0rem;
}
@media (min-width: 50em) {
  .Dialog-closeButton .Icon-svg {
    margin: 0rem;
    margin: 0;
  }
}

.Dialog-closeButton img {
  display: none;
}

@font-face {
  font-family: 'KnowledgeRegular';
  src: url("../Fonts/knowledge-regular-webfont.eot");
  /* IE9 Compat Modes */
  src: url("../Fonts/knowledge-regular-webfont.eot?#iefix") format("embedded-opentype"), url("../Fonts/knowledge-regular-webfont.woff2") format("woff2"), url("../Fonts/knowledge-regular-webfont.woff") format("woff"), url("../Fonts/knowledge-regular-webfont.ttf") format("truetype"), url("../Fonts/knowledge-regular-webfont.svg#svgFontName") format("svg");
  /* Legacy iOS */
}
@font-face {
  font-family: 'KnowledgeMedium';
  src: url("../Fonts/knowledge-medium-webfont.eot");
  /* IE9 Compat Modes */
  src: url("../Fonts/knowledge-medium-webfont.eot?#iefix") format("embedded-opentype"), url("../Fonts/knowledge-medium-webfont.woff2") format("woff2"), url("../Fonts/knowledge-medium-webfont.woff") format("woff"), url("../Fonts/knowledge-medium-webfont.ttf") format("truetype"), url("../Fonts/knowledge-medium-webfont.svg#svgFontName") format("svg");
  /* Legacy iOS */
}
.CustomFont {
  font-family: KnowledgeRegular, 'Source Sans Pro', Arial, sans-serif;
}

.CustomFont {
  color: #f27300;
  font-weight: normal;
}

.Footer {
  padding: 24px 0px;
  padding: 1.8rem 0rem;
  background: #efefef;
  border-top: solid 1px #dadada;
  width: 100%;
  z-index: 2;
}
@media (min-width: 50em) {
  .Footer {
    padding: 24px 0px;
    padding: 2.4rem 0rem;
  }
}
@media (max-width: 50em) {
  .Footer {
    text-align: center;
  }
}

.Footer .Content-wrap {
  position: relative;
}

@media (max-width: 50em) {
  body.full.registration .Footer .Content-wrap {
    padding: 0px 32px;
    padding: 0rem 2.4rem;
  }
}
@media (max-width: 50em) and (min-width: 50em) {
  body.full.registration .Footer .Content-wrap {
    padding: 0px 32px;
    padding: 0rem 3.2rem;
  }
}

.GlobalFooter-logo {
  margin: 0px 32px 0px 0px;
  margin: 0rem 2.4rem 0rem 0rem;
  position: absolute;
  right: 0;
  top: 0;
}
@media (min-width: 50em) {
  .GlobalFooter-logo {
    margin: 0px 32px 0px 0px;
    margin: 0rem 3.2rem 0rem 0rem;
  }
}
@media (max-width: 50em) {
  .GlobalFooter-logo {
    margin: 4px 0px;
    margin: 0.3rem 0rem;
    position: relative;
    right: auto;
    top: auto;
  }
}
@media (max-width: 50em) and (min-width: 50em) {
  .GlobalFooter-logo {
    margin: 4px 0px;
    margin: 0.4rem 0rem;
  }
}

.GlobalFooter-logo img {
  display: none;
}

.GlobalFooter-menu {
  color: #6b6b6b;
  line-height: 20px;
  line-height: 2rem;
}
@media (max-width: 50em) {
  .GlobalFooter-menu {
    margin: 12px 0px 4px 0px;
    margin: 0.9rem 0rem 0.3rem 0rem;
  }
}
@media (max-width: 50em) and (min-width: 50em) {
  .GlobalFooter-menu {
    margin: 12px 0px 4px 0px;
    margin: 1.2rem 0rem 0.4rem 0rem;
  }
}

.GlobalFooter-menu li:before {
  margin: 0px 8px;
  margin: 0rem 0.6rem;
  color: #c6c6c6;
  content: '\2022';
}
@media (min-width: 50em) {
  .GlobalFooter-menu li:before {
    margin: 0px 8px;
    margin: 0rem 0.8rem;
  }
}

.GlobalFooter-menu li:first-child:before {
  margin: 0px;
  margin: 0rem;
  content: '';
}
@media (min-width: 50em) {
  .GlobalFooter-menu li:first-child:before {
    margin: 0rem;
    margin: 0;
  }
}

.Copyright {
  margin: 8px 0px 0px 0px;
  margin: 0.6rem 0rem 0rem 0rem;
}
@media (min-width: 50em) {
  .Copyright {
    margin: 8px 0px 0px 0px;
    margin: 0.8rem 0rem 0rem 0rem;
  }
}

.Phone-extras li {
  margin: 0px 0px 0px 12px;
  margin: 0rem 0rem 0rem 0.9rem;
}
@media (min-width: 50em) {
  .Phone-extras li {
    margin: 0px 0px 0px 12px;
    margin: 0rem 0rem 0rem 1.2rem;
  }
}

.Phone-extras li:before {
  margin: 0px;
  margin: 0rem;
  content: '';
}
@media (min-width: 50em) {
  .Phone-extras li:before {
    margin: 0rem;
    margin: 0;
  }
}

.Phone-toggle {
  margin: 0px 0px 0px 12px;
  margin: 0rem 0rem 0rem 0.9rem;
  white-space: nowrap;
}
@media (min-width: 50em) {
  .Phone-toggle {
    margin: 0px 0px 0px 12px;
    margin: 0rem 0rem 0rem 1.2rem;
  }
}
.Phone-toggle:hover, .Phone-toggle:focus {
  text-decoration: none;
}
.Phone-toggle:hover span, .Phone-toggle:focus span {
  text-decoration: underline;
}

.Phone-toggle span {
  margin: 0px 0px 0px 4px;
  margin: 0rem 0rem 0rem 0.3rem;
}
@media (min-width: 50em) {
  .Phone-toggle span {
    margin: 0px 0px 0px 4px;
    margin: 0rem 0rem 0rem 0.4rem;
  }
}

form {
  margin: 0px;
  margin: 0rem;
}
@media (min-width: 50em) {
  form {
    margin: 0rem;
    margin: 0;
  }
}

fieldset {
  margin: 0px;
  margin: 0rem;
  padding: 0px;
  padding: 0rem;
  border: none;
}
@media (min-width: 50em) {
  fieldset {
    margin: 0rem;
    margin: 0;
  }
}
@media (min-width: 50em) {
  fieldset {
    padding: 0rem;
    padding: 0;
  }
}

legend {
  margin: 0px 0px 12px 0px;
  margin: 0rem 0rem 0.9rem 0rem;
}
@media (min-width: 50em) {
  legend {
    margin: 0px 0px 12px 0px;
    margin: 0rem 0rem 1.2rem 0rem;
  }
}

.Form--hasPadding {
  padding: 20px 0px 0px 0px;
  padding: 1.5rem 0rem 0rem 0rem;
}
@media (min-width: 50em) {
  .Form--hasPadding {
    padding: 20px 0px 0px 0px;
    padding: 2rem 0rem 0rem 0rem;
  }
}

.Form--hasBorder {
  padding: 20px 0px 0px 0px;
  padding: 1.5rem 0rem 0rem 0rem;
  border-top: 1px solid #c6c6c6;
}
@media (min-width: 50em) {
  .Form--hasBorder {
    padding: 20px 0px 0px 0px;
    padding: 2rem 0rem 0rem 0rem;
  }
}

.Form-textSelect {
  padding: 0px 0px 4px 0px;
  padding: 0rem 0rem 0.3rem 0rem;
}
@media (min-width: 50em) {
  .Form-textSelect {
    padding: 0px 0px 4px 0px;
    padding: 0rem 0rem 0.4rem 0rem;
  }
}

.Form-textSelect + .Form-textSelect {
  margin: 20px 0px 0px 0px;
  margin: 1.5rem 0rem 0rem 0rem;
}
@media (min-width: 50em) {
  .Form-textSelect + .Form-textSelect {
    margin: 20px 0px 0px 0px;
    margin: 2rem 0rem 0rem 0rem;
  }
}

.Form-textSelect--hasBorder {
  padding: 20px 0px 0px 0px;
  padding: 1.5rem 0rem 0rem 0rem;
  border-top: 1px solid #c6c6c6;
}
@media (min-width: 50em) {
  .Form-textSelect--hasBorder {
    padding: 20px 0px 0px 0px;
    padding: 2rem 0rem 0rem 0rem;
  }
}

.Form-textSelect > div {
  color: #262626;
}

.Form-textSelect div + p {
  margin: 4px 0px 0px 0px;
  margin: 0.3rem 0rem 0rem 0rem;
  word-break: break-all;
}
@media (min-width: 50em) {
  .Form-textSelect div + p {
    margin: 4px 0px 0px 0px;
    margin: 0.4rem 0rem 0rem 0rem;
  }
}

.Form--withIconLabels {
  padding: 0px 0px 4px 36px;
  padding: 0rem 0rem 0.3rem 2.7rem;
  position: relative;
}
@media (min-width: 50em) {
  .Form--withIconLabels {
    padding: 0px 0px 4px 36px;
    padding: 0rem 0rem 0.4rem 3.6rem;
  }
}

.Form--withIconLabels .Icon-svg {
  left: 0;
  position: absolute;
  top: 0;
}

.formText--extraLarge {
  color: #3d3d3d;
  line-height: 24px;
  line-height: 2.4rem;
}

.Form-textSelect input[type=date],
.Form-textSelect input[type=email],
.Form-textSelect input[type=password],
.Form-textSelect input[type=search],
.Form-textSelect input[type=tel],
.Form-textSelect input[type="text"],
.Recaptcha input[type="text"],
.Form-textSelect label select,
.Form-textSelect label textarea,
.Form-textSelect select,
.Form-textSelect textarea,
select,
textarea {
  -webkit-border-radius: 2px;
  border-radius: 2px;
  margin: 12px 0px 0px 0px;
  margin: 0.9rem 0rem 0rem 0rem;
  padding: 8px 12px;
  padding: 0.6rem 0.9rem;
  background-clip: padding-box;
  background-color: white;
  border: 1px solid #c6c6c6;
  box-sizing: border-box;
  color: #262626;
  font-size: 16px;
  font-size: 1.6rem;
  width: 100%;
}
@media (min-width: 50em) {
  .Form-textSelect input[type=date],
  .Form-textSelect input[type=email],
  .Form-textSelect input[type=password],
  .Form-textSelect input[type=search],
  .Form-textSelect input[type=tel],
  .Form-textSelect input[type="text"],
  .Recaptcha input[type="text"],
  .Form-textSelect label select,
  .Form-textSelect label textarea,
  .Form-textSelect select,
  .Form-textSelect textarea,
  select,
  textarea {
    margin: 12px 0px 0px 0px;
    margin: 1.2rem 0rem 0rem 0rem;
  }
}
@media (min-width: 50em) {
  .Form-textSelect input[type=date],
  .Form-textSelect input[type=email],
  .Form-textSelect input[type=password],
  .Form-textSelect input[type=search],
  .Form-textSelect input[type=tel],
  .Form-textSelect input[type="text"],
  .Recaptcha input[type="text"],
  .Form-textSelect label select,
  .Form-textSelect label textarea,
  .Form-textSelect select,
  .Form-textSelect textarea,
  select,
  textarea {
    padding: 8px 12px;
    padding: 0.8rem 1.2rem;
  }
}
.Form-textSelect input[type=date].Input--small,
.Form-textSelect input[type=email].Input--small,
.Form-textSelect input[type=password].Input--small,
.Form-textSelect input[type=search].Input--small,
.Form-textSelect input[type=tel].Input--small,
.Form-textSelect input[type="text"].Input--small,
.Recaptcha input[type="text"].Input--small,
.Form-textSelect label select.Input--small,
.Form-textSelect label textarea.Input--small,
.Form-textSelect select.Input--small,
.Form-textSelect textarea.Input--small,
select.Input--small,
textarea.Input--small {
  max-width: 144px;
}
.Form-textSelect input[type=date]:focus,
.Form-textSelect input[type=email]:focus,
.Form-textSelect input[type=password]:focus,
.Form-textSelect input[type=search]:focus,
.Form-textSelect input[type=tel]:focus,
.Form-textSelect input[type="text"]:focus,
.Recaptcha input[type="text"]:focus,
.Form-textSelect label select:focus,
.Form-textSelect label textarea:focus,
.Form-textSelect select:focus,
.Form-textSelect textarea:focus,
select:focus,
textarea:focus {
  outline: 2px solid #0d77d6;
}
.Form-textSelect input[type=date]:disabled,
.Form-textSelect input[type=date] .disabled,
.Form-textSelect input[type=email]:disabled,
.Form-textSelect input[type=email] .disabled,
.Form-textSelect input[type=password]:disabled,
.Form-textSelect input[type=password] .disabled,
.Form-textSelect input[type=search]:disabled,
.Form-textSelect input[type=search] .disabled,
.Form-textSelect input[type=tel]:disabled,
.Form-textSelect input[type=tel] .disabled,
.Form-textSelect input[type="text"]:disabled,
.Form-textSelect input[type="text"] .disabled,
.Recaptcha input[type="text"]:disabled,
.Recaptcha input[type="text"] .disabled,
.Form-textSelect label select:disabled,
.Form-textSelect label select .disabled,
.Form-textSelect label textarea:disabled,
.Form-textSelect label textarea .disabled,
.Form-textSelect select:disabled,
.Form-textSelect select .disabled,
.Form-textSelect textarea:disabled,
.Form-textSelect textarea .disabled,
select:disabled,
select .disabled,
textarea:disabled,
textarea .disabled {
  background: #efefef;
  border-color: #acacac;
  color: #acacac;
}

input:-webkit-autofill {
  -webkit-box-shadow: 0 0 0px 1000px white inset;
}

.Form-textSelect input[type=tel] {
  max-width: 200px;
}

.Form-textSelect--inlineButton input {
  height: 39px;
  vertical-align: top;
}

.Form-textSelect--inlineButton button {
  margin: 12px 0px 0px 24px;
  margin: 0.9rem 0rem 0rem 1.8rem;
  height: 39px;
  vertical-align: top;
}
@media (min-width: 50em) {
  .Form-textSelect--inlineButton button {
    margin: 12px 0px 0px 24px;
    margin: 1.2rem 0rem 0rem 2.4rem;
  }
}
@media (max-width: 26.25em) {
  .Form-textSelect--inlineButton button {
    margin: 12px 0px 0px 0px;
    margin: 0.9rem 0rem 0rem 0rem;
    display: block;
  }
}
@media (max-width: 26.25em) and (min-width: 50em) {
  .Form-textSelect--inlineButton button {
    margin: 12px 0px 0px 0px;
    margin: 1.2rem 0rem 0rem 0rem;
  }
}

.Form-textSelect--hasForgotLinks {
  position: relative;
}

.Form-textSelect.Form-textSelect--hasForgotLinks label {
  display: inline;
}
@media (max-width: 26.25em) {
  .Form-textSelect.Form-textSelect--hasForgotLinks label {
    display: block;
  }
}

.Form-textSelect .CheckboxList label,
.Form-textSelect .CheckboxList input[type=checkbox] + input[type=hidden] + label {
  font-size: 14px;
  font-size: 1.4rem;
  font-weight: normal;
  line-height: 20px;
  line-height: 2rem;
}

.CheckboxList + .CheckboxList {
  margin: 4px 0px 0px 0px;
  margin: 0.3rem 0rem 0rem 0rem;
}
@media (min-width: 50em) {
  .CheckboxList + .CheckboxList {
    margin: 4px 0px 0px 0px;
    margin: 0.4rem 0rem 0rem 0rem;
  }
}

.Button-forgot {
  margin: 0px 0px 0px 12px;
  margin: 0rem 0rem 0rem 0.9rem;
  float: right;
  font-size: 14px;
  font-size: 1.4rem;
  line-height: 20px;
  line-height: 2rem;
}
@media (min-width: 50em) {
  .Button-forgot {
    margin: 0px 0px 0px 12px;
    margin: 0rem 0rem 0rem 1.2rem;
  }
}
@media (max-width: 26.25em) {
  .Button-forgot {
    margin: 0px;
    margin: 0rem;
    float: none;
  }
}
@media (max-width: 26.25em) and (min-width: 50em) {
  .Button-forgot {
    margin: 0rem;
    margin: 0;
  }
}

.Form-textSelect label,
legend {
  color: #262626;
  display: block;
  line-height: 20px;
  line-height: 2rem;
}

.ie8 .Form-textSelect label {
  display: inline-block;
}

.Form-textSelect.Form-radioButtonList label {
  color: #6b6b6b;
}

@media (max-width: 20em) {
  .Form-textSelect label.InlineLabel {
    display: block;
  }
}

.Form-textSelect .Label-example {
  color: #6b6b6b;
  display: block;
  font-size: 14px;
  font-size: 1.4rem;
  text-transform: none;
}

.Form-textSelect .Label-example-indented {
  margin: 0px 0px 0px 28px;
  margin: 0rem 0rem 0rem 2.1rem;
  line-height: 16px;
  line-height: 1.6rem;
}
@media (min-width: 50em) {
  .Form-textSelect .Label-example-indented {
    margin: 0px 0px 0px 28px;
    margin: 0rem 0rem 0rem 2.8rem;
  }
}
@media (max-width: 50em) {
  .Form-textSelect .Label-example-indented {
    margin: 8px 0px 0px 0px;
    margin: 0.6rem 0rem 0rem 0rem;
    line-height: 20px;
    line-height: 2rem;
  }
}
@media (max-width: 50em) and (min-width: 50em) {
  .Form-textSelect .Label-example-indented {
    margin: 8px 0px 0px 0px;
    margin: 0.8rem 0rem 0rem 0rem;
  }
}

.Form-textSelect label.radioButtonList {
  color: #6b6b6b;
  text-transform: none;
}

.Form-textSelect label.radioButtonList + label.radioButtonList {
  margin: 12px 0px 0px 0px;
  margin: 0.9rem 0rem 0rem 0rem;
}
@media (min-width: 50em) {
  .Form-textSelect label.radioButtonList + label.radioButtonList {
    margin: 12px 0px 0px 0px;
    margin: 1.2rem 0rem 0rem 0rem;
  }
}

.Form--small.hasBorder {
  margin: 40px 0px 0px 0px;
  margin: 3rem 0rem 0rem 0rem;
  padding: 24px 0px 0px 0px;
  padding: 1.8rem 0rem 0rem 0rem;
  border-top: solid 1px #dadada;
}
@media (min-width: 50em) {
  .Form--small.hasBorder {
    margin: 40px 0px 0px 0px;
    margin: 4rem 0rem 0rem 0rem;
  }
}
@media (min-width: 50em) {
  .Form--small.hasBorder {
    padding: 24px 0px 0px 0px;
    padding: 2.4rem 0rem 0rem 0rem;
  }
}

.hasFloatedButton p {
  float: left;
}
@media (max-width: 50em) {
  .hasFloatedButton p {
    float: none;
  }
}

.Form--small .Form-textSelect {
  max-width: 415px;
}
@media (max-width: 26.25em) {
  .Form--small .Form-textSelect {
    max-width: none !important;
  }
}

.Form-Password--hasTwoColumns {
  max-width: 710px;
}

.Form-Password.Form--hasWrapper .Form-content {
  padding: 32px 24px 40px 40px;
  padding: 2.4rem 1.8rem 3rem 3rem;
}
@media (min-width: 50em) {
  .Form-Password.Form--hasWrapper .Form-content {
    padding: 32px 24px 40px 40px;
    padding: 3.2rem 2.4rem 4rem 4rem;
  }
}

.Form-Password .Form {
  float: left;
  width: calc(100% - 242px);
}
@media (max-width: 37.5em) {
  .Form-Password .Form {
    float: none;
    width: 100%;
  }
}

.Password-Requirements {
  margin: 20px 0px 0px 0px;
  margin: 1.5rem 0rem 0rem 0rem;
  max-width: 430px;
}
@media (min-width: 50em) {
  .Password-Requirements {
    margin: 20px 0px 0px 0px;
    margin: 2rem 0rem 0rem 0rem;
  }
}

.Password-Requirements ul li {
  padding: 0px 0px 4px 0px;
  padding: 0rem 0rem 0.3rem 0rem;
  color: #6b6b6b;
  font-size: 13px;
  font-size: 1.3rem;
  line-height: 20px;
  line-height: 2rem;
  margin-left: 0.4rem;
}
@media (min-width: 50em) {
  .Password-Requirements ul li {
    padding: 0px 0px 4px 0px;
    padding: 0rem 0rem 0.4rem 0rem;
  }
}
@media (max-width: 50em) {
  .Password-Requirements ul li {
    margin-left: 2.2rem;
  }
}

.Password-Requirements ul li.is-fulfilled {
  color: #158915;
  position: relative;
}

.ie8 .Password-Requirements ul li.is-fulfilled {
  text-decoration: line-through;
}

.Password-Requirements ul li .Icon-svg {
  margin-right: 0.4rem;
}

.Password-Requirements .Characters {
  float: left;
  margin-left: 2rem;
}
@media (max-width: 37.5em) {
  .Password-Requirements .Characters {
    float: none;
  }
}

.Password-Requirements .Special-characters {
  float: right;
}
@media (max-width: 37.5em) {
  .Password-Requirements .Special-characters {
    float: none;
  }
}

.Form--hasWrapper {
  -webkit-border-radius: 2px;
  border-radius: 2px;
  margin: 32px 0px 0px 0px;
  margin: 2.4rem 0rem 0rem 0rem;
  background: white;
  border: solid 1px #dadada;
}
@media (min-width: 50em) {
  .Form--hasWrapper {
    margin: 32px 0px 0px 0px;
    margin: 3.2rem 0rem 0rem 0rem;
  }
}

.Form--hasHeader {
  margin: 24px 0px 0px 0px;
  margin: 1.8rem 0rem 0rem 0rem;
}
@media (min-width: 50em) {
  .Form--hasHeader {
    margin: 24px 0px 0px 0px;
    margin: 2.4rem 0rem 0rem 0rem;
  }
}

.Form-content-header {
  -webkit-border-radius: 2px 2px 0 0;
  border-radius: 2px 2px 0 0;
  padding: 8px 32px;
  padding: 0.6rem 2.4rem;
  border: solid 1px #dadada;
  border-bottom: none;
  color: #6b6b6b;
  font-size: 14px;
  font-size: 1.4rem;
  line-height: 23px;
  line-height: 2.3rem;
}
@media (min-width: 50em) {
  .Form-content-header {
    padding: 8px 32px;
    padding: 0.8rem 3.2rem;
  }
}

.Form-content-header-icon {
  position: relative;
}
@media (max-width: 37.5em) {
  .Form-content-header-icon {
    display: block;
  }
}

.Form-content-header-icon .Icon-svg {
  left: 0;
  position: absolute;
  top: -2px;
}

.Form-content-header-link {
  float: right;
}
@media (max-width: 64em) {
  .Form-content-header-link {
    display: block;
    float: none;
  }
}

.Form--hasHeader .Form--hasWrapper {
  -webkit-border-radius: 0 0 2px 2px;
  border-radius: 0 0 2px 2px;
  margin: 0px;
  margin: 0rem;
}
@media (min-width: 50em) {
  .Form--hasHeader .Form--hasWrapper {
    margin: 0rem;
    margin: 0;
  }
}

.Form-content {
  padding: 32px 32px;
  padding: 2.4rem 2.4rem;
}
@media (min-width: 50em) {
  .Form-content {
    padding: 32px 32px;
    padding: 3.2rem 3.2rem;
  }
}

.Form-content--hasSidebar .Form-main {
  padding: 0px 32px 0px 0px;
  padding: 0rem 2.4rem 0rem 0rem;
  border-right: solid 1px #dadada;
  float: left;
  width: 60%;
}
@media (min-width: 50em) {
  .Form-content--hasSidebar .Form-main {
    padding: 0px 32px 0px 0px;
    padding: 0rem 3.2rem 0rem 0rem;
  }
}
@media (max-width: 26.25em) {
  .Form-content--hasSidebar .Form-main {
    padding: 0px;
    padding: 0rem;
  }
}
@media (max-width: 26.25em) and (min-width: 50em) {
  .Form-content--hasSidebar .Form-main {
    padding: 0rem;
    padding: 0;
  }
}

.Form-content--hasSidebar .Form-side {
  padding: 0px 0px 0px 32px;
  padding: 0rem 0rem 0rem 2.4rem;
  float: right;
  width: 40%;
}
@media (min-width: 50em) {
  .Form-content--hasSidebar .Form-side {
    padding: 0px 0px 0px 32px;
    padding: 0rem 0rem 0rem 3.2rem;
  }
}
@media (max-width: 26.25em) {
  .Form-content--hasSidebar .Form-side {
    padding: 32px 0px 0px 0px;
    padding: 2.4rem 0rem 0rem 0rem;
  }
}
@media (max-width: 26.25em) and (min-width: 50em) {
  .Form-content--hasSidebar .Form-side {
    padding: 32px 0px 0px 0px;
    padding: 3.2rem 0rem 0rem 0rem;
  }
}

@media (max-width: 26.25em) {
  .Form-content--hasSidebar .Form-main,
  .Form-content--hasSidebar .Form-side {
    border: none;
    float: none;
    width: 100%;
  }
}

.Form-sideBar {
  font-size: 14px;
  font-size: 1.4rem;
}

.Form-sideBar li {
  padding: 4px 0px 0px 0px;
  padding: 0.3rem 0rem 0rem 0rem;
  position: relative;
}
@media (min-width: 50em) {
  .Form-sideBar li {
    padding: 4px 0px 0px 0px;
    padding: 0.4rem 0rem 0rem 0rem;
  }
}

.Form-sideBar li:first-child {
  padding-top: 0;
}

.Form-sideBar li a {
  position: relative;
}

.Form-sideBar li a .Icon-svg {
  height: 18px;
  left: -3px;
  position: absolute;
  top: 0;
  width: 18px;
}

input[type=password]::-ms-reveal,
input[type=password]::-ms-clear {
  display: none;
}

.Password-wrap {
  position: relative;
}

.ie8 .Password-wrap {
  min-height: 1px;
}

.Password-wrap input[type=password],
.Password-wrap input.Password-input {
  height: 42px;
  padding-right: 116px;
  padding-right: 11.6rem;
}
@media (max-width: 50em) {
  .Password-wrap input[type=password],
  .Password-wrap input.Password-input {
    padding-right: 106px;
    padding-right: 10.6rem;
  }
}

@media (max-width: 50em) {
  .ie8 .Password-wrap input[type=password],
  .ie8 .Password-wrap input.Password-input,
  .ie9 .Password-wrap input[type=password],
  .ie9 .Password-wrap input.Password-input {
    min-width: 0;
  }
}

.Password-wrap .Form-inlineCheckboxWrapper {
  height: 42px;
  margin-top: 12px;
  position: absolute;
  right: 0;
  top: 0;
}
@media (max-width: 50em) {
  .Password-wrap .Form-inlineCheckboxWrapper {
    margin-top: 10px;
  }
}

.ie8 .Password-wrap .Form-inlineCheckboxWrapper,
.ie9 .Password-wrap .Form-inlineCheckboxWrapper {
  position: relative;
  width: 200px;
}

.Password-wrap .Form-inlineCheckbox {
  margin: 4px 4px 0px 0px;
  margin: 0.3rem 0.3rem 0rem 0rem;
  padding: 0px 8px;
  padding: 0rem 0.6rem;
  -ms-flex-align: center;
  align-items: center;
  display: -ms-flexbox;
  display: flex;
  background: #efefef;
  height: 34px;
  line-height: 0;
}
@media (min-width: 50em) {
  .Password-wrap .Form-inlineCheckbox {
    margin: 4px 4px 0px 0px;
    margin: 0.4rem 0.4rem 0rem 0rem;
  }
}
@media (min-width: 50em) {
  .Password-wrap .Form-inlineCheckbox {
    padding: 0px 8px;
    padding: 0rem 0.8rem;
  }
}

.ie8 .Password-wrap .Form-inlineCheckbox,
.ie9 .Password-wrap .Form-inlineCheckbox {
  display: block;
  padding-top: 6px;
}

.Form-textSelect .Form-inlineCheckbox label {
  color: #565656;
  font-size: 13px;
  font-size: 1.3rem;
  line-height: 20px;
  line-height: 2rem;
  text-transform: none;
}

input[type=radio],
input[type=checkbox] {
  position: absolute;
  opacity: 0;
  z-index: -1;
}

.ie8 input[type=radio],
.ie8 input[type=checkbox] {
  left: auto !important;
  position: relative;
  right: auto !important;
  opacity: 1;
  z-index: 1;
}

.ie8 input[type=checkbox] {
  margin-right: 5px;
}

input[type=checkbox] + label,
input[type=checkbox] + input[type=hidden] + label {
  color: #565656;
}

input[type=checkbox] + label:before,
input[type=checkbox] + input[type=hidden] + label:before {
  content: url("../images/svg-Checkbox.svg");
  display: inline-block;
  width: 20px;
  height: 20px;
  vertical-align: middle;
  margin-right: 8px;
  margin-top: -2px;
}

input[type=checkbox]:checked + label:before,
input[type=checkbox]:checked + input[type=hidden] + label:before {
  content: url("../images/svg-CheckboxSelected.svg");
}

input[type=checkbox]:focus + label:before,
input[type=checkbox]:focus + input[type=hidden] + label:before {
  content: url("../images/svg-CheckboxFocused.svg");
}

input[type=checkbox]:checked:focus + label:before,
input[type=checkbox]:checked:focus + input[type=hidden] + label:before {
  content: url("../images/svg-CheckboxSelectedFocused.svg");
}

input[type=checkbox]:checked:disabled + label:before,
input[type=checkbox]:checked:disabled + input[type=hidden] + label:before {
  content: url("../images/svg-CheckboxSelectedDisabled.svg");
}

input[type=checkbox]:disabled + label:before,
input[type=checkbox]:disabled + input[type=hidden] + label:before {
  content: url("../images/svg-CheckboxDisabled.svg");
}

.ie8 input[type=checkbox]:checked + label:before,
.ie8 input[type=checkbox]:checked + input[type=hidden] + label:before {
  content: '';
  display: none;
}

.ie8 input[type=checkbox] + label:before,
.ie8 input[type=checkbox] + input[type=hidden] + label:before {
  content: '';
  display: none;
}

.Form-textSelect .Checkbox--inline label {
  margin: 12px 0px 0px 0px;
  margin: 0.9rem 0rem 0rem 0rem;
  font-size: 14px;
  font-size: 1.4rem;
  line-height: 18px;
  line-height: 1.8rem;
}
@media (min-width: 50em) {
  .Form-textSelect .Checkbox--inline label {
    margin: 12px 0px 0px 0px;
    margin: 1.2rem 0rem 0rem 0rem;
  }
}

input[type=radio] + label {
  margin: 0px 0px 12px 0px;
  margin: 0rem 0rem 0.9rem 0rem;
  padding: 0px 0px 0px 32px;
  padding: 0rem 0rem 0rem 2.4rem;
  overflow: hidden;
  position: relative;
  text-overflow: ellipsis;
  vertical-align: top;
}
@media (min-width: 50em) {
  input[type=radio] + label {
    margin: 0px 0px 12px 0px;
    margin: 0rem 0rem 1.2rem 0rem;
  }
}
@media (min-width: 50em) {
  input[type=radio] + label {
    padding: 0px 0px 0px 32px;
    padding: 0rem 0rem 0rem 3.2rem;
  }
}

.Form-textSelect .RadioButton--hasButton label {
  margin: 0px 8px 12px 0px;
  margin: 0rem 0.6rem 0.9rem 0rem;
}
@media (min-width: 50em) {
  .Form-textSelect .RadioButton--hasButton label {
    margin: 0px 8px 12px 0px;
    margin: 0rem 0.8rem 1.2rem 0rem;
  }
}

.RadioButton--hasIcon,
.RadioButton {
  background: url("../images/svg-RadioSelected.svg") no-repeat -999px -999px;
}

.ie8 .RadioButton--hasIcon,
.ie8 .RadioButton {
  background: none;
}

.RadioButton--hasButton span,
.RadioButton--hasButton .Button {
  margin: 0px 0px 12px 0px;
  margin: 0rem 0rem 0.9rem 0rem;
}
@media (min-width: 50em) {
  .RadioButton--hasButton span,
  .RadioButton--hasButton .Button {
    margin: 0px 0px 12px 0px;
    margin: 0rem 0rem 1.2rem 0rem;
  }
}

.RadioButton--hasIcon input[type=radio] + label {
  padding: 0px 0px 0px 32px;
  padding: 0rem 0rem 0rem 2.4rem;
}
@media (min-width: 50em) {
  .RadioButton--hasIcon input[type=radio] + label {
    padding: 0px 0px 0px 32px;
    padding: 0rem 0rem 0rem 3.2rem;
  }
}
@media (max-width: 50em) {
  .RadioButton--hasIcon input[type=radio] + label {
    padding: 0px 0px 0px 40px;
    padding: 0rem 0rem 0rem 3rem;
  }
}
@media (max-width: 50em) and (min-width: 50em) {
  .RadioButton--hasIcon input[type=radio] + label {
    padding: 0px 0px 0px 40px;
    padding: 0rem 0rem 0rem 4rem;
  }
}

.RadioButton--hasIcon .Icon-svg {
  left: -8px;
  top: 2px;
}

.RadioButton--hasIcon .Icon-svg.Icon-mail {
  top: -3px;
}

.ie8 input[type=radio] + label {
  display: inline;
  padding: 0 !important;
}

input[type=radio] + label {
  background: url("../images/svg-Radio.svg") no-repeat;
  background-position: left top;
}

.ie8 input[type=radio] + label:before {
  display: none;
}

.ie8 input[type=radio] + label {
  background: none !important;
}

input[type=radio]:checked + label {
  background: url("../images/svg-RadioSelected.svg") no-repeat;
  background-position: left top;
}

input[type=radio]:focus + label {
  background: url("../images/svg-RadioFocused.svg") no-repeat;
  background-position: left top;
}

input[type=radio]:checked:focus + label {
  background: url("../images/svg-RadioSelectedFocused.svg") no-repeat;
  background-position: left top;
}

input[type=radio]:disabled + label {
  background: url("../images/svg-RadioDisabled.svg") no-repeat;
  background-position: left top;
  color: #acacac;
}

input[type=radio]:checked:disabled + label {
  background: url("../images/svg-RadioSelectedDisabled.svg") no-repeat;
  background-position: left top;
  color: #acacac;
}

.ie8 input[type=radio]:checked + label {
  background: none;
}

.Select-custom-label {
  margin: 4px 12px 4px 0px;
  margin: 0.3rem 0.9rem 0.3rem 0rem;
  color: #6b6b6b;
  float: left;
  font-size: 13px;
  font-size: 1.3rem;
}
@media (min-width: 50em) {
  .Select-custom-label {
    margin: 4px 12px 4px 0px;
    margin: 0.4rem 1.2rem 0.4rem 0rem;
  }
}

.Select-custom {
  padding: 0px;
  padding: 0rem;
  background-color: #efefef;
  border: 1px solid #C6C6C6;
  border-radius: 2px;
  float: left;
  overflow: hidden;
  position: relative;
}
@media (min-width: 50em) {
  .Select-custom {
    padding: 0rem;
    padding: 0;
  }
}
.Select-custom:hover {
  background-color: white;
}

.ie8 .Select-custom:after,
.ie9 .Select-custom:after {
  content: '';
}

.Select-custom select {
  margin: 0px;
  margin: 0rem;
  padding: 4px 60px 4px 12px;
  padding: 0.3rem 4.5rem 0.3rem 0.9rem;
  border: solid 2px transparent;
  box-shadow: none;
  background-color: transparent;
  background-image: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  font-size: 13px;
  font-size: 1.3rem;
  position: relative;
  z-index: 1;
}
@media (min-width: 50em) {
  .Select-custom select {
    margin: 0rem;
    margin: 0;
  }
}
@media (min-width: 50em) {
  .Select-custom select {
    padding: 4px 60px 4px 12px;
    padding: 0.4rem 6rem 0.4rem 1.2rem;
  }
}

.ie8 .Select-custom,
.ie9 .Select-custom {
  width: 160px;
}

.ie8 .Select-custom select,
.ie9 .Select-custom select {
  padding: 4px 12px;
  padding: 0.3rem 0.9rem;
  width: 160px;
}
@media (min-width: 50em) {
  .ie8 .Select-custom select,
  .ie9 .Select-custom select {
    padding: 4px 12px;
    padding: 0.4rem 1.2rem;
  }
}

.Select-custom select::-ms-expand {
  display: none;
}

.Select-custom select:focus {
  border: 2px solid #0d77d6;
}

.Select-custom-button {
  position: absolute;
  height: 100%;
  width: 40px;
  background-image: url(../images/svg-LargeSelectArrows.svg);
  background-position: center center;
  background-repeat: no-repeat;
  top: 0;
  right: 0;
  z-index: 0;
}

.Form-select-custom-wrap {
  width: 100%;
}

.Form-select-custom {
  -webkit-border-radius: 2px;
  border-radius: 2px;
  margin: 12px 0px 0px 0px;
  margin: 0.9rem 0rem 0rem 0rem;
  background-color: transparent;
  border: 1px solid #c6c6c6;
  color: #262626;
  float: left;
  font-size: 16px;
  font-size: 1.6rem;
  position: relative;
  width: 100%;
}
@media (min-width: 50em) {
  .Form-select-custom {
    margin: 12px 0px 0px 0px;
    margin: 1.2rem 0rem 0rem 0rem;
  }
}

.Form-select-custom select {
  margin: 0px;
  margin: 0rem;
  padding: 8px 60px 8px 12px;
  padding: 0.6rem 4.5rem 0.6rem 0.9rem;
  border: none;
  box-shadow: none;
  background-color: transparent;
  background-image: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  font-size: 16px;
  font-size: 1.6rem;
  position: relative;
  z-index: 1;
}
@media (min-width: 50em) {
  .Form-select-custom select {
    margin: 0rem;
    margin: 0;
  }
}
@media (min-width: 50em) {
  .Form-select-custom select {
    padding: 8px 60px 8px 12px;
    padding: 0.8rem 6rem 0.8rem 1.2rem;
  }
}
.Form-select-custom select:hover, .Form-select-custom select:focus {
  background-color: transparent;
}

.Form-select-custom select:focus::-ms-value {
  background-color: transparent;
  color: #262626;
}

.ie8 .Form-select-custom select,
.ie9 .Form-select-custom select {
  padding: 8px 12px;
  padding: 0.6rem 0.9rem;
}
@media (min-width: 50em) {
  .ie8 .Form-select-custom select,
  .ie9 .Form-select-custom select {
    padding: 8px 12px;
    padding: 0.8rem 1.2rem;
  }
}

.Form-select-custom-button {
  position: absolute;
  height: 100%;
  width: 40px;
  background-color: #efefef;
  background-image: url(../images/svg-LargeSelectArrows.svg);
  background-position: center center;
  background-repeat: no-repeat;
  border-left: 1px solid #c6c6c6;
  top: 0;
  right: 0;
  z-index: 0;
}

.ie8 .Form-select-custom-button,
.ie9 .Form-select-custom-button {
  display: none;
}

.Form-select-custom select::-ms-expand {
  display: none;
}

.Form-select-custom select:focus {
  outline: 2px solid #0d77d6;
}

.Form-select-custom select:-moz-focusring {
  color: transparent;
  text-shadow: 0 0 0 #000;
}

.ComboBox-wrapper {
  position: relative;
}

.ComboBox {
  position: relative;
}

input[type="text"].ComboBox-input {
  height: 40px;
  height: 4rem;
  padding-right: 52px;
  padding-right: 5.2rem;
}
@media (max-width: 50em) {
  input[type="text"].ComboBox-input {
    padding-right: 50px;
    padding-right: 5rem;
  }
}

.ComboBox-button {
  margin: 12px 0px 0px 0px;
  margin: 0.9rem 0rem 0rem 0rem;
  padding: 0px;
  padding: 0rem;
  background-color: #efefef;
  background-image: url(../images/svg-LargeSelectArrows.svg);
  background-position: center center;
  background-repeat: no-repeat;
  border-left: 1px solid #c6c6c6;
  height: 40px;
  height: 4rem;
  position: absolute;
  right: 0;
  top: 0;
  width: 40px;
  width: 4rem;
}
@media (min-width: 50em) {
  .ComboBox-button {
    margin: 12px 0px 0px 0px;
    margin: 1.2rem 0rem 0rem 0rem;
  }
}
@media (min-width: 50em) {
  .ComboBox-button {
    padding: 0rem;
    padding: 0;
  }
}
.ComboBox-button:hover {
  background-color: #dadada;
}
.ComboBox-button:focus {
  background-color: #dadada;
  outline: 2px solid #0d77d6;
}
.ComboBox-button:disabled, .ComboBox-button:disabled:hover {
  background-color: #dadada;
  background-image: url(../images/svg-LargeSelectArrowsDisabled.svg);
  background-position: center center;
  background-repeat: no-repeat;
}

.ie8 .ComboBox-button {
  background-image: url(../images/svg-LargeSelectArrows.png);
}

.ComboBox-button .Icon-svg {
  margin: 0px;
  margin: 0rem;
}
@media (min-width: 50em) {
  .ComboBox-button .Icon-svg {
    margin: 0rem;
    margin: 0;
  }
}

.ComboBox-list {
  -webkit-border-radius: 0 0 2px 2px;
  border-radius: 0 0 2px 2px;
  padding: 16px 0px;
  padding: 1.2rem 0rem;
  background: white;
  border: 1px solid #c6c6c6;
  border-top: none;
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2);
  max-height: 225px;
  overflow: auto;
  position: absolute;
  width: 100%;
}
@media (min-width: 50em) {
  .ComboBox-list {
    padding: 16px 0px;
    padding: 1.6rem 0rem;
  }
}

.ie8 .ComboBox-list {
  max-width: 414px;
}

.Form-registration {
  margin: 24px 0px 0px 0px;
  margin: 1.8rem 0rem 0rem 0rem;
}
@media (min-width: 50em) {
  .Form-registration {
    margin: 24px 0px 0px 0px;
    margin: 2.4rem 0rem 0rem 0rem;
  }
}

.Form-registration {
  color: #262626;
}

.Form-twoStep {
  margin: 52px 0px 0px 0px;
  margin: 3.9rem 0rem 0rem 0rem;
}
@media (min-width: 50em) {
  .Form-twoStep {
    margin: 52px 0px 0px 0px;
    margin: 5.2rem 0rem 0rem 0rem;
  }
}

.Form-twoStep .infoText-small {
  color: #6b6b6b;
  max-width: 80%;
}

.Form-authentication {
  margin: 16px 0px 0px 0px;
  margin: 1.2rem 0rem 0rem 0rem;
  font-size: 14px;
  font-size: 1.4rem;
  line-height: 20px;
  line-height: 2rem;
}
@media (min-width: 50em) {
  .Form-authentication {
    margin: 16px 0px 0px 0px;
    margin: 1.6rem 0rem 0rem 0rem;
  }
}

.Form-authentication .infoText-small {
  margin: 20px 0px 12px 0px;
  margin: 1.5rem 0rem 0.9rem 0rem;
}
@media (min-width: 50em) {
  .Form-authentication .infoText-small {
    margin: 20px 0px 12px 0px;
    margin: 2rem 0rem 1.2rem 0rem;
  }
}

.Form-authentication li.Form-textSelect {
  margin: 0px;
  margin: 0rem;
}
@media (min-width: 50em) {
  .Form-authentication li.Form-textSelect {
    margin: 0rem;
    margin: 0;
  }
}

.Form-authentication li.Form-textSelect + li.Form-textSelect {
  margin: 12px 0px 0px 0px;
  margin: 0.9rem 0rem 0rem 0rem;
}
@media (min-width: 50em) {
  .Form-authentication li.Form-textSelect + li.Form-textSelect {
    margin: 12px 0px 0px 0px;
    margin: 1.2rem 0rem 0rem 0rem;
  }
}

.Form-eitherOr {
  margin: 32px 0px 0px 0px;
  margin: 2.4rem 0rem 0rem 0rem;
}
@media (min-width: 50em) {
  .Form-eitherOr {
    margin: 32px 0px 0px 0px;
    margin: 3.2rem 0rem 0rem 0rem;
  }
}

.Button-eitherOr {
  padding-left: 0;
}

.EitherOr-divider {
  margin: 20px 0px;
  margin: 1.5rem 0rem;
  width: 170px;
  overflow: hidden;
  text-align: center;
  white-space: nowrap;
}
@media (min-width: 50em) {
  .EitherOr-divider {
    margin: 20px 0px;
    margin: 2rem 0rem;
  }
}

.EitherOr-divider > span {
  -webkit-border-radius: 5px;
  border-radius: 5px;
  padding: 0px 12px;
  padding: 0rem 0.9rem;
  border: 1px solid #c6c6c6;
  font-size: 14px;
  font-size: 1.4rem;
  line-height: 20px;
  line-height: 2rem;
  position: relative;
}
@media (min-width: 50em) {
  .EitherOr-divider > span {
    padding: 0px 12px;
    padding: 0rem 1.2rem;
  }
}

.EitherOr-divider > span:before,
.EitherOr-divider > span:after {
  background: #c6c6c6;
  content: "";
  height: 1px;
  position: absolute;
  top: 50%;
  width: 9999px;
}

.EitherOr-divider > span:before {
  margin-right: 15px;
  margin-right: 1.5rem;
  right: 100%;
}

.EitherOr-divider > span:after {
  left: 100%;
  margin-left: 15px;
  margin-left: 1.5rem;
}

.RememberMe {
  position: relative;
}

.RememberMe > div {
  float: left;
  z-index: 1;
}

.RememberMe .Icon-wrapper--rememberMe {
  float: none;
  margin-top: -6px;
  margin-top: -0.6rem;
}

.Icon-wrapper--rememberMe {
  margin: 0px 0px 0px 8px;
  margin: 0rem 0rem 0rem 0.6rem;
  background: #6b6b6b;
}
@media (min-width: 50em) {
  .Icon-wrapper--rememberMe {
    margin: 0px 0px 0px 8px;
    margin: 0rem 0rem 0rem 0.8rem;
  }
}

.Button-rememberMe:hover .Icon-wrapper--rememberMe,
.Button-rememberMe:focus .Icon-wrapper--rememberMe {
  background: #3d3d3d;
  outline: 2px solid #0d77d6;
}

.Button-rememberMe img {
  display: none;
}

.ie8 .Button-rememberMe img {
  margin: 0px 0px 0px 8px;
  margin: 0rem 0rem 0rem 0.6rem;
}
@media (min-width: 50em) {
  .ie8 .Button-rememberMe img {
    margin: 0px 0px 0px 8px;
    margin: 0rem 0rem 0rem 0.8rem;
  }
}

.Form-information {
  font-size: 14px;
  font-size: 1.4rem;
  line-height: 20px;
  line-height: 2rem;
}

.Page-wrapper .Flex-wrap {
  display: -ms-flexbox;
  display: flex;
  -ms-flex: 1 0 auto;
  flex: 1 0 auto;
  min-height: 700px;
}
@media (max-width: 56.25em) {
  .Page-wrapper .Flex-wrap {
    padding: 0px;
    padding: 0rem;
    display: block;
    min-height: 0;
  }
}
@media (max-width: 56.25em) and (min-width: 50em) {
  .Page-wrapper .Flex-wrap {
    padding: 0rem;
    padding: 0;
  }
}

.Page-wrapper .Flex-content {
  padding: 48px 32px 60px 0px;
  padding: 3.6rem 2.4rem 4.5rem 0rem;
  -ms-flex: 2 1 auto;
  flex: 2 1 auto;
}
@media (min-width: 50em) {
  .Page-wrapper .Flex-content {
    padding: 48px 32px 60px 0px;
    padding: 4.8rem 3.2rem 6rem 0rem;
  }
}
@media (max-width: 56.25em) {
  .Page-wrapper .Flex-content {
    padding: 32px 0px 0px 0px;
    padding: 2.4rem 0rem 0rem 0rem;
  }
}
@media (max-width: 56.25em) and (min-width: 50em) {
  .Page-wrapper .Flex-content {
    padding: 32px 0px 0px 0px;
    padding: 3.2rem 0rem 0rem 0rem;
  }
}

.ie8 .Page-wrapper .Flex-content,
.ie9 .Page-wrapper .Flex-content {
  float: left;
  width: 70%;
}
@media (max-width: 56.25em) {
  .ie8 .Page-wrapper .Flex-content,
  .ie9 .Page-wrapper .Flex-content {
    float: none;
    width: 100%;
  }
}

.Page-wrapper .Flex-sidebar {
  margin: 16px 16px 16px 16px;
  margin: 1.2rem 1.2rem 1.2rem 1.2rem;
  padding: 40px 32px 20px 32px;
  padding: 3rem 2.4rem 1.5rem 2.4rem;
  background: #3e4d6b;
  color: white;
  -ms-flex: 0 1 23%;
  flex: 0 1 23%;
  min-width: 360px;
}
@media (min-width: 50em) {
  .Page-wrapper .Flex-sidebar {
    margin: 16px 16px 16px 16px;
    margin: 1.6rem 1.6rem 1.6rem 1.6rem;
  }
}
@media (min-width: 50em) {
  .Page-wrapper .Flex-sidebar {
    padding: 40px 32px 20px 32px;
    padding: 4rem 3.2rem 2rem 3.2rem;
  }
}
@media (max-width: 56.25em) {
  .Page-wrapper .Flex-sidebar {
    margin: 80px 0 0 0;
    min-width: 0;
    padding: 36px;
    padding: 3.6rem;
  }
}

.ie8 .Page-wrapper .Flex-sidebar,
.ie9 .Page-wrapper .Flex-sidebar {
  float: right;
  min-height: 700px;
  width: 22%;
}
@media (max-width: 56.25em) {
  .ie8 .Page-wrapper .Flex-sidebar,
  .ie9 .Page-wrapper .Flex-sidebar {
    float: none;
    min-height: 0;
    width: 100%;
  }
}

.Marketing-image {
  margin: 0px 0px 24px 0px;
  margin: 0rem 0rem 1.8rem 0rem;
  text-align: center;
}
@media (min-width: 50em) {
  .Marketing-image {
    margin: 0px 0px 24px 0px;
    margin: 0rem 0rem 2.4rem 0rem;
  }
}
@media (max-width: 56.25em) {
  .Marketing-image {
    margin-left: auto;
    margin-right: auto;
    max-width: 480px;
  }
}

.Marketing-image > * {
  max-width: 100%;
}

.Marketing-image img {
  display: none;
}

.Marketing-content {
  margin: 0px 36px 0px 0px;
  margin: 0rem 2.7rem 0rem 0rem;
}
@media (min-width: 50em) {
  .Marketing-content {
    margin: 0px 36px 0px 0px;
    margin: 0rem 3.6rem 0rem 0rem;
  }
}
@media (max-width: 56.25em) {
  .Marketing-content {
    margin-left: auto;
    margin-right: auto;
    max-width: 480px;
  }
}

.Marketing-list {
  margin: 0px 0px 12px 16px;
  margin: 0rem 0rem 0.9rem 1.2rem;
  list-style: disc;
}
@media (min-width: 50em) {
  .Marketing-list {
    margin: 0px 0px 12px 16px;
    margin: 0rem 0rem 1.2rem 1.6rem;
  }
}

.Marketing-list li {
  margin: 20px 0px 0px 0px;
  margin: 1.5rem 0rem 0rem 0rem;
}
@media (min-width: 50em) {
  .Marketing-list li {
    margin: 20px 0px 0px 0px;
    margin: 2rem 0rem 0rem 0rem;
  }
}

.OnePass-logo > * {
  margin: 0px 0px 0px 32px;
  margin: 0rem 0rem 0rem 2.4rem;
}
@media (min-width: 50em) {
  .OnePass-logo > * {
    margin: 0px 0px 0px 32px;
    margin: 0rem 0rem 0rem 3.2rem;
  }
}

.OnePass-logo img {
  display: none;
}

@media (max-width: 56.25em) {
  .Button-backToRegistration {
    margin: 0px 0px 0px 16px;
    margin: 0rem 0rem 0rem 1.2rem;
  }
}
@media (max-width: 56.25em) and (min-width: 50em) {
  .Button-backToRegistration {
    margin: 0px 0px 0px 16px;
    margin: 0rem 0rem 0rem 1.6rem;
  }
}

.Button-backToRegistration .Icon-svg {
  top: -3px;
}

.Button-backToVerify {
  margin: 32px 0px 0px 0px;
  margin: 2.4rem 0rem 0rem 0rem;
  position: absolute;
}
@media (min-width: 50em) {
  .Button-backToVerify {
    margin: 32px 0px 0px 0px;
    margin: 3.2rem 0rem 0rem 0rem;
  }
}
@media (max-width: 50em) {
  .Button-backToVerify {
    margin: 16px 0px 0px 0px;
    margin: 1.2rem 0rem 0rem 0rem;
  }
}
@media (max-width: 50em) and (min-width: 50em) {
  .Button-backToVerify {
    margin: 16px 0px 0px 0px;
    margin: 1.6rem 0rem 0rem 0rem;
  }
}

.Button-learnMore {
  margin: 20px 0px 0px 0px;
  margin: 1.5rem 0rem 0rem 0rem;
}
@media (min-width: 50em) {
  .Button-learnMore {
    margin: 20px 0px 0px 0px;
    margin: 2rem 0rem 0rem 0rem;
  }
}
@media (max-width: 56.25em) {
  .Button-learnMore {
    display: block;
    margin-left: auto;
    margin-right: auto;
  }
}

.Button-createOnePass {
  font-size: 14px;
  font-size: 1.4rem;
}

.Content-wrap.Saml-productLink {
  margin-top: 32px;
  margin-top: 3.2rem;
}
@media (max-width: 50em) {
  .Content-wrap.Saml-productLink {
    max-width: 560px;
  }
}

@media (max-width: 50em) {
  .Saml-productLink .Button-backToRegistration {
    margin-left: 0;
  }
}

@media (min-width: 100em) {
  body.full.registration .PageHeader {
    padding-top: 24px;
    padding-top: 2.4rem;
  }
  body.full.registration .Content-wrap--small {
    max-width: 604px;
  }
  body.full.registration .OnePass-logo > * {
    margin-left: 28px;
    margin-left: 2.8rem;
  }
  body.full.registration .Button-forgot {
    font-size: 16px;
    font-size: 1.6rem;
  }
  body.full.registration .Form-textSelect input[type=password],
  body.full.registration .Form-textSelect input[type="text"] {
    font-size: 18px;
    font-size: 1.8rem;
    padding: 12px;
    padding: 1.2rem;
  }
  body.full.registration .Password-wrap input[type=password],
  body.full.registration .Password-wrap input.Password-input {
    padding-right: 116px;
    padding-right: 11.6rem;
    height: 50px;
  }
  body.full.registration .Password-wrap .Form-inlineCheckboxWrapper {
    margin-top: 12px;
    height: 50px;
  }
  body.full.registration .Password-wrap .Form-inlineCheckbox {
    height: 42px;
  }
  body.full.registration .Password-wrap .Form-inlineCheckbox.ie9, body.full.registration .Password-wrap .Form-inlineCheckbox.ie8 {
    padding-top: 11px;
  }
  body.full.registration .Form-textSelect .Form-inlineCheckbox label {
    font-size: 14px;
    font-size: 1.4rem;
  }
  body.full.registration .ButtonBar {
    margin-top: 40px;
    margin-top: 4rem;
  }
  body.full.registration .ButtonBar--hasLink {
    margin-bottom: 40px;
    margin-bottom: 4rem;
    margin-top: 40px;
    margin-top: 4rem;
  }
  body.full.registration .Button--large {
    font-size: 18px;
    font-size: 1.8rem;
    line-height: 23px;
    line-height: 2.3rem;
  }
  body.full.registration .Button-createOnePass {
    font-size: 16px;
    font-size: 1.6rem;
  }
  body.full.registration .Marketing-content p {
    font-size: 18px;
    font-size: 1.8rem;
    line-height: 24px;
    line-height: 2.4rem;
  }
  body.full.registration .Marketing-content p.paragraph--large {
    font-size: 21px;
    font-size: 2.1rem;
  }
  body.full.registration .Button--ghost {
    font-size: 16px;
    font-size: 1.6rem;
    line-height: 20px;
    line-height: 2rem;
  }
  body.full.registration .Content-wrap {
    max-width: none;
    padding-left: 32px;
    padding-left: 3.2rem;
    padding-right: 0;
  }
  body.full.registration .Recaptcha input[type="text"] {
    width: 288px;
  }
  body.full.registration .Recaptcha-options {
    height: 50px;
  }
  body.full.registration .Recaptcha-options a {
    padding: 16px 0;
  }
}
@media (max-width: 100em) {
  body.full.registration .Password-wrap .Form-inlineCheckbox {
    padding: 0px 8px;
    padding: 0rem 0.6rem;
    height: 34px;
  }
}
@media (max-width: 100em) and (min-width: 50em) {
  body.full.registration .Password-wrap .Form-inlineCheckbox {
    padding: 0px 8px;
    padding: 0rem 0.8rem;
  }
}

@media (max-width: 50em) {
  body.full.registration .Footer .Content-wrap {
    padding: 0px 32px;
    padding: 0rem 2.4rem;
  }
}
@media (max-width: 50em) and (min-width: 50em) {
  body.full.registration .Footer .Content-wrap {
    padding: 0px 32px;
    padding: 0rem 3.2rem;
  }
}

body.full.saml .PageHeader {
  padding: 24px 0px 0px 0px;
  padding: 1.8rem 0rem 0rem 0rem;
}
@media (min-width: 50em) {
  body.full.saml .PageHeader {
    padding: 24px 0px 0px 0px;
    padding: 2.4rem 0rem 0rem 0rem;
  }
}

.Header {
  background: #3d3d3d;
  width: 100%;
}

@media (max-width: 50em) {
  .Header > .Content-wrap {
    padding: 0px;
    padding: 0rem;
    text-align: center;
  }
}
@media (max-width: 50em) and (min-width: 50em) {
  .Header > .Content-wrap {
    padding: 0rem;
    padding: 0;
  }
}

.Flex-header {
  display: -ms-flexbox;
  display: flex;
}
@media (max-width: 50em) {
  .Flex-header {
    -ms-flex-direction: column;
    flex-direction: column;
  }
}

.GlobalHeader-logo {
  margin: 8px 8px 8px -8px;
  margin: 0.6rem 0.6rem 0.6rem -0.6rem;
  padding: 12px 12px;
  padding: 0.9rem 0.9rem;
  border: solid 1px transparent;
  -ms-flex: 0 1 auto;
  flex: 0 1 auto;
  line-height: 0;
  transition: border 0.15s cubic-bezier(0.42, 0, 0.58, 1);
}
@media (min-width: 50em) {
  .GlobalHeader-logo {
    margin: 8px 8px 8px -8px;
    margin: 0.8rem 0.8rem 0.8rem -0.8rem;
  }
}
@media (min-width: 50em) {
  .GlobalHeader-logo {
    padding: 12px 12px;
    padding: 1.2rem 1.2rem;
  }
}
@media (max-width: 50em) {
  .GlobalHeader-logo {
    padding: 20px 0px;
    padding: 1.5rem 0rem;
    margin-left: auto;
    margin-right: auto;
    width: 130px;
  }
}
@media (max-width: 50em) and (min-width: 50em) {
  .GlobalHeader-logo {
    padding: 20px 0px;
    padding: 2rem 0rem;
  }
}

.GlobalHeader-logo:hover, .GlobalHeader-logo:focus {
  border: solid 1px white;
  border-radius: 2px;
}

.ie8 .GlobalHeader-logo,
.ie9 .GlobalHeader-logo {
  float: left;
}
@media (max-width: 50em) {
  .ie8 .GlobalHeader-logo,
  .ie9 .GlobalHeader-logo {
    float: none;
  }
}

.GlobalHeader-logo img {
  display: none;
}

.GlobalHeader-menu {
  margin: 20px 0px 0px 36px;
  margin: 1.5rem 0rem 0rem 2.7rem;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
}
@media (min-width: 50em) {
  .GlobalHeader-menu {
    margin: 20px 0px 0px 36px;
    margin: 2rem 0rem 0rem 3.6rem;
  }
}
@media (max-width: 50em) {
  .GlobalHeader-menu {
    margin: 0px 0px 20px 0px;
    margin: 0rem 0rem 1.5rem 0rem;
  }
}
@media (max-width: 50em) and (min-width: 50em) {
  .GlobalHeader-menu {
    margin: 0px 0px 20px 0px;
    margin: 0rem 0rem 2rem 0rem;
  }
}

.ie8 .GlobalHeader-menu,
.ie9 .GlobalHeader-menu {
  float: left;
}
@media (max-width: 50em) {
  .ie8 .GlobalHeader-menu,
  .ie9 .GlobalHeader-menu {
    float: none;
  }
}

.GlobalHeader-menu li a {
  padding: 8px 12px;
  padding: 0.6rem 0.9rem;
  border: solid 1px transparent;
  border-radius: 2px;
  color: #acacac;
  font-size: 18px;
  font-size: 1.8rem;
  line-height: 20px;
  line-height: 2rem;
  text-decoration: none;
  transition: border 0.15s cubic-bezier(0.42, 0, 0.58, 1), color 0.15s cubic-bezier(0.42, 0, 0.58, 1);
}
@media (min-width: 50em) {
  .GlobalHeader-menu li a {
    padding: 8px 12px;
    padding: 0.8rem 1.2rem;
  }
}
.GlobalHeader-menu li a:hover, .GlobalHeader-menu li a:focus, .GlobalHeader-menu li a.is-selected {
  border-color: white;
  color: white;
}

.GlobalHeader-secondaryMenu {
  -ms-flex: 0 1 auto;
  flex: 0 1 auto;
  margin-left: auto;
  margin-right: 0;
  margin-top: 28px;
  margin-top: 2.8rem;
}
@media (max-width: 50em) {
  .GlobalHeader-secondaryMenu {
    margin: 0px;
    margin: 0rem;
    padding: 8px 0px;
    padding: 0.6rem 0rem;
    border-bottom: solid 1px #6b6b6b;
    -ms-flex-order: -1;
    order: -1;
  }
}
@media (max-width: 50em) and (min-width: 50em) {
  .GlobalHeader-secondaryMenu {
    margin: 0rem;
    margin: 0;
  }
}
@media (max-width: 50em) and (min-width: 50em) {
  .GlobalHeader-secondaryMenu {
    padding: 8px 0px;
    padding: 0.8rem 0rem;
  }
}

.ie8 .GlobalHeader-secondaryMenu,
.ie9 .GlobalHeader-secondaryMenu {
  float: right;
}
@media (max-width: 50em) {
  .ie8 .GlobalHeader-secondaryMenu,
  .ie9 .GlobalHeader-secondaryMenu {
    border-bottom: none;
    border-top: solid 1px #6b6b6b;
    float: none;
  }
}

.GlobalHeader-secondaryMenu li {
  color: #c6c6c6;
}

.GlobalHeader-secondaryMenu li a {
  padding: 4px 16px;
  padding: 0.3rem 1.2rem;
  color: white;
}
@media (min-width: 50em) {
  .GlobalHeader-secondaryMenu li a {
    padding: 4px 16px;
    padding: 0.4rem 1.6rem;
  }
}

.GlobalHeader-productName {
  padding: 4px 0px;
  padding: 0.3rem 0rem;
  border-bottom: solid 1px #565656;
}
@media (min-width: 50em) {
  .GlobalHeader-productName {
    padding: 4px 0px;
    padding: 0.4rem 0rem;
  }
}
@media (max-width: 50em) {
  .GlobalHeader-productName {
    padding: 4px 0px 0px 0px;
    padding: 0.3rem 0rem 0rem 0rem;
    border: none;
    float: none;
    line-height: 16px;
    line-height: 1.6rem;
    text-align: center;
  }
}
@media (max-width: 50em) and (min-width: 50em) {
  .GlobalHeader-productName {
    padding: 4px 0px 0px 0px;
    padding: 0.4rem 0rem 0rem 0rem;
  }
}

.GlobalHeader-productName a {
  color: white;
}
@media (max-width: 26.25em) {
  .GlobalHeader-productName a {
    display: inline;
  }
}

.GlobalHeader-userName {
  padding: 0px 0px 0px 16px;
  padding: 0rem 0rem 0rem 1.2rem;
}
@media (min-width: 50em) {
  .GlobalHeader-userName {
    padding: 0px 0px 0px 16px;
    padding: 0rem 0rem 0rem 1.6rem;
  }
}
@media (max-width: 50em) {
  .GlobalHeader-userName {
    display: block;
    float: none;
  }
}

*,
*:before,
*:after {
  box-sizing: inherit;
}

html {
  height: 100%;
  width: 100%;
}

body {
  background: #efefef;
  height: 100%;
}

.TR-logo img {
  display: none;
}

.ie8 .TR-logo img {
  display: block;
}

.Page-wrapper {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  height: 100%;
}
@media (max-width: 50em) {
  .Page-wrapper {
    display: block;
  }
}

.Page-wrapper > * {
  -ms-flex: 0 1 auto;
  flex: 0 1 auto;
}

.Skip-link {
  display: block;
  left: -999px;
  position: absolute;
  top: -999px;
}
.Skip-link:focus {
  left: 8px;
  left: 0.8rem;
  top: 8px;
  top: 0.8rem;
}
@media (max-width: 50em) {
  .Skip-link {
    display: none;
  }
}

.Main-wrap {
  padding: 0px 0px 60px 0px;
  padding: 0rem 0rem 4.5rem 0rem;
  background: white;
  -ms-flex: 1 0 auto;
  flex: 1 0 auto;
  position: relative;
}
@media (min-width: 50em) {
  .Main-wrap {
    padding: 0px 0px 60px 0px;
    padding: 0rem 0rem 6rem 0rem;
  }
}
@media (max-width: 50em) {
  .Main-wrap {
    display: block;
  }
}

body.full .Main-wrap {
  background: #efefef;
}

.ie8 .Main-wrap,
.ie9 .Main-wrap {
  min-height: 700px;
}

.Content-wrap {
  max-width: 1280px;
}
.full.registration .Content-wrap {
  max-width: none;
  padding-right: 0;
}

.Content-wrap--full {
  text-align: center;
}

.Content-wrap--medium {
  max-width: 848px;
}

.Content-wrap--middle {
  max-width: 726px;
}

.Content-wrap--small {
  max-width: 560px;
}

.Content-wrap,
.Content-wrap--medium,
.Content-wrap--middle,
.Content-wrap--small {
  padding: 0px 32px;
  padding: 0rem 2.4rem;
  margin: 0 auto;
  width: 100%;
}
@media (min-width: 50em) {
  .Content-wrap,
  .Content-wrap--medium,
  .Content-wrap--middle,
  .Content-wrap--small {
    padding: 0px 32px;
    padding: 0rem 3.2rem;
  }
}

.OnePass-logo {
  margin-bottom: 40px;
  margin-bottom: 4rem;
}

.Content-wrap--twoColumn {
  display: -ms-flexbox;
  display: flex;
  -ms-flex: 1 0 auto;
  flex: 1 0 auto;
}
@media (max-width: 50em) {
  .Content-wrap--twoColumn {
    display: block;
  }
}

.PageHeader {
  padding: 32px 0px;
  padding: 2.4rem 0rem;
  background: #efefef;
  -ms-flex: 0 1 auto;
  flex: 0 1 auto;
}
@media (min-width: 50em) {
  .PageHeader {
    padding: 32px 0px;
    padding: 3.2rem 0rem;
  }
}
@media (max-width: 50em) {
  .PageHeader {
    max-height: none;
  }
}

body.full .PageHeader {
  padding: 40px 0px 0px 0px;
  padding: 3rem 0rem 0rem 0rem;
}
@media (min-width: 50em) {
  body.full .PageHeader {
    padding: 40px 0px 0px 0px;
    padding: 4rem 0rem 0rem 0rem;
  }
}
@media (max-width: 50em) {
  body.full .PageHeader {
    padding-bottom: 0;
  }
}

body.full .Saml-productLink + .PageHeader {
  padding: 12px 0px 0px 0px;
  padding: 0.9rem 0rem 0rem 0rem;
}
@media (min-width: 50em) {
  body.full .Saml-productLink + .PageHeader {
    padding: 12px 0px 0px 0px;
    padding: 1.2rem 0rem 0rem 0rem;
  }
}

.PageHeader h1 {
  margin: 0px;
  margin: 0rem;
}
@media (min-width: 50em) {
  .PageHeader h1 {
    margin: 0rem;
    margin: 0;
  }
}

.PageHeader--hasButton h1 {
  float: left;
}
@media (max-width: 37.5em) {
  .PageHeader--hasButton h1 {
    float: none;
  }
}

.PageHeader--hasButton button {
  margin: 0px 0px 0px 40px;
  margin: 0rem 0rem 0rem 3rem;
  float: left;
}
@media (min-width: 50em) {
  .PageHeader--hasButton button {
    margin: 0px 0px 0px 40px;
    margin: 0rem 0rem 0rem 4rem;
  }
}
@media (max-width: 37.5em) {
  .PageHeader--hasButton button {
    margin: 24px 0px 0px 0px;
    margin: 1.8rem 0rem 0rem 0rem;
    float: none;
  }
}
@media (max-width: 37.5em) and (min-width: 50em) {
  .PageHeader--hasButton button {
    margin: 24px 0px 0px 0px;
    margin: 2.4rem 0rem 0rem 0rem;
  }
}

.PageSubheaderWrapper {
  margin: 0px 0px 20px 0px;
  margin: 0rem 0rem 1.5rem 0rem;
  -ms-flex-align: baseline;
  align-items: baseline;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
}
@media (min-width: 50em) {
  .PageSubheaderWrapper {
    margin: 0px 0px 20px 0px;
    margin: 0rem 0rem 2rem 0rem;
  }
}

.PageSubheaderWrapper button {
  -ms-flex-item-align: end;
  align-self: flex-end;
  -ms-flex: 0 0 auto;
  flex: 0 0 auto;
  margin-left: auto;
}

.ie8 .PageSubheader,
.ie9 .PageSubheader {
  float: left;
}

.ie8 .PageSubheaderWrapper button,
.ie9 .PageSubheaderWrapper button {
  float: right;
}

.PageSubheader h2 {
  margin: 0px;
  margin: 0rem;
  word-break: break-all;
}
@media (min-width: 50em) {
  .PageSubheader h2 {
    margin: 0rem;
    margin: 0;
  }
}

.PageSubheader .productLink {
  margin: 4px 0px 0px 0px;
  margin: 0.3rem 0rem 0rem 0rem;
}
@media (min-width: 50em) {
  .PageSubheader .productLink {
    margin: 4px 0px 0px 0px;
    margin: 0.4rem 0rem 0rem 0rem;
  }
}

.PageSubheader button,
.PageSubheader .Badge {
  margin: 8px 0px 0px 0px;
  margin: 0.6rem 0rem 0rem 0rem;
}
@media (min-width: 50em) {
  .PageSubheader button,
  .PageSubheader .Badge {
    margin: 8px 0px 0px 0px;
    margin: 0.8rem 0rem 0rem 0rem;
  }
}

.Column-side,
.Column-main {
  margin: 36px 0px 0px 0px;
  margin: 2.7rem 0rem 0rem 0rem;
  float: left;
}
@media (min-width: 50em) {
  .Column-side,
  .Column-main {
    margin: 36px 0px 0px 0px;
    margin: 3.6rem 0rem 0rem 0rem;
  }
}
@media (max-width: 50em) {
  .Column-side,
  .Column-main {
    float: none;
    min-height: auto;
  }
}

.Column-main {
  padding: 0px 0px 32px 32px;
  padding: 0rem 0rem 2.4rem 2.4rem;
  border-left: solid 1px #dadada;
  width: calc(100% - 264px);
}
@media (min-width: 50em) {
  .Column-main {
    padding: 0px 0px 32px 32px;
    padding: 0rem 0rem 3.2rem 3.2rem;
  }
}
@media (max-width: 50em) {
  .Column-main {
    margin: 52px 0px 0px 0px;
    margin: 3.9rem 0rem 0rem 0rem;
    padding: 0px;
    padding: 0rem;
    border-left: none;
    width: 100%;
  }
}
@media (max-width: 50em) and (min-width: 50em) {
  .Column-main {
    margin: 52px 0px 0px 0px;
    margin: 5.2rem 0rem 0rem 0rem;
  }
}
@media (max-width: 50em) and (min-width: 50em) {
  .Column-main {
    padding: 0rem;
    padding: 0;
  }
}

.ie8 .Column-main {
  width: 938px;
}

.Helper-text-wrap {
  margin: 12px 0px 0px 0px;
  margin: 0.9rem 0rem 0rem 0rem;
  color: #6b6b6b;
}
@media (min-width: 50em) {
  .Helper-text-wrap {
    margin: 12px 0px 0px 0px;
    margin: 1.2rem 0rem 0rem 0rem;
  }
}

.Helper-text-wrap-twoStep {
  margin: 20px 0px 0px 0px;
  margin: 1.5rem 0rem 0rem 0rem;
  max-width: 550px;
}
@media (min-width: 50em) {
  .Helper-text-wrap-twoStep {
    margin: 20px 0px 0px 0px;
    margin: 2rem 0rem 0rem 0rem;
  }
}
@media (max-width: 50em) {
  .Helper-text-wrap-twoStep {
    max-width: none;
  }
}

.Helper-text-withIcon {
  padding-left: 50px;
  padding-left: 5rem;
  width: 85%;
}

.Desk-wrapper {
  padding: 64px 0px 0px 0px;
  padding: 4.8rem 0rem 0rem 0rem;
  text-align: center;
}
@media (min-width: 50em) {
  .Desk-wrapper {
    padding: 64px 0px 0px 0px;
    padding: 6.4rem 0rem 0rem 0rem;
  }
}

.Desk-wrapper-small {
  padding: 0px 0px;
  padding: 0rem 0rem;
  text-align: center;
}
@media (min-width: 50em) {
  .Desk-wrapper-small {
    padding: 0px 0px;
    padding: 0rem 0rem;
  }
}

.cosi .Desk-wrapper-small {
  margin: 40px 0px 0px 0px;
  margin: 3rem 0rem 0rem 0rem;
}
@media (min-width: 50em) {
  .cosi .Desk-wrapper-small {
    margin: 40px 0px 0px 0px;
    margin: 4rem 0rem 0rem 0rem;
  }
}

.Desk {
  min-height: 188px;
  background: url(../images/svg-Desk.png);
  background: url(../images/svg-Desk.svg), url(../images/svg-Monitor.svg);
  background-position: top center;
  background-repeat: no-repeat;
  background-size: 562px 188px, auto auto;
}
@media (max-width: 37.5em) {
  .Desk {
    background: none;
    min-height: 0;
  }
}

.Desk-small {
  min-height: 160px;
  background: url(../images/svg-Desk-small.png);
  background: url(../images/svg-Desk-small.svg), url(../images/svg-Monitor-small.svg);
  background-position: top center;
  background-repeat: no-repeat;
  background-size: 450px 146px, auto auto;
}
@media (max-width: 37.5em) {
  .Desk-small {
    background: none;
    min-height: 0;
  }
}

.Desk img {
  margin-top: 7px;
}

.Desk-small img {
  margin-left: 3px;
  margin-top: 5px;
}

.Desk-wrapper .Message {
  margin: 40px 0px 0px 0px;
  margin: 3rem 0rem 0rem 0rem;
  color: #3d3d3d;
  font-weight: 500;
}
@media (min-width: 50em) {
  .Desk-wrapper .Message {
    margin: 40px 0px 0px 0px;
    margin: 4rem 0rem 0rem 0rem;
  }
}

.Desk-message-left {
  margin: 0 auto;
  max-width: 562px;
  text-align: left;
}

.Desk-message-left-small {
  max-width: 450px;
}

.Desk-wrapper .Button,
.Desk-wrapper-small .Button {
  margin: 20px 0px 0px 0px;
  margin: 1.5rem 0rem 0rem 0rem;
}
@media (min-width: 50em) {
  .Desk-wrapper .Button,
  .Desk-wrapper-small .Button {
    margin: 20px 0px 0px 0px;
    margin: 2rem 0rem 0rem 0rem;
  }
}

.DeviceInformation {
  color: #3d3d3d;
  margin-bottom: 44px;
  margin-bottom: 4.4rem;
  margin-top: 48px;
  margin-top: 4.8rem;
}

.DeviceIP {
  margin-bottom: 4px;
  margin-bottom: 0.4rem;
}

.generatePasswordWrapper .paragraph--extraLarge {
  float: left;
}

.generatePasswordWrapper .Button-copy {
  margin: 0px 0px 0px 20px;
  margin: 0rem 0rem 0rem 1.5rem;
  float: left;
}
@media (min-width: 50em) {
  .generatePasswordWrapper .Button-copy {
    margin: 0px 0px 0px 20px;
    margin: 0rem 0rem 0rem 2rem;
  }
}

.Progress-spinner {
  display: block;
  position: relative;
  animation: spinnerRotate 10s cubic-bezier(0.87, 0.03, 0.33, 1) infinite;
  height: 40px;
  width: 40px;
}

.Progress-spinner--small {
  height: 24px;
  width: 24px;
}

.Progress-spinner svg {
  position: absolute;
  transform: rotate(-90deg);
  top: 0;
  left: 0;
  transform-origin: center;
  overflow: visible;
}

.Progress-spinner circle {
  transition-property: stroke;
  animation-name: spinnerCircle;
  fill: transparent;
  transform-origin: center;
  transition: stroke-dashoffset 225ms linear;
  stroke-dasharray: 94.2478px;
  stroke-dashoffset: 18.8496px;
  stroke-width: 10%;
  stroke: #4397e0;
}

.Progress-spinner--small circle {
  animation-name: spinnerCircleSmall;
  stroke-dasharray: 43.9823px;
  stroke-dashoffset: 8.79646px;
  stroke-width: 12.5%;
}

@keyframes spinnerRotate {
  0% {
    transform: rotate(0);
  }
  25% {
    transform: rotate(1170deg);
  }
  50% {
    transform: rotate(2340deg);
  }
  75% {
    transform: rotate(3510deg);
  }
  100% {
    transform: rotate(4680deg);
  }
}
@keyframes spinnerCircle {
  0% {
    stroke-dashoffset: 89.5354;
    transform: rotate(0deg);
  }
  12.5% {
    stroke-dashoffset: 18.8496;
    transform: rotate(0deg);
  }
  12.51% {
    stroke-dashoffset: 18.8496;
    transform: rotateX(180deg) rotate(72.5deg);
  }
  25% {
    stroke-dashoffset: 89.5354;
    transform: rotateX(180deg) rotate(72.5deg);
  }
  25.1% {
    stroke-dashoffset: 89.5354;
    transform: rotate(270deg);
  }
  37.5% {
    stroke-dashoffset: 18.8496;
    transform: rotate(270deg);
  }
  37.51% {
    stroke-dashoffset: 18.8496;
    transform: rotateX(180deg) rotate(161.5deg);
  }
  50% {
    stroke-dashoffset: 89.5354;
    transform: rotateX(180deg) rotate(161.5deg);
  }
  50.01% {
    stroke-dashoffset: 89.5354;
    transform: rotate(180deg);
  }
  62.5% {
    stroke-dashoffset: 18.8496;
    transform: rotate(180deg);
  }
  62.51% {
    stroke-dashoffset: 18.8496;
    transform: rotateX(180deg) rotate(251.5deg);
  }
  75% {
    stroke-dashoffset: 89.5354;
    transform: rotateX(180deg) rotate(251.5deg);
  }
  75.01% {
    stroke-dashoffset: 89.5354;
    transform: rotate(90deg);
  }
  87.5% {
    stroke-dashoffset: 18.8496;
    transform: rotate(90deg);
  }
  87.51% {
    stroke-dashoffset: 18.8496;
    transform: rotateX(180deg) rotate(341.5deg);
  }
  100% {
    stroke-dashoffset: 89.5354;
    transform: rotateX(180deg) rotate(341.5deg);
  }
}
@keyframes spinnerCircleSmall {
  0% {
    stroke-dashoffset: 41.7832;
    transform: rotate(0deg);
  }
  12.5% {
    stroke-dashoffset: 8.79646;
    transform: rotate(0deg);
  }
  12.51% {
    stroke-dashoffset: 8.79646;
    transform: rotateX(180deg) rotate(72.5deg);
  }
  25% {
    stroke-dashoffset: 41.7832;
    transform: rotateX(180deg) rotate(72.5deg);
  }
  25.1% {
    stroke-dashoffset: 41.7832;
    transform: rotate(270deg);
  }
  37.5% {
    stroke-dashoffset: 8.79646;
    transform: rotate(270deg);
  }
  37.51% {
    stroke-dashoffset: 8.79646;
    transform: rotateX(180deg) rotate(161.5deg);
  }
  50% {
    stroke-dashoffset: 41.7832;
    transform: rotateX(180deg) rotate(161.5deg);
  }
  50.01% {
    stroke-dashoffset: 41.7832;
    transform: rotate(180deg);
  }
  62.5% {
    stroke-dashoffset: 8.79646;
    transform: rotate(180deg);
  }
  62.51% {
    stroke-dashoffset: 8.79646;
    transform: rotateX(180deg) rotate(251.5deg);
  }
  75% {
    stroke-dashoffset: 41.7832;
    transform: rotateX(180deg) rotate(251.5deg);
  }
  75.01% {
    stroke-dashoffset: 41.7832;
    transform: rotate(90deg);
  }
  87.5% {
    stroke-dashoffset: 8.79646;
    transform: rotate(90deg);
  }
  87.51% {
    stroke-dashoffset: 8.79646;
    transform: rotateX(180deg) rotate(341.5deg);
  }
  100% {
    stroke-dashoffset: 41.7832;
    transform: rotateX(180deg) rotate(341.5deg);
  }
}
.Toast-wrapper {
  pointer-events: none;
  position: absolute;
  top: 96px;
  text-align: center;
  width: 100%;
  z-index: 1001;
}

.Toast-wrapper--hasAnimation {
  -webkit-animation: fadeInDown .5s;
  animation: fadeInDown .5s;
  -ms-animation: fadeInDown .5s;
}

@-webkit-keyframes fadeInDown {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-30px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
  }
}
@keyframes fadeInDown {
  0% {
    opacity: 0;
    transform: translateY(-30px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
@-ms-keyframes fadeInDown {
  0% {
    opacity: 0;
    -ms-transform: translateY(-30px);
  }
  100% {
    opacity: 1;
    -ms-transform: translateY(0);
  }
}
.Toast,
.Error {
  -webkit-border-radius: 2px;
  border-radius: 2px;
  margin: 0px 8px;
  margin: 0rem 0.6rem;
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.15);
  color: white;
  display: inline-block;
  font-size: 14px;
  font-size: 1.4rem;
  pointer-events: auto;
  position: relative;
}
@media (min-width: 50em) {
  .Toast,
  .Error {
    margin: 0px 8px;
    margin: 0rem 0.8rem;
  }
}

.Toast a,
.Error a {
  color: white;
  text-decoration: underline;
}

.Error {
  -webkit-border-radius: 2px 2px 0 0;
  border-radius: 2px 2px 0 0;
  margin: 0px;
  margin: 0rem;
  box-shadow: none;
  width: 100%;
}
@media (min-width: 50em) {
  .Error {
    margin: 0rem;
    margin: 0;
  }
}

.Form-content .Error {
  margin: 0px 0px 24px 0px;
  margin: 0rem 0rem 1.8rem 0rem;
}
@media (min-width: 50em) {
  .Form-content .Error {
    margin: 0px 0px 24px 0px;
    margin: 0rem 0rem 2.4rem 0rem;
  }
}

.Error.Form-level-error {
  margin: 0px 0px 40px 0px;
  margin: 0rem 0rem 3rem 0rem;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.15);
  padding: 12px 24px;
}
@media (min-width: 50em) {
  .Error.Form-level-error {
    margin: 0px 0px 40px 0px;
    margin: 0rem 0rem 4rem 0rem;
  }
}

.Toast {
  max-width: 612px;
}

.Toast-success {
  background: #1a661a;
  padding: 12px 20px;
}

.Toast-success .Icon-svg {
  fill: #bae567;
  left: -4px;
  top: -3px;
}

.Toast-failure:empty,
.Error:empty {
  padding: 0;
}

.ie8 .Error {
  padding: 0;
}

.Toast-failure,
.Error {
  background: #a0251c;
  padding: 12px 52px 12px 32px;
}

.ie8 .Error > span {
  display: block;
  padding: 12px 52px 12px 32px;
}

.Toast-failure .Icon-svgError,
.Error .Icon-svgError {
  fill: #ea8981;
  left: -5px;
  top: -3px;
}

.Toast-close {
  line-height: 0;
  position: absolute;
  right: 20px;
  top: calc(50% - 5px);
}
@media (max-width: 50em) {
  .Toast-close {
    top: 10px;
  }
}

.ie8 .Toast-close {
  margin: 0px 0px 0px 20px;
  margin: 0rem 0rem 0rem 1.5rem;
  color: white;
  position: relative;
  right: auto;
}
@media (min-width: 50em) {
  .ie8 .Toast-close {
    margin: 0px 0px 0px 20px;
    margin: 0rem 0rem 0rem 2rem;
  }
}

.Toast-failure .Icon-svgClose {
  fill: white;
  top: -4px;
}

.Toast-info {
  color: #103a59;
  background: #e4ecf4;
  border: solid 1px #c2dbf2;
  padding: 12px 52px 12px 30px;
}

.Toast-info a {
  color: #103a59;
}

.Toast-info .Icon-svgError {
  fill: #7992ba;
  left: -10px;
  top: -4px;
}

.Toast-info .Icon-svgClose {
  fill: #103a59;
}

.InlineError-message {
  margin: 12px 0px 0px 0px;
  margin: 0.9rem 0rem 0rem 0rem;
  color: #a0251c !important;
  display: block;
}
@media (min-width: 50em) {
  .InlineError-message {
    margin: 12px 0px 0px 0px;
    margin: 1.2rem 0rem 0rem 0rem;
  }
}

.InlineError-message:empty,
.validation-error:empty {
  margin: 0;
}

.Form-textSelect .InlineError,
.Form-textSelect input.validation-error,
.Form-textSelect .InlineError + .Password-input,
.Form-textSelect input.validation-error + .Password-input {
  border: solid 2px #a0251c !important;
}

.Password-fail {
  color: #a0251c !important;
  font-weight: normal !important;
}

.Password-success {
  color: #158915 !important;
  font-weight: normal !important;
}

.Informational-wrapper {
  margin: 0px 0px 32px 0px;
  margin: 0rem 0rem 2.4rem 0rem;
}
@media (min-width: 50em) {
  .Informational-wrapper {
    margin: 0px 0px 32px 0px;
    margin: 0rem 0rem 3.2rem 0rem;
  }
}

.Informational {
  padding: 16px 20px;
  padding: 1.2rem 1.5rem;
  -webkit-border-radius: 4px;
  border-radius: 4px;
  background: #e4ecf4;
  border: solid 1px #c2dbf2;
  color: #103a59;
  line-height: 18px;
  line-height: 1.8rem;
}
@media (min-width: 50em) {
  .Informational {
    padding: 16px 20px;
    padding: 1.6rem 2rem;
  }
}

.Informational a {
  color: #0d77d6;
  text-decoration: underline;
}

.ui-widget-overlay {
  background-color: #3d3d3d;
  left: 0;
  height: 100%;
  opacity: 0.9;
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 1001;
}

@-webkit-keyframes fadeInDown {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-30px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
  }
}
@keyframes fadeInDown {
  0% {
    opacity: 0;
    transform: translateY(-30px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
@-ms-keyframes fadeInDown {
  0% {
    opacity: 0;
    -ms-transform: translateY(-30px);
  }
  100% {
    opacity: 1;
    -ms-transform: translateY(0);
  }
}
.modal {
  display: none;
}

.ui-dialog {
  padding: 0px 0px;
  padding: 0rem 0rem;
  -webkit-border-radius: 2px;
  border-radius: 2px;
  background-color: white;
  border: none !important;
  z-index: 1002;
  -webkit-animation: fadeInDown .3s;
  animation: fadeInDown .3s;
  -ms-animation: fadeInDown .3s;
}
@media (min-width: 50em) {
  .ui-dialog {
    padding: 0px 0px;
    padding: 0rem 0rem;
  }
}
@media (max-width: 50em) {
  .ui-dialog {
    width: 80%;
  }
}

.ui-dialog,
.ui-widget input,
.ui-widget select,
.ui-widget textarea,
.ui-widget button {
  font-family: "Source Sans Pro", Arial, sans-serif;
}

.ie9 .ui-dialog,
.ie8 .ui-dialog {
  margin: 32px 0px 0px 0px;
  margin: 2.4rem 0rem 0rem 0rem;
}
@media (min-width: 50em) {
  .ie9 .ui-dialog,
  .ie8 .ui-dialog {
    margin: 32px 0px 0px 0px;
    margin: 3.2rem 0rem 0rem 0rem;
  }
}

.ui-dialog .ui-dialog-content {
  padding: 0px 0px;
  padding: 0rem 0rem;
}
@media (min-width: 50em) {
  .ui-dialog .ui-dialog-content {
    padding: 0px 0px;
    padding: 0rem 0rem;
  }
}

.Modal-title {
  padding: 12px 20px;
  padding: 0.9rem 1.5rem;
  background: #efefef;
  border: solid 1px #dadada;
}
@media (min-width: 50em) {
  .Modal-title {
    padding: 12px 20px;
    padding: 1.2rem 2rem;
  }
}

.Modal-title h1 {
  margin: 0px;
  margin: 0rem;
  max-width: calc(100% - 40px);
  color: #3d3d3d;
  line-height: 28px;
  line-height: 2.8rem;
}
@media (min-width: 50em) {
  .Modal-title h1 {
    margin: 0rem;
    margin: 0;
  }
}
.Modal-title h1:focus {
  outline: none;
}

.Modal-content {
  padding: 24px 24px;
  padding: 1.8rem 1.8rem;
  word-break: break-word;
}
@media (min-width: 50em) {
  .Modal-content {
    padding: 24px 24px;
    padding: 2.4rem 2.4rem;
  }
}

.no-close .ui-dialog-titlebar,
.no-close .ui-dialog-titlebar-close {
  display: none;
}

.modal-closeButton {
  padding: 8px 8px;
  padding: 0.6rem 0.6rem;
  line-height: 0;
  position: absolute;
  top: 11px;
  right: 15px;
}
@media (min-width: 50em) {
  .modal-closeButton {
    padding: 8px 8px;
    padding: 0.8rem 0.8rem;
  }
}
.modal-closeButton:hover, .modal-closeButton:focus {
  background: #dadada;
}

.modal-closeButton .Icon-svg {
  margin: 0px;
  margin: 0rem;
}
@media (min-width: 50em) {
  .modal-closeButton .Icon-svg {
    margin: 0rem;
    margin: 0;
  }
}

.modal-closeButton img {
  display: none;
}

.ButtonBar-modal {
  margin: 24px 0px 0px 0px;
  margin: 1.8rem 0rem 0rem 0rem;
  text-align: right;
}
@media (min-width: 50em) {
  .ButtonBar-modal {
    margin: 24px 0px 0px 0px;
    margin: 2.4rem 0rem 0rem 0rem;
  }
}

.Form-textSelect.Recaptcha {
  margin: 0px;
  margin: 0rem;
  padding: 0px;
  padding: 0rem;
}
@media (min-width: 50em) {
  .Form-textSelect.Recaptcha {
    margin: 0rem;
    margin: 0;
  }
}
@media (min-width: 50em) {
  .Form-textSelect.Recaptcha {
    padding: 0rem;
    padding: 0;
  }
}

.Recaptcha-wrapper {
  margin: 24px 0px 0px 0px;
  margin: 1.8rem 0rem 0rem 0rem;
  padding: 0px 24px 36px 24px;
  padding: 0rem 1.8rem 2.7rem 1.8rem;
  border: solid 1px #dadada;
  position: relative;
}
@media (min-width: 50em) {
  .Recaptcha-wrapper {
    margin: 24px 0px 0px 0px;
    margin: 2.4rem 0rem 0rem 0rem;
  }
}
@media (min-width: 50em) {
  .Recaptcha-wrapper {
    padding: 0px 24px 36px 24px;
    padding: 0rem 2.4rem 3.6rem 2.4rem;
  }
}

.Recaptcha-logo {
  position: absolute;
  right: 4px;
  top: 4px;
  width: 53px;
}
@media (max-width: 64em) {
  .Recaptcha-logo {
    bottom: 4px;
    top: auto;
  }
}

.Recaptcha-images {
  margin: 12px 0px 20px 0px;
  margin: 0.9rem 0rem 1.5rem 0rem;
  max-width: 100%;
}
@media (min-width: 50em) {
  .Recaptcha-images {
    margin: 12px 0px 20px 0px;
    margin: 1.2rem 0rem 2rem 0rem;
  }
}

.Recaptcha-images embed {
  display: block;
}

.Recaptcha-images img {
  height: auto;
  max-width: 100%;
}

.Recaptcha-images br {
  display: none;
}

.Recaptcha-images span {
  display: block;
}

.Recaptcha-images span:last-child {
  padding: 0px 0px 8px 0px;
  padding: 0rem 0rem 0.6rem 0rem;
  display: block;
  border-bottom: solid 1px #dadada;
}
@media (min-width: 50em) {
  .Recaptcha-images span:last-child {
    padding: 0px 0px 8px 0px;
    padding: 0rem 0rem 0.8rem 0rem;
  }
}

.Recaptcha-label {
  color: #6b6b6b;
}

.Recaptcha input[type="text"] {
  float: left;
  width: 210px;
}
@media (max-width: 64em) {
  .Recaptcha input[type="text"] {
    float: none;
    width: 100%;
  }
}

.ie8 .Recaptcha input[type="text"] {
  float: none;
  width: auto;
}

.Recaptcha-options {
  margin: 12px 0px 0px 0px;
  margin: 0.9rem 0rem 0rem 0rem;
  background: #efefef;
  border: solid 1px #dadada;
  float: right;
  height: 39px;
  width: 120px;
}
@media (min-width: 50em) {
  .Recaptcha-options {
    margin: 12px 0px 0px 0px;
    margin: 1.2rem 0rem 0rem 0rem;
  }
}
@media (max-width: 64em) {
  .Recaptcha-options {
    float: none;
  }
}

.ie8 .Recaptcha-options {
  background: none;
  border: none;
  float: none;
  height: auto;
  width: auto;
}

.Recaptcha-options a {
  line-height: 0;
  padding: 10px 0;
  float: left;
  text-align: center;
  width: 33%;
}
.Recaptcha-options a:hover, .Recaptcha-options a:focus {
  background: #dadada;
}

.ie8 .Recaptcha-options a {
  float: none;
  text-align: left;
  width: 100%;
}

.Recaptcha-options a.Recaptcha-middleButton {
  width: 34%;
}

.Recaptcha-IE {
  display: none;
}

.ie8 .Recaptcha-IE {
  display: block;
  line-height: 24px;
  line-height: 2.4rem;
}

.Column-side {
  padding: 0px 40px 32px 0px;
  padding: 0rem 3rem 2.4rem 0rem;
  width: 264px;
}
@media (min-width: 50em) {
  .Column-side {
    padding: 0px 40px 32px 0px;
    padding: 0rem 4rem 3.2rem 0rem;
  }
}
@media (max-width: 50em) {
  .Column-side {
    padding: 0px;
    padding: 0rem;
    width: 100%;
  }
}
@media (max-width: 50em) and (min-width: 50em) {
  .Column-side {
    padding: 0rem;
    padding: 0;
  }
}

.Sidebar-title {
  margin: 0px 12px 12px 12px;
  margin: 0rem 0.9rem 0.9rem 0.9rem;
}
@media (min-width: 50em) {
  .Sidebar-title {
    margin: 0px 12px 12px 12px;
    margin: 0rem 1.2rem 1.2rem 1.2rem;
  }
}

@media (max-width: 50em) {
  .Sidebar-menu {
    padding: 20px 56px;
    padding: 1.5rem 4.2rem;
    border: solid 1px #efefef;
    border-top: none;
  }
}
@media (max-width: 50em) and (min-width: 50em) {
  .Sidebar-menu {
    padding: 20px 56px;
    padding: 2rem 5.6rem;
  }
}

@media (max-width: 26.25em) {
  .Sidebar-menu {
    padding: 20px 28px;
    padding: 1.5rem 2.1rem;
  }
}
@media (max-width: 26.25em) and (min-width: 50em) {
  .Sidebar-menu {
    padding: 20px 28px;
    padding: 2rem 2.8rem;
  }
}

.Sidebar-menu li a {
  -webkit-border-radius: 2px;
  border-radius: 2px;
  margin: 0px 0px 4px 0px;
  margin: 0rem 0rem 0.3rem 0rem;
  padding: 8px 12px;
  padding: 0.6rem 0.9rem;
  display: block;
  text-decoration: none;
}
@media (min-width: 50em) {
  .Sidebar-menu li a {
    margin: 0px 0px 4px 0px;
    margin: 0rem 0rem 0.4rem 0rem;
  }
}
@media (min-width: 50em) {
  .Sidebar-menu li a {
    padding: 8px 12px;
    padding: 0.8rem 1.2rem;
  }
}
.Sidebar-menu li a:hover, .Sidebar-menu li a:focus, .Sidebar-menu li a.is-selected {
  background: #3d3d3d;
  color: white;
}
@media (max-width: 50em) {
  .Sidebar-menu li a {
    font-size: 1.6rem;
    text-align: center;
  }
}

.Sidebar-navButton {
  padding: 8px;
  padding: 0.6rem;
  border: solid 1px #efefef;
  color: #0d77d6;
  font-weight: 600;
  text-align: center;
  width: 100%;
}
@media (min-width: 50em) {
  .Sidebar-navButton {
    padding: 0.8rem;
    padding: 8;
  }
}
.Sidebar-navButton:hover, .Sidebar-navButton:focus {
  background-color: #dadada;
  border-color: #dadada;
  color: #262626;
}

.Sidebar-navButton .Icon-svg {
  top: -4px;
}

.Icon-wrapper {
  display: inline-block;
  height: 14px;
  position: relative;
  vertical-align: middle;
  width: 14px;
}

.ie8 .Icon-wrapper {
  display: none;
}

.Icon-wrapper--small {
  height: 12px;
  width: 12px;
}

.Icon-wrapper--large {
  height: 16px;
  width: 16px;
}

.Icon-wrapper--extraLarge {
  height: 20px;
  width: 20px;
}

.Icon-wrapper--isCircle {
  -webkit-border-radius: 50%;
  border-radius: 50%;
}

.Icon-svg {
  bottom: 0;
  left: 0;
  margin: auto;
  height: 100%;
  width: 100%;
  position: absolute;
  right: 0;
  top: 0;
}

.ie8 .Icon-svg {
  display: none !important;
}

.Icon-svg:not(:root) {
  overflow: hidden;
}

.Icon-svg--right {
  margin: 0px 0px 0px 4px;
  margin: 0rem 0rem 0rem 0.3rem;
}
@media (min-width: 50em) {
  .Icon-svg--right {
    margin: 0px 0px 0px 4px;
    margin: 0rem 0rem 0rem 0.4rem;
  }
}

.Icon-svg--large + span {
  padding: 0px 0px 0px 24px;
  padding: 0rem 0rem 0rem 1.8rem;
}
@media (min-width: 50em) {
  .Icon-svg--large + span {
    padding: 0px 0px 0px 24px;
    padding: 0rem 0rem 0rem 2.4rem;
  }
}
@media (max-width: 50em) {
  .Icon-svg--large + span {
    padding: 0px 0px 0px 28px;
    padding: 0rem 0rem 0rem 2.1rem;
  }
}
@media (max-width: 50em) and (min-width: 50em) {
  .Icon-svg--large + span {
    padding: 0px 0px 0px 28px;
    padding: 0rem 0rem 0rem 2.8rem;
  }
}

.Complete-circle {
  -webkit-border-radius: 18px;
  border-radius: 18px;
  background: #158915;
  height: 36px;
  left: 0;
  line-height: 0;
  position: absolute;
  text-align: center;
  top: -4px;
  width: 36px;
}

.ie8 .Complete-circle {
  padding: 0px 4px 0px 0px;
  padding: 0rem 0.3rem 0rem 0rem;
  background: none;
  height: auto;
  position: relative;
  width: auto;
}
@media (min-width: 50em) {
  .ie8 .Complete-circle {
    padding: 0px 4px 0px 0px;
    padding: 0rem 0.4rem 0rem 0rem;
  }
}

.Complete-circle .Icon-svg {
  fill: white;
  height: 13px;
  margin-right: 0;
  margin-top: 11px;
  margin-top: 1.1rem;
  width: 17px;
}

.Complete-circle img {
  display: none;
}

.ie8 .Complete-circle img {
  display: block;
}

.Icon-svg {
  fill: #c6c6c6;
}

.Icon-svg--onLight {
  fill: #acacac;
}

.Icon-svg--onDark {
  fill: #6b6b6b;
}

.Icon-svg--inPrimaryButton {
  fill: #8ec0ed;
}

.Icon-svg--isFulfilled {
  fill: #158915;
}

.Icon-svg--ghost {
  fill: white;
}

.Icon-svg--link {
  fill: #0d77d6;
}

/*************************************************
  Tables
  Description: Generic styles for html tables.
  Version: 1.0
  Options:
  Structure:

**************************************************/
.Table-wrapper {
  margin: 40px 0px 0px 0px;
  margin: 3rem 0rem 0rem 0rem;
}
@media (min-width: 50em) {
  .Table-wrapper {
    margin: 40px 0px 0px 0px;
    margin: 4rem 0rem 0rem 0rem;
  }
}

.Table-wrapper:first-child {
  padding: 0px;
  padding: 0rem;
  margin: 0px;
  margin: 0rem;
  border-top: none;
}
@media (min-width: 50em) {
  .Table-wrapper:first-child {
    padding: 0rem;
    padding: 0;
  }
}
@media (min-width: 50em) {
  .Table-wrapper:first-child {
    margin: 0rem;
    margin: 0;
  }
}

table {
  margin: 24px 0px;
  margin: 1.8rem 0rem;
  border: 1px solid #dadada;
  border-collapse: collapse;
  width: 100%;
}
@media (min-width: 50em) {
  table {
    margin: 24px 0px;
    margin: 2.4rem 0rem;
  }
}
@media (max-width: 64em) {
  table {
    border: none;
  }
}

table + table {
  margin: 48px 0px 0px 0px;
  margin: 3.6rem 0rem 0rem 0rem;
}
@media (min-width: 50em) {
  table + table {
    margin: 48px 0px 0px 0px;
    margin: 4.8rem 0rem 0rem 0rem;
  }
}
@media (max-width: 64em) {
  table + table {
    margin: 24px 0px 0px 0px;
    margin: 1.8rem 0rem 0rem 0rem;
  }
}
@media (max-width: 64em) and (min-width: 50em) {
  table + table {
    margin: 24px 0px 0px 0px;
    margin: 2.4rem 0rem 0rem 0rem;
  }
}

table caption {
  padding: 0px 0px 20px 0px;
  padding: 0rem 0rem 1.5rem 0rem;
  font-size: 18px;
  font-size: 1.8rem;
  line-height: 24px;
  line-height: 2.4rem;
  text-align: left;
}
@media (min-width: 50em) {
  table caption {
    padding: 0px 0px 20px 0px;
    padding: 0rem 0rem 2rem 0rem;
  }
}

table caption.hasIcon {
  padding: 0px 0px 20px 0px;
  padding: 0rem 0rem 1.5rem 0rem;
  position: relative;
}
@media (min-width: 50em) {
  table caption.hasIcon {
    padding: 0px 0px 20px 0px;
    padding: 0rem 0rem 2rem 0rem;
  }
}
@media (max-width: 64em) {
  table caption.hasIcon {
    padding: 0px 0px 20px 0px;
    padding: 0rem 0rem 1.5rem 0rem;
  }
}
@media (max-width: 64em) and (min-width: 50em) {
  table caption.hasIcon {
    padding: 0px 0px 20px 0px;
    padding: 0rem 0rem 2rem 0rem;
  }
}

.ie8 table caption.hasIcon {
  padding: 0px 0px 20px 0px;
  padding: 0rem 0rem 1.5rem 0rem;
}
@media (min-width: 50em) {
  .ie8 table caption.hasIcon {
    padding: 0px 0px 20px 0px;
    padding: 0rem 0rem 2rem 0rem;
  }
}

table caption.hasIcon .Icon-wrapper {
  margin: 0px 4px 0px 0px;
  margin: 0rem 0.3rem 0rem 0rem;
}
@media (min-width: 50em) {
  table caption.hasIcon .Icon-wrapper {
    margin: 0px 4px 0px 0px;
    margin: 0rem 0.4rem 0rem 0rem;
  }
}

@media (max-width: 64em) {
  table thead {
    display: none;
  }
}

thead th {
  background: #efefef;
  font-size: 14px;
  font-size: 1.4rem;
  font-weight: 600;
  line-height: 20px;
  line-height: 2rem;
  text-align: left;
  padding: 12px 24px;
  padding: 0.9rem 1.8rem;
}
@media (min-width: 50em) {
  thead th {
    padding: 12px 24px;
    padding: 1.2rem 2.4rem;
  }
}

thead th:first-child {
  padding-left: 24px;
  padding-left: 1.8rem;
}
@media (min-width: 50em) {
  thead th:first-child {
    padding-left: 24px;
    padding-left: 2.4rem;
  }
}
@media (max-width: 64em) {
  thead th:first-child {
    padding: 20px 0px 0px 0px;
    padding: 1.5rem 0rem 0rem 0rem;
  }
}
@media (max-width: 64em) and (min-width: 50em) {
  thead th:first-child {
    padding: 20px 0px 0px 0px;
    padding: 2rem 0rem 0rem 0rem;
  }
}

@media (max-width: 64em) {
  table tr {
    padding: 12px 0px 0px 0px;
    padding: 0.9rem 0rem 0rem 0rem;
    display: block;
    float: left;
    position: relative;
    width: 100%;
  }
}
@media (max-width: 64em) and (min-width: 50em) {
  table tr {
    padding: 12px 0px 0px 0px;
    padding: 1.2rem 0rem 0rem 0rem;
  }
}

table th,
table td {
  max-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  vertical-align: top;
}
@media (max-width: 64em) {
  table th,
  table td {
    max-width: none;
    overflow: visible;
    text-overflow: clip;
    vertical-align: middle;
    word-break: break-all;
  }
}

table td a {
  padding: 0px 8px 0px 0px;
  padding: 0rem 0.6rem 0rem 0rem;
}
@media (min-width: 50em) {
  table td a {
    padding: 0px 8px 0px 0px;
    padding: 0rem 0.8rem 0rem 0rem;
  }
}

tbody td,
tfoot td {
  padding: 12px 24px;
  padding: 0.9rem 1.8rem;
}
@media (min-width: 50em) {
  tbody td,
  tfoot td {
    padding: 12px 24px;
    padding: 1.2rem 2.4rem;
  }
}
@media (max-width: 64em) {
  tbody td,
  tfoot td {
    padding: 8px 20px;
    padding: 0.6rem 1.5rem;
    display: block;
    float: left;
    width: 100%;
  }
}
@media (max-width: 64em) and (min-width: 50em) {
  tbody td,
  tfoot td {
    padding: 8px 20px;
    padding: 0.8rem 2rem;
  }
}

@media (max-width: 64em) {
  tbody td:before,
  tfoot td:before {
    color: #6b6b6b;
    content: attr(data-th);
    display: block;
    font-weight: 700;
  }
}

@media (max-width: 64em) {
  tbody td.Text-right,
  tfoot td.Text-right {
    padding: 0px;
    padding: 0rem;
  }
}
@media (max-width: 64em) and (min-width: 50em) {
  tbody td.Text-right,
  tfoot td.Text-right {
    padding: 0rem;
    padding: 0;
  }
}

tbody td:first-child,
tfoot td:first-child {
  padding-left: 24px;
  padding-left: 1.8rem;
}
@media (min-width: 50em) {
  tbody td:first-child,
  tfoot td:first-child {
    padding-left: 24px;
    padding-left: 2.4rem;
  }
}
@media (max-width: 64em) {
  tbody td:first-child,
  tfoot td:first-child {
    padding: 8px 20px;
    padding: 0.6rem 1.5rem;
  }
}
@media (max-width: 64em) and (min-width: 50em) {
  tbody td:first-child,
  tfoot td:first-child {
    padding: 8px 20px;
    padding: 0.8rem 2rem;
  }
}

thead tr,
tbody tr {
  border-bottom: 1px solid #dadada;
}
@media (max-width: 64em) {
  thead tr,
  tbody tr {
    margin: 0px 0px 16px 0px;
    margin: 0rem 0rem 1.2rem 0rem;
    border: 1px solid #dadada;
  }
}
@media (max-width: 64em) and (min-width: 50em) {
  thead tr,
  tbody tr {
    margin: 0px 0px 16px 0px;
    margin: 0rem 0rem 1.6rem 0rem;
  }
}

thead th.Text-right,
tbody td.Text-right {
  text-align: right;
}

.Text-right .Button {
  display: inline-block;
}

tfoot {
  border-top: 1px solid #dadada;
}

.Table--onGrayBackground .thead th {
  background: transparent;
}

.Table--onGrayBackground tbody tr {
  background: white;
}

@media (max-width: 64em) {
  .Table--withoutEdit tr {
    padding-bottom: 8px;
    padding-bottom: 0.8rem;
  }
}

.ThreeColumnWithEdit th,
.ThreeColumnWithEdit td {
  width: 35%;
}
@media (max-width: 64em) {
  .ThreeColumnWithEdit th,
  .ThreeColumnWithEdit td {
    width: 100%;
  }
}

.ThreeColumnWithEdit th.Text-right,
.ThreeColumnWithEdit td.Text-right {
  width: 30%;
}
@media (max-width: 64em) {
  .ThreeColumnWithEdit th.Text-right,
  .ThreeColumnWithEdit td.Text-right {
    width: 100%;
  }
}

@media (max-width: 64em) {
  table td.Text-right .Button--cornered {
    margin: 0px 0px 4px 0px;
    margin: 0rem 0rem 0.3rem 0rem;
    padding: 6px 20px;
  }
}
@media (max-width: 64em) and (min-width: 50em) {
  table td.Text-right .Button--cornered {
    margin: 0px 0px 4px 0px;
    margin: 0rem 0rem 0.4rem 0rem;
  }
}

@media (max-width: 64em) {
  table td.Text-right .Button--cornered {
    margin-bottom: -1px;
    margin-right: -1px;
  }
}

.ToggleSwitch {
  padding: 20px 0px 32px 0px;
  padding: 1.5rem 0rem 2.4rem 0rem;
}
@media (min-width: 50em) {
  .ToggleSwitch {
    padding: 20px 0px 32px 0px;
    padding: 2rem 0rem 3.2rem 0rem;
  }
}

.ToggleSwitch--isLarge {
  padding: 0px;
  padding: 0rem;
}
@media (min-width: 50em) {
  .ToggleSwitch--isLarge {
    padding: 0rem;
    padding: 0;
  }
}

.ToggleSwitch .Switch:empty ~ label {
  padding: 0px 0px 0px 60px;
  padding: 0rem 0rem 0rem 4.5rem;
  color: #3d3d3d;
  cursor: pointer;
  overflow: hidden;
  position: relative;
  white-space: nowrap;
}
@media (min-width: 50em) {
  .ToggleSwitch .Switch:empty ~ label {
    padding: 0px 0px 0px 60px;
    padding: 0rem 0rem 0rem 6rem;
  }
}
@media (max-width: 50em) {
  .ToggleSwitch .Switch:empty ~ label {
    padding: 0px 0px 0px 80px;
    padding: 0rem 0rem 0rem 6rem;
  }
}
@media (max-width: 50em) and (min-width: 50em) {
  .ToggleSwitch .Switch:empty ~ label {
    padding: 0px 0px 0px 80px;
    padding: 0rem 0rem 0rem 8rem;
  }
}

.ToggleSwitch--isLarge .Switch:empty ~ label {
  font-size: 21px;
  font-size: 2.1rem;
  line-height: 27px;
  line-height: 2.7rem;
}

.ToggleSwitch .Switch:empty ~ label:before,
.ToggleSwitch .Switch:empty ~ label:after {
  -webkit-border-radius: 10px;
  border-radius: 10px;
  border: solid 1px #c6c6c6;
  bottom: 0;
  content: '';
  font-size: 12px;
  font-size: 1.2rem;
  height: 20px;
  height: 2rem;
  left: 0;
  line-height: 17px;
  position: absolute;
  text-align: center;
  width: 50px;
  width: 5rem;
}

.ToggleSwitch .Switch:empty ~ label:before {
  background: #efefef;
}

.ToggleSwitch .Switch:checked ~ label:before {
  background: #158915;
  border: solid 1px #158915;
  content: url("../images/svg-ToggleCheck.svg");
  padding-left: 11px;
  padding-left: 1.1rem;
  padding-top: 1px;
  padding-top: 0.1rem;
  text-align: left;
}

.ie9 .ToggleSwitch .Switch:checked ~ label:before {
  padding-top: 1px;
  padding-top: 0.1rem;
}

.ToggleSwitch--isLarge .Switch:empty ~ label:before,
.ToggleSwitch--isLarge .Switch:empty ~ label:after {
  bottom: 2px;
}
@media (max-width: 50em) {
  .ToggleSwitch--isLarge .Switch:empty ~ label:before,
  .ToggleSwitch--isLarge .Switch:empty ~ label:after {
    bottom: 0;
  }
}

/* Toggle Off */
.ToggleSwitch .Switch:empty ~ label:after {
  background-color: white;
  height: 18px;
  height: 1.8rem;
  left: 0;
  position: absolute;
  top: 6px;
  width: 18px;
  width: 1.8rem;
}

.ToggleSwitch .Switch:focus:empty ~ label:before {
  border: solid 2px #1a661a;
}

/* Toggle On */
.ToggleSwitch .Switch:checked ~ label:after {
  border-color: #158915;
  background-color: white;
  margin-left: 31px;
  margin-left: 3.1rem;
  z-index: 1;
}

.ToggleSwitch .Switch:focus:checked ~ label:before {
  border: solid 2px #1a661a;
  content: url("../images/svg-ToggleCheck.svg");
  height: 20px;
  outline: none;
  padding-left: 10px;
  padding-left: 1rem;
  padding-top: 0;
  z-index: 1;
}

.ie9 .ToggleSwitch .Switch:focus:checked ~ label:before {
  padding-top: 0px;
  padding-top: 0rem;
}

.ToggleSwitch .Switch:focus:checked ~ label:after {
  margin-left: 31px;
  margin-left: 3.1rem;
}

/* Disabled */
.ToggleSwitch .Switch:disabled ~ label {
  cursor: default;
}

.ToggleSwitch .Switch:disabled:empty ~ label:before,
.ToggleSwitch .Switch:disabled:checked ~ label:before {
  background-color: #dadada;
  border-color: #efefef;
  content: '';
}

.ToggleSwitch .Switch:disabled:empty ~ label:after {
  background-color: #efefef;
  border-color: #efefef;
}

.ToggleSwitch .Switch:disabled:checked ~ label:after {
  background-color: #efefef;
  border-color: #dadada;
}

.ToggleSwitch .Switch:disabled:checked ~ label:before {
  content: url("../images/svg-ToggleCheckGray.svg");
  height: 20px;
  outline: none;
  padding-left: 10px;
  padding-left: 1rem;
  padding-top: 4px;
  padding-top: 0.4rem;
  z-index: 1;
}

.TwoStep-wrapper .ToggleSwitchEmpty h3 {
  margin: 0px 0px 8px 0px;
  margin: 0rem 0rem 0.6rem 0rem;
  float: none;
  line-height: 23px;
  line-height: 2.3rem;
}
@media (min-width: 50em) {
  .TwoStep-wrapper .ToggleSwitchEmpty h3 {
    margin: 0px 0px 8px 0px;
    margin: 0rem 0rem 0.8rem 0rem;
  }
}